boardHeader.jade 10.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295
  1. template(name="boardHeaderBar")
  2. h1.header-board-menu {{currentBoard.title}}
  3. with currentBoard
  4. if $eq title 'Templates'
  5. | {{_ 'templates'}}
  6. else
  7. +viewer
  8. = title
  9. .board-header-btns.left
  10. unless isMiniScreen
  11. if currentBoard
  12. if currentUser
  13. with currentBoard
  14. if currentUser.isBoardAdmin
  15. a.board-header-btn(class="{{#if currentUser.isBoardAdmin}}js-edit-board-title{{else}}is-disabled{{/if}}" title="{{_ 'edit'}}" value=title)
  16. i.fa.fa-pencil-square-o
  17. a.board-header-btn.js-star-board(class="{{#if isStarred}}is-active{{/if}}"
  18. title="{{#if isStarred}}{{_ 'click-to-unstar'}}{{else}}{{_ 'click-to-star'}}{{/if}} {{_ 'starred-boards-description'}}")
  19. i.fa(class="fa-star{{#unless isStarred}}-o{{/unless}}")
  20. if showStarCounter
  21. span
  22. = currentBoard.stars
  23. a.board-header-btn(
  24. class="{{#if currentUser.isBoardAdmin}}js-change-visibility{{else}}is-disabled{{/if}}"
  25. title="{{_ currentBoard.permission}}")
  26. i.fa(class="{{#if currentBoard.isPublic}}fa-globe{{else}}fa-lock{{/if}}")
  27. span {{_ currentBoard.permission}}
  28. a.board-header-btn.js-watch-board(
  29. title="{{_ watchLevel }}")
  30. if $eq watchLevel "watching"
  31. i.fa.fa-eye
  32. if $eq watchLevel "tracking"
  33. i.fa.fa-bell
  34. if $eq watchLevel "muted"
  35. i.fa.fa-bell-slash
  36. span {{_ watchLevel}}
  37. a.board-header-btn(title="{{_ 'sort-cards'}}" class="{{#if isSortActive }}emphasis{{else}} js-sort-cards {{/if}}")
  38. i.fa.fa-sort
  39. span {{#if isSortActive }}{{_ 'sort-is-on'}}{{else}}{{_ 'sort-cards'}}{{/if}}
  40. if isSortActive
  41. a.board-header-btn-close.js-sort-reset(title="{{_ 'remove-sort'}}")
  42. i.fa.fa-times-thin
  43. else
  44. a.board-header-btn.js-log-in(
  45. title="{{_ 'log-in'}}")
  46. i.fa.fa-sign-in
  47. span {{_ 'log-in'}}
  48. .board-header-btns.right
  49. if currentBoard
  50. if isMiniScreen
  51. if currentUser
  52. with currentBoard
  53. a.board-header-btn(class="{{#if currentUser.isBoardAdmin}}js-edit-board-title{{else}}is-disabled{{/if}}" title="{{_ 'edit'}}" value=title)
  54. i.fa.fa-pencil-square-o
  55. a.board-header-btn.js-star-board(class="{{#if isStarred}}is-active{{/if}}"
  56. title="{{#if isStarred}}{{_ 'click-to-unstar'}}{{else}}{{_ 'click-to-star'}}{{/if}} {{_ 'starred-boards-description'}}")
  57. i.fa(class="fa-star{{#unless isStarred}}-o{{/unless}}")
  58. if showStarCounter
  59. span
  60. = currentBoard.stars
  61. a.board-header-btn(
  62. class="{{#if currentUser.isBoardAdmin}}js-change-visibility{{else}}is-disabled{{/if}}"
  63. title="{{_ currentBoard.permission}}")
  64. i.fa(class="{{#if currentBoard.isPublic}}fa-globe{{else}}fa-lock{{/if}}")
  65. span {{_ currentBoard.permission}}
  66. a.board-header-btn.js-watch-board(
  67. title="{{_ watchLevel }}")
  68. if $eq watchLevel "watching"
  69. i.fa.fa-eye
  70. if $eq watchLevel "tracking"
  71. i.fa.fa-bell
  72. if $eq watchLevel "muted"
  73. i.fa.fa-bell-slash
  74. span {{_ watchLevel}}
  75. a.board-header-btn(title="{{_ 'sort-cards'}}" class="{{#if isSortActive }}emphasis{{else}} js-sort-cards {{/if}}")
  76. i.fa.fa-sort
  77. span {{#if isSortActive }}{{_ 'sort-is-on'}}{{else}}{{_ 'sort-cards'}}{{/if}}
  78. if isSortActive
  79. a.board-header-btn-close.js-sort-reset(title="{{_ 'remove-sort'}}")
  80. i.fa.fa-times-thin
  81. else
  82. a.board-header-btn.js-log-in(
  83. title="{{_ 'log-in'}}")
  84. i.fa.fa-sign-in
  85. span {{_ 'log-in'}}
  86. if isSandstorm
  87. if currentUser
  88. a.board-header-btn.js-open-archived-board
  89. i.fa.fa-archive
  90. span {{_ 'archives'}}
  91. //if showSort
  92. // a.board-header-btn.js-open-sort-view(title="{{_ 'sort-desc'}}")
  93. // i.fa(class="{{directionClass}}")
  94. // span {{_ 'sort'}}{{_ listSortShortDesc}}
  95. a.board-header-btn.js-open-filter-view(
  96. title="{{#if Filter.isActive}}{{_ 'filter-on-desc'}}{{else}}{{_ 'filter'}}{{/if}}"
  97. class="{{#if Filter.isActive}}emphasis{{/if}}")
  98. i.fa.fa-filter
  99. span {{#if Filter.isActive}}{{_ 'filter-on'}}{{else}}{{_ 'filter'}}{{/if}}
  100. if Filter.isActive
  101. a.board-header-btn-close.js-filter-reset(title="{{_ 'filter-clear'}}")
  102. i.fa.fa-times-thin
  103. a.board-header-btn.js-open-search-view(title="{{_ 'search'}}")
  104. i.fa.fa-search
  105. span {{_ 'search'}}
  106. unless currentBoard.isTemplatesBoard
  107. a.board-header-btn.js-toggle-board-view(
  108. title="{{_ 'board-view'}}")
  109. i.fa.fa-caret-down
  110. if $eq boardView 'board-view-swimlanes'
  111. i.fa.fa-th-large
  112. if $eq boardView 'board-view-lists'
  113. i.fa.fa-trello
  114. if $eq boardView 'board-view-cal'
  115. i.fa.fa-calendar
  116. span {{#if boardView}}{{_ boardView}}{{else}}{{_ 'board-view-swimlanes'}}{{/if}}
  117. if canModifyBoard
  118. a.board-header-btn.js-multiselection-activate(
  119. title="{{#if MultiSelection.isActive}}{{_ 'multi-selection-on'}}{{else}}{{_ 'multi-selection'}}{{/if}}"
  120. class="{{#if MultiSelection.isActive}}emphasis{{/if}}")
  121. i.fa.fa-check-square-o
  122. span {{#if MultiSelection.isActive}}{{_ 'multi-selection-on'}}{{else}}{{_ 'multi-selection'}}{{/if}}
  123. if MultiSelection.isActive
  124. a.board-header-btn-close.js-multiselection-reset(
  125. title="{{_ 'deactivate-multi-selection'}}"
  126. aria-label="{{_ 'deactivate-multi-selection'}}"
  127. )
  128. i.fa.fa-times-thin
  129. .separator
  130. a.board-header-btn.js-toggle-sidebar(title="{{_ 'sidebar-open'}} {{_ 'or'}} {{_ 'sidebar-close'}}")
  131. i.fa.fa-navicon
  132. template(name="boardVisibilityList")
  133. ul.pop-over-list
  134. li
  135. with "private"
  136. a.js-select-visibility
  137. i.fa.fa-lock.colorful
  138. | {{_ 'private'}}
  139. if visibilityCheck
  140. i.fa.fa-check
  141. span.sub-name {{_ 'private-desc'}}
  142. if notAllowPrivateVisibilityOnly
  143. li
  144. with "public"
  145. a.js-select-visibility
  146. i.fa.fa-globe.colorful
  147. | {{_ 'public'}}
  148. if visibilityCheck
  149. i.fa.fa-check
  150. span.sub-name {{_ 'public-desc'}}
  151. template(name="boardChangeVisibilityPopup")
  152. +boardVisibilityList
  153. template(name="boardChangeWatchPopup")
  154. ul.pop-over-list
  155. li
  156. with "watching"
  157. a.js-select-watch
  158. i.fa.fa-eye.colorful
  159. | {{_ 'watching'}}
  160. if watchCheck
  161. i.fa.fa-check
  162. span.sub-name {{_ 'watching-info'}}
  163. li
  164. with "tracking"
  165. a.js-select-watch
  166. i.fa.fa-bell.colorful
  167. | {{_ 'tracking'}}
  168. if watchCheck
  169. i.fa.fa-check
  170. span.sub-name {{_ 'tracking-info'}}
  171. li
  172. with "muted"
  173. a.js-select-watch
  174. i.fa.fa-bell-slash.colorful
  175. | {{_ 'muted'}}
  176. if watchCheck
  177. i.fa.fa-check
  178. span.sub-name {{_ 'muted-info'}}
  179. template(name="boardChangeViewPopup")
  180. ul.pop-over-list
  181. li
  182. with "board-view-swimlanes"
  183. a.js-open-swimlanes-view
  184. i.fa.fa-th-large.colorful
  185. | {{_ 'board-view-swimlanes'}}
  186. if $eq Utils.boardView "board-view-swimlanes"
  187. i.fa.fa-check
  188. li
  189. with "board-view-lists"
  190. a.js-open-lists-view
  191. i.fa.fa-trello.colorful
  192. | {{_ 'board-view-lists'}}
  193. if $eq Utils.boardView "board-view-lists"
  194. i.fa.fa-check
  195. li
  196. with "board-view-cal"
  197. a.js-open-cal-view
  198. i.fa.fa-calendar.colorful
  199. | {{_ 'board-view-cal'}}
  200. if $eq Utils.boardView "board-view-cal"
  201. i.fa.fa-check
  202. template(name="createBoard")
  203. form
  204. label
  205. | {{_ 'title'}}
  206. input.js-new-board-title(type="text" placeholder="{{_ 'bucket-example'}}" autofocus required)
  207. if visibilityMenuIsOpen.get
  208. +boardVisibilityList
  209. else
  210. p.quiet
  211. if $eq visibility.get 'public'
  212. span.fa.fa-globe.colorful
  213. = " "
  214. | {{{_ 'board-public-info'}}}
  215. else
  216. span.fa.fa-lock.colorful
  217. = " "
  218. | {{{_ 'board-private-info'}}}
  219. a.js-change-visibility {{_ 'change'}}.
  220. a.flex.js-toggle-add-template-container
  221. .materialCheckBox#add-template-container
  222. span {{_ 'add-template-container'}}
  223. input.primary.wide(type="submit" value="{{_ 'create'}}")
  224. span.quiet
  225. | {{_ 'or'}}
  226. a.js-import-board {{_ 'import'}}
  227. span.quiet
  228. | /
  229. a.js-board-template {{_ 'template'}}
  230. //template(name="listsortPopup")
  231. // h2
  232. // | {{_ 'list-sort-by'}}
  233. // hr
  234. // ul.pop-over-list
  235. // each value in allowedSortValues
  236. // li
  237. // a.js-sort-by(name="{{value.name}}")
  238. // if $eq sortby value.name
  239. // i(class="fa {{Direction}}")
  240. // | {{_ value.label }}{{_ value.shortLabel}}
  241. // if $eq sortby value.name
  242. // i(class="fa fa-check")
  243. template(name="boardChangeTitlePopup")
  244. form
  245. label
  246. | {{_ 'title'}}
  247. input.js-board-name(type="text" value=title autofocus dir="auto")
  248. label
  249. | {{_ 'description'}}
  250. textarea.js-board-desc(dir="auto")= description
  251. input.primary.wide(type="submit" value="{{_ 'rename'}}")
  252. template(name="boardCreateRulePopup")
  253. p {{_ 'close-board-pop'}}
  254. button.js-confirm.negate.full(type="submit") {{_ 'archive'}}
  255. template(name="cardsSortPopup")
  256. ul.pop-over-list
  257. li
  258. a.js-sort-due {{_ 'due-date'}}
  259. hr
  260. li
  261. a.js-sort-title {{_ 'title-alphabetically'}}
  262. hr
  263. li
  264. a.js-sort-created-desc {{_ 'created-at-newest-first'}}
  265. hr
  266. li
  267. a.js-sort-created-asc {{_ 'created-at-oldest-first'}}