boardHeader.jade 10 KB

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