@alisaitteke/seatmap-canvas 2.0.3 → 2.3.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 (70) hide show
  1. package/.github/workflows/publish.yml +1 -1
  2. package/.opencommitignore +2 -1
  3. package/CHANGELOG.md +2 -0
  4. package/README.md +3 -5
  5. package/dist/cjs/index.js +16 -0
  6. package/examples/index.html +171 -0
  7. package/package.json +19 -12
  8. package/rollup.config.js +56 -0
  9. package/src/lib/canvas.index.ts +2 -3
  10. package/src/lib/config.ts +1 -1
  11. package/src/lib/decorators/dom.ts +1 -1
  12. package/src/lib/decorators/index.ts +1 -1
  13. package/src/lib/dev.tools.ts +1 -1
  14. package/src/lib/enums/global.ts +3 -3
  15. package/src/lib/models/block.model.ts +23 -128
  16. package/src/lib/models/coordinate.model.ts +3 -20
  17. package/src/lib/models/data.model.ts +29 -9
  18. package/src/lib/models/defaults.model.ts +10 -4
  19. package/src/lib/models/global.model.ts +1 -1
  20. package/src/lib/models/label.model.ts +5 -38
  21. package/src/lib/models/legend.model.ts +6 -38
  22. package/src/lib/models/model.base.ts +5 -22
  23. package/src/lib/models/seat.model.ts +18 -126
  24. package/src/lib/svg/event.manager.ts +6 -14
  25. package/src/lib/svg/legend/legend.circle.ts +1 -1
  26. package/src/lib/svg/legend/legend.item.ts +7 -4
  27. package/src/lib/svg/legend/legend.title.ts +2 -2
  28. package/src/lib/svg/legend.ts +1 -1
  29. package/src/lib/svg/stage/blocks/block-item/block-item.bounds.ts +1 -1
  30. package/src/lib/svg/stage/blocks/block-item/block-item.index.ts +17 -5
  31. package/src/lib/svg/stage/blocks/block-item/block-item.info.index.ts +2 -1
  32. package/src/lib/svg/stage/blocks/block-item/block-item.labels.index.ts +1 -1
  33. package/src/lib/svg/stage/blocks/block-item/block-item.mask.ts +1 -1
  34. package/src/lib/svg/stage/blocks/block-item/block-item.seats.index.ts +1 -1
  35. package/src/lib/svg/stage/blocks/block-item/bound/bound-item.index.ts +1 -1
  36. package/src/lib/svg/stage/blocks/block-item/info/title.ts +1 -1
  37. package/src/lib/svg/stage/blocks/block-item/label/label-item.circle.ts +1 -1
  38. package/src/lib/svg/stage/blocks/block-item/label/label-item.index.ts +1 -1
  39. package/src/lib/svg/stage/blocks/block-item/label/label-item.title.ts +1 -1
  40. package/src/lib/svg/stage/blocks/block-item/seat/seat-item.check.ts +12 -5
  41. package/src/lib/svg/stage/blocks/block-item/seat/seat-item.circle.ts +1 -1
  42. package/src/lib/svg/stage/blocks/block-item/seat/seat-item.index.ts +4 -4
  43. package/src/lib/svg/stage/blocks/block-item/seat/seat-item.title.ts +1 -1
  44. package/src/lib/svg/stage/blocks/blocks.index.ts +8 -5
  45. package/src/lib/svg/stage/blocks.search-circle.ts +1 -1
  46. package/src/lib/svg/stage/multi-select/rect.ts +1 -1
  47. package/src/lib/svg/stage/multi-select.ts +1 -1
  48. package/src/lib/svg/stage/search-circle/circle.ts +1 -1
  49. package/src/lib/svg/stage/stage.index.ts +1 -1
  50. package/src/lib/svg/svg.base.ts +40 -28
  51. package/src/lib/svg/svg.index.ts +1 -1
  52. package/src/lib/svg/tooltip/rect.ts +1 -1
  53. package/src/lib/svg/tooltip/title.ts +2 -11
  54. package/src/lib/svg/tooltip.ts +4 -3
  55. package/src/lib/svg/zoom-out.bg.ts +2 -2
  56. package/src/lib/svg/zoom.manager.ts +56 -48
  57. package/src/lib/window.manager.ts +3 -3
  58. package/tsconfig.json +21 -17
  59. package/dist/seatmap.canvas.2.0.2.css +0 -1
  60. package/dist/seatmap.canvas.2.0.2.js +0 -2
  61. package/dist/seatmap.canvas.2.0.2.js.LICENSE.txt +0 -14
  62. package/examples/basic/bootstrap.min.css +0 -7
  63. package/examples/basic/index.html +0 -201
  64. package/examples/basic/jquery.min.js +0 -2
  65. package/examples/data/data.json +0 -70007
  66. package/examples/data/small.json +0 -1307
  67. package/examples/data/tiny.json +0 -119
  68. package/examples/old/index.html +0 -262
  69. package/webpack.environments/development.js +0 -58
  70. package/webpack.environments/production.js +0 -52
