locize 3.3.0 → 4.0.1
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/README.md +76 -38
- package/dist/cjs/api/handleCommitKeys.js +7 -0
- package/dist/cjs/api/handleEditKey.js +1 -1
- package/dist/cjs/api/handleIsLocizeEnabled.js +2 -2
- package/dist/cjs/api/handleRequestPopupChanges.js +11 -0
- package/dist/cjs/api/handleSendMatchedUninstrumented.js +26 -0
- package/dist/cjs/api/postMessage.js +32 -45
- package/dist/cjs/implementations/dummyImplementation.js +35 -0
- package/dist/cjs/implementations/i18nextImplementation.js +94 -0
- package/dist/cjs/index.d.ts +9 -16
- package/dist/cjs/index.js +1 -6
- package/dist/cjs/locizePlugin.js +6 -90
- package/dist/cjs/observer.js +1 -0
- package/dist/cjs/parser.js +100 -14
- package/dist/cjs/process.js +37 -5
- package/dist/cjs/startStandalone.js +11 -17
- package/dist/cjs/store.js +1 -0
- package/dist/cjs/ui/elements/highlightBox.js +13 -0
- package/dist/cjs/ui/elements/icons.js +1 -17
- package/dist/cjs/ui/elements/popup.js +3 -3
- package/dist/cjs/ui/elements/ribbonBox.js +3 -6
- package/dist/cjs/ui/highlightNode.js +28 -77
- package/dist/cjs/ui/popup.js +10 -0
- package/dist/cjs/ui/utils.js +18 -0
- package/dist/cjs/uninstrumentedStore.js +18 -2
- package/dist/cjs/utils.js +55 -77
- package/dist/cjs/vars.js +5 -2
- package/dist/esm/api/handleCommitKeys.js +7 -0
- package/dist/esm/api/handleEditKey.js +1 -1
- package/dist/esm/api/handleIsLocizeEnabled.js +2 -2
- package/dist/esm/api/handleRequestPopupChanges.js +11 -0
- package/dist/esm/api/handleSendMatchedUninstrumented.js +20 -0
- package/dist/esm/api/postMessage.js +33 -44
- package/dist/esm/implementations/dummyImplementation.js +31 -0
- package/dist/esm/implementations/i18nextImplementation.js +85 -0
- package/dist/esm/index.d.ts +9 -16
- package/dist/esm/index.js +3 -6
- package/dist/esm/locizePlugin.js +5 -85
- package/dist/esm/observer.js +1 -0
- package/dist/esm/parser.js +101 -16
- package/dist/esm/process.js +38 -6
- package/dist/esm/startStandalone.js +7 -17
- package/dist/esm/store.js +1 -0
- package/dist/esm/ui/elements/highlightBox.js +9 -0
- package/dist/esm/ui/elements/icons.js +2 -16
- package/dist/esm/ui/elements/popup.js +3 -3
- package/dist/esm/ui/elements/ribbonBox.js +4 -7
- package/dist/esm/ui/highlightNode.js +28 -78
- package/dist/esm/ui/popup.js +10 -0
- package/dist/esm/ui/utils.js +18 -1
- package/dist/esm/uninstrumentedStore.js +18 -2
- package/dist/esm/utils.js +54 -72
- package/dist/esm/vars.js +5 -3
- package/dist/umd/locize.js +637 -592
- package/dist/umd/locize.min.js +1 -1
- package/index.d.ts +9 -16
- package/locize.js +637 -592
- package/locize.min.js +1 -1
- package/package.json +1 -1
- package/src/_startStandalone.js +22 -0
- package/src/api/handleCommitKeys.js +9 -0
- package/src/api/handleEditKey.js +5 -11
- package/src/api/handleIsLocizeEnabled.js +7 -2
- package/src/api/handleRequestPopupChanges.js +27 -0
- package/src/api/handleSendMatchedUninstrumented.js +38 -0
- package/src/api/index.js +1 -4
- package/src/api/postMessage.js +37 -53
- package/src/implementations/dummyImplementation.js +29 -0
- package/src/implementations/i18nextImplementation.js +114 -0
- package/src/implementations/index.js +2 -0
- package/src/index.js +7 -6
- package/src/locizePlugin.js +51 -28
- package/src/observer.js +1 -0
- package/src/parser.js +207 -19
- package/src/process.js +52 -5
- package/src/startStandalone.js +4 -17
- package/src/store.js +2 -0
- package/src/ui/elements/highlightBox.js +17 -0
- package/src/ui/elements/popup.js +4 -4
- package/src/ui/elements/ribbonBox.js +12 -8
- package/src/ui/highlightNode.js +102 -71
- package/src/ui/popup.js +33 -5
- package/src/ui/utils.js +28 -1
- package/src/uninstrumentedStore.js +18 -2
- package/src/utils.js +72 -5
- package/src/vars.js +6 -4
- package/dist/cjs/api/handleTurnOff.js +0 -8
- package/dist/cjs/api/handleTurnOn.js +0 -8
- package/dist/cjs/clickHandler.js +0 -55
- package/dist/cjs/processLegacy.js +0 -80
- package/dist/esm/api/handleTurnOff.js +0 -6
- package/dist/esm/api/handleTurnOn.js +0 -6
- package/dist/esm/clickHandler.js +0 -51
- package/dist/esm/processLegacy.js +0 -72
- /package/src/{processLegacy.js → _processLegacy.js} +0 -0
- /package/src/api/{handleTurnOff.js → _handleTurnOff.js} +0 -0
- /package/src/api/{handleTurnOn.js → _handleTurnOn.js} +0 -0
|
@@ -5,56 +5,29 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
6
|
var vars = require('../vars.js');
|
|
7
7
|
var ribbonBox = require('./elements/ribbonBox.js');
|
|
8
|
+
var highlightBox = require('./elements/highlightBox.js');
|
|
8
9
|
var dom = require('@floating-ui/dom');
|
|
10
|
+
var utils = require('./utils.js');
|
|
9
11
|
|
|
10
12
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
11
13
|
|
|
12
14
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
13
15
|
|
|
14
|
-
var eleToOutline = ['DIV', 'P', 'H1', 'H2', 'H3', 'H4', 'H5', 'H6', 'OL', 'UL', 'ADDRESS', 'BLOCKQUOTE', 'DL', 'PRE'];
|
|
15
|
-
var overriddenStyles = ['outline', 'border-radius', 'outline-offset', 'filter'];
|
|
16
|
-
var originalStyles = {};
|
|
17
16
|
var selected = {};
|
|
18
17
|
function highlight(item, node, keys) {
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
if (!
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
}, {});
|
|
26
|
-
}
|
|
27
|
-
if (eleToOutline.includes(node.nodeName)) {
|
|
28
|
-
node.style.outline = "".concat(vars.colors.highlight, " solid 1px");
|
|
29
|
-
node.style.setProperty('border-radius', '1px');
|
|
30
|
-
node.style.setProperty('outline-offset', '2px');
|
|
31
|
-
node.style.filter = 'brightness(110%)';
|
|
32
|
-
} else {
|
|
33
|
-
node.style.outline = "".concat(vars.colors.highlight, " solid 1px");
|
|
34
|
-
node.style.setProperty('border-radius', '1px');
|
|
35
|
-
node.style.setProperty('outline-offset', '1px');
|
|
36
|
-
node.style.filter = 'brightness(110%)';
|
|
18
|
+
item.id;
|
|
19
|
+
var rectEle = utils.getOptimizedBoundingRectEle(node);
|
|
20
|
+
if (!item.highlightBox) {
|
|
21
|
+
var box = highlightBox.HighlightBox(rectEle, vars.colors.highlight);
|
|
22
|
+
document.body.appendChild(box);
|
|
23
|
+
item.highlightBox = box;
|
|
37
24
|
}
|
|
38
25
|
if (!item.ribbonBox) {
|
|
39
26
|
var _RibbonBox = ribbonBox.RibbonBox(keys),
|
|
40
27
|
actions = _RibbonBox.box,
|
|
41
28
|
arrowEle = _RibbonBox.arrow;
|
|
42
29
|
document.body.appendChild(actions);
|
|
43
|
-
|
|
44
|
-
if (node.childNodes.length === 1) {
|
|
45
|
-
var childNode = node.childNodes[0];
|
|
46
|
-
if (childNode && childNode.nodeName === '#text') {
|
|
47
|
-
var range = document.createRange();
|
|
48
|
-
range.selectNode(childNode);
|
|
49
|
-
var rect = range.getBoundingClientRect();
|
|
50
|
-
refEle = {
|
|
51
|
-
getBoundingClientRect: function getBoundingClientRect() {
|
|
52
|
-
return rect;
|
|
53
|
-
}
|
|
54
|
-
};
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
dom.computePosition(refEle, actions, {
|
|
30
|
+
dom.computePosition(rectEle, actions, {
|
|
58
31
|
placement: 'right',
|
|
59
32
|
middleware: [dom.flip({
|
|
60
33
|
fallbackPlacements: ['left', 'bottom']
|
|
@@ -101,58 +74,35 @@ function highlight(item, node, keys) {
|
|
|
101
74
|
function highlightUninstrumented(item, node, keys) {
|
|
102
75
|
var id = item.id;
|
|
103
76
|
if (selected[id]) return;
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
}
|
|
110
|
-
if (eleToOutline.includes(node.nodeName)) {
|
|
111
|
-
node.style.outline = "".concat(vars.colors.warning, " solid 1px");
|
|
112
|
-
node.style.setProperty('border-radius', '1px');
|
|
113
|
-
node.style.setProperty('outline-offset', '2px');
|
|
114
|
-
node.style.filter = 'brightness(110%)';
|
|
115
|
-
} else {
|
|
116
|
-
node.style.outline = "".concat(vars.colors.warning, " solid 1px");
|
|
117
|
-
node.style.setProperty('border-radius', '1px');
|
|
118
|
-
node.style.setProperty('outline-offset', '1px');
|
|
119
|
-
node.style.filter = 'brightness(110%)';
|
|
77
|
+
var rectEle = utils.getOptimizedBoundingRectEle(node);
|
|
78
|
+
if (!item.highlightBox) {
|
|
79
|
+
var box = highlightBox.HighlightBox(rectEle, vars.colors.warning);
|
|
80
|
+
document.body.appendChild(box);
|
|
81
|
+
item.highlightBox = box;
|
|
120
82
|
}
|
|
121
83
|
}
|
|
122
84
|
function selectedHighlight(item, node, keys) {
|
|
123
85
|
var id = item.id;
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
}
|
|
130
|
-
if (eleToOutline.includes(node.nodeName)) {
|
|
131
|
-
node.style.outline = "".concat(vars.colors.highlight, " solid 1px");
|
|
132
|
-
node.style.setProperty('border-radius', '1px');
|
|
133
|
-
node.style.setProperty('outline-offset', '2px');
|
|
134
|
-
node.style.filter = "brightness(110%) drop-shadow(0px 0px 2px ".concat(vars.colors.highlight, " )");
|
|
135
|
-
} else {
|
|
136
|
-
node.style.outline = "".concat(vars.colors.highlight, " solid 1px");
|
|
137
|
-
node.style.setProperty('border-radius', '1px');
|
|
138
|
-
node.style.setProperty('outline-offset', '1px');
|
|
139
|
-
node.style.filter = "brightness(110%) drop-shadow(0px 0px 2px ".concat(vars.colors.highlight, " )");
|
|
140
|
-
}
|
|
141
|
-
if (item.ribbonBox) {
|
|
142
|
-
document.body.removeChild(item.ribbonBox);
|
|
143
|
-
delete item.ribbonBox;
|
|
86
|
+
var rectEle = utils.getOptimizedBoundingRectEle(node);
|
|
87
|
+
if (!item.highlightBox) {
|
|
88
|
+
var box = highlightBox.HighlightBox(rectEle, vars.colors.highlight, vars.colors.gray);
|
|
89
|
+
document.body.appendChild(box);
|
|
90
|
+
item.highlightBox = box;
|
|
144
91
|
}
|
|
145
92
|
selected[id] = true;
|
|
146
93
|
}
|
|
94
|
+
function recalcSelectedHighlight(item, node, keys) {
|
|
95
|
+
if (!selected[item.id]) return;
|
|
96
|
+
resetHighlight(item, node, keys, false);
|
|
97
|
+
selectedHighlight(item, node);
|
|
98
|
+
}
|
|
147
99
|
function resetHighlight(item, node, keys) {
|
|
148
100
|
var ignoreSelected = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
|
|
149
101
|
var id = item.id;
|
|
150
102
|
if (ignoreSelected && selected[id]) return;
|
|
151
|
-
if (
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
});
|
|
155
|
-
delete originalStyles[id];
|
|
103
|
+
if (item.highlightBox) {
|
|
104
|
+
document.body.removeChild(item.highlightBox);
|
|
105
|
+
delete item.highlightBox;
|
|
156
106
|
}
|
|
157
107
|
if (item.ribbonBox) {
|
|
158
108
|
document.body.removeChild(item.ribbonBox);
|
|
@@ -163,5 +113,6 @@ function resetHighlight(item, node, keys) {
|
|
|
163
113
|
|
|
164
114
|
exports.highlight = highlight;
|
|
165
115
|
exports.highlightUninstrumented = highlightUninstrumented;
|
|
116
|
+
exports.recalcSelectedHighlight = recalcSelectedHighlight;
|
|
166
117
|
exports.resetHighlight = resetHighlight;
|
|
167
118
|
exports.selectedHighlight = selectedHighlight;
|
package/dist/cjs/ui/popup.js
CHANGED
|
@@ -51,6 +51,11 @@ function initDragElement() {
|
|
|
51
51
|
function closeDragElement() {
|
|
52
52
|
mouseDistance.startMouseTracking();
|
|
53
53
|
if (overlay) overlay.style.display = 'none';
|
|
54
|
+
var ele = document.getElementById('i18next-editor-popup');
|
|
55
|
+
localStorage.setItem('locize_popup_pos', JSON.stringify({
|
|
56
|
+
top: parseInt(document.defaultView.getComputedStyle(ele).top, 10),
|
|
57
|
+
left: parseInt(document.defaultView.getComputedStyle(ele).left, 10)
|
|
58
|
+
}));
|
|
54
59
|
document.onmouseup = null;
|
|
55
60
|
document.onmousemove = null;
|
|
56
61
|
}
|
|
@@ -104,6 +109,11 @@ function initResizeElement() {
|
|
|
104
109
|
function stopDrag() {
|
|
105
110
|
mouseDistance.startMouseTracking();
|
|
106
111
|
if (overlay) overlay.style.display = 'none';
|
|
112
|
+
var ele = document.getElementById('i18next-editor-popup');
|
|
113
|
+
localStorage.setItem('locize_popup_size', JSON.stringify({
|
|
114
|
+
width: parseInt(document.defaultView.getComputedStyle(ele).width, 10),
|
|
115
|
+
height: parseInt(document.defaultView.getComputedStyle(ele).height, 10)
|
|
116
|
+
}));
|
|
107
117
|
document.documentElement.removeEventListener('mousemove', doDrag, false);
|
|
108
118
|
document.documentElement.removeEventListener('mouseup', stopDrag, false);
|
|
109
119
|
}
|
package/dist/cjs/ui/utils.js
CHANGED
|
@@ -38,6 +38,24 @@ function mouseDistanceFromElement(mouseEvent, element) {
|
|
|
38
38
|
hypot = Math.pow(Math.pow(distX, 2) + Math.pow(distY, 2), 1 / 2);
|
|
39
39
|
return Math.floor(hypot);
|
|
40
40
|
}
|
|
41
|
+
function getOptimizedBoundingRectEle(node) {
|
|
42
|
+
var refEle = node;
|
|
43
|
+
if (node.childNodes.length === 1) {
|
|
44
|
+
var childNode = node.childNodes[0];
|
|
45
|
+
if (childNode && childNode.nodeName === '#text') {
|
|
46
|
+
var range = document.createRange();
|
|
47
|
+
range.selectNode(childNode);
|
|
48
|
+
var rect = range.getBoundingClientRect();
|
|
49
|
+
refEle = {
|
|
50
|
+
getBoundingClientRect: function getBoundingClientRect() {
|
|
51
|
+
return rect;
|
|
52
|
+
}
|
|
53
|
+
};
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
return refEle;
|
|
57
|
+
}
|
|
41
58
|
|
|
59
|
+
exports.getOptimizedBoundingRectEle = getOptimizedBoundingRectEle;
|
|
42
60
|
exports.isInViewport = isInViewport;
|
|
43
61
|
exports.mouseDistanceFromElement = mouseDistanceFromElement;
|
|
@@ -20,7 +20,7 @@ function clean() {
|
|
|
20
20
|
}
|
|
21
21
|
});
|
|
22
22
|
}
|
|
23
|
-
function save(id, type, node) {
|
|
23
|
+
function save(id, type, node, txt) {
|
|
24
24
|
if (!id || !type || !node) return;
|
|
25
25
|
if (!data[id]) {
|
|
26
26
|
data[id] = {
|
|
@@ -28,13 +28,29 @@ function save(id, type, node) {
|
|
|
28
28
|
node: node
|
|
29
29
|
};
|
|
30
30
|
}
|
|
31
|
-
data[id].keys = _objectSpread(_objectSpread({}, data[id].keys), {}, _defineProperty__default["default"]({}, "".concat(type),
|
|
31
|
+
data[id].keys = _objectSpread(_objectSpread({}, data[id].keys), {}, _defineProperty__default["default"]({}, "".concat(type), {
|
|
32
|
+
value: txt,
|
|
33
|
+
eleUniqueID: id,
|
|
34
|
+
textType: type
|
|
35
|
+
}));
|
|
36
|
+
}
|
|
37
|
+
function remove(id, node) {
|
|
38
|
+
highlightNode.resetHighlight(id, node);
|
|
39
|
+
delete data[id];
|
|
40
|
+
}
|
|
41
|
+
function removeKey(id, key, node) {
|
|
42
|
+
var item = get(id);
|
|
43
|
+
if (!item) return;
|
|
44
|
+
delete item.keys["".concat(key)];
|
|
45
|
+
if (!Object.keys(item.keys).length) remove(id, node);
|
|
32
46
|
}
|
|
33
47
|
function get(id) {
|
|
34
48
|
return data[id];
|
|
35
49
|
}
|
|
36
50
|
var uninstrumentedStore = {
|
|
37
51
|
save: save,
|
|
52
|
+
remove: remove,
|
|
53
|
+
removeKey: removeKey,
|
|
38
54
|
clean: clean,
|
|
39
55
|
get: get,
|
|
40
56
|
data: data
|
package/dist/cjs/utils.js
CHANGED
|
@@ -2,11 +2,12 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
|
|
6
|
+
require('@babel/runtime/helpers/typeof');
|
|
6
7
|
|
|
7
8
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
8
9
|
|
|
9
|
-
var
|
|
10
|
+
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
|
|
10
11
|
|
|
11
12
|
function debounce(func, wait, immediate) {
|
|
12
13
|
var timeout;
|
|
@@ -23,76 +24,6 @@ function debounce(func, wait, immediate) {
|
|
|
23
24
|
if (callNow) func.apply(context, args);
|
|
24
25
|
};
|
|
25
26
|
}
|
|
26
|
-
function isWindow(obj) {
|
|
27
|
-
return obj != null && obj === obj.window;
|
|
28
|
-
}
|
|
29
|
-
function getWindow(elem) {
|
|
30
|
-
return isWindow(elem) ? elem : elem.nodeType === 9 && elem.defaultView;
|
|
31
|
-
}
|
|
32
|
-
function offset(elem) {
|
|
33
|
-
var box = {
|
|
34
|
-
top: 0,
|
|
35
|
-
left: 0,
|
|
36
|
-
right: 0,
|
|
37
|
-
bottom: 0
|
|
38
|
-
};
|
|
39
|
-
var doc = elem && elem.ownerDocument;
|
|
40
|
-
var docElem = doc && doc.documentElement;
|
|
41
|
-
if (!docElem) return box;
|
|
42
|
-
if (_typeof__default["default"](elem.getBoundingClientRect) !== ("undefined" )) {
|
|
43
|
-
box = elem.getBoundingClientRect();
|
|
44
|
-
}
|
|
45
|
-
var win = getWindow(doc);
|
|
46
|
-
var top = box.top + win.pageYOffset - docElem.clientTop;
|
|
47
|
-
var left = box.left + win.pageXOffset - docElem.clientLeft;
|
|
48
|
-
return {
|
|
49
|
-
top: top,
|
|
50
|
-
left: left,
|
|
51
|
-
right: left + (box.right - box.left),
|
|
52
|
-
bottom: top + (box.bottom - box.top)
|
|
53
|
-
};
|
|
54
|
-
}
|
|
55
|
-
function getClickedElement(e) {
|
|
56
|
-
if (e.srcElement && e.srcElement.nodeType === 1 && (e.srcElement.nodeName === 'BUTTON' || e.srcElement.nodeName === 'INPUT')) {
|
|
57
|
-
if (e.srcElement.getAttribute && e.srcElement.getAttribute('ignorelocizeeditor') === '') {
|
|
58
|
-
return null;
|
|
59
|
-
}
|
|
60
|
-
return e.srcElement;
|
|
61
|
-
}
|
|
62
|
-
var el;
|
|
63
|
-
if (e.originalEvent && e.originalEvent.explicitOriginalTarget) {
|
|
64
|
-
el = e.originalEvent.explicitOriginalTarget;
|
|
65
|
-
} else {
|
|
66
|
-
var parent = e.srcElement;
|
|
67
|
-
if (parent.getAttribute && parent.getAttribute('ignorelocizeeditor') === '') return null;
|
|
68
|
-
var left = e.pageX;
|
|
69
|
-
var top = e.pageY;
|
|
70
|
-
var topStartsAt = 0;
|
|
71
|
-
var topBreaksAt;
|
|
72
|
-
for (var i = 0; i < parent.childNodes.length; i++) {
|
|
73
|
-
var n = parent.childNodes[i];
|
|
74
|
-
var nOffset = offset(n);
|
|
75
|
-
if (n.nodeType === 1 && nOffset.bottom < top) topStartsAt = i + 1;
|
|
76
|
-
if (!topBreaksAt && nOffset.top + (n.clientHeight || 0) > top) topBreaksAt = i;
|
|
77
|
-
}
|
|
78
|
-
if (topStartsAt + 1 > parent.childNodes.length) topStartsAt = parent.childNodes.length - 1;
|
|
79
|
-
if (!topBreaksAt) topBreaksAt = parent.childNodes.length;
|
|
80
|
-
for (var y = topStartsAt; y < topBreaksAt; y++) {
|
|
81
|
-
var _n = parent.childNodes[y];
|
|
82
|
-
var _nOffset = offset(_n);
|
|
83
|
-
if (_nOffset.left > left) {
|
|
84
|
-
break;
|
|
85
|
-
}
|
|
86
|
-
if (_n && _n.nodeType !== 8) el = _n;
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
return el;
|
|
90
|
-
}
|
|
91
|
-
function getElementText(el) {
|
|
92
|
-
var str = el.textContent || el.text && el.text.innerText || el.placeholder;
|
|
93
|
-
if (typeof str !== 'string') return;
|
|
94
|
-
return str.replace(/\n +/g, '').trim();
|
|
95
|
-
}
|
|
96
27
|
function getAttribute(el, name) {
|
|
97
28
|
return el && el.getAttribute && el.getAttribute(name);
|
|
98
29
|
}
|
|
@@ -104,6 +35,57 @@ function getElementI18nKey(el) {
|
|
|
104
35
|
}
|
|
105
36
|
return undefined;
|
|
106
37
|
}
|
|
38
|
+
function parseAttrFromKey(key) {
|
|
39
|
+
var attr = 'text';
|
|
40
|
+
if (key.indexOf('[') == 0) {
|
|
41
|
+
var parts = key.split(']');
|
|
42
|
+
key = parts[1];
|
|
43
|
+
attr = parts[0].substr(1, parts[0].length - 1);
|
|
44
|
+
}
|
|
45
|
+
var newKey = key.indexOf(';') == key.length - 1 ? key.substr(0, key.length - 2) : key;
|
|
46
|
+
return [newKey, attr];
|
|
47
|
+
}
|
|
48
|
+
function getI18nMetaFromNode(el) {
|
|
49
|
+
var hasNamespacePrependToKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
50
|
+
var key = getElementI18nKey(el);
|
|
51
|
+
var ns = getElementNamespace(el);
|
|
52
|
+
var allKeys = {};
|
|
53
|
+
if (key && key.indexOf(';') >= 0) {
|
|
54
|
+
var keys = key.split(';');
|
|
55
|
+
for (var ix = 0, l_ix = keys.length; ix < l_ix; ix++) {
|
|
56
|
+
if (keys[ix] != '') {
|
|
57
|
+
var _parseAttrFromKey = parseAttrFromKey(keys[ix]),
|
|
58
|
+
_parseAttrFromKey2 = _slicedToArray__default["default"](_parseAttrFromKey, 2),
|
|
59
|
+
usedKey = _parseAttrFromKey2[0],
|
|
60
|
+
attr = _parseAttrFromKey2[1];
|
|
61
|
+
allKeys[attr] = usedKey;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
} else if (key) {
|
|
65
|
+
var _parseAttrFromKey3 = parseAttrFromKey(key),
|
|
66
|
+
_parseAttrFromKey4 = _slicedToArray__default["default"](_parseAttrFromKey3, 2),
|
|
67
|
+
_usedKey = _parseAttrFromKey4[0],
|
|
68
|
+
_attr = _parseAttrFromKey4[1];
|
|
69
|
+
allKeys[_attr] = _usedKey;
|
|
70
|
+
}
|
|
71
|
+
if (Object.keys(allKeys).length < 1) return null;
|
|
72
|
+
var res = Object.keys(allKeys).reduce(function (mem, attr) {
|
|
73
|
+
var key = allKeys[attr];
|
|
74
|
+
var usedNS = ns;
|
|
75
|
+
var usedKey = key;
|
|
76
|
+
if (hasNamespacePrependToKey && key.indexOf(':') > -1) {
|
|
77
|
+
var parts = key.split(':');
|
|
78
|
+
usedKey = parts[1];
|
|
79
|
+
usedNS = parts[0];
|
|
80
|
+
}
|
|
81
|
+
mem[attr] = {
|
|
82
|
+
key: usedKey,
|
|
83
|
+
ns: usedNS
|
|
84
|
+
};
|
|
85
|
+
return mem;
|
|
86
|
+
}, {});
|
|
87
|
+
return res;
|
|
88
|
+
}
|
|
107
89
|
function getElementNamespace(el) {
|
|
108
90
|
var found;
|
|
109
91
|
var find = function find(ele) {
|
|
@@ -139,11 +121,7 @@ function getQsParameterByName(name, url) {
|
|
|
139
121
|
}
|
|
140
122
|
|
|
141
123
|
exports.debounce = debounce;
|
|
142
|
-
exports.getClickedElement = getClickedElement;
|
|
143
124
|
exports.getElementI18nKey = getElementI18nKey;
|
|
144
125
|
exports.getElementNamespace = getElementNamespace;
|
|
145
|
-
exports.
|
|
126
|
+
exports.getI18nMetaFromNode = getI18nMetaFromNode;
|
|
146
127
|
exports.getQsParameterByName = getQsParameterByName;
|
|
147
|
-
exports.getWindow = getWindow;
|
|
148
|
-
exports.isWindow = isWindow;
|
|
149
|
-
exports.offset = offset;
|
package/dist/cjs/vars.js
CHANGED
|
@@ -3,9 +3,11 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var validAttributes = ['placeholder', 'title', 'alt'];
|
|
6
|
+
var ignoreElements = ['SCRIPT'];
|
|
6
7
|
var colors = {
|
|
7
|
-
highlight: '#
|
|
8
|
-
warning: '#e67a00'
|
|
8
|
+
highlight: '#1976d2',
|
|
9
|
+
warning: '#e67a00',
|
|
10
|
+
gray: '#ccc'
|
|
9
11
|
};
|
|
10
12
|
var getIframeUrl = function getIframeUrl() {
|
|
11
13
|
var _prc$env;
|
|
@@ -19,4 +21,5 @@ var getIframeUrl = function getIframeUrl() {
|
|
|
19
21
|
|
|
20
22
|
exports.colors = colors;
|
|
21
23
|
exports.getIframeUrl = getIframeUrl;
|
|
24
|
+
exports.ignoreElements = ignoreElements;
|
|
22
25
|
exports.validAttributes = validAttributes;
|
|
@@ -2,6 +2,7 @@ import _toConsumableArray from '@babel/runtime/helpers/esm/toConsumableArray';
|
|
|
2
2
|
import { api } from './postMessage.js';
|
|
3
3
|
import { store } from '../store.js';
|
|
4
4
|
import { setValueOnNode } from './handleEditKey.js';
|
|
5
|
+
import { recalcSelectedHighlight } from '../ui/highlightNode.js';
|
|
5
6
|
|
|
6
7
|
function handler(payload) {
|
|
7
8
|
var updated = payload.updated;
|
|
@@ -19,6 +20,12 @@ function handler(payload) {
|
|
|
19
20
|
});
|
|
20
21
|
}
|
|
21
22
|
api.i18n.setResource(lng, ns, key, data.value);
|
|
23
|
+
if (metas) {
|
|
24
|
+
Object.values(metas).forEach(function (m) {
|
|
25
|
+
var sItem = store.get(m.eleUniqueID);
|
|
26
|
+
recalcSelectedHighlight(sItem, sItem.node, sItem.keys);
|
|
27
|
+
});
|
|
28
|
+
}
|
|
22
29
|
});
|
|
23
30
|
Object.values(store.data).forEach(function (item) {
|
|
24
31
|
if (item.originalChildNodes) {
|
|
@@ -5,7 +5,7 @@ import { store } from '../store.js';
|
|
|
5
5
|
function setValueOnNode(meta, value) {
|
|
6
6
|
var item = store.get(meta.eleUniqueID);
|
|
7
7
|
if (!item || !item.keys[meta.textType]) return;
|
|
8
|
-
var txtWithHiddenMeta = wrap(value, item.subliminal);
|
|
8
|
+
var txtWithHiddenMeta = item.subliminal ? wrap(value, item.subliminal) : value;
|
|
9
9
|
if (meta.textType === 'text') {
|
|
10
10
|
item.node.textContent = txtWithHiddenMeta;
|
|
11
11
|
} else if (meta.textType.indexOf('attr:') === 0) {
|
|
@@ -3,7 +3,7 @@ import { api } from './postMessage.js';
|
|
|
3
3
|
function handler(payload, e) {
|
|
4
4
|
api.source = e.source;
|
|
5
5
|
api.origin = e.origin;
|
|
6
|
-
api.
|
|
7
|
-
api.
|
|
6
|
+
api.sendLocizeIsEnabled(payload);
|
|
7
|
+
api.requestInitialize(api.config);
|
|
8
8
|
}
|
|
9
9
|
api.addHandler('isLocizeEnabled', handler);
|
|
@@ -5,6 +5,15 @@ function handler(payload) {
|
|
|
5
5
|
var containerStyle = payload.containerStyle;
|
|
6
6
|
if (containerStyle) {
|
|
7
7
|
var popup = document.getElementById(popupId);
|
|
8
|
+
if (!popup) return;
|
|
9
|
+
var storedPos = localStorage.getItem('locize_popup_pos');
|
|
10
|
+
if (storedPos) storedPos = JSON.parse(storedPos);
|
|
11
|
+
var storedSize = localStorage.getItem('locize_popup_size');
|
|
12
|
+
if (storedSize) storedSize = JSON.parse(storedSize);
|
|
13
|
+
if (storedSize && storedSize.height && storedSize.width) {
|
|
14
|
+
containerStyle.height = storedSize.height + 'px';
|
|
15
|
+
containerStyle.width = storedSize.width + 'px';
|
|
16
|
+
}
|
|
8
17
|
if (containerStyle.height) {
|
|
9
18
|
var diff = "calc(".concat(containerStyle.height, " - ").concat(popup.style.height, ")");
|
|
10
19
|
popup.style.setProperty('top', "calc(".concat(popup.style.top, " - ").concat(diff, ")"));
|
|
@@ -15,6 +24,8 @@ function handler(payload) {
|
|
|
15
24
|
popup.style.setProperty('left', "calc(".concat(popup.style.left, " - ").concat(_diff, ")"));
|
|
16
25
|
popup.style.setProperty('width', containerStyle.width);
|
|
17
26
|
}
|
|
27
|
+
if (storedPos && storedPos.top && storedPos.top < window.innerHeight - containerStyle.height.replace('px', '')) popup.style.setProperty('top', storedPos.top + 'px');
|
|
28
|
+
if (storedPos && storedPos.left && storedPos.left < window.innerWidth - containerStyle.width.replace('px', '')) popup.style.setProperty('left', storedPos.left + 'px');
|
|
18
29
|
}
|
|
19
30
|
}
|
|
20
31
|
api.addHandler('requestPopupChanges', handler);
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
|
+
import { api } from './postMessage.js';
|
|
3
|
+
import { store } from '../store.js';
|
|
4
|
+
import { uninstrumentedStore } from '../uninstrumentedStore.js';
|
|
5
|
+
import { extractNodeMeta } from '../parser.js';
|
|
6
|
+
|
|
7
|
+
function handler(payload) {
|
|
8
|
+
if (!payload.length) return;
|
|
9
|
+
payload.forEach(function (item) {
|
|
10
|
+
var uni = uninstrumentedStore.get(item.eleUniqueID);
|
|
11
|
+
store.save(item.eleUniqueID, undefined, item.textType, extractNodeMeta(item.eleUniqueID, item.textType, _defineProperty({}, "".concat(item.textType), {
|
|
12
|
+
ns: item.ns,
|
|
13
|
+
key: item.key
|
|
14
|
+
}), item.value), uni === null || uni === void 0 ? void 0 : uni.node);
|
|
15
|
+
delete uni.keys["".concat(item.textType)];
|
|
16
|
+
if (!Object.keys(uni.keys).length) uninstrumentedStore.remove(item.eleUniqueID, uni.node);
|
|
17
|
+
});
|
|
18
|
+
api.sendCurrentParsedContent();
|
|
19
|
+
}
|
|
20
|
+
api.addHandler('sendMatchedUninstrumented', handler);
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
2
|
import { getIframeUrl } from '../vars.js';
|
|
3
3
|
import { store } from '../store.js';
|
|
4
|
+
import { uninstrumentedStore } from '../uninstrumentedStore.js';
|
|
5
|
+
import { debounce } from '../utils.js';
|
|
4
6
|
|
|
5
7
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
6
8
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
@@ -14,27 +16,18 @@ function getMappedLegacyEvent(msg) {
|
|
|
14
16
|
function addLocizeSavedHandler(handler) {
|
|
15
17
|
api.locizeSavedHandler = handler;
|
|
16
18
|
}
|
|
17
|
-
function turnOn() {
|
|
18
|
-
api.scriptTurnedOff = false;
|
|
19
|
-
api.turnOn();
|
|
20
|
-
return api.scriptTurnedOff;
|
|
21
|
-
}
|
|
22
|
-
function turnOff() {
|
|
23
|
-
api.turnOff();
|
|
24
|
-
api.scriptTurnedOff = true;
|
|
25
|
-
return api.scriptTurnedOff;
|
|
26
|
-
}
|
|
27
19
|
function setEditorLng(lng) {
|
|
28
20
|
api.sendCurrentTargetLanguage(lng);
|
|
29
21
|
}
|
|
30
22
|
var pendingMsgs = [];
|
|
23
|
+
var allowedActionsBeforeInit = ['locizeIsEnabled', 'requestInitialize'];
|
|
31
24
|
function sendMessage(action, payload) {
|
|
32
25
|
if (!api.source) {
|
|
33
26
|
var _document$getElementB;
|
|
34
27
|
api.source = (_document$getElementB = document.getElementById('i18next-editor-iframe')) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.contentWindow;
|
|
35
28
|
}
|
|
36
29
|
if (!api.origin) api.origin = getIframeUrl();
|
|
37
|
-
if (!api.source || !api.source.postMessage) {
|
|
30
|
+
if (!api.source || !api.source.postMessage || !api.initialized && allowedActionsBeforeInit.indexOf(action) < 0) {
|
|
38
31
|
pendingMsgs.push({
|
|
39
32
|
action: action,
|
|
40
33
|
payload: payload
|
|
@@ -48,7 +41,7 @@ function sendMessage(action, payload) {
|
|
|
48
41
|
} else {
|
|
49
42
|
api.source.postMessage({
|
|
50
43
|
sender: 'i18next-editor',
|
|
51
|
-
senderAPIVersion: '
|
|
44
|
+
senderAPIVersion: 'v2',
|
|
52
45
|
action: action,
|
|
53
46
|
message: action,
|
|
54
47
|
payload: payload
|
|
@@ -62,6 +55,22 @@ function sendMessage(action, payload) {
|
|
|
62
55
|
sendMessage(action, payload);
|
|
63
56
|
});
|
|
64
57
|
}
|
|
58
|
+
var sendCurrentParsedContentDebounced = function sendCurrentParsedContentDebounced() {
|
|
59
|
+
sendMessage('sendCurrentParsedContent', {
|
|
60
|
+
content: Object.values(store.data).map(function (item) {
|
|
61
|
+
return {
|
|
62
|
+
id: item.id,
|
|
63
|
+
keys: item.keys
|
|
64
|
+
};
|
|
65
|
+
}),
|
|
66
|
+
uninstrumented: Object.values(uninstrumentedStore.data).map(function (item) {
|
|
67
|
+
return {
|
|
68
|
+
id: item.id,
|
|
69
|
+
keys: item.keys
|
|
70
|
+
};
|
|
71
|
+
})
|
|
72
|
+
});
|
|
73
|
+
};
|
|
65
74
|
var handlers = {};
|
|
66
75
|
var repeat = 5;
|
|
67
76
|
var api = {
|
|
@@ -79,7 +88,7 @@ var api = {
|
|
|
79
88
|
clearInterval(api.initInterval);
|
|
80
89
|
delete api.initInterval;
|
|
81
90
|
}
|
|
82
|
-
},
|
|
91
|
+
}, 2000);
|
|
83
92
|
},
|
|
84
93
|
selectKey: function selectKey(meta) {
|
|
85
94
|
sendMessage('selectKey', meta);
|
|
@@ -87,45 +96,25 @@ var api = {
|
|
|
87
96
|
confirmResourceBundle: function confirmResourceBundle(payload) {
|
|
88
97
|
sendMessage('confirmResourceBundle', payload);
|
|
89
98
|
},
|
|
90
|
-
sendCurrentParsedContent:
|
|
91
|
-
sendMessage('sendCurrentParsedContent', {
|
|
92
|
-
content: Object.values(store.data).map(function (item) {
|
|
93
|
-
return {
|
|
94
|
-
id: item.id,
|
|
95
|
-
keys: item.keys
|
|
96
|
-
};
|
|
97
|
-
})
|
|
98
|
-
});
|
|
99
|
-
},
|
|
99
|
+
sendCurrentParsedContent: debounce(sendCurrentParsedContentDebounced, 500),
|
|
100
100
|
sendCurrentTargetLanguage: function sendCurrentTargetLanguage(lng) {
|
|
101
101
|
sendMessage('sendCurrentTargetLanguage', {
|
|
102
102
|
targetLng: lng || api.i18n.getLng()
|
|
103
103
|
});
|
|
104
104
|
},
|
|
105
|
+
sendHrefchanged: function sendHrefchanged(href) {
|
|
106
|
+
sendMessage('hrefChanged', {
|
|
107
|
+
href: href
|
|
108
|
+
});
|
|
109
|
+
},
|
|
105
110
|
addHandler: function addHandler(action, fc) {
|
|
106
111
|
if (!handlers[action]) handlers[action] = [];
|
|
107
112
|
handlers[action].push(fc);
|
|
108
113
|
},
|
|
109
|
-
sendLocizeIsEnabled: function sendLocizeIsEnabled() {
|
|
110
|
-
sendMessage('locizeIsEnabled', {
|
|
114
|
+
sendLocizeIsEnabled: function sendLocizeIsEnabled(payload) {
|
|
115
|
+
sendMessage('locizeIsEnabled', _objectSpread(_objectSpread({}, payload), {}, {
|
|
111
116
|
enabled: true
|
|
112
|
-
});
|
|
113
|
-
},
|
|
114
|
-
turnOn: function turnOn() {
|
|
115
|
-
if (api.scriptTurnedOff) return sendMessage('forcedOff');
|
|
116
|
-
if (!api.clickInterceptionEnabled) {
|
|
117
|
-
window.document.body.addEventListener('click', api.clickHandler, true);
|
|
118
|
-
}
|
|
119
|
-
api.clickInterceptionEnabled = true;
|
|
120
|
-
sendMessage('turnedOn');
|
|
121
|
-
},
|
|
122
|
-
turnOff: function turnOff() {
|
|
123
|
-
if (api.scriptTurnedOff) return sendMessage('forcedOff');
|
|
124
|
-
if (api.clickInterceptionEnabled) {
|
|
125
|
-
window.document.body.removeEventListener('click', api.clickHandler, true);
|
|
126
|
-
}
|
|
127
|
-
api.clickInterceptionEnabled = false;
|
|
128
|
-
sendMessage('turnedOff');
|
|
117
|
+
}));
|
|
129
118
|
},
|
|
130
119
|
onAddedKey: function onAddedKey(lng, ns, key, value) {
|
|
131
120
|
var msg = {
|
|
@@ -153,10 +142,10 @@ if (typeof window !== 'undefined') {
|
|
|
153
142
|
}
|
|
154
143
|
} else if (sender === 'i18next-editor-frame' && handlers[action]) {
|
|
155
144
|
handlers[action].forEach(function (fc) {
|
|
156
|
-
fc(payload);
|
|
145
|
+
fc(payload, e);
|
|
157
146
|
});
|
|
158
147
|
}
|
|
159
148
|
});
|
|
160
149
|
}
|
|
161
150
|
|
|
162
|
-
export { addLocizeSavedHandler, api, sendMessage, setEditorLng
|
|
151
|
+
export { addLocizeSavedHandler, api, sendMessage, setEditorLng };
|