@things-factory/board-ui 8.0.38 → 9.0.0-9.0.0-beta.59.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (165) hide show
  1. package/dist-client/apptools/favorite-tool.js +1 -1
  2. package/dist-client/apptools/favorite-tool.js.map +1 -1
  3. package/dist-client/board-list/board-tile-list.js +1 -1
  4. package/dist-client/board-list/board-tile-list.js.map +1 -1
  5. package/dist-client/board-list/group-bar.js +1 -1
  6. package/dist-client/board-list/group-bar.js.map +1 -1
  7. package/dist-client/board-list/play-group-bar.js +1 -1
  8. package/dist-client/board-list/play-group-bar.js.map +1 -1
  9. package/dist-client/board-provider.js +0 -4
  10. package/dist-client/board-provider.js.map +1 -1
  11. package/dist-client/bootstrap.js +4 -4
  12. package/dist-client/bootstrap.js.map +1 -1
  13. package/dist-client/data-grist/board-editor.d.ts +1 -1
  14. package/dist-client/data-grist/board-editor.js +1 -1
  15. package/dist-client/data-grist/board-editor.js.map +1 -1
  16. package/dist-client/entries/headless-scene-components.d.ts +1 -0
  17. package/dist-client/entries/headless-scene-components.js +4 -0
  18. package/dist-client/entries/headless-scene-components.js.map +1 -0
  19. package/dist-client/entries/scene-player.d.ts +5 -0
  20. package/dist-client/entries/scene-player.js +84 -0
  21. package/dist-client/entries/scene-player.js.map +1 -0
  22. package/dist-client/entries/scene-viewer.d.ts +5 -0
  23. package/dist-client/entries/scene-viewer.js +85 -0
  24. package/dist-client/entries/scene-viewer.js.map +1 -0
  25. package/dist-client/entries/things-scene-components.import +1 -0
  26. package/dist-client/graphql/index.d.ts +6 -6
  27. package/dist-client/graphql/index.js +6 -6
  28. package/dist-client/graphql/index.js.map +1 -1
  29. package/dist-client/index.d.ts +8 -8
  30. package/dist-client/index.js +8 -8
  31. package/dist-client/index.js.map +1 -1
  32. package/dist-client/pages/board-list-page.d.ts +4 -4
  33. package/dist-client/pages/board-list-page.js +5 -5
  34. package/dist-client/pages/board-list-page.js.map +1 -1
  35. package/dist-client/pages/board-modeller-page.js +2 -2
  36. package/dist-client/pages/board-modeller-page.js.map +1 -1
  37. package/dist-client/pages/board-player-by-name-page.d.ts +1 -1
  38. package/dist-client/pages/board-player-by-name-page.js +1 -1
  39. package/dist-client/pages/board-player-by-name-page.js.map +1 -1
  40. package/dist-client/pages/board-player-page.js +1 -1
  41. package/dist-client/pages/board-player-page.js.map +1 -1
  42. package/dist-client/pages/board-template/board-template-list-page.js +1 -1
  43. package/dist-client/pages/board-template/board-template-list-page.js.map +1 -1
  44. package/dist-client/pages/board-viewer-by-name-page.d.ts +1 -1
  45. package/dist-client/pages/board-viewer-by-name-page.js +1 -1
  46. package/dist-client/pages/board-viewer-by-name-page.js.map +1 -1
  47. package/dist-client/pages/board-viewer-page.js +1 -1
  48. package/dist-client/pages/board-viewer-page.js.map +1 -1
  49. package/dist-client/pages/play-list-page.d.ts +3 -3
  50. package/dist-client/pages/play-list-page.js +3 -3
  51. package/dist-client/pages/play-list-page.js.map +1 -1
  52. package/dist-client/pages/printable-board-viewer-page.d.ts +1 -1
  53. package/dist-client/pages/printable-board-viewer-page.js +9 -4
  54. package/dist-client/pages/printable-board-viewer-page.js.map +1 -1
  55. package/dist-client/pages/theme/theme-list-page.js +1 -1
  56. package/dist-client/pages/theme/theme-list-page.js.map +1 -1
  57. package/dist-client/tsconfig.tsbuildinfo +1 -1
  58. package/dist-client/viewparts/board-basic-info.js +1 -1
  59. package/dist-client/viewparts/board-basic-info.js.map +1 -1
  60. package/dist-client/viewparts/board-info.d.ts +3 -3
  61. package/dist-client/viewparts/board-info.js +3 -3
  62. package/dist-client/viewparts/board-info.js.map +1 -1
  63. package/dist-client/viewparts/board-versions.js +1 -1
  64. package/dist-client/viewparts/board-versions.js.map +1 -1
  65. package/dist-client/viewparts/group-info-import.js +1 -1
  66. package/dist-client/viewparts/group-info-import.js.map +1 -1
  67. package/dist-client/viewparts/group-info.d.ts +2 -2
  68. package/dist-client/viewparts/group-info.js +2 -2
  69. package/dist-client/viewparts/group-info.js.map +1 -1
  70. package/dist-client/viewparts/index.d.ts +3 -3
  71. package/dist-client/viewparts/index.js +3 -3
  72. package/dist-client/viewparts/index.js.map +1 -1
  73. package/dist-client/viewparts/link-builder.js +1 -1
  74. package/dist-client/viewparts/link-builder.js.map +1 -1
  75. package/dist-client/viewparts/play-group-info-basic.js +1 -1
  76. package/dist-client/viewparts/play-group-info-basic.js.map +1 -1
  77. package/dist-client/viewparts/play-group-info.d.ts +2 -2
  78. package/dist-client/viewparts/play-group-info.js +2 -2
  79. package/dist-client/viewparts/play-group-info.js.map +1 -1
  80. package/dist-server/tsconfig.tsbuildinfo +1 -1
  81. package/helps/board-modeller/effects/hover-event.ko.md +3 -3
  82. package/helps/board-modeller/effects/hover-event.md +6 -4
  83. package/helps/board-modeller/effects/hover-event.zh.md +3 -3
  84. package/package.json +20 -19
  85. package/things-factory.config.js +12 -48
  86. package/translations/en.json +42 -31
  87. package/translations/ja.json +43 -32
  88. package/translations/ko.json +43 -32
  89. package/translations/ms.json +31 -25
  90. package/translations/zh.json +41 -30
  91. package/assets/images/bg-blue.png +0 -0
  92. package/assets/images/bg-green.png +0 -0
  93. package/assets/images/bg-input-select.png +0 -0
  94. package/assets/images/bg-rail.png +0 -0
  95. package/assets/images/forklift.png +0 -0
  96. package/assets/images/icon-backinfo.png +0 -0
  97. package/assets/images/icon-brand.png +0 -0
  98. package/assets/images/icon-close.png +0 -0
  99. package/assets/images/icon-editor-gradient-direction.png +0 -0
  100. package/assets/images/icon-mobile-brand.png +0 -0
  101. package/assets/images/icon-nametag.png +0 -0
  102. package/assets/images/icon-properties-label.png +0 -0
  103. package/assets/images/icon-properties-line-type.png +0 -0
  104. package/assets/images/icon-properties-table.png +0 -0
  105. package/assets/images/icon-resource-select.png +0 -0
  106. package/assets/images/person.png +0 -0
  107. package/assets/images/profile.png +0 -0
  108. package/client/apptools/favorite-tool.ts +0 -124
  109. package/client/board-list/board-tile-list.ts +0 -272
  110. package/client/board-list/group-bar-styles.ts +0 -63
  111. package/client/board-list/group-bar.ts +0 -99
  112. package/client/board-list/play-group-bar.ts +0 -88
  113. package/client/board-provider.ts +0 -92
  114. package/client/bootstrap.ts +0 -39
  115. package/client/data-grist/board-editor.ts +0 -113
  116. package/client/data-grist/board-renderer.ts +0 -134
  117. package/client/data-grist/color-map-editor.ts +0 -17
  118. package/client/data-grist/color-ranges-editor.ts +0 -17
  119. package/client/graphql/board-template.ts +0 -141
  120. package/client/graphql/board.ts +0 -273
  121. package/client/graphql/favorite-board.ts +0 -25
  122. package/client/graphql/group.ts +0 -138
  123. package/client/graphql/index.ts +0 -6
  124. package/client/graphql/my-board.ts +0 -25
  125. package/client/graphql/play-group.ts +0 -189
  126. package/client/index.ts +0 -10
  127. package/client/pages/attachment-list-page.ts +0 -142
  128. package/client/pages/board-list-page.ts +0 -603
  129. package/client/pages/board-modeller-page.ts +0 -288
  130. package/client/pages/board-player-by-name-page.ts +0 -29
  131. package/client/pages/board-player-page.ts +0 -241
  132. package/client/pages/board-template/board-template-list-page.ts +0 -248
  133. package/client/pages/board-viewer-by-name-page.ts +0 -24
  134. package/client/pages/board-viewer-page.ts +0 -271
  135. package/client/pages/font-list-page.ts +0 -31
  136. package/client/pages/play-list-page.ts +0 -400
  137. package/client/pages/printable-board-viewer-page.ts +0 -54
  138. package/client/pages/theme/theme-editors.ts +0 -56
  139. package/client/pages/theme/theme-list-page.ts +0 -313
  140. package/client/pages/things-scene-components-with-tools.import +0 -0
  141. package/client/pages/things-scene-components.import +0 -0
  142. package/client/route.ts +0 -51
  143. package/client/setting-let/board-view-setting-let.ts +0 -68
  144. package/client/themes/board-theme.css +0 -77
  145. package/client/things-scene-import.d.ts +0 -4
  146. package/client/viewparts/board-basic-info.ts +0 -646
  147. package/client/viewparts/board-info-link.ts +0 -56
  148. package/client/viewparts/board-info.ts +0 -85
  149. package/client/viewparts/board-template-builder.ts +0 -135
  150. package/client/viewparts/board-versions.ts +0 -172
  151. package/client/viewparts/group-info-basic.ts +0 -267
  152. package/client/viewparts/group-info-import.ts +0 -132
  153. package/client/viewparts/group-info.ts +0 -87
  154. package/client/viewparts/index.ts +0 -3
  155. package/client/viewparts/link-builder.ts +0 -210
  156. package/client/viewparts/play-group-info-basic.ts +0 -268
  157. package/client/viewparts/play-group-info-link.ts +0 -46
  158. package/client/viewparts/play-group-info.ts +0 -81
  159. package/images/icon-properties-arrow-type.png +0 -0
  160. package/images/icon-properties-gradient-direction.png +0 -0
  161. package/images/icon-properties-line-type.png +0 -0
  162. package/images/icon-properties-padding.png +0 -0
  163. package/images/icon-properties-table.png +0 -0
  164. package/images/icon-shell-inspector.png +0 -0
  165. package/server/index.ts +0 -0
