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

Merge pull request #1056 from taigaio/enhancement/wiki_links 

Wiki nav redesign
stable
Juanfran 2016-07-05 12:10:38 +02:00 committed by GitHub
parent dc078a534c 8a24afa997
commit 945979a19b
6 changed files with 165 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -39,48 +39,15 @@ 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
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,
copy: false,
mirrorContainer: tdom[0],
moves: (item) -> return $(item).is('li')
})
drake.on 'dragend', (item) ->
itemEl = $(item)
item = itemEl.scope().link
itemIndex = itemEl.index()
$scope.$emit("wiki:links:move", item, itemIndex)
scroll = autoScroll(window, {
margin: 20,
pixels: 30,
scrollWhenOutside: true,
autoScroll: () ->
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"
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
@ -95,8 +62,37 @@ WikiNavDirective = ($tgrepo, $log, $location, $confirm, $analytics, $loading, $t
html = $compile(html)($scope)
$el.off()
if addWikiLinkPermission and drake
drake.destroy()
$el.html(html)
if addWikiLinkPermission
itemEl = null
tdom = $el.find(".sortable")
drake = dragula([tdom[0]], {
direction: 'vertical',
copySortSource: false,
copy: false,
mirrorContainer: tdom[0],
moves: (item) -> return $(item).is('li')
})
drake.on 'dragend', (item) ->
itemEl = $(item)
item = itemEl.scope().link
itemIndex = itemEl.index()
$scope.$emit("wiki:links:move", item, itemIndex)
scroll = autoScroll(window, {
margin: 20,
pixels: 30,
scrollWhenOutside: true,
autoScroll: () ->
return this.down && drake.dragging;
})
$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",

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

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

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

@ -1,56 +1,57 @@
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
a.link-title(
href=""
tg-nav="project-wiki:project=project.slug"
translate="WIKI.NAVIGATION.HOME"
)
ul.sortable
li.wiki-link(
ng-repeat="link in wikiLinks"
data-id!="{{ $index }}"
tg-bind-scope
tg-class-permission="{'is-sortable': 'add_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"
)
<% if (addWikiLinkPermission) { %>
tg-svg.dragger(svg-icon="icon-drag")
<% } %>
a.link-title(title!="{{ link.title }}", href!="{{ link.url }}") {{ link.title }}
<% if (deleteWikiLinkPermission) { %>
a.js-delete-link.remove-wiki-page(title!="{{'WIKI.DELETE_LINK_TITLE' | translate}}")
tg-svg(svg-icon="icon-trash")
<% } %>
ul.sortable.wiki-link-container
li.wiki-link(
ng-repeat="link in wikiLinks"
data-id!="{{ $index }}"
tg-bind-scope
tg-class-permission="{'is-sortable': 'add_wiki_link'}"
)
<% if (addWikiLinkPermission) { %>
tg-svg.dragger(svg-icon="icon-drag")
<% } %>
a.link-title(title!="{{ link.title }}", href!="{{ link.url }}") {{ link.title }}
input.hidden(
type="text"
placeholder="{{'COMMON.FIELDS.NAME' | translate}}"
value!="{{ link.title }}"
)
<% if (deleteWikiLinkPermission) { %>
a.js-delete-link.remove-wiki-page(title!="{{'WIKI.DELETE_LINK_TITLE' | translate}}")
tg-svg(svg-icon="icon-trash")
<% } %>
li.new.hidden
input(
type="text"
placeholder="{{'COMMON.FIELDS.NAME' | translate}}"
)
input.hidden(
type="text"
placeholder="{{'COMMON.FIELDS.NAME' | translate}}"
value!="{{ link.title }}"
)
ul.sortable.wiki-link-container
li.new.hidden
input(
type="text"
placeholder="{{'COMMON.FIELDS.NAME' | translate}}"
)
<% 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"
)

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

@ -1,13 +1,15 @@
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(
tg-wiki-nav
ng-model="wikiLinks"
)
sidebar.menu-secondary.extrabar.wiki-nav(
ng-if="linksVisible"
tg-wiki-nav
ng-model="wikiLinks"
)
section.main.wiki
header
h1

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

@ -1,34 +1,97 @@
.wiki-nav {
padding: 0;
width: 240px;
.title {
@include font-size(larger);
padding: 2rem 1rem 0 2rem;
}
.add-button {
align-items: center;
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 {
@include font-type(text);
align-items: center;
border-bottom: 1px solid $gray-light;
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%;
}
}