jclic 2.1.21 → 2.1.22
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.
- package/CHANGELOG.md +4 -0
- package/dist/jclic-node.js +1 -1
- package/dist/jclic-node.js.map +1 -1
- package/dist/jclic.min.js +2 -2
- package/dist/jclic.min.js.map +1 -1
- package/package.json +1 -1
- package/src/GlobalData.js +1 -1
- package/dist/1078.jclic-node.js +0 -282
- package/dist/1078.jclic-node.js.map +0 -1
- package/dist/1196.jclic-node.js +0 -808
- package/dist/1196.jclic-node.js.map +0 -1
- package/dist/1253.jclic-node.js +0 -1432
- package/dist/1253.jclic-node.js.map +0 -1
- package/dist/13.jclic-node.js +0 -103
- package/dist/13.jclic-node.js.map +0 -1
- package/dist/1567.jclic-node.js +0 -2313
- package/dist/1567.jclic-node.js.map +0 -1
- package/dist/1588.jclic-node.js +0 -602
- package/dist/1588.jclic-node.js.map +0 -1
- package/dist/1725.jclic-node.js +0 -836
- package/dist/1725.jclic-node.js.map +0 -1
- package/dist/1731.jclic-node.js +0 -438
- package/dist/1731.jclic-node.js.map +0 -1
- package/dist/1842.jclic-node.js +0 -651
- package/dist/1842.jclic-node.js.map +0 -1
- package/dist/2160.jclic-node.js +0 -1016
- package/dist/2160.jclic-node.js.map +0 -1
- package/dist/222.jclic-node.js +0 -129
- package/dist/222.jclic-node.js.map +0 -1
- package/dist/2316.jclic-node.js +0 -949
- package/dist/2316.jclic-node.js.map +0 -1
- package/dist/2355.jclic-node.js +0 -371
- package/dist/2355.jclic-node.js.map +0 -1
- package/dist/2366.jclic-node.js +0 -431
- package/dist/2366.jclic-node.js.map +0 -1
- package/dist/2379.jclic-node.js +0 -202
- package/dist/2379.jclic-node.js.map +0 -1
- package/dist/2437.jclic-node.js +0 -450
- package/dist/2437.jclic-node.js.map +0 -1
- package/dist/2531.jclic-node.js +0 -869
- package/dist/2531.jclic-node.js.map +0 -1
- package/dist/2608.jclic-node.js +0 -160
- package/dist/2608.jclic-node.js.map +0 -1
- package/dist/2715.jclic-node.js +0 -554
- package/dist/2715.jclic-node.js.map +0 -1
- package/dist/277.jclic-node.js +0 -22
- package/dist/277.jclic-node.js.map +0 -1
- package/dist/2921.jclic-node.js +0 -660
- package/dist/2921.jclic-node.js.map +0 -1
- package/dist/2952.jclic-node.js +0 -101
- package/dist/2952.jclic-node.js.map +0 -1
- package/dist/3018.jclic-node.js +0 -421
- package/dist/3018.jclic-node.js.map +0 -1
- package/dist/3019.jclic-node.js +0 -682
- package/dist/3019.jclic-node.js.map +0 -1
- package/dist/3231.jclic-node.js +0 -274
- package/dist/3231.jclic-node.js.map +0 -1
- package/dist/331.jclic-node.js +0 -115
- package/dist/331.jclic-node.js.map +0 -1
- package/dist/3391.jclic-node.js +0 -276
- package/dist/3391.jclic-node.js.map +0 -1
- package/dist/3502.jclic-node.js +0 -671
- package/dist/3502.jclic-node.js.map +0 -1
- package/dist/3653.jclic-node.js +0 -982
- package/dist/3653.jclic-node.js.map +0 -1
- package/dist/371.jclic.min.js +0 -2
- package/dist/371.jclic.min.js.map +0 -1
- package/dist/3856.jclic-node.js +0 -575
- package/dist/3856.jclic-node.js.map +0 -1
- package/dist/4112.jclic-node.js +0 -659
- package/dist/4112.jclic-node.js.map +0 -1
- package/dist/4123.jclic-node.js +0 -910
- package/dist/4123.jclic-node.js.map +0 -1
- package/dist/427.jclic-node.js +0 -894
- package/dist/427.jclic-node.js.map +0 -1
- package/dist/4483.jclic-node.js +0 -327
- package/dist/4483.jclic-node.js.map +0 -1
- package/dist/4548.jclic-node.js +0 -1078
- package/dist/4548.jclic-node.js.map +0 -1
- package/dist/466.jclic-node.js +0 -99
- package/dist/466.jclic-node.js.map +0 -1
- package/dist/485.jclic-node.js +0 -783
- package/dist/485.jclic-node.js.map +0 -1
- package/dist/4921.jclic-node.js +0 -500
- package/dist/4921.jclic-node.js.map +0 -1
- package/dist/5091.jclic-node.js +0 -239
- package/dist/5091.jclic-node.js.map +0 -1
- package/dist/520.jclic-node.js +0 -550
- package/dist/520.jclic-node.js.map +0 -1
- package/dist/5312.jclic-node.js +0 -1126
- package/dist/5312.jclic-node.js.map +0 -1
- package/dist/5338.jclic-node.js +0 -212
- package/dist/5338.jclic-node.js.map +0 -1
- package/dist/5344.jclic-node.js +0 -229
- package/dist/5344.jclic-node.js.map +0 -1
- package/dist/5550.jclic-node.js +0 -238
- package/dist/5550.jclic-node.js.map +0 -1
- package/dist/5626.jclic-node.js +0 -614
- package/dist/5626.jclic-node.js.map +0 -1
- package/dist/5977.jclic-node.js +0 -1081
- package/dist/5977.jclic-node.js.map +0 -1
- package/dist/6148.jclic-node.js +0 -345
- package/dist/6148.jclic-node.js.map +0 -1
- package/dist/6176.jclic-node.js +0 -481
- package/dist/6176.jclic-node.js.map +0 -1
- package/dist/6221.jclic-node.js +0 -1072
- package/dist/6221.jclic-node.js.map +0 -1
- package/dist/6238.jclic-node.js +0 -718
- package/dist/6238.jclic-node.js.map +0 -1
- package/dist/6454.jclic-node.js +0 -1413
- package/dist/6454.jclic-node.js.map +0 -1
- package/dist/6565.jclic-node.js +0 -294
- package/dist/6565.jclic-node.js.map +0 -1
- package/dist/6579.jclic-node.js +0 -719
- package/dist/6579.jclic-node.js.map +0 -1
- package/dist/6715.jclic-node.js +0 -148
- package/dist/6715.jclic-node.js.map +0 -1
- package/dist/6777.jclic-node.js +0 -171
- package/dist/6777.jclic-node.js.map +0 -1
- package/dist/6782.jclic-node.js +0 -1611
- package/dist/6782.jclic-node.js.map +0 -1
- package/dist/6847.jclic-node.js +0 -601
- package/dist/6847.jclic-node.js.map +0 -1
- package/dist/6856.jclic-node.js +0 -252
- package/dist/6856.jclic-node.js.map +0 -1
- package/dist/696.jclic-node.js +0 -1821
- package/dist/696.jclic-node.js.map +0 -1
- package/dist/698.jclic-node.js +0 -583
- package/dist/698.jclic-node.js.map +0 -1
- package/dist/704.jclic-node.js +0 -80
- package/dist/704.jclic-node.js.map +0 -1
- package/dist/7046.jclic-node.js +0 -735
- package/dist/7046.jclic-node.js.map +0 -1
- package/dist/7220.jclic-node.js +0 -156
- package/dist/7220.jclic-node.js.map +0 -1
- package/dist/7257.jclic-node.js +0 -931
- package/dist/7257.jclic-node.js.map +0 -1
- package/dist/743.jclic-node.js +0 -583
- package/dist/743.jclic-node.js.map +0 -1
- package/dist/757.jclic-node.js +0 -1072
- package/dist/757.jclic-node.js.map +0 -1
- package/dist/7781.jclic-node.js +0 -202
- package/dist/7781.jclic-node.js.map +0 -1
- package/dist/7912.jclic-node.js +0 -2103
- package/dist/7912.jclic-node.js.map +0 -1
- package/dist/827.jclic-node.js +0 -708
- package/dist/827.jclic-node.js.map +0 -1
- package/dist/8276.jclic-node.js +0 -409
- package/dist/8276.jclic-node.js.map +0 -1
- package/dist/8322.jclic-node.js +0 -498
- package/dist/8322.jclic-node.js.map +0 -1
- package/dist/8641.jclic-node.js +0 -360
- package/dist/8641.jclic-node.js.map +0 -1
- package/dist/8837.jclic-node.js +0 -651
- package/dist/8837.jclic-node.js.map +0 -1
- package/dist/8895.jclic-node.js +0 -151
- package/dist/8895.jclic-node.js.map +0 -1
- package/dist/9072.jclic-node.js +0 -1285
- package/dist/9072.jclic-node.js.map +0 -1
- package/dist/9078.jclic-node.js +0 -935
- package/dist/9078.jclic-node.js.map +0 -1
- package/dist/9103.jclic-node.js +0 -718
- package/dist/9103.jclic-node.js.map +0 -1
- package/dist/9359.jclic-node.js +0 -145
- package/dist/9359.jclic-node.js.map +0 -1
- package/dist/9409.jclic-node.js +0 -921
- package/dist/9409.jclic-node.js.map +0 -1
- package/dist/9513.jclic-node.js +0 -720
- package/dist/9513.jclic-node.js.map +0 -1
- package/dist/9704.jclic-node.js +0 -81
- package/dist/9704.jclic-node.js.map +0 -1
- package/dist/9950.jclic-node.js +0 -827
- package/dist/9950.jclic-node.js.map +0 -1
package/dist/1725.jclic-node.js
DELETED
|
@@ -1,836 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
exports.id = 1725;
|
|
3
|
-
exports.ids = [1725];
|
|
4
|
-
exports.modules = {
|
|
5
|
-
|
|
6
|
-
/***/ 1725:
|
|
7
|
-
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
8
|
-
|
|
9
|
-
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
10
|
-
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
11
|
-
/* harmony export */ });
|
|
12
|
-
/* unused harmony export ActiveBox */
|
|
13
|
-
/* harmony import */ var jquery__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7750);
|
|
14
|
-
/* harmony import */ var jquery__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(jquery__WEBPACK_IMPORTED_MODULE_0__);
|
|
15
|
-
/* harmony import */ var _AbstractBox_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(9513);
|
|
16
|
-
/* harmony import */ var _ActiveBoxContent_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9072);
|
|
17
|
-
/* harmony import */ var _ActiveBagContent_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(9409);
|
|
18
|
-
/* harmony import */ var _AWT_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(7912);
|
|
19
|
-
/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(1253);
|
|
20
|
-
/**
|
|
21
|
-
* File : boxes/ActiveBox.js
|
|
22
|
-
* Created : 18/04/2015
|
|
23
|
-
* By : Francesc Busquets <francesc@gmail.com>
|
|
24
|
-
*
|
|
25
|
-
* JClic.js
|
|
26
|
-
* An HTML5 player of JClic activities
|
|
27
|
-
* https://projectestac.github.io/jclic.js
|
|
28
|
-
*
|
|
29
|
-
* @source https://github.com/projectestac/jclic.js
|
|
30
|
-
*
|
|
31
|
-
* @license EUPL-1.2
|
|
32
|
-
* @licstart
|
|
33
|
-
* (c) 2000-2020 Educational Telematic Network of Catalonia (XTEC)
|
|
34
|
-
*
|
|
35
|
-
* Licensed under the EUPL, Version 1.1 or -as soon they will be approved by
|
|
36
|
-
* the European Commission- subsequent versions of the EUPL (the "Licence");
|
|
37
|
-
* You may not use this work except in compliance with the Licence.
|
|
38
|
-
*
|
|
39
|
-
* You may obtain a copy of the Licence at:
|
|
40
|
-
* https://joinup.ec.europa.eu/software/page/eupl
|
|
41
|
-
*
|
|
42
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
43
|
-
* distributed under the Licence is distributed on an "AS IS" basis, WITHOUT
|
|
44
|
-
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
|
45
|
-
* Licence for the specific language governing permissions and limitations
|
|
46
|
-
* under the Licence.
|
|
47
|
-
* @licend
|
|
48
|
-
* @module
|
|
49
|
-
*/
|
|
50
|
-
|
|
51
|
-
/* global document */
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
/**
|
|
61
|
-
* Objects of this class are widely used in JClic activities: cells in puzzles and associations,
|
|
62
|
-
* messages and other objects are active boxes.
|
|
63
|
-
*
|
|
64
|
-
* The specific content, size and location of `ActiveBox` objects is determined by its
|
|
65
|
-
* {@link module:boxes/ActiveBoxContent.ActiveBoxContent ActiveBoxContent} member. Most ActiveBoxes have only one content, but some of them can
|
|
66
|
-
* have a secondary or "alternative" content stored in the `altContent` field. This content is
|
|
67
|
-
* used only when the `alternative` flag of the ActiveBox is `on`.
|
|
68
|
-
*
|
|
69
|
-
* Active boxes can host video and interactive media content (specified in the `mediaContent`
|
|
70
|
-
* member of the {@link module:boxes/ActiveBoxContent.ActiveBoxContent ActiveBoxContent} through its `hostedMediaPlayer` member.
|
|
71
|
-
* @extends module:boxes/AbstractBox.AbstractBox
|
|
72
|
-
*/
|
|
73
|
-
class ActiveBox extends _AbstractBox_js__WEBPACK_IMPORTED_MODULE_1__["default"] {
|
|
74
|
-
/**
|
|
75
|
-
* ActiveBox constructor
|
|
76
|
-
* @param {module:boxes/AbstractBox.AbstractBox} [parent] - The AbstractBox to which this ActiveBox belongs
|
|
77
|
-
* @param {module:AWT.Container} [container] - The container where this box is placed.
|
|
78
|
-
* @param {module:boxes/BoxBase.BoxBase} [boxBase] - The object where colors, fonts, border and other graphic properties
|
|
79
|
-
* of this box are defined.
|
|
80
|
-
* @param {number} [setIdLoc] - A numeric identifier, used to locate this box in a set of sibling objects.
|
|
81
|
-
* @param {module:AWT.Rectangle} [rect] - The initial bounds of the box.
|
|
82
|
-
*/
|
|
83
|
-
constructor(parent, container, boxBase, setIdLoc, rect) {
|
|
84
|
-
// ActiveBox extends AbstractBox
|
|
85
|
-
super(parent, container, boxBase);
|
|
86
|
-
this.clear();
|
|
87
|
-
if (typeof setIdLoc === 'number') {
|
|
88
|
-
this.idLoc = setIdLoc;
|
|
89
|
-
this.idAss = 0;
|
|
90
|
-
this.idOrder = 0;
|
|
91
|
-
}
|
|
92
|
-
if (rect)
|
|
93
|
-
this.setBounds(rect);
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
/**
|
|
97
|
-
* Factory constructor that creates a new cell inside a JQuery DOM element.
|
|
98
|
-
* @param {external:jQuery} $dom - The DOM element that will act as a container
|
|
99
|
-
* @param {module:boxes/ActiveBoxContent.ActiveBoxContent} abc - The cell's content. Must not be null and have the `dimension`
|
|
100
|
-
* member initialized.
|
|
101
|
-
* @returns {module:boxes/ActiveBox.ActiveBox}
|
|
102
|
-
*/
|
|
103
|
-
static createCell($dom, abc) {
|
|
104
|
-
if (abc && abc.dimension) {
|
|
105
|
-
const
|
|
106
|
-
box = new ActiveBox(),
|
|
107
|
-
$canvas = jquery__WEBPACK_IMPORTED_MODULE_0___default()('<canvas width="' + abc.dimension.width + '" height="' + abc.dimension.height + '"/>'),
|
|
108
|
-
rect = new _AWT_js__WEBPACK_IMPORTED_MODULE_4__/* .Rectangle */ .M_(0, 0, abc.dimension.width, abc.dimension.height);
|
|
109
|
-
box.container = new _AWT_js__WEBPACK_IMPORTED_MODULE_4__/* .Container */ .mc();
|
|
110
|
-
box.container.$div = $dom;
|
|
111
|
-
box.setContent(abc);
|
|
112
|
-
box.setBounds(rect);
|
|
113
|
-
$dom.append($canvas);
|
|
114
|
-
// Create accessible, focusable elements only for cells with media content
|
|
115
|
-
// TODO: remove focus mark on blur in cells placed on fillInBlanks activities
|
|
116
|
-
if (abc.mediaContent)
|
|
117
|
-
box.buildAccessibleElement($canvas, $dom);
|
|
118
|
-
box.update($canvas.get(-1).getContext('2d'), rect);
|
|
119
|
-
return box;
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
/**
|
|
124
|
-
* Returns the current content used by the box
|
|
125
|
-
* @returns {module:boxes/ActiveBoxContent.ActiveBoxContent}
|
|
126
|
-
*/
|
|
127
|
-
getCurrentContent() {
|
|
128
|
-
return this.isAlternative() ? this.altContent : this.content;
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
/**
|
|
132
|
-
* Returns the current content, creating an empty one if needed.
|
|
133
|
-
* @returns {module:boxes/ActiveBoxContent.ActiveBoxContent}
|
|
134
|
-
*/
|
|
135
|
-
getContent() {
|
|
136
|
-
if (!this.content)
|
|
137
|
-
this.setContent(new _ActiveBoxContent_js__WEBPACK_IMPORTED_MODULE_2__["default"]());
|
|
138
|
-
return this.content;
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
/**
|
|
142
|
-
* Clears the current content
|
|
143
|
-
*/
|
|
144
|
-
clear() {
|
|
145
|
-
this.content = null;
|
|
146
|
-
this.altContent = null;
|
|
147
|
-
this.idOrder = -1;
|
|
148
|
-
this.setInactive(true);
|
|
149
|
-
if (!this.hasHostedComponent)
|
|
150
|
-
this.setHostedComponent(null);
|
|
151
|
-
this.setHostedMediaPlayer(null);
|
|
152
|
-
if (this.$accessibleElement)
|
|
153
|
-
this.$accessibleElement.html('');
|
|
154
|
-
if (this.tmpTrans)
|
|
155
|
-
this.tmpTrans = false;
|
|
156
|
-
this.invalidate();
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
/**
|
|
160
|
-
* Checks if two ActiveBox objects have equivalent content
|
|
161
|
-
* @param {module:boxes/ActiveBox.ActiveBox} bx - The ActiveBox to check against this.
|
|
162
|
-
* @param {boolean} [checkCase] - When `true`, the comparing will be case-sensitive.
|
|
163
|
-
* @returns {boolean} - `true` if both cells are equivalent.
|
|
164
|
-
*/
|
|
165
|
-
isEquivalent(bx, checkCase) {
|
|
166
|
-
return bx !== null &&
|
|
167
|
-
this.content !== null &&
|
|
168
|
-
this.content.isEquivalent(bx.content, checkCase);
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
/**
|
|
172
|
-
* Same functionality as {@link module:boxes/ActiveBox.ActiveBox#isEquivalent isEquivalent}, but comparing the current content.
|
|
173
|
-
* @param {module:boxes/ActiveBox.ActiveBox} bx - The ActiveBox to check against this.
|
|
174
|
-
* @param {boolean} [checkCase] - When `true`, the comparing will be case-sensitive.
|
|
175
|
-
* @returns {boolean}
|
|
176
|
-
*/
|
|
177
|
-
isCurrentContentEquivalent(bx, checkCase) {
|
|
178
|
-
return bx !== null &&
|
|
179
|
-
this.getCurrentContent() !== null &&
|
|
180
|
-
this.getCurrentContent().isEquivalent(bx.getCurrentContent(), checkCase);
|
|
181
|
-
}
|
|
182
|
-
|
|
183
|
-
/**
|
|
184
|
-
* Swaps the location of two active boxes
|
|
185
|
-
* @param {module:boxes/ActiveBox.ActiveBox} bx - The ActiveBox to swap with this one.
|
|
186
|
-
*/
|
|
187
|
-
exchangeLocation(bx) {
|
|
188
|
-
const
|
|
189
|
-
pt = new _AWT_js__WEBPACK_IMPORTED_MODULE_4__/* .Point */ .bR(this.pos),
|
|
190
|
-
idLoc0 = this.idLoc;
|
|
191
|
-
this.moveTo(bx.pos);
|
|
192
|
-
bx.moveTo(pt);
|
|
193
|
-
this.idLoc = bx.idLoc;
|
|
194
|
-
bx.idLoc = idLoc0;
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
/**
|
|
198
|
-
* Copy the content of another ActiveBox into this one
|
|
199
|
-
* @param {module:boxes/ActiveBox.ActiveBox} bx - The ActiveBox from which to take the content
|
|
200
|
-
*/
|
|
201
|
-
copyContent(bx) {
|
|
202
|
-
this.idOrder = bx.idOrder;
|
|
203
|
-
this.idAss = bx.idAss;
|
|
204
|
-
this.content = bx.content;
|
|
205
|
-
this.altContent = bx.altContent;
|
|
206
|
-
if (this.content) {
|
|
207
|
-
if (this.content.style)
|
|
208
|
-
this.setBoxBase(this.content.style);
|
|
209
|
-
if (this.content.border !== null && bx.hasBorder() !== this.content.border)
|
|
210
|
-
this.setBorder(this.content.border);
|
|
211
|
-
}
|
|
212
|
-
this.setInactive(bx.isInactive());
|
|
213
|
-
this.setInverted(bx.isInverted());
|
|
214
|
-
this.setAlternative(bx.isAlternative());
|
|
215
|
-
this.setHostedComponent(bx.getHostedComponent());
|
|
216
|
-
this.hasHostedComponent = bx.hasHostedComponent;
|
|
217
|
-
this.setHostedMediaPlayer(bx.hostedMediaPlayer);
|
|
218
|
-
if (this.hostedMediaPlayer)
|
|
219
|
-
this.hostedMediaPlayer.setVisualComponentVisible(!this.isInactive() && this.isVisible());
|
|
220
|
-
if (this.$accessibleElement)
|
|
221
|
-
this.$accessibleElement.html(this.toString());
|
|
222
|
-
}
|
|
223
|
-
|
|
224
|
-
/**
|
|
225
|
-
*
|
|
226
|
-
* Exhanges the content of this ActiveBox with another one
|
|
227
|
-
* @param {module:boxes/ActiveBox.ActiveBox} bx - The ActiveBox with which to exchange the content.
|
|
228
|
-
*/
|
|
229
|
-
exchangeContent(bx) {
|
|
230
|
-
const bx0 = new ActiveBox(this.getParent(), this.getContainerX(), this.boxBase);
|
|
231
|
-
bx0.copyContent(this);
|
|
232
|
-
this.copyContent(bx);
|
|
233
|
-
bx.copyContent(bx0);
|
|
234
|
-
}
|
|
235
|
-
|
|
236
|
-
/**
|
|
237
|
-
*
|
|
238
|
-
* Sets the text content of this ActiveBox.
|
|
239
|
-
* @param {string} tx - The text to set.
|
|
240
|
-
*/
|
|
241
|
-
setTextContent(tx) {
|
|
242
|
-
// only plain text!
|
|
243
|
-
if (!tx)
|
|
244
|
-
tx = '';
|
|
245
|
-
if (!this.content)
|
|
246
|
-
this.content = new _ActiveBoxContent_js__WEBPACK_IMPORTED_MODULE_2__["default"]();
|
|
247
|
-
this.content.text = tx;
|
|
248
|
-
this.content.mediaContent = null;
|
|
249
|
-
this.content.img = null;
|
|
250
|
-
|
|
251
|
-
this.setHostedComponent(null);
|
|
252
|
-
this.setInactive(false);
|
|
253
|
-
this.checkHostedComponent();
|
|
254
|
-
this.setHostedMediaPlayer(null);
|
|
255
|
-
|
|
256
|
-
if (this.$accessibleElement)
|
|
257
|
-
this.$accessibleElement.html(this.toString());
|
|
258
|
-
}
|
|
259
|
-
|
|
260
|
-
/**
|
|
261
|
-
* Sets the default value to `idAss`
|
|
262
|
-
*/
|
|
263
|
-
setDefaultIdAss() {
|
|
264
|
-
this.idAss = this.content === null ? -1 : this.content.id;
|
|
265
|
-
}
|
|
266
|
-
|
|
267
|
-
/**
|
|
268
|
-
* Checks if this ActiveBox is at its original place.
|
|
269
|
-
* @returns {boolean}
|
|
270
|
-
*/
|
|
271
|
-
isAtPlace() {
|
|
272
|
-
return this.idOrder === this.idLoc;
|
|
273
|
-
}
|
|
274
|
-
|
|
275
|
-
/**
|
|
276
|
-
* Sets the {@link module:boxes/ActiveBoxContent.ActiveBoxContent ActiveBoxContent} of this ActiveBox
|
|
277
|
-
* @param {ActiveBoxContent|ActiveBagContent} abc - Object containing the content to set.
|
|
278
|
-
* @param {number} i - When `abc` is an {@link module:boxes/ActiveBagContent.ActiveBagContent ActiveBagContent}, this field indicates an
|
|
279
|
-
* index in the content array.
|
|
280
|
-
*/
|
|
281
|
-
setContent(abc, i) {
|
|
282
|
-
if (abc instanceof _ActiveBagContent_js__WEBPACK_IMPORTED_MODULE_3__["default"]) {
|
|
283
|
-
if (i < 0)
|
|
284
|
-
i = this.idOrder;
|
|
285
|
-
if (i >= abc.getNumCells())
|
|
286
|
-
return;
|
|
287
|
-
if (abc.style !== this.boxBase)
|
|
288
|
-
this.setBoxBase(abc.style);
|
|
289
|
-
|
|
290
|
-
// `abc` is now an [ActiveBoxContent](ActiveBoxContent.html)
|
|
291
|
-
abc = abc.getActiveBoxContent(i);
|
|
292
|
-
}
|
|
293
|
-
this.setHostedComponent(null);
|
|
294
|
-
this.setHostedMediaPlayer(null);
|
|
295
|
-
this.content = abc;
|
|
296
|
-
if (abc) {
|
|
297
|
-
if (abc.animatedGifFile && !this.specialShape) {
|
|
298
|
-
const url = `url(${abc.animatedGifFile})`;
|
|
299
|
-
const $hc = jquery__WEBPACK_IMPORTED_MODULE_0___default()('<span/>').css({
|
|
300
|
-
'background-image': url,
|
|
301
|
-
'background-position': 'center',
|
|
302
|
-
'background-repeat': 'no-repeat'
|
|
303
|
-
});
|
|
304
|
-
// Save background image for later use
|
|
305
|
-
$hc.data('background-image', url);
|
|
306
|
-
|
|
307
|
-
if (abc.imgClip !== null) {
|
|
308
|
-
$hc.css({
|
|
309
|
-
'background-origin': 'border-box',
|
|
310
|
-
'background-position': `${-abc.imgClip.pos.x}px ${-abc.imgClip.pos.y}px`
|
|
311
|
-
// TODO: Use background-size only when the original image must be compressed
|
|
312
|
-
//,'background-size': abc.imgClip.dim.width + 'px ' + abc.imgClip.dim.height + 'px'
|
|
313
|
-
});
|
|
314
|
-
}
|
|
315
|
-
this.setHostedComponent($hc);
|
|
316
|
-
}
|
|
317
|
-
|
|
318
|
-
if (abc.style !== this.boxBase)
|
|
319
|
-
this.setBoxBase(abc.style);
|
|
320
|
-
|
|
321
|
-
if (abc.innerHtmlText)
|
|
322
|
-
this.setHostedComponent(jquery__WEBPACK_IMPORTED_MODULE_0___default()('<div/>').html(abc.innerHtmlText));
|
|
323
|
-
|
|
324
|
-
if (abc.hasOwnProperty('border') && this.hasBorder() !== abc.border)
|
|
325
|
-
this.setBorder(abc.border);
|
|
326
|
-
this.setInactive(false);
|
|
327
|
-
if (abc.amp)
|
|
328
|
-
this.setHostedMediaPlayer(abc.amp);
|
|
329
|
-
this.checkHostedComponent();
|
|
330
|
-
this.checkAutoStartMedia();
|
|
331
|
-
} else
|
|
332
|
-
this.clear();
|
|
333
|
-
|
|
334
|
-
this.invalidate();
|
|
335
|
-
if (this.$accessibleElement)
|
|
336
|
-
this.$accessibleElement.html(this.toString());
|
|
337
|
-
}
|
|
338
|
-
|
|
339
|
-
/**
|
|
340
|
-
* Sets the {@link module:boxes/ActiveBoxContent.ActiveBoxContent ActiveBoxContent} that will act as an alternative content (`altContent` field)
|
|
341
|
-
* of this ActiveBox,
|
|
342
|
-
* @param {ActiveBoxContent|ActiveBagContent} abc - Object containing the content to set.
|
|
343
|
-
* @param {number} i - When `abc` is an {@link module:boxes/ActiveBagContent.ActiveBagContent ActiveBagContent}, this field indicates an
|
|
344
|
-
* index in the content array.
|
|
345
|
-
*/
|
|
346
|
-
setAltContent(abc, i) {
|
|
347
|
-
if (abc instanceof _ActiveBagContent_js__WEBPACK_IMPORTED_MODULE_3__["default"]) {
|
|
348
|
-
if (i < 0)
|
|
349
|
-
i = this.idOrder;
|
|
350
|
-
// `abc` is now an [ActiveBoxContent](ActiveBoxContent.html)
|
|
351
|
-
abc = abc.getActiveBoxContent(i);
|
|
352
|
-
}
|
|
353
|
-
this.altContent = abc;
|
|
354
|
-
this.checkHostedComponent();
|
|
355
|
-
if (this.isAlternative() && this.hostedMediaPlayer)
|
|
356
|
-
this.setHostedMediaPlayer(null);
|
|
357
|
-
|
|
358
|
-
if (this.$accessibleElement) {
|
|
359
|
-
this.$accessibleElement.html(this.toString());
|
|
360
|
-
this.$accessibleElement.prop('disabled', true);
|
|
361
|
-
}
|
|
362
|
-
}
|
|
363
|
-
|
|
364
|
-
/**
|
|
365
|
-
* Sets the current content of this ActiveBox
|
|
366
|
-
* @param {module:boxes/ActiveBoxContent.ActiveBoxContent} abc - The content to set.
|
|
367
|
-
*/
|
|
368
|
-
setCurrentContent(abc) {
|
|
369
|
-
if (this.isAlternative())
|
|
370
|
-
this.setAltContent(abc);
|
|
371
|
-
else
|
|
372
|
-
this.setContent(abc);
|
|
373
|
-
this.invalidate();
|
|
374
|
-
}
|
|
375
|
-
|
|
376
|
-
/**
|
|
377
|
-
* Puts this ActiveBox in "alternative" mode, meaning that `altContent` will be used instead of `content`
|
|
378
|
-
*/
|
|
379
|
-
switchToAlt() {
|
|
380
|
-
if (this.isAlternative() || !this.altContent || this.altContent.isEmpty())
|
|
381
|
-
return false;
|
|
382
|
-
this.setHostedComponent(null);
|
|
383
|
-
this.setHostedMediaPlayer(null);
|
|
384
|
-
this.setAlternative(true);
|
|
385
|
-
this.tmpTrans = false;
|
|
386
|
-
this.checkHostedComponent();
|
|
387
|
-
this.checkAutoStartMedia();
|
|
388
|
-
|
|
389
|
-
if (this.$accessibleElement)
|
|
390
|
-
this.$accessibleElement.html(this.toString());
|
|
391
|
-
|
|
392
|
-
return true;
|
|
393
|
-
}
|
|
394
|
-
|
|
395
|
-
/**
|
|
396
|
-
* Checks the presence of content susceptible to be treated as HTML DOM embedded in this ActiveBox.
|
|
397
|
-
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Drawing_DOM_objects_into_a_canvas}
|
|
398
|
-
*/
|
|
399
|
-
checkHostedComponent() {
|
|
400
|
-
if (this.hasHostedComponent)
|
|
401
|
-
return;
|
|
402
|
-
const
|
|
403
|
-
abc = this.getCurrentContent(),
|
|
404
|
-
style = this.getBoxBaseResolve();
|
|
405
|
-
if (!this.isInactive() && abc && abc.innerHtmlText)
|
|
406
|
-
style.getCSS()['text-align'] = abc.txtAlign.h.replace('middle', 'center');
|
|
407
|
-
}
|
|
408
|
-
|
|
409
|
-
/**
|
|
410
|
-
* Checks if the call has a {@link module:media/MediaContent.MediaContent} set to `autostart`, and launches it when found.
|
|
411
|
-
*/
|
|
412
|
-
checkAutoStartMedia() {
|
|
413
|
-
const cnt = this.getContent();
|
|
414
|
-
if (cnt && cnt.mediaContent && cnt.mediaContent.autoStart && cnt.amp) {
|
|
415
|
-
cnt.amp.playNow(this);
|
|
416
|
-
}
|
|
417
|
-
}
|
|
418
|
-
|
|
419
|
-
/**
|
|
420
|
-
* Draws the content of this Activebox on the specified canvas context.
|
|
421
|
-
* @override
|
|
422
|
-
* @param {external:CanvasRenderingContext2D} ctx - The canvas rendering context used to draw the
|
|
423
|
-
* box content.
|
|
424
|
-
* @param {module:AWT.Rectangle} [dirtyRegion] - The area that must be repainted. `null` refers to the whole box.
|
|
425
|
-
*/
|
|
426
|
-
updateContent(ctx, dirtyRegion) {
|
|
427
|
-
|
|
428
|
-
const
|
|
429
|
-
abc = this.getCurrentContent(),
|
|
430
|
-
style = this.getBoxBaseResolve();
|
|
431
|
-
|
|
432
|
-
if (this.isInactive() || !abc || this.dim.width < 2 || this.dim.height < 2) {
|
|
433
|
-
this._focusAccessibleElement(ctx);
|
|
434
|
-
return true;
|
|
435
|
-
}
|
|
436
|
-
|
|
437
|
-
if (dirtyRegion && !this.intersects(dirtyRegion))
|
|
438
|
-
return false;
|
|
439
|
-
|
|
440
|
-
let imgRect = null;
|
|
441
|
-
|
|
442
|
-
if (abc.img && !this.tmpTrans) {
|
|
443
|
-
try {
|
|
444
|
-
if (abc.imgClip) {
|
|
445
|
-
const r = abc.imgClip.getBounds();
|
|
446
|
-
let img = abc.img;
|
|
447
|
-
if (!abc.imgClip.isRect()) {
|
|
448
|
-
// Prepare a temporary `canvas` object that will contain the clipped image
|
|
449
|
-
const tmpCanvas = document.createElement('canvas');
|
|
450
|
-
tmpCanvas.width = r.pos.x + r.dim.width;
|
|
451
|
-
tmpCanvas.height = r.pos.y + r.dim.height;
|
|
452
|
-
const tmpCtx = tmpCanvas.getContext('2d');
|
|
453
|
-
// Set the clipping region
|
|
454
|
-
abc.imgClip.clip(tmpCtx);
|
|
455
|
-
// Draw the original image
|
|
456
|
-
tmpCtx.drawImage(abc.img, 0, 0);
|
|
457
|
-
// Use the temporary canvas as a source image
|
|
458
|
-
// (as seen on: [http://stackoverflow.com/questions/7242006/html5-copy-a-canvas-to-image-and-back])
|
|
459
|
-
img = tmpCanvas;
|
|
460
|
-
}
|
|
461
|
-
ctx.drawImage(img,
|
|
462
|
-
Math.max(0, r.pos.x), Math.max(0, r.pos.y), Math.min(img.width, r.dim.width), Math.min(img.height, r.dim.height),
|
|
463
|
-
this.pos.x, this.pos.y, this.dim.width, this.dim.height);
|
|
464
|
-
} else {
|
|
465
|
-
let
|
|
466
|
-
imgw = abc.img.naturalWidth || this.dim.width,
|
|
467
|
-
imgh = abc.img.naturalHeight || this.dim.height,
|
|
468
|
-
compress = false,
|
|
469
|
-
scale = 1.0;
|
|
470
|
-
if (_Utils_js__WEBPACK_IMPORTED_MODULE_5__/* .settings */ .W0.COMPRESS_IMAGES &&
|
|
471
|
-
(this.dim.width > 0 && this.dim.height > 0) &&
|
|
472
|
-
(imgw > this.dim.width || imgh > this.dim.height)) {
|
|
473
|
-
|
|
474
|
-
scale = Math.min(this.dim.width / imgw, this.dim.height / imgh);
|
|
475
|
-
imgw *= scale;
|
|
476
|
-
imgh *= scale;
|
|
477
|
-
compress = true;
|
|
478
|
-
}
|
|
479
|
-
const xs = abc.imgAlign.h === 'left' ? 0
|
|
480
|
-
: abc.imgAlign.h === 'right' ? this.dim.width - imgw
|
|
481
|
-
: (this.dim.width - imgw) / 2;
|
|
482
|
-
const ys = abc.imgAlign.v === 'top' ? 0
|
|
483
|
-
: abc.imgAlign.v === 'bottom' ? this.dim.height - imgh
|
|
484
|
-
: (this.dim.height - imgh) / 2;
|
|
485
|
-
if (compress) {
|
|
486
|
-
ctx.drawImage(abc.img, this.pos.x + xs, this.pos.y + ys, imgw, imgh);
|
|
487
|
-
} else
|
|
488
|
-
ctx.drawImage(abc.img, this.pos.x + xs, this.pos.y + ys);
|
|
489
|
-
|
|
490
|
-
if (abc.avoidOverlapping && abc.text)
|
|
491
|
-
imgRect = new _AWT_js__WEBPACK_IMPORTED_MODULE_4__/* .Rectangle */ .M_(
|
|
492
|
-
Math.max(0, xs), Math.max(0, ys),
|
|
493
|
-
Math.min(this.dim.width, imgw), Math.min(this.dim.height, imgh));
|
|
494
|
-
}
|
|
495
|
-
} catch (ex) {
|
|
496
|
-
(0,_Utils_js__WEBPACK_IMPORTED_MODULE_5__/* .log */ .Rm)('warn', `Unable to draw image "${abc.image}": ${ex.message}`);
|
|
497
|
-
}
|
|
498
|
-
}
|
|
499
|
-
if (abc.text && abc.text.length > 0) {
|
|
500
|
-
let
|
|
501
|
-
px = this.pos.x,
|
|
502
|
-
py = this.pos.y,
|
|
503
|
-
pWidth = this.dim.width,
|
|
504
|
-
pHeight = this.dim.height;
|
|
505
|
-
|
|
506
|
-
if (imgRect) {
|
|
507
|
-
// There is an image in the ActiveBox
|
|
508
|
-
// Try to compute the current space available for text
|
|
509
|
-
const
|
|
510
|
-
prx = [0, imgRect.pos.x, imgRect.pos.x + imgRect.dim.width, pWidth],
|
|
511
|
-
pry = [0, imgRect.pos.y, imgRect.pos.y + imgRect.dim.height, pHeight],
|
|
512
|
-
rr = [
|
|
513
|
-
// Calc four rectangles inside BoxBag, sourronding imgRect
|
|
514
|
-
// Top rectangle:
|
|
515
|
-
new _AWT_js__WEBPACK_IMPORTED_MODULE_4__/* .Rectangle */ .M_(prx[0], pry[0], prx[3], pry[1]),
|
|
516
|
-
// Bottom rectangle:
|
|
517
|
-
new _AWT_js__WEBPACK_IMPORTED_MODULE_4__/* .Rectangle */ .M_(prx[0], pry[2], prx[3], pry[3] - pry[2]),
|
|
518
|
-
// Left rectangle:
|
|
519
|
-
new _AWT_js__WEBPACK_IMPORTED_MODULE_4__/* .Rectangle */ .M_(prx[0], pry[0], prx[1], pry[3]),
|
|
520
|
-
// Right rectangle:
|
|
521
|
-
new _AWT_js__WEBPACK_IMPORTED_MODULE_4__/* .Rectangle */ .M_(prx[2], pry[0], prx[3] - prx[2], pry[3])
|
|
522
|
-
];
|
|
523
|
-
//
|
|
524
|
-
// Find the rectangle with highest surface, and in accordance
|
|
525
|
-
// with the `txtAlign` values of the current
|
|
526
|
-
// [ActiveBoxContent](ActiveBoxContent)
|
|
527
|
-
let rmax = rr[0];
|
|
528
|
-
let maxSurface = rmax.dim.width * rmax.dim.height;
|
|
529
|
-
for (let i = 1; i < rr.length; i++) {
|
|
530
|
-
let s = rr[i].dim.width * rr[i].dim.height;
|
|
531
|
-
if (s > maxSurface - 1) {
|
|
532
|
-
if (Math.abs(s - maxSurface) <= 1) {
|
|
533
|
-
let b = false;
|
|
534
|
-
switch (i) {
|
|
535
|
-
case 1:
|
|
536
|
-
b = abc.txtAlign.v === 'bottom';
|
|
537
|
-
break;
|
|
538
|
-
case 2:
|
|
539
|
-
b = abc.txtAlign.h === 'left';
|
|
540
|
-
break;
|
|
541
|
-
case 3:
|
|
542
|
-
b = abc.txtAlign.h === 'right';
|
|
543
|
-
break;
|
|
544
|
-
}
|
|
545
|
-
if (!b)
|
|
546
|
-
continue;
|
|
547
|
-
}
|
|
548
|
-
maxSurface = s;
|
|
549
|
-
rmax = rr[i];
|
|
550
|
-
}
|
|
551
|
-
}
|
|
552
|
-
// Finally, this is the surface available to draw text:
|
|
553
|
-
px += rmax.pos.x;
|
|
554
|
-
py += rmax.pos.y;
|
|
555
|
-
pWidth = rmax.dim.width;
|
|
556
|
-
pHeight = rmax.dim.height;
|
|
557
|
-
}
|
|
558
|
-
|
|
559
|
-
// Calc available width and height, discounting margins
|
|
560
|
-
const
|
|
561
|
-
availWidth = Math.max(5, pWidth - 2 * style.textMargin),
|
|
562
|
-
availHeight = Math.max(5, pHeight - 2 * style.textMargin);
|
|
563
|
-
|
|
564
|
-
// Calc the size of each line
|
|
565
|
-
const lines = style.prepareText(ctx, abc.text, availWidth, availHeight);
|
|
566
|
-
|
|
567
|
-
ctx.font = style.font.cssFont();
|
|
568
|
-
ctx.textBaseline = 'alphabetic';
|
|
569
|
-
const
|
|
570
|
-
lineHeight = style.font.getHeight(),
|
|
571
|
-
totalHeight = lineHeight * lines.length;
|
|
572
|
-
|
|
573
|
-
// Calc the vertical co-ordinate of the first line
|
|
574
|
-
// Default is 'middle'
|
|
575
|
-
let y = py + style.textMargin + (abc.txtAlign.v === 'top' ? 0
|
|
576
|
-
: abc.txtAlign.v === 'bottom' ? availHeight - totalHeight
|
|
577
|
-
: (availHeight - totalHeight) / 2) + style.font.getMetrics().ascent;
|
|
578
|
-
|
|
579
|
-
for (let l = 0; l < lines.length; l++, y += lineHeight) {
|
|
580
|
-
// Calc the horizontal position of each line
|
|
581
|
-
// Default is 'middle'
|
|
582
|
-
const x = px + style.textMargin + (abc.txtAlign.h === 'left' ? 0
|
|
583
|
-
: abc.txtAlign.h === 'right' ?
|
|
584
|
-
availWidth - lines[l].size.width
|
|
585
|
-
: (availWidth - lines[l].size.width) / 2);
|
|
586
|
-
|
|
587
|
-
if (style.shadow) {
|
|
588
|
-
// Render text shadow
|
|
589
|
-
const d = Math.max(1, style.font.size / 10);
|
|
590
|
-
ctx.fillStyle = style.shadowColor;
|
|
591
|
-
ctx.fillText(lines[l].text, x + d, y + d);
|
|
592
|
-
}
|
|
593
|
-
// Render text
|
|
594
|
-
ctx.fillStyle = this.isInverted() ? style.backColor
|
|
595
|
-
: this.isAlternative() ? style.alternativeColor : style.textColor;
|
|
596
|
-
ctx.fillText(lines[l].text, x, y);
|
|
597
|
-
}
|
|
598
|
-
|
|
599
|
-
this._focusAccessibleElement(ctx);
|
|
600
|
-
|
|
601
|
-
}
|
|
602
|
-
return true;
|
|
603
|
-
}
|
|
604
|
-
|
|
605
|
-
/**
|
|
606
|
-
* Draw focus on accessible element if needed
|
|
607
|
-
* @param {external:CanvasRenderingContext2D} ctx - The canvas rendering context used to draw the
|
|
608
|
-
* box content.
|
|
609
|
-
*/
|
|
610
|
-
_focusAccessibleElement(ctx) {
|
|
611
|
-
if (_Utils_js__WEBPACK_IMPORTED_MODULE_5__/* .settings */ .W0.CANVAS_DRAW_FOCUS && this.$accessibleElement) {
|
|
612
|
-
this.shape.preparePath(ctx);
|
|
613
|
-
ctx.drawFocusIfNeeded(this.$accessibleElement.get(-1));
|
|
614
|
-
}
|
|
615
|
-
}
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
/**
|
|
619
|
-
* Gets the `description` field of the current {@link module:boxes/ActiveBoxContent.ActiveBoxContent ActiveBoxContent}
|
|
620
|
-
* @returns {string}
|
|
621
|
-
*/
|
|
622
|
-
getDescription() {
|
|
623
|
-
return this.content ? this.content.getDescription() : '';
|
|
624
|
-
}
|
|
625
|
-
|
|
626
|
-
/**
|
|
627
|
-
* Gets a descriptive text for this ActiveBox
|
|
628
|
-
* @returns {string}
|
|
629
|
-
*/
|
|
630
|
-
toString() {
|
|
631
|
-
return (this.role !== 'cell' ? (0,_Utils_js__WEBPACK_IMPORTED_MODULE_5__/* .getMsg */ .qG)(this.role) : '') + (this.getCurrentContent() || '-').toString();
|
|
632
|
-
}
|
|
633
|
-
|
|
634
|
-
/**
|
|
635
|
-
* Plays the action or media associated with this ActiveBox
|
|
636
|
-
* @param {module:JClicPlayer.JClicPlayer} ps - Usually, a {@link module:JClicPlayer.JClicPlayer JClicPlayer}
|
|
637
|
-
* @param {function[]} delayedActions - If set, store the the action in this array for future execution
|
|
638
|
-
*/
|
|
639
|
-
playMedia(ps, delayedActions = null) {
|
|
640
|
-
const abc = this.getCurrentContent();
|
|
641
|
-
if (abc && abc.mediaContent) {
|
|
642
|
-
(0,_Utils_js__WEBPACK_IMPORTED_MODULE_5__/* .log */ .Rm)('debug', `Playing: ${abc.mediaContent.toString()}`);
|
|
643
|
-
ps.playMedia(abc.mediaContent, this, delayedActions);
|
|
644
|
-
return true;
|
|
645
|
-
}
|
|
646
|
-
return false;
|
|
647
|
-
}
|
|
648
|
-
|
|
649
|
-
/**
|
|
650
|
-
* Sets the hosted media player of this ActiveBox
|
|
651
|
-
* @param {module:media/ActiveMediaPlayer.ActiveMediaPlayer} amp - The media player.
|
|
652
|
-
*/
|
|
653
|
-
setHostedMediaPlayer(amp) {
|
|
654
|
-
const old = this.hostedMediaPlayer;
|
|
655
|
-
this.hostedMediaPlayer = amp;
|
|
656
|
-
if (old && old !== amp)
|
|
657
|
-
old.linkTo(null);
|
|
658
|
-
if (amp)
|
|
659
|
-
amp.linkTo(this);
|
|
660
|
-
}
|
|
661
|
-
|
|
662
|
-
/**
|
|
663
|
-
* Sets a new size and/or dimension to this box.
|
|
664
|
-
* @override
|
|
665
|
-
* @param {AWT.Rectangle|number} rect - An AWT.Rectangle object, or the `x` coordinate of the
|
|
666
|
-
* upper-left corner of a new rectangle.
|
|
667
|
-
* @param {number} [y] - `y` coordinate of the upper-left corner of the new rectangle.
|
|
668
|
-
* @param {number} [w] - Width of the new rectangle.
|
|
669
|
-
* @param {number} [h] - Height of the new rectangle.
|
|
670
|
-
*/
|
|
671
|
-
setBounds(rect, y, w, h) {
|
|
672
|
-
if (typeof rect === 'number')
|
|
673
|
-
// arguments are co-ordinates and size
|
|
674
|
-
rect = new _AWT_js__WEBPACK_IMPORTED_MODULE_4__/* .Rectangle */ .M_(rect, y, w, h);
|
|
675
|
-
// Rectangle comparision
|
|
676
|
-
if (this.equals(rect))
|
|
677
|
-
return;
|
|
678
|
-
super.setBounds(rect);
|
|
679
|
-
if (this.hostedMediaPlayer)
|
|
680
|
-
this.hostedMediaPlayer.checkVisualComponentBounds(this);
|
|
681
|
-
}
|
|
682
|
-
|
|
683
|
-
/**
|
|
684
|
-
* Places and resizes {@link module:boxes/AbstractBox.AbstractBox#$hostedComponent $hostedComponent}, based on the size
|
|
685
|
-
* and position of this box.
|
|
686
|
-
* @override
|
|
687
|
-
* @param {boolean} sizeChanged - `true` when this {@link module:boxes/ActiveBox.ActiveBox ActiveBox} has changed its size
|
|
688
|
-
*/
|
|
689
|
-
setHostedComponentBounds(sizeChanged) {
|
|
690
|
-
if (this.$hostedComponent) {
|
|
691
|
-
super.setHostedComponentBounds(sizeChanged);
|
|
692
|
-
const abc = this.getCurrentContent();
|
|
693
|
-
if (sizeChanged && abc && abc.animatedGifFile && abc.img) {
|
|
694
|
-
const
|
|
695
|
-
img = abc.img,
|
|
696
|
-
w = Math.max(img.naturalWidth, this.dim.width),
|
|
697
|
-
h = Math.max(img.naturalHeight, this.dim.height);
|
|
698
|
-
let scale = 1, bgSize = '';
|
|
699
|
-
if (abc.imgClip) {
|
|
700
|
-
const r = abc.imgClip.getBounds();
|
|
701
|
-
if (this.dim.width < r.dim.width || this.dim.height < r.dim.height) {
|
|
702
|
-
scale = Math.min(this.dim.width / r.dim.width, this.dim.height / r.dim.height);
|
|
703
|
-
bgSize = `${w * scale}px ${h * scale}px`;
|
|
704
|
-
}
|
|
705
|
-
this.$hostedComponent.css({
|
|
706
|
-
'background-position': `${-abc.imgClip.pos.x * scale}px ${-abc.imgClip.pos.y * scale}px`,
|
|
707
|
-
'background-size': bgSize
|
|
708
|
-
});
|
|
709
|
-
} else {
|
|
710
|
-
if (this.dim.width < w || this.dim.height < h) {
|
|
711
|
-
scale = Math.min(this.dim.width / w, this.dim.height / h);
|
|
712
|
-
bgSize = `${w * scale}px ${h * scale}px`;
|
|
713
|
-
}
|
|
714
|
-
this.$hostedComponent.css({
|
|
715
|
-
'background-size': bgSize
|
|
716
|
-
});
|
|
717
|
-
}
|
|
718
|
-
}
|
|
719
|
-
}
|
|
720
|
-
}
|
|
721
|
-
|
|
722
|
-
/**
|
|
723
|
-
* Builds a hidden `buton` that will act as a accessible element associated to the canvas area
|
|
724
|
-
* of this ActiveBox.
|
|
725
|
-
* The button will be created only when `CanvasRenderingContext2D` has a method named `addHitRegion`.
|
|
726
|
-
* See https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility
|
|
727
|
-
* for more information and supported browsers.
|
|
728
|
-
* @param {external:jQuery} $canvas - The `canvas` where this `ActiveBox` will deploy, wrapped up in a jQuery object
|
|
729
|
-
* @param {external:jQuery} $clickReceiver - The DOM element that will be notified when `$accessibleElement` is activated.
|
|
730
|
-
* @param {external:jQuery} [$canvasGroup] - Optional DOM element containing the accessible element. Useful to group cells in associations. When `null`, the element belongs to $canvas.
|
|
731
|
-
* @param {string} [eventType] - Type of event sent to $clickReceiver. Default is `click`.
|
|
732
|
-
* @returns {external:jQuery} - The accessible element associated to this ActiveBox.
|
|
733
|
-
*/
|
|
734
|
-
buildAccessibleElement($canvas, $clickReceiver, $canvasGroup, eventType) {
|
|
735
|
-
if (this.$accessibleElement)
|
|
736
|
-
this.$accessibleElement.remove();
|
|
737
|
-
|
|
738
|
-
const canvas = $canvas.get(-1);
|
|
739
|
-
if (canvas.width > 0 && canvas.height > 0) {
|
|
740
|
-
const
|
|
741
|
-
id = Math.round(Math.random() * 100000),
|
|
742
|
-
disabled = this.isInactive() && !this.accessibleAlwaysActive;
|
|
743
|
-
this.$accessibleElement = jquery__WEBPACK_IMPORTED_MODULE_0___default()('<button/>', {
|
|
744
|
-
tabindex: disabled ? -1 : 0,
|
|
745
|
-
id: `AE${id}`,
|
|
746
|
-
disabled: disabled
|
|
747
|
-
})
|
|
748
|
-
.html(this.toString())
|
|
749
|
-
.on('click', ev => {
|
|
750
|
-
// Check if event was produced by a mouse click
|
|
751
|
-
if (ev.originalEvent && (ev.originalEvent.pageX !== 0 || ev.originalEvent.pageY !== 0)) {
|
|
752
|
-
// Mouse clicks should be processed odirectly by the canvas, so ignore this accessible event
|
|
753
|
-
return true;
|
|
754
|
-
}
|
|
755
|
-
(0,_Utils_js__WEBPACK_IMPORTED_MODULE_5__/* .log */ .Rm)('debug', `Click on accessible element: ${this.toString()}`);
|
|
756
|
-
const
|
|
757
|
-
$event = jquery__WEBPACK_IMPORTED_MODULE_0___default().Event(eventType || 'click'),
|
|
758
|
-
bounds = this.getBounds(),
|
|
759
|
-
offset = $canvas.offset();
|
|
760
|
-
$event.pageX = offset.left + bounds.pos.x + bounds.dim.width / 2;
|
|
761
|
-
$event.pageY = offset.top + bounds.pos.y + bounds.dim.height / 2;
|
|
762
|
-
$clickReceiver.trigger($event);
|
|
763
|
-
return false;
|
|
764
|
-
});
|
|
765
|
-
const $dest = $canvasGroup || $canvas;
|
|
766
|
-
$dest.append(this.$accessibleElement);
|
|
767
|
-
if (_Utils_js__WEBPACK_IMPORTED_MODULE_5__/* .settings */ .W0.CANVAS_DRAW_FOCUS) {
|
|
768
|
-
this.$accessibleElement.on('focus blur', ev => {
|
|
769
|
-
(0,_Utils_js__WEBPACK_IMPORTED_MODULE_5__/* .log */ .Rm)('debug', `${ev.type} accessible element: ${this.toString()}`);
|
|
770
|
-
if (this.container)
|
|
771
|
-
this.container.update();
|
|
772
|
-
this.updateContent(canvas.getContext('2d'), null);
|
|
773
|
-
});
|
|
774
|
-
}
|
|
775
|
-
}
|
|
776
|
-
return this.$accessibleElement;
|
|
777
|
-
}
|
|
778
|
-
}
|
|
779
|
-
|
|
780
|
-
Object.assign(ActiveBox.prototype, {
|
|
781
|
-
/**
|
|
782
|
-
* Identifier used to set the relative position of this box in a set.
|
|
783
|
-
* @name module:boxes/ActiveBox.ActiveBox#idOrder
|
|
784
|
-
* @type {number} */
|
|
785
|
-
idOrder: -1,
|
|
786
|
-
/**
|
|
787
|
-
* Identifier used to set a relative position in the space.
|
|
788
|
-
* @name module:boxes/ActiveBox.ActiveBox#idLoc
|
|
789
|
-
* @type {number} */
|
|
790
|
-
idLoc: -1,
|
|
791
|
-
/**
|
|
792
|
-
* Identifier used to establish relationships between cells of different sets (in associations)
|
|
793
|
-
* @name module:boxes/ActiveBox.ActiveBox#idAss
|
|
794
|
-
* @type {number} */
|
|
795
|
-
idAss: -1,
|
|
796
|
-
/**
|
|
797
|
-
* Backup of the original position of the cell, useful when the real position must be restored after a temporary change.
|
|
798
|
-
* @name module:boxes/ActiveBox.ActiveBox#pos0
|
|
799
|
-
* @type {module:AWT.Point} */
|
|
800
|
-
pos0: null,
|
|
801
|
-
/**
|
|
802
|
-
* Main content of this box
|
|
803
|
-
* @name module:boxes/ActiveBox.ActiveBox#content
|
|
804
|
-
* @type {module:boxes/ActiveBoxContent.ActiveBoxContent} */
|
|
805
|
-
content: null,
|
|
806
|
-
/**
|
|
807
|
-
* Alternative content of this box
|
|
808
|
-
* @name module:boxes/ActiveBox.ActiveBox#altContent
|
|
809
|
-
* @type {module:boxes/ActiveBoxContent.ActiveBoxContent} */
|
|
810
|
-
altContent: null,
|
|
811
|
-
/**
|
|
812
|
-
* Flag to check if this box has a 'hosted component'
|
|
813
|
-
* @name module:boxes/ActiveBox.ActiveBox#hostedComponent
|
|
814
|
-
* @type {boolean} */
|
|
815
|
-
hasHostedComponent: false,
|
|
816
|
-
/**
|
|
817
|
-
* The media player associated to this box
|
|
818
|
-
* @name module:boxes/ActiveBox.ActiveBox#hostedMediaPlayer
|
|
819
|
-
* @type {module:media/ActiveMediaPlayer.ActiveMediaPlayer} */
|
|
820
|
-
hostedMediaPlayer: null,
|
|
821
|
-
/**
|
|
822
|
-
* Indicates that this box is used as a background. When drawing, the clipping region must be respected.
|
|
823
|
-
* @name module:boxes/ActiveBox.ActiveBox#isBackground
|
|
824
|
-
* @type {boolean} */
|
|
825
|
-
isBackground: false,
|
|
826
|
-
});
|
|
827
|
-
|
|
828
|
-
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ActiveBox);
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
/***/ })
|
|
833
|
-
|
|
834
|
-
};
|
|
835
|
-
;
|
|
836
|
-
//# sourceMappingURL=1725.jclic-node.js.map
|