taiga
/
taiga-front
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Wiki nav redesign

stable
Xavier Julián 2016-06-23 12:49:27 +02:00
parent dc078a534c
commit 8a24afa997
6 changed files with 165 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
app/coffee/modules/wiki/nav.coffee
View File

@ -39,15 +39,38 @@ WikiNavDirective = ($tgrepo, $log, $location, $confirm, $analytics, $loading, $t
$compile, $translate) ->
template = $template.get("wiki/wiki-nav.html", true)
linkDragAndDrop = ($scope, $el, $attrs) ->
oldParentScope = null
newParentScope = null
linkWikiLinks = ($scope, $el, $attrs) ->
$ctrl = $el.controller()
if not $attrs.ngModel?
return $log.error "WikiNavDirective: no ng-model attr is defined"
addWikiLinkPermission = $scope.project.my_permissions.indexOf("add_wiki_link") > -1
drake = null
render = (wikiLinks) ->
addWikiLinkPermission = $scope.project.my_permissions.indexOf("add_wiki_link") > -1
deleteWikiLinkPermission = $scope.project.my_permissions.indexOf("delete_wiki_link") > -1
html = template({
wikiLinks: wikiLinks,
projectSlug: $scope.projectSlug
addWikiLinkPermission: addWikiLinkPermission
deleteWikiLinkPermission: deleteWikiLinkPermission
})
html = $compile(html)($scope)
$el.off()
if addWikiLinkPermission and drake
drake.destroy()
$el.html(html)
if addWikiLinkPermission
itemEl = null
tdom = $el.find(".sortable")
addWikiLinkPermission = $scope.project.my_permissions.indexOf("add_wiki_link") > -1
if addWikiLinkPermission
drake = dragula([tdom[0]], {
direction: 'vertical',
copySortSource: false,
@ -70,33 +93,6 @@ WikiNavDirective = ($tgrepo, $log, $location, $confirm, $analytics, $loading, $t
return this.down && drake.dragging;
})
$scope.$on "$destroy", ->
$el.off()
if addWikiLinkPermission
drake.destroy()
linkWikiLinks = ($scope, $el, $attrs) ->
$ctrl = $el.controller()
if not $attrs.ngModel?
return $log.error "WikiNavDirective: no ng-model attr is defined"
render = (wikiLinks) ->
addWikiLinkPermission = $scope.project.my_permissions.indexOf("add_wiki_link") > -1
deleteWikiLinkPermission = $scope.project.my_permissions.indexOf("delete_wiki_link") > -1
html = template({
wikiLinks: wikiLinks,
projectSlug: $scope.projectSlug
addWikiLinkPermission: addWikiLinkPermission
deleteWikiLinkPermission: deleteWikiLinkPermission
})
html = $compile(html)($scope)
$el.off()
$el.html(html)
$el.on "click", ".add-button", (event) ->
event.preventDefault()
$el.find(".new").removeClass("hidden")
@ -171,7 +167,6 @@ WikiNavDirective = ($tgrepo, $log, $location, $confirm, $analytics, $loading, $t
link = ($scope, $el, $attrs) ->
linkWikiLinks($scope, $el, $attrs)
linkDragAndDrop($scope, $el, $attrs)
$scope.$on "$destroy", ->
$el.off()

6
app/locales/taiga/locale-en.json
View File

@ -1460,9 +1460,9 @@
"DELETE_LINK_TITLE": "Delete Wiki link",
"NAVIGATION": {
"HOME": "Main Page",
"SECTION_NAME": "Links",
"ACTION_ADD_LINK": "Add link",
"ALL_PAGES": "All pages"
"SECTION_NAME": "BOOKMARKS",
"ACTION_ADD_LINK": "Add bookmark",
"ALL_PAGES": "All wiki pages"
},
"SUMMARY": {
"TIMES_EDITED": "times <br />edited",

4
app/partials/wiki/wiki-list.jade
View File

@ -5,8 +5,8 @@ div.wrapper(
ng-init="section='wiki'"
)
tg-project-menu
sidebar.menu-secondary.extrabar(ng-if="linksVisible")
section.wiki-nav(
sidebar.menu-secondary.extrabar.wiki-nav(
ng-if="linksVisible"
tg-wiki-nav
ng-model="wikiLinks"
)

29
app/partials/wiki/wiki-nav.jade
View File

@ -1,23 +1,15 @@
header
h1(translate="WIKI.NAVIGATION.SECTION_NAME")
h1.title(translate="WIKI.NAVIGATION.SECTION_NAME")
nav
ul
li.wiki-link
a.link-title(
href=""
tg-nav="project-wiki-list:project=project.slug"
translate="WIKI.NAVIGATION.ALL_PAGES"
)
li.wiki-link
ul.wiki-link-container
li.wiki-link.fixed-link
a.link-title(
href=""
tg-nav="project-wiki:project=project.slug"
translate="WIKI.NAVIGATION.HOME"
)
ul.sortable
ul.sortable.wiki-link-container
li.wiki-link(
ng-repeat="link in wikiLinks"
data-id!="{{ $index }}"
@ -40,6 +32,7 @@ nav
value!="{{ link.title }}"
)
ul.sortable.wiki-link-container
li.new.hidden
input(
type="text"
@ -47,10 +40,18 @@ nav
)
<% if (addWikiLinkPermission) { %>
a(
a.add-button(
href=""
title="{{'WIKI.NAVIGATION.ACTION_ADD_LINK' | translate}}"
class="add-button button-gray"
)
tg-svg(svg-icon="icon-add")
span(translate="WIKI.NAVIGATION.ACTION_ADD_LINK")
<% } %>
ul.wiki-link-container.wiki-all-links
li.wiki-link.fixed-link
a.link-title(
href=""
tg-nav="project-wiki-list:project=project.slug"
translate="WIKI.NAVIGATION.ALL_PAGES"
)

10
app/partials/wiki/wiki.jade
View File

@ -1,10 +1,12 @@
doctype html
div.wrapper(ng-controller="WikiDetailController as ctrl",
ng-init="section='wiki'")
div.wrapper(
ng-controller="WikiDetailController as ctrl"
ng-init="section='wiki'"
)
tg-project-menu
sidebar.menu-secondary.extrabar(ng-if="linksVisible")
section.wiki-nav(
sidebar.menu-secondary.extrabar.wiki-nav(
ng-if="linksVisible"
tg-wiki-nav
ng-model="wikiLinks"
)

114
app/styles/modules/wiki/wiki-nav.scss
View File

@ -1,34 +1,97 @@
.wiki-link {
@include font-type(text);
.wiki-nav {
padding: 0;
width: 240px;
.title {
@include font-size(larger);
padding: 2rem 1rem 0 2rem;
}
.add-button {
align-items: center;
border-bottom: 1px solid $gray-light;
display: flex;
padding: 1rem 1rem 1rem 2rem;
text-transform: uppercase;
vertical-align: middle;
&:hover {
svg {
background: $primary-light;
}
}
svg {
@include svg-size(1.25rem);
background: $gray-light;
border-radius: 2px;
fill: $white;
margin-right: .5rem;
padding: .25rem;
transition: background .2s linear;
}
}
.wiki-link-container {
margin: 0;
&.wiki-all-links {
border-top: 1px solid $gray-light;
}
}
input[type="text"] {
background: $whitish;
color: $grayer;
margin: 1rem 1rem 1rem 2rem;
width: 80%;
@include placeholder {
color: $gray-light;
}
}
.loading {
padding: 1rem;
text-align: center;
}
}
.wiki-link {
align-items: center;
border-bottom: 1px solid $whitish;
display: flex;
justify-content: space-between;
padding: 1rem 0;
text-transform: uppercase;
margin-left: 2rem;
padding-right: 1rem;
position: relative;
&:hover {
.remove-wiki-page {
cursor: pointer;
opacity: 1;
transition: opacity .2s linear;
transition-delay: .2s;
transition-delay: .1s;
}
.dragger {
cursor: move;
fill: $gray-light;
opacity: 1;
transition: opacity .2s linear;
transition-delay: .2s;
transition-delay: .1s;
}
}
&.gu-mirror {
border-bottom: 0;
}
&.fixed-link {
@include font-size(large);
text-transform: uppercase;
}
&.is-sortable {
cursor: move;
}
.link-title {
cursor: pointer;
display: block;
flex-grow: 1;
padding: 1rem 0;
}
.dragger {
margin-right: .5rem;
fill: $gray-light;
left: -1rem;
opacity: 0;
position: absolute;
top: 1rem;
svg {
@include svg-size(.9rem);
@include svg-size(.7rem);
}
}
.remove-wiki-page {
@ -39,35 +102,4 @@
}
}
}
.link-title {
cursor: pointer;
flex-grow: 1;
}
.icon-trash {
fill: $gray-light;
}
}
.wiki-nav {
.add-button {
color: $white;
display: block;
margin-bottom: .5rem;
text-align: center;
}
input[type="text"] {
@include font-type(text);
@include font-size(medium);
background: $grayer;
color: $whitish;
@include placeholder {
color: $gray-light;
}
}
.loading {
margin: 0;
padding: 8px;
text-align: center;
width: 100%;
}
}