@@ -1,119 +0,0 @@
1
- {
2
- "totalItemCount": 0,
3
- "seats": [
4
- {
5
- "isSold": false,
6
- "seatClassType": 100,
7
- "id": 5691694,
8
- "positionTop": 0,
9
- "positionLeft": 0,
10
- "displayName": "49",
11
- "rowName": "A",
12
- "rowNo": 1,
13
- "refSeatClassID": 158,
14
- "blockId": 0,
15
- "refChannelGroupId": 25351,
16
- "gateTurnstile": "[{\"gateID\":24435,\"gateName\":\"DENIZLI GATE 1\",\"turnstileID\":24900,\"turnstileName\":\"DENIZLI TURNSTILE 1\"}]"
17
- },
18
- {
19
- "isSold": false,
20
- "seatClassType": 100,
21
- "id": 5691695,
22
- "positionTop": 0,
23
- "positionLeft": 30,
24
- "displayName": "47",
25
- "rowName": "A",
26
- "rowNo": 1,
27
- "refSeatClassID": 158,
28
- "blockId": 0,
29
- "refChannelGroupId": 25351,
30
- "gateTurnstile": "[{\"gateID\":24435,\"gateName\":\"DENIZLI GATE 1\",\"turnstileID\":24900,\"turnstileName\":\"DENIZLI TURNSTILE 1\"}]"
31
- },
32
- {
33
- "isSold": false,
34
- "seatClassType": 100,
35
- "id": 5691696,
36
- "positionTop": 0,
37
- "positionLeft": 60,
38
- "displayName": "45",
39
- "rowName": "A",
40
- "rowNo": 1,
41
- "refSeatClassID": 158,
42
- "blockId": 0,
43
- "refChannelGroupId": 25351,
44
- "gateTurnstile": "[{\"gateID\":24435,\"gateName\":\"DENIZLI GATE 1\",\"turnstileID\":24900,\"turnstileName\":\"DENIZLI TURNSTILE 1\"}]"
45
- },
46
- {
47
- "isSold": false,
48
- "seatClassType": 100,
49
- "id": 5691724,
50
- "positionTop": 30,
51
- "positionLeft": 150,
52
- "displayName": "39",
53
- "rowName": "B",
54
- "rowNo": 2,
55
- "refSeatClassID": 158,
56
- "blockId": 0,
57
- "refChannelGroupId": 25351,
58
- "gateTurnstile": "[{\"gateID\":24435,\"gateName\":\"DENIZLI GATE 1\",\"turnstileID\":24900,\"turnstileName\":\"DENIZLI TURNSTILE 1\"}]"
59
- },
60
- {
61
- "isSold": false,
62
- "seatClassType": 100,
63
- "id": 5691725,
64
- "positionTop": 30,
65
- "positionLeft": 180,
66
- "displayName": "37",
67
- "rowName": "B",
68
- "rowNo": 2,
69
- "refSeatClassID": 158,
70
- "blockId": 0,
71
- "refChannelGroupId": 25351,
72
- "gateTurnstile": "[{\"gateID\":24435,\"gateName\":\"DENIZLI GATE 1\",\"turnstileID\":24900,\"turnstileName\":\"DENIZLI TURNSTILE 1\"}]"
73
- },
74
- {
75
- "isSold": false,
76
- "seatClassType": 100,
77
- "id": 5691726,
78
- "positionTop": 30,
79
- "positionLeft": 210,
80
- "displayName": "35",
81
- "rowName": "B",
82
- "rowNo": 2,
83
- "refSeatClassID": 158,
84
- "blockId": 0,
85
- "refChannelGroupId": 25351,
86
- "gateTurnstile": "[{\"gateID\":24435,\"gateName\":\"DENIZLI GATE 1\",\"turnstileID\":24900,\"turnstileName\":\"DENIZLI TURNSTILE 1\"}]"
87
- },
88
- {
89
- "isSold": false,
90
- "seatClassType": 100,
91
- "id": 5691727,
92
- "positionTop": 30,
93
- "positionLeft": 240,
94
- "displayName": "33",
95
- "rowName": "B",
96
- "rowNo": 2,
97
- "refSeatClassID": 158,
98
- "blockId": 0,
99
- "refChannelGroupId": 25351,
100
- "gateTurnstile": "[{\"gateID\":24435,\"gateName\":\"DENIZLI GATE 1\",\"turnstileID\":24900,\"turnstileName\":\"DENIZLI TURNSTILE 1\"}]"
101
- },
102
- {
103
- "isSold": false,
104
- "seatClassType": 100,
105
- "id": 5691728,
106
- "positionTop": 30,
107
- "positionLeft": 270,
108
- "displayName": "31",
109
- "rowName": "B",
110
- "rowNo": 2,
111
- "refSeatClassID": 158,
112
- "blockId": 0,
113
- "refChannelGroupId": 25351,
114
- "gateTurnstile": "[{\"gateID\":24435,\"gateName\":\"DENIZLI GATE 1\",\"turnstileID\":24900,\"turnstileName\":\"DENIZLI TURNSTILE 1\"}]"
115
- }
116
- ],
117
- "isError": false,
118
- "resultCode": 0
119
- }
@@ -1,262 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <!-- Required meta tags -->
5
- <meta charset="utf-8">
6
- <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
7
-
8
- <!-- Bootstrap CSS -->
9
- <link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
10
- integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
11
-
12
- <title>Hello, world!</title>
13
-
14
- <style>
15
-
16
- .seats_container {
17
- position: absolute;
18
- left: 0;
19
- top: 0;
20
- width: 100%;
21
- height: 100%;
22
- background-color: #fff;
23
- }
24
-
25
- .buttons {
26
- position: absolute;
27
- width: 100%;
28
- left: 0;
29
- top: 0;
30
- }
31
-
32
- </style>
33
- </head>
34
- <body>
35
- <div class="seats_container">
36
- <div class="buttons">
37
- <div class="container">
38
- <div class="row">
39
- <div class="col">
40
- <button class="btn btn-default btn-block" id="zoomout-button">Zoom-out</button>
41
- </div>
42
- <div class="col">
43
- <button class="btn btn-default btn-block" id="best-find-start">Best Available Search</button>
44
- </div>
45
- <div class="col">
46
- <button class="btn btn-default btn-block" id="best-find-cancel">Best Available Cancel</button>
47
- </div>
48
- <div class="col">
49
- <button class="btn btn-default btn-block" id="get-data">Get Selected Seat(s) Json</button>
50
- </div>
51
- <div class="col">
52
- <button class="btn btn-default btn-block" id="set-filter">Filter On</button>
53
- </div>
54
- <div class="col">
55
- <button class="btn btn-default btn-block" id="set-filter-disable">Filter of</button>
56
- </div>
57
- <div class="col">
58
- <button class="btn btn-default btn-block" id="zoom-block-1">Zoom Block 1</button>
59
- </div>
60
- <div class="col">
61
- <button class="btn btn-default btn-block" id="zoom-block-2">Zoom Block 2</button>
62
- </div>
63
- <div class="col">
64
- <button class="btn btn-default btn-block" id="zoom-block-3">Zoom Block 3</button>
65
- </div>
66
- <div class="col">
67
- <button class="btn btn-default btn-block" id="zoom-block-4">Zoom Block 4</button>
68
- </div>
69
- </div>
70
- </div>
71
- </div>
72
- </div>
73
-
74
-
75
- <!-- Optional JavaScript -->
76
- <!-- jQuery first then Bootstrap JS -->
77
- <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js" crossorigin="anonymous"></script>
78
-
79
- <script type="text/javascript" src="/seatmap.canvas.js"></script>
80
- <script type="text/javascript">
81
- $(document).ready(function () {
82
-
83
- let config = {
84
- "container": ".seats_container",
85
- "max_zoom": 1.2,
86
- "resizable": true,
87
- "seat_style": {
88
- "radius": 12,
89
- "color": "#FFFFFF",
90
- "hover": "#dce7ff",
91
- "not_salable": "#424747",
92
- "selected": "#56aa45",
93
- "focus": "#c3f7ff",
94
- "focus_out": "#56aa45",
95
- },
96
- "block_style": {
97
- "fill": "#e2e2e2",
98
- "stroke": "#e2e2e2"
99
- },
100
- "label_style": {
101
- "color": "#000",
102
- "radius": 12,
103
- "font-size": "12px",
104
- "bg": "#ffffff"
105
- },
106
- "legend_style": {
107
- "radius": 12,
108
- "font_size": 11,
109
- "padding": 100
110
- }
111
- };
112
-
113
-
114
- let seatmap = new SeatmapCanvas(config);
115
-
116
- seatmap.addEventListener("seat.click", (seat) => {
117
- console.log(seat);
118
- if (seat.selected) {
119
- seatmap.seatUnselect(seat);
120
- } else {
121
- seatmap.seatSelect(seat);
122
- }
123
- });
124
- seatmap.addEventListener("seat.hover", (seat) => {
125
- //console.log(seat);
126
- });
127
- seatmap.addEventListener("seat.leave", (seat) => {
128
- //console.log(seat);
129
- });
130
-
131
- seatmap.addEventListener("seat.context_menu", (seat) => {
132
- console.log(seat);
133
- });
134
-
135
- seatmap.addEventListener("label.click", (label) => {
136
- console.log(label);
137
- });
138
-
139
- seatmap.addEventListener("label.hover", (label) => {
140
- seatmap.hideSeatsOfTags(["row_" + label.title], label.block.id).showSeatsOfTags(["row_" + label.title], label.block.id);
141
- });
142
-
143
- seatmap.addEventListener("label.leave", (label) => {
144
- seatmap.showSeatsOfTags(["row_" + label.title], label.block.id);
145
- });
146
-
147
- $("#best-find-start").on("click", function () {
148
- seatmap.findBestSeat(3);
149
- });
150
- $("#zoomout-button").on("click", function () {
151
- seatmap.centerStage(true);
152
- });
153
- $("#best-find-cancel").on("click", function () {
154
- seatmap.cancelBestSeat();
155
- });
156
- $("#get-data").on("click", function () {
157
- var data = seatmap.getSelectedSeats(true);
158
- console.log(JSON.stringify(data));
159
- });
160
- $("#set-filter").on("click", function () {
161
- seatmap.hideSeatsOfTags(["a"]);
162
- });
163
-
164
- $("#set-filter-disable").on("click", function () {
165
- seatmap.showSeatsOfTags(["a"]);
166
- });
167
-
168
- $("#zoom-block-1").on("click", function () {
169
- seatmap.zoomToBlock(1);
170
- });
171
-
172
- $("#zoom-block-2").on("click", function () {
173
- seatmap.zoomToBlock(2);
174
- });
175
- $("#zoom-block-3").on("click", function () {
176
- seatmap.zoomToBlock(3);
177
- });
178
- $("#zoom-block-4").on("click", function () {
179
- seatmap.zoomToBlock(4);
180
- });
181
-
182
-
183
- setTimeout(() => {
184
- $.getJSON("/data/data.json", function (result) {
185
-
186
- let data = {
187
- "blocks": []
188
- };
189
-
190
- let block_colors = ["#2c2828", "#ff1f5a", "#fccf4d", "#ef255f"];
191
-
192
-
193
- let x_gap = 0;
194
- let y_gap = 0;
195
-
196
-
197
- for (let i = 0; i < 1; i++) {
198
-
199
- let labels = [];
200
- let label_index = {};
201
-
202
- let color = block_colors[i % block_colors.length];
203
-
204
- //x_gap = 890;
205
-
206
- if (i % 2 === 0) {
207
- y_gap += 500;
208
- x_gap = 0;
209
- } else {
210
- x_gap += 890;
211
- }
212
-
213
-
214
- let seats = result.seats.map((item, index) => {
215
- if (!label_index[item.rowName]) {
216
- var label_data = {
217
- title: item.rowName,
218
- x: item.positionLeft + x_gap,
219
- y: item.positionTop + y_gap
220
- };
221
- label_index[item.rowName] = label_data;
222
- labels.push(label_data);
223
- }
224
-
225
- let tags = [];
226
- if (index % 2 === 1) {
227
- tags.push("a");
228
- } else {
229
- tags.push("b");
230
- }
231
- tags.push("row_" + item.rowName);
232
- return {
233
- id: index + 1,
234
- x: item.positionLeft + x_gap + 40,
235
- y: item.positionTop + y_gap,
236
- color: item.color || null,
237
- salable: item.isSold === true ? false : true,
238
- note: "note test",
239
- tags: tags,
240
- title: item.displayName
241
- }
242
- });
243
-
244
- data.blocks.push({
245
- "id": i + 1,
246
- "title": "Block " + (i + 1),
247
- "labels": labels,
248
- "color": color,
249
- "seats": seats
250
- });
251
-
252
- }
253
-
254
- seatmap.setData(data);
255
- });
256
- }, 250);
257
-
258
-
259
- });
260
- </script>
261
- </body>
262
- </html>
@@ -1,58 +0,0 @@
1
- const path = require('path');
2
-
3
- module.exports = {
4
- mode: "production",
5
- devtool: "inline-source-map",
6
- context: __dirname,
7
- entry: {
8
- "main": path.resolve(__dirname, '../src', "lib", "canvas.index.ts")
9
- },
10
- resolve: {
11
- // Add `.ts` and `.tsx` as a resolvable extension.
12
- extensions: [".ts", ".tsx", ".js"]
13
- },
14
- output: {
15
- path: path.resolve(__dirname, '../dist'),
16
- filename: 'seatmap.canvas.js',
17
- },
18
- module: {
19
- rules: [
20
- {test: /\.tsx?$/, loader: "ts-loader"},
21
- {
22
- test: /\.txt$/,
23
- use: 'raw-loader'
24
- }, {
25
- test: /\.s[ac]ss$/i,
26
- use: [
27
- // Creates `style` nodes from JS strings
28
- "style-loader",
29
- // Translates CSS into CommonJS
30
- "css-loader",
31
- // Compiles Sass to CSS
32
- "sass-loader",
33
- ],
34
- },
35
- ],
36
- },
37
- watch: true,
38
- watchOptions: {
39
- ignored: ['src/**/*.js', 'node_modules', 'dist', 'examples']
40
- },
41
- devServer: {
42
- liveReload: true,
43
- client: {
44
- reconnect: true,
45
- progress: true,
46
- overlay: {
47
- errors: true,
48
- warnings: false,
49
- }
50
- },
51
- static: {
52
- directory: path.join(__dirname, '../examples')
53
- },
54
- open: true,
55
- compress: true,
56
- port: 1967
57
- },
58
- };
@@ -1,52 +0,0 @@
1
- const path = require('path');
2
- const MiniCssExtractPlugin = require("mini-css-extract-plugin");
3
-
4
- const context = path.resolve(__dirname, '../src');
5
-
6
- const PACKAGE = require(path.resolve(__dirname, '../package.json'));
7
- const version = PACKAGE.version;
8
-
9
- module.exports = {
10
- mode: "production",
11
- context: context,
12
- entry: {
13
- "seatmap.canvas": path.resolve(context, 'lib', 'canvas.index.ts')
14
- },
15
- resolve: {
16
- // Add `.ts` and `.tsx` as a resolvable extension.
17
- extensions: [".ts", ".tsx", ".js"]
18
- },
19
- output: {
20
- path: path.resolve(__dirname, '../dist'),
21
- filename: `[name].${version}.js`,
22
- clean: true
23
- },
24
- module: {
25
- rules: [
26
- {
27
- test: /\.tsx?$/,
28
- loader: "ts-loader",
29
- exclude: /node_modules/,
30
- },
31
-
32
- {
33
- test: /\.scss$/,
34
- exclude: /node_modules/,
35
- use: [
36
- MiniCssExtractPlugin.loader,
37
- "css-loader",
38
- "postcss-loader",
39
- "sass-loader",
40
- ],
41
- },
42
- ],
43
- },
44
- plugins: [
45
- new MiniCssExtractPlugin({
46
- // Options similar to the same options in webpackOptions.output
47
- // both options are optional
48
- filename: `[name].${version}.css`,
49
- chunkFilename: "[id].css"
50
- })
51
- ],
52
- };