boardHeader.jade 9.3 KB

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