@@ -1,4 +1,5 @@
1
1
  {
2
+ "EDIT": "编辑",
2
3
  "button.accept": "同意",
3
4
  "button.account": "账户",
4
5
  "button.add": "添加",
@@ -79,45 +80,45 @@
79
80
  "button.view-short": "查看",
80
81
  "button.zoom-in": "放大",
81
82
  "button.zoom-out": "缩小",
83
+ "component.audio": "音频",
84
+ "component.both arrow": "双向箭头",
85
+ "component.color image": "彩色图像",
82
86
  "component.container": "容器",
83
- "component.popup": "弹出窗口",
84
- "component.info-window": "信息窗口",
85
- "component.local-ref": "本地引用",
87
+ "component.dash": "虚线",
88
+ "component.donut": "圆环",
89
+ "component.ellipse": "椭圆",
90
+ "component.embed": "嵌入",
91
+ "component.gif image": "GIF图像",
92
+ "component.gif-view": "GIF视图",
86
93
  "component.global-ref": "全球引用",
94
+ "component.gray image": "灰色图像",
87
95
  "component.group": "组",
96
+ "component.image-view": "图像视图",
97
+ "component.info-window": "信息窗口",
88
98
  "component.line": "线条",
89
- "component.dash": "虚线",
90
- "component.single arrow": "单箭头",
91
- "component.both arrow": "双向箭头",
92
- "component.polyline": "多段线",
99
+ "component.local-ref": "本地引用",
100
+ "component.model-layer": "画布",
93
101
  "component.ortholine": "正交线",
94
- "component.rect": "矩形",
95
- "component.ellipse": "椭圆",
96
- "component.donut": "圆环",
97
- "component.triangle": "三角形",
102
+ "component.pdf-page": "PDF页面",
98
103
  "component.polygon": "多边形",
104
+ "component.polyline": "多段线",
105
+ "component.popup": "弹出窗口",
106
+ "component.rect": "矩形",
107
+ "component.single arrow": "单箭头",
99
108
  "component.star": "星形",
100
109
  "component.text": "文本",
101
- "component.color image": "彩色图像",
102
- "component.gray image": "灰色图像",
103
- "component.image-view": "图像视图",
104
- "component.gif image": "GIF图像",
105
- "component.gif-view": "GIF视图",
106
- "component.audio": "音频",
110
+ "component.triangle": "三角形",
107
111
  "component.video": "视频",
108
- "component.embed": "嵌入",
109
- "component.model-layer": "画布",
110
- "EDIT": "编辑",
112
+ "error.MAX_LENGTH_OF_X_IS_Y": "{name}的最大长度是 {value}。",
113
+ "error.SERVER-ERROR": "发生了服务端错误。({msg})",
114
+ "error.SHOULD_NOT_BE_EMPTY": "值'{value}'不能为空值。",
111
115
  "error.count over license limit": "您的看板或子域数量超过了许可证限制!",
112
116
  "error.invalid license key": "无效的许可证密钥!",
113
117
  "error.license expiration notice": "许可证到期提醒",
114
118
  "error.license key is empty": "许可证密钥为空!",
115
119
  "error.license key is not certified": "许可证密钥未通过认证!",
116
120
  "error.license token not valid": "您的数据密钥验证失败,系统许可无效!",
117
- "error.MAX_LENGTH_OF_X_IS_Y": "{name}的最大长度是 {value}。",
118
- "error.SERVER-ERROR": "发生了服务端错误。({msg})",
119
121
  "error.setting-error": "设置错误",
120
- "error.SHOULD_NOT_BE_EMPTY": "值'{value}'不能为空值。",
121
122
  "error.your license due date is x, please renewal your license!": "您的许可证到期日期为{x},请续订您的许可证!",
122
123
  "error.your license is expired! expired date is [x]": "您的许可证已过期! 过期日为[{x}]",
123
124
  "error.your license is not valid in this host": "您的许可证在此主机中无效!",
@@ -240,11 +241,15 @@
240
241
  "label.domain-url": "域地址",
241
242
  "label.domain_app": "域应用程序",
242
243
  "label.donut-style": "圆环样式",
244
+ "label.draggable": "可拖动",
243
245
  "label.duration": "持续期间",
244
246
  "label.email": "邮件",
245
247
  "label.email-id": "邮件ID",
246
248
  "label.email_address": "邮件地址",
247
249
  "label.emphasize": "强调",
250
+ "label.emphasize-animation": "强调线动画",
251
+ "label.emphasize-distance": "强调线距离",
252
+ "label.emphasize-line-width": "强调线宽度",
248
253
  "label.end-alpha": "结束阿尔法",
249
254
  "label.end-angle": "结束角度",
250
255
  "label.end-size": "结束大小",
@@ -271,6 +276,7 @@
271
276
  "label.gradient": "渐变",
272
277
  "label.grid-line": "网格线",
273
278
  "label.group": "组",
279
+ "label.guide-only": "仅供建模指南",
274
280
  "label.headless-link": "无头链接",
275
281
  "label.headless-link by-name": "按名称生成",
276
282
  "label.headless-link query-key": "查询键",
@@ -282,6 +288,7 @@
282
288
  "label.hide-rack-frame": "隐藏货架框",
283
289
  "label.horizontal": "水平对齐",
284
290
  "label.hour-width": "时针厚度",
291
+ "label.hover-action": "悬停操作",
285
292
  "label.hover-event": "悬停事件",
286
293
  "label.href": "href",
287
294
  "label.id": "ID",
@@ -351,6 +358,8 @@
351
358
  "label.min": "最小",
352
359
  "label.min-section": "最小段",
353
360
  "label.min-unit": "最小单位",
361
+ "label.minimizable": "可最小化",
362
+ "label.minimized": "最小化",
354
363
  "label.minor": "次要",
355
364
  "label.minute-width": "分针厚度",
356
365
  "label.miter": "斜边",
@@ -380,6 +389,7 @@
380
389
  "label.padding": "间隔",
381
390
  "label.partial-spreading": "部分传播",
382
391
  "label.passcode": "密码",
392
+ "label.page": "页面",
383
393
  "label.path": "路径",
384
394
  "label.pattern": "图案",
385
395
  "label.period": "期间",
@@ -428,7 +438,7 @@
428
438
  "label.requester": "申请人",
429
439
  "label.reset-password": "重置密码",
430
440
  "label.reset_password": "重置密码",
431
- "label.restore-on-leave": "离开时恢复",
441
+ "label.reset-on-leave": "离开时恢复",
432
442
  "label.retain": "保持",
433
443
  "label.retention": "保存期间",
434
444
  "label.reverse": "反转",
@@ -517,6 +527,7 @@
517
527
  "label.tab-active-index": "标签激活指数",
518
528
  "label.tab-reference": "标签参考",
519
529
  "label.tag": "标签",
530
+ "label.tap-action": "点击操作",
520
531
  "label.tap-event": "点击事件",
521
532
  "label.target": "目标",
522
533
  "label.target-axis": "对象轴",
@@ -603,6 +614,12 @@
603
614
  "menu.variables": "变量",
604
615
  "scene.scene-height": "标签高(Pixel)",
605
616
  "scene.scene-width": "标签宽(Pixel)",
617
+ "text.NOTHING_CHANGED": "没有新的更新。",
618
+ "text.New Alarm Message is Arrived.": "新报警到达!",
619
+ "text.Server Processing": "执行服务中..",
620
+ "text.Success to Process": "执行成功",
621
+ "text.Sure To Delete Important": "所有相关数据都会被删除,请确认是否删除?",
622
+ "text.Sure to X": "确定要{x}吗?",
606
623
  "text.add_files": "添加文件",
607
624
  "text.board cloned": "看板 '{board}' 已成功克隆",
608
625
  "text.board created": "看板 '{board}' 创建成功",
@@ -655,9 +672,7 @@
655
672
  "text.modeller-save-title": "保存:版本报警",
656
673
  "text.move-to-home": "将会移动到主页。",
657
674
  "text.name-and-group-required": "请指定仪表盘名称和仪表盘组!",
658
- "text.New Alarm Message is Arrived.": "新报警到达!",
659
675
  "text.no released version information available": "没有发布版本信息可用",
660
- "text.NOTHING_CHANGED": "没有新的更新。",
661
676
  "text.only-edit-status-label-can-be-deleted": "只有EDIT状态的标签才可以删除!",
662
677
  "text.only-edit-status-label-can-be-saved": "只有EDIT状态的标签才可以更改!",
663
678
  "text.password-missmatch": "新密码与确认密码不同",
@@ -680,13 +695,9 @@
680
695
  "text.saved": "已保存",
681
696
  "text.search with type, id or tag": "通过类型、ID或标签名搜索",
682
697
  "text.select_file": "选择文件",
683
- "text.Server Processing": "执行服务中..",
684
698
  "text.server_unavailable": "服务器无法链接",
685
699
  "text.settings-already-done": "已有设置。",
686
700
  "text.stalled": "停滞",
687
- "text.Success to Process": "执行成功",
688
- "text.Sure To Delete Important": "所有相关数据都会被删除,请确认是否删除?",
689
- "text.Sure to X": "确定要{x}吗?",
690
701
  "text.sure-delete-domain": "所有相关数据都会被删除,请确认是否删除?",
691
702
  "text.sure-delete-domain-final": "将会删除所有相关数据。是否继续进行删除?",
692
703
  "text.sure-to-delete": "是否执行删除操作?",
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
@@ -1,124 +0,0 @@
1
- import '@material/web/icon/icon.js'
2
-
3
- import gql from 'graphql-tag'
4
- import { css, html, LitElement, nothing } from 'lit'
5
- import { customElement, property } from 'lit/decorators.js'
6
- import { connect } from 'pwa-helpers/connect-mixin.js'
7
-
8
- import { store } from '@operato/shell'
9
- import { client } from '@operato/graphql'
10
-
11
- import { UPDATE_FAVORITES } from '@things-factory/fav-base/client'
12
-
13
- @customElement('favorite-tool')
14
- export class FavoriteTool extends connect(store)(LitElement) {
15
- static styles = css`
16
- :host {
17
- display: inline-block;
18
- vertical-align: middle;
19
- line-height: 0;
20
- }
21
-
22
- [favorable] {
23
- opacity: 0.5;
24
- }
25
- `
26
-
27
- @property({ type: Array }) favorites: any[] = []
28
- @property({ type: Object }) user: any
29
- @property({ type: String }) resourceId?: string
30
- @property({ type: Boolean }) favored?: boolean
31
- @property({ type: Array }) acceptedPages: any[] = []
32
-
33
- page: any
34
-
35
- render() {
36
- var renderable = (this.acceptedPages || []).indexOf(this.page) !== -1
37
-
38
- return renderable
39
- ? html`
40
- <md-icon @click=${this.onClick.bind(this)} ?favorable=${!this.favored}
41
- >${this.favored ? 'star' : 'star_border'}</md-icon
42
- >
43
- `
44
- : nothing
45
- }
46
-
47
- updated(changes) {
48
- if (changes.has('user')) {
49
- this.refreshFavorites()
50
- }
51
-
52
- this.favored = (this.favorites || []).includes(this.resourceId)
53
- }
54
-
55
- stateChanged(state) {
56
- this.page = state.route.page
57
- this.favorites = state.favorite.favorites
58
- this.user = state.auth.user
59
- this.resourceId = state.route.resourceId
60
- }
61
-
62
- onClick(event) {
63
- if (!this.resourceId) {
64
- return
65
- }
66
-
67
- if (this.favored) {
68
- this.removeFavorite(this.resourceId)
69
- } else {
70
- this.addFavorite(this.resourceId)
71
- }
72
- }
73
-
74
- async refreshFavorites() {
75
- if (!this.user || !this.user.email) {
76
- return
77
- }
78
-
79
- const response = await client.query({
80
- query: gql`
81
- query {
82
- myFavorites {
83
- id
84
- routing
85
- }
86
- }
87
- `
88
- })
89
-
90
- store.dispatch({
91
- type: UPDATE_FAVORITES,
92
- favorites: response.data.myFavorites.map(favorite => favorite.routing)
93
- })
94
- }
95
-
96
- async removeFavorite(routing) {
97
- await client.query({
98
- query: gql`
99
- mutation {
100
- deleteFavorite(routing: "${routing}")
101
- }
102
- `
103
- })
104
-
105
- this.refreshFavorites()
106
- }
107
-
108
- async addFavorite(routing) {
109
- await client.query({
110
- query: gql`
111
- mutation {
112
- createFavorite(favorite: {
113
- routing: "${routing}"
114
- }) {
115
- id
116
- routing
117
- }
118
- }
119
- `
120
- })
121
-
122
- this.refreshFavorites()
123
- }
124
- }
@@ -1,272 +0,0 @@
1
- import '@material/web/icon/icon.js'
2
- import '@operato/board/ox-board-creation-card.js'
3
-
4
- import gql from 'graphql-tag'
5
- import { css, html, LitElement, PropertyValues, nothing } from 'lit'
6
- import { customElement, property, state, query } from 'lit/decorators.js'
7
- import { keyed } from 'lit/directives/keyed.js'
8
-
9
- import { client } from '@operato/graphql'
10
-
11
- import { privileged } from '@things-factory/auth-base/dist-client'
12
-
13
- @customElement('board-tile-list')
14
- export class BoardTileList extends LitElement {
15
- static styles = [
16
- css`
17
- :host {
18
- overflow: auto;
19
- padding: var(--popup-content-padding);
20
- display: grid;
21
- background-color: var(--md-sys-color-background);
22
-
23
- grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
24
- grid-auto-rows: var(--card-list-rows-height);
25
- grid-gap: 20px;
26
- }
27
-
28
- [card] {
29
- position: relative;
30
- align-items: center;
31
- overflow: hidden;
32
- }
33
-
34
- [card][create] {
35
- overflow: visible;
36
- background-color: initial;
37
- }
38
-
39
- [card] > a {
40
- display: flex;
41
- clip-path: border-box;
42
- }
43
-
44
- [card]:hover {
45
- cursor: pointer;
46
- }
47
-
48
- [name] {
49
- text-overflow: ellipsis;
50
- white-space: nowrap;
51
- overflow: hidden;
52
- margin-top: var(--spacing-small);
53
- width: calc(100% - 45px);
54
- color: var(--md-sys-color-on-background);
55
- font-weight: bolder;
56
- font-size: var(--fontsize-small);
57
- }
58
-
59
- img {
60
- flex: 1;
61
- object-fit: contain;
62
- }
63
-
64
- md-icon[iconBtn] {
65
- float: right;
66
- margin-top: -20px;
67
- margin-left: 2px;
68
- color: var(--board-list-star-color);
69
- font-size: 1.4em;
70
- }
71
- md-icon[info] {
72
- color: var(--md-sys-color-primary);
73
- }
74
-
75
- md-icon[iconBtn][favored],
76
- md-icon[info]:hover {
77
- color: var(--board-list-star-active-color);
78
- }
79
-
80
- a {
81
- display: block;
82
- border-radius: var(--card-list-border-radius);
83
- border: var(--border-dim-color);
84
- box-sizing: border-box;
85
- color: var(--card-list-color);
86
- background-color: var(--card-list-background-color);
87
- margin: 0px;
88
- height: calc(100% - 25px);
89
- }
90
-
91
- :host > *:hover [info] {
92
- opacity: 1;
93
- -webkit-transition: opacity 0.8s;
94
- -moz-transition: opacity 0.8s;
95
- -o-transition: opacity 0.8s;
96
- transition: opacity 0.8s;
97
- }
98
-
99
- [draggable='true'] {
100
- cursor: grab;
101
- }
102
-
103
- @media screen and (max-width: 800px), screen and (max-height: 600px) {
104
- ox-board-creation-card {
105
- display: none;
106
- }
107
- }
108
- `
109
- ]
110
-
111
- @property({ type: Array }) boards: any[] = []
112
- @property({ type: Array }) favorites: any[] = []
113
- @property({ type: Array }) groups: any[] = []
114
- @property({ type: String }) group?: string
115
- @property({ type: Boolean }) creatable?: boolean = false
116
- @property({ type: String, attribute: 'search-text' }) searchText?: string
117
- @property({ type: Boolean, attribute: 'reorderable' }) reorderable: boolean = false
118
-
119
- private draggedItem
120
-
121
- connectedCallback() {
122
- super.connectedCallback()
123
-
124
- if (this.reorderable) {
125
- this.renderRoot.addEventListener('dragstart', (e: Event) => {
126
- const target = e.target! as HTMLElement
127
- this.draggedItem = target.closest('[card]')
128
- ;(e as DragEvent).dataTransfer?.setData('text/plain', target.innerHTML)
129
- })
130
-
131
- this.renderRoot.addEventListener('dragover', (e: Event) => {
132
- e.preventDefault()
133
-
134
- const target = e.target! as HTMLElement
135
- const targetItem = target.closest('[card]')
136
- if (targetItem && targetItem !== this.draggedItem) {
137
- const targetRect = targetItem.getBoundingClientRect()
138
- const mousePos = (e as DragEvent).clientX - targetRect.left
139
-
140
- if (mousePos < targetRect.width / 2) {
141
- // 마우스 위치가 아이템 좌측 반절에 있을 때
142
- this.renderRoot.insertBefore(this.draggedItem, targetItem)
143
- } else {
144
- // 마우스 위치가 아이템 우측 반절에 있을 때
145
- this.renderRoot.insertBefore(this.draggedItem, targetItem.nextSibling)
146
- }
147
- }
148
- })
149
-
150
- this.renderRoot.addEventListener('drop', (e: Event) => {
151
- e.preventDefault()
152
-
153
- const boardIds = Array.from(this.renderRoot.querySelectorAll('[card]'))
154
- .map(board => board.getAttribute('id'))
155
- .filter(Boolean)
156
-
157
- this.dispatchEvent(
158
- new CustomEvent('reordered', {
159
- detail: {
160
- groupId: this.group,
161
- boardIds
162
- }
163
- })
164
- )
165
- })
166
- }
167
- }
168
-
169
- render() {
170
- var boards = this.boards || []
171
-
172
- return html`
173
- ${this.creatable
174
- ? privileged(
175
- { privilege: 'mutation', category: 'board' },
176
- html`
177
- <ox-board-creation-card
178
- .groups=${this.groups}
179
- .defaultGroup=${this.group}
180
- @create-board=${e => this.onCreateBoard(e)}
181
- card
182
- create
183
- ></ox-board-creation-card>
184
- `
185
- )
186
- : nothing}
187
- ${keyed(
188
- Date.now(),
189
- boards.map(
190
- board => html`
191
- <div card draggable="true" id=${board.id}>
192
- <a href="board-viewer/${board.id}"> <img src=${board.thumbnail} /> </a>
193
-
194
- <div name>${board.name}</div>
195
- <!-- <div description>${board.description}</div> -->
196
-
197
- <md-icon
198
- iconBtn
199
- info
200
- @click=${e => {
201
- this.infoBoard(board)
202
- e.preventDefault()
203
- }}
204
- >info</md-icon
205
- >
206
-
207
- ${(this.favorites || []).includes(board.id)
208
- ? html` <md-icon iconBtn favored @click=${e => this.removeFavorite(board.id)}>star</md-icon> `
209
- : html` <md-icon iconBtn @click=${e => this.addFavorite(board.id)}>star_border</md-icon> `}
210
- </div>
211
- `
212
- )
213
- )}
214
- `
215
- }
216
-
217
- updated(changes: PropertyValues<this>) {
218
- var creationCard = this.renderRoot.querySelector('ox-board-creation-card') as any
219
- if (creationCard) {
220
- creationCard.reset()
221
- }
222
- }
223
-
224
- onCreateBoard(e) {
225
- this.dispatchEvent(
226
- new CustomEvent('create-board', {
227
- detail: e.detail
228
- })
229
- )
230
- }
231
-
232
- infoBoard(board) {
233
- this.dispatchEvent(
234
- new CustomEvent('info-board', {
235
- detail: board
236
- })
237
- )
238
- }
239
-
240
- async removeFavorite(boardId) {
241
- await client.query({
242
- query: gql`
243
- mutation {
244
- deleteFavorite(routing: "${boardId}")
245
- }
246
- `
247
- })
248
-
249
- this.refreshFavorites()
250
- }
251
-
252
- async addFavorite(boardId) {
253
- await client.query({
254
- query: gql`
255
- mutation {
256
- createFavorite(favorite: {
257
- routing: "${boardId}"
258
- }) {
259
- id
260
- routing
261
- }
262
- }
263
- `
264
- })
265
-
266
- this.refreshFavorites()
267
- }
268
-
269
- async refreshFavorites() {
270
- this.dispatchEvent(new CustomEvent('refresh-favorites'))
271
- }
272
- }
@@ -1,63 +0,0 @@
1
- import { css } from 'lit'
2
-
3
- export const GroupBarStyles = css`
4
- :host {
5
- background-color: var(--group-bar-background-color);
6
-
7
- overflow-x: hidden;
8
- }
9
-
10
- ul {
11
- display: flex;
12
- flex-direction: row;
13
- box-sizing: border-box;
14
- list-style: none;
15
- margin: 0;
16
- padding: 0;
17
- white-space: nowrap;
18
- }
19
-
20
- li {
21
- display: flex;
22
- align-items: center;
23
-
24
- box-sizing: border-box;
25
- border-bottom: var(--group-bar-line);
26
- align-self: auto;
27
- min-height: 43px;
28
- padding: 4px 8px;
29
-
30
- * {
31
- vertical-align: middle;
32
- }
33
-
34
- a {
35
- display: block;
36
- text-decoration: none;
37
- font: var(--group-bar-textbutton);
38
- color: var(--md-sys-color-on-secondary-container);
39
- opacity: 0.8;
40
- }
41
-
42
- a md-icon {
43
- font-variation-settings: 'FILL' 1;
44
- }
45
-
46
- &[active] {
47
- border-color: var(--group-bar-active-line-color);
48
-
49
- a {
50
- font: var(--group-bar-textbutton-active);
51
- opacity: 1;
52
- }
53
- }
54
-
55
- &[padding] {
56
- flex: 1;
57
- }
58
-
59
- &[add] * {
60
- color: var(--md-sys-color-on-secondary-container);
61
- }
62
- }
63
- `