boardHeader.jade 10.0 KB

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