@themarioga/grid-editor 7.2.0 → 8.0.0-beta.2
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 +101 -0
- package/README.md +96 -30
- package/UPGRADING.md +86 -0
- package/dist/grideditor.bundle.min.js +3 -3
- package/dist/grideditor.css +149 -6
- package/dist/grideditor.d.ts +18 -0
- package/dist/grideditor.esm.js +257 -48
- package/dist/grideditor.jquery.js +0 -13
- package/dist/grideditor.jquery.min.js +1 -1
- package/dist/grideditor.jquery.min.js.map +3 -3
- package/dist/grideditor.js +257 -48
- package/dist/grideditor.min.css +1 -1
- package/dist/grideditor.min.css.map +1 -1
- package/dist/grideditor.min.js +2 -2
- package/dist/grideditor.min.js.map +3 -3
- package/dist/locales/grideditor.es.esm.js +80 -6
- package/dist/locales/grideditor.es.js +80 -6
- package/dist/locales/grideditor.es.min.js +1 -1
- package/dist/locales/grideditor.es.min.js.map +2 -2
- package/dist/plugins/grideditor.accordion.min.js.map +2 -2
- package/dist/plugins/grideditor.alignment.esm.js +11 -38
- package/dist/plugins/grideditor.alignment.js +11 -38
- package/dist/plugins/grideditor.alignment.min.js +1 -1
- package/dist/plugins/grideditor.alignment.min.js.map +3 -3
- package/dist/plugins/grideditor.card.min.js.map +1 -1
- package/dist/plugins/grideditor.ckeditor.esm.js +0 -5
- package/dist/plugins/grideditor.ckeditor.js +0 -5
- package/dist/plugins/grideditor.ckeditor.min.js +1 -1
- package/dist/plugins/grideditor.ckeditor.min.js.map +3 -3
- package/dist/plugins/grideditor.clipboard.min.js.map +1 -1
- package/dist/plugins/grideditor.codemirror-inline.min.js.map +1 -1
- package/dist/plugins/grideditor.codemirror.min.js.map +1 -1
- package/dist/plugins/grideditor.elements.min.js.map +2 -2
- package/dist/plugins/grideditor.gutters.min.js.map +1 -1
- package/dist/plugins/grideditor.order.min.js.map +1 -1
- package/dist/plugins/grideditor.popup.min.js.map +1 -1
- package/dist/plugins/grideditor.sections.min.js.map +2 -2
- package/dist/plugins/grideditor.style.esm.js +1926 -0
- package/dist/plugins/grideditor.style.js +1923 -0
- package/dist/plugins/grideditor.style.min.js +4 -0
- package/dist/plugins/grideditor.style.min.js.map +7 -0
- package/dist/plugins/grideditor.summernote.min.js.map +2 -2
- package/dist/plugins/grideditor.tabs.min.js.map +2 -2
- package/dist/plugins/grideditor.tinymce.esm.js +1 -8
- package/dist/plugins/grideditor.tinymce.js +1 -8
- package/dist/plugins/grideditor.tinymce.min.js +1 -1
- package/dist/plugins/grideditor.tinymce.min.js.map +3 -3
- package/docs/events.md +4 -6
- package/docs/locale-keys.md +99 -15
- package/docs/plugins.md +47 -23
- package/example/ckeditor.html +0 -5
- package/example/index.html +17 -2
- package/example/style.html +163 -0
- package/example/utilities.html +21 -16
- package/package.json +1 -1
- package/src/js/dom.js +1 -2
- package/src/js/grideditor.jquery.js +7 -28
- package/src/js/grideditor.js +336 -67
- package/src/js/locales/grideditor.es.js +80 -6
- package/src/js/plugins/grideditor.alignment.js +21 -50
- package/src/js/plugins/grideditor.ckeditor.js +10 -23
- package/src/js/plugins/grideditor.style.js +185 -0
- package/src/js/plugins/grideditor.summernote.js +4 -5
- package/src/js/plugins/grideditor.tinymce.js +4 -17
- package/src/js/style/accordion.js +168 -0
- package/src/js/style/catalog.js +76 -0
- package/src/js/style/custom.js +84 -0
- package/src/js/style/display.js +229 -0
- package/src/js/style/drawerflow.js +118 -0
- package/src/js/style/fields.js +382 -0
- package/src/js/style/flex.js +156 -0
- package/src/js/{plugins/grideditor.float.js → style/float.js} +6 -16
- package/src/js/style/options.js +60 -0
- package/src/js/style/sections.js +298 -0
- package/src/js/{plugins/grideditor.spacing.js → style/spacing.js} +7 -19
- package/src/js/style/sticky.js +39 -0
- package/src/js/{plugins/grideditor.textalign.js → style/textalign.js} +6 -14
- package/src/js/text/grideditor.text.js +1 -1
- package/src/less/grideditor.less +151 -10
- package/types/grideditor.d.ts +18 -0
- package/dist/plugins/grideditor.float.esm.js +0 -34
- package/dist/plugins/grideditor.float.js +0 -41
- package/dist/plugins/grideditor.float.min.js +0 -1
- package/dist/plugins/grideditor.float.min.js.map +0 -7
- package/dist/plugins/grideditor.spacing.esm.js +0 -318
- package/dist/plugins/grideditor.spacing.js +0 -323
- package/dist/plugins/grideditor.spacing.min.js +0 -1
- package/dist/plugins/grideditor.spacing.min.js.map +0 -7
- package/dist/plugins/grideditor.textalign.esm.js +0 -40
- package/dist/plugins/grideditor.textalign.js +0 -47
- package/dist/plugins/grideditor.textalign.min.js +0 -1
- package/dist/plugins/grideditor.textalign.min.js.map +0 -7
- package/dist/plugins/grideditor.visibility.esm.js +0 -158
- package/dist/plugins/grideditor.visibility.js +0 -163
- package/dist/plugins/grideditor.visibility.min.js +0 -1
- package/dist/plugins/grideditor.visibility.min.js.map +0 -7
- package/src/js/plugins/grideditor.visibility.js +0 -171
package/example/index.html
CHANGED
|
@@ -44,10 +44,17 @@
|
|
|
44
44
|
</p>
|
|
45
45
|
<p class="text-body-secondary">
|
|
46
46
|
Since 4.1: utility plugins, which edit Bootstrap's responsive
|
|
47
|
-
utility classes —
|
|
47
|
+
utility classes — display, column order, alignment,
|
|
48
48
|
gutters and spacing — per breakpoint. See
|
|
49
49
|
<a href="utilities.html">Responsive utilities</a>.
|
|
50
50
|
</p>
|
|
51
|
+
<p class="text-body-secondary">
|
|
52
|
+
New in 7.3: the style plugin, inline css by section with
|
|
53
|
+
Bootstrap's classes as chips, which also carries display,
|
|
54
|
+
spacing, text alignment and float. See
|
|
55
|
+
<a href="style.html">Style</a>. In 8.0: flex, sticky and
|
|
56
|
+
Bootstrap 5.3's colors.
|
|
57
|
+
</p>
|
|
51
58
|
|
|
52
59
|
<div class="list-group my-4">
|
|
53
60
|
|
|
@@ -128,7 +135,15 @@
|
|
|
128
135
|
<strong>Responsive utilities</strong>
|
|
129
136
|
<code class="text-body-secondary">utilities.html</code>
|
|
130
137
|
</div>
|
|
131
|
-
<span class="text-body-secondary">Bootstrap's utility classes edited per breakpoint:
|
|
138
|
+
<span class="text-body-secondary">Bootstrap's utility classes edited per breakpoint: display, flex, column order, alignment, gutters, spacing, text alignment and float</span>
|
|
139
|
+
</a>
|
|
140
|
+
|
|
141
|
+
<a class="list-group-item list-group-item-action" href="style.html">
|
|
142
|
+
<div class="d-flex justify-content-between">
|
|
143
|
+
<strong>Style</strong>
|
|
144
|
+
<code class="text-body-secondary">style.html</code>
|
|
145
|
+
</div>
|
|
146
|
+
<span class="text-body-secondary">The style plugin: inline css for rows, columns, containers and elements, by section, with Bootstrap's classes for each as chips</span>
|
|
132
147
|
</a>
|
|
133
148
|
|
|
134
149
|
<a class="list-group-item list-group-item-action" href="locale.html">
|
|
@@ -0,0 +1,163 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html>
|
|
3
|
+
<head>
|
|
4
|
+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
5
|
+
|
|
6
|
+
<!-- CSS dependencies -->
|
|
7
|
+
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
|
|
8
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.css">
|
|
9
|
+
|
|
10
|
+
<!-- Javascript dependencies -->
|
|
11
|
+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js" integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI" crossorigin="anonymous"></script>
|
|
12
|
+
|
|
13
|
+
<!-- Grid editor CSS -->
|
|
14
|
+
<link rel="stylesheet" type="text/css" href="../dist/grideditor.css" />
|
|
15
|
+
|
|
16
|
+
<!-- The editor, the elements and tabs plugins so there is one of each
|
|
17
|
+
kind of node, and the style plugin. -->
|
|
18
|
+
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.6/Sortable.min.js"></script>
|
|
19
|
+
<script src="../dist/grideditor.min.js"></script>
|
|
20
|
+
<script src="../dist/plugins/grideditor.elements.min.js"></script>
|
|
21
|
+
<script src="../dist/plugins/grideditor.tabs.min.js"></script>
|
|
22
|
+
<script src="../dist/plugins/grideditor.style.min.js"></script>
|
|
23
|
+
|
|
24
|
+
<script>
|
|
25
|
+
document.addEventListener('DOMContentLoaded', function() {
|
|
26
|
+
var grid = document.getElementById('myGrid');
|
|
27
|
+
var panel = document.getElementById('panel');
|
|
28
|
+
var narrow = document.getElementById('narrow');
|
|
29
|
+
var editor;
|
|
30
|
+
|
|
31
|
+
function start() {
|
|
32
|
+
editor = new GridEditor(grid, {
|
|
33
|
+
new_row_layouts: [[12], [6,6], [4,4,4], [8,4]],
|
|
34
|
+
content_types: [],
|
|
35
|
+
|
|
36
|
+
// Where a node's settings open. In a popover, or inline
|
|
37
|
+
// in the drawer, the Style accordion opens in a dialog
|
|
38
|
+
settings_panel: panel.value,
|
|
39
|
+
|
|
40
|
+
// Every section, unless the host says otherwise: this
|
|
41
|
+
// leaves out position and keeps the border section to
|
|
42
|
+
// three fields with no chips
|
|
43
|
+
style: narrow.checked ? {
|
|
44
|
+
sections: {
|
|
45
|
+
position: false,
|
|
46
|
+
border: { properties: ['border-width', 'border-style', 'border-color'], catalog: false },
|
|
47
|
+
},
|
|
48
|
+
} : {},
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
start();
|
|
52
|
+
|
|
53
|
+
// The same canvas, started again with the other settings
|
|
54
|
+
function restart() {
|
|
55
|
+
var html = editor.getHtml();
|
|
56
|
+
editor.destroy();
|
|
57
|
+
grid.innerHTML = html;
|
|
58
|
+
start();
|
|
59
|
+
}
|
|
60
|
+
panel.addEventListener('change', restart);
|
|
61
|
+
narrow.addEventListener('change', restart);
|
|
62
|
+
|
|
63
|
+
document.getElementById('output').addEventListener('click', function() {
|
|
64
|
+
document.getElementById('html').textContent = editor.getHtml();
|
|
65
|
+
});
|
|
66
|
+
});
|
|
67
|
+
</script>
|
|
68
|
+
|
|
69
|
+
<title>Grid Editor style example</title>
|
|
70
|
+
</head>
|
|
71
|
+
<body>
|
|
72
|
+
<!-- Back to the demo index -->
|
|
73
|
+
<div class="container pt-3">
|
|
74
|
+
<a class="link-secondary" href="index.html"><i class="bi bi-arrow-left"></i> All demos</a>
|
|
75
|
+
</div>
|
|
76
|
+
|
|
77
|
+
<div class="container">
|
|
78
|
+
|
|
79
|
+
<div class="row my-3">
|
|
80
|
+
<div class="col-lg-8">
|
|
81
|
+
<h1 class="h4">Style</h1>
|
|
82
|
+
<p class="form-text">
|
|
83
|
+
The gear of a row, a column, a container, a tab, an element
|
|
84
|
+
or a section has a <strong>Style</strong> accordion: size,
|
|
85
|
+
spacing, border, background, text, typography, display,
|
|
86
|
+
flex, position and free css. What you type is written to the
|
|
87
|
+
node's own <code>style</code>; a value the browser does
|
|
88
|
+
not take is marked and not written.
|
|
89
|
+
</p>
|
|
90
|
+
<p class="form-text">
|
|
91
|
+
Each section also offers Bootstrap's classes for what it
|
|
92
|
+
styles, as chips: one puts its class in the classes field,
|
|
93
|
+
and pressing it again takes it off. Bootstrap's utilities
|
|
94
|
+
are <code>!important</code>, so a field whose property a
|
|
95
|
+
class on the node also sets says the class wins.
|
|
96
|
+
</p>
|
|
97
|
+
<p class="form-text">
|
|
98
|
+
The inline style is the same at every size. Padding and
|
|
99
|
+
margin, text alignment, display, flex, sticky and float
|
|
100
|
+
are Bootstrap's responsive classes, edited per breakpoint
|
|
101
|
+
in their sections: pick a breakpoint in the dropdown. A
|
|
102
|
+
node that is flex or grid has its drawer on top, out of
|
|
103
|
+
the flow, so its content is laid out as on the page.
|
|
104
|
+
</p>
|
|
105
|
+
<div class="d-flex flex-wrap align-items-center gap-3 mb-3">
|
|
106
|
+
<div class="d-flex align-items-center gap-2">
|
|
107
|
+
<label class="form-label mb-0" for="panel">A gear opens its settings in</label>
|
|
108
|
+
<select class="form-select form-select-sm w-auto" id="panel">
|
|
109
|
+
<option value="offcanvas">a side panel (offcanvas)</option>
|
|
110
|
+
<option value="popover">a popover</option>
|
|
111
|
+
<option value="modal">a modal</option>
|
|
112
|
+
<option value="inline">the drawer itself (inline)</option>
|
|
113
|
+
</select>
|
|
114
|
+
</div>
|
|
115
|
+
<div class="form-check mb-0">
|
|
116
|
+
<input class="form-check-input" type="checkbox" id="narrow">
|
|
117
|
+
<label class="form-check-label" for="narrow">Fewer sections: no position, a shorter border</label>
|
|
118
|
+
</div>
|
|
119
|
+
</div>
|
|
120
|
+
<button class="btn btn-sm btn-secondary" id="output" type="button">Show the html this produces</button>
|
|
121
|
+
<pre id="html" class="form-text"></pre>
|
|
122
|
+
</div>
|
|
123
|
+
</div>
|
|
124
|
+
|
|
125
|
+
<div id="myGrid">
|
|
126
|
+
|
|
127
|
+
<div class="row" style="background-color: #f0f4ff; border-radius: 12px;">
|
|
128
|
+
<div class="col-12 col-md-8" style="padding-top: 1rem; padding-bottom: 1rem;">
|
|
129
|
+
<h2 class="h5">Styled inline</h2>
|
|
130
|
+
<p>This row has a background and a radius in its <code>style</code>; open its gear and look in Background and Border.</p>
|
|
131
|
+
</div>
|
|
132
|
+
<div class="col-12 col-md-4 shadow-sm rounded-3" style="box-shadow: 0 4px 12px rgba(0, 0, 0, .15)">
|
|
133
|
+
<h2 class="h5">A class and a style</h2>
|
|
134
|
+
<p>It has <code>shadow-sm</code> and an inline shadow: the class wins, and the Border section says so.</p>
|
|
135
|
+
</div>
|
|
136
|
+
</div>
|
|
137
|
+
|
|
138
|
+
<div class="row my-3">
|
|
139
|
+
<div class="col-6">
|
|
140
|
+
<div data-ge-element="callout" data-ge-label="Callout" class="p-3 border-start border-4 bg-body-tertiary" style="font-style: italic; letter-spacing: .02em">
|
|
141
|
+
An element, with a few classes from the catalog and some typography of its own.
|
|
142
|
+
</div>
|
|
143
|
+
</div>
|
|
144
|
+
<div class="col-6">
|
|
145
|
+
<p>Try Size on this column: it offers only the min- and max- widths and heights, since its width is the grid's.</p>
|
|
146
|
+
</div>
|
|
147
|
+
</div>
|
|
148
|
+
|
|
149
|
+
<div class="row my-3">
|
|
150
|
+
<div class="col-12 col-md-6 d-flex flex-column flex-md-row align-items-md-center gap-3 bg-primary-subtle">
|
|
151
|
+
<p class="mb-0">A column made flex: its texts are stacked on phones and side by side from tablet up, with a gap between them.</p>
|
|
152
|
+
<p class="mb-0">Open its gear, and look in Display and Flex.</p>
|
|
153
|
+
</div>
|
|
154
|
+
<div class="col-12 col-md-6 text-bg-dark">
|
|
155
|
+
<p>This column has <code>text-bg-dark</code>, one of Bootstrap 5.3's colors in the Background section, with the subtle ones and the opacities.</p>
|
|
156
|
+
</div>
|
|
157
|
+
</div>
|
|
158
|
+
|
|
159
|
+
</div> <!-- /#myGrid -->
|
|
160
|
+
</div> <!-- /.container -->
|
|
161
|
+
|
|
162
|
+
</body>
|
|
163
|
+
</html>
|
package/example/utilities.html
CHANGED
|
@@ -14,18 +14,19 @@
|
|
|
14
14
|
<link rel="stylesheet" type="text/css" href="../dist/grideditor.css" />
|
|
15
15
|
|
|
16
16
|
<!-- The editor, and the utility plugins. Each is a file of its own, and
|
|
17
|
-
loading it is what puts its
|
|
17
|
+
loading it is what puts its fields in the settings panels. The style
|
|
18
|
+
plugin carries display, flex, spacing, text alignment, sticky and
|
|
19
|
+
float, and edits them in its Style accordion - a row's justify and
|
|
20
|
+
align among them, in Flex; order, a column's align-self and gutters
|
|
21
|
+
are the grid's, and stay in the Responsive section. -->
|
|
18
22
|
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.6/Sortable.min.js"></script>
|
|
19
23
|
<script src="../dist/grideditor.min.js"></script>
|
|
20
|
-
<script src="../dist/plugins/grideditor.visibility.min.js"></script>
|
|
21
24
|
<script src="../dist/plugins/grideditor.order.min.js"></script>
|
|
22
25
|
<script src="../dist/plugins/grideditor.alignment.min.js"></script>
|
|
23
26
|
<script src="../dist/plugins/grideditor.gutters.min.js"></script>
|
|
24
|
-
<script src="../dist/plugins/grideditor.spacing.min.js"></script>
|
|
25
|
-
<script src="../dist/plugins/grideditor.textalign.min.js"></script>
|
|
26
27
|
<!-- Float works on elements, so the elements plugin comes first -->
|
|
27
28
|
<script src="../dist/plugins/grideditor.elements.min.js"></script>
|
|
28
|
-
<script src="../dist/plugins/grideditor.
|
|
29
|
+
<script src="../dist/plugins/grideditor.style.min.js"></script>
|
|
29
30
|
|
|
30
31
|
<script>
|
|
31
32
|
document.addEventListener('DOMContentLoaded', function() {
|
|
@@ -89,9 +90,11 @@
|
|
|
89
90
|
breakpoint. Pick a breakpoint in the dropdown and every
|
|
90
91
|
change is written for that breakpoint alone; in
|
|
91
92
|
<strong>All sizes</strong> it is written once, for every
|
|
92
|
-
size. Each drawer's gear has a <strong>
|
|
93
|
-
|
|
94
|
-
|
|
93
|
+
size. Each drawer's gear has a <strong>Style</strong>
|
|
94
|
+
accordion, whose sections hold display, flex, spacing, text
|
|
95
|
+
alignment, sticky and float, and a <strong>Responsive</strong>
|
|
96
|
+
section for the grid's utilities. Every field says what
|
|
97
|
+
the breakpoint inherits and from where.
|
|
95
98
|
</p>
|
|
96
99
|
<div class="d-flex align-items-center gap-2 mb-3">
|
|
97
100
|
<label class="form-label mb-0" for="panel">A gear opens its settings in</label>
|
|
@@ -103,7 +106,8 @@
|
|
|
103
106
|
</select>
|
|
104
107
|
</div>
|
|
105
108
|
<p class="form-text">
|
|
106
|
-
<strong>
|
|
109
|
+
<strong>Display:</strong> a field in the Display section,
|
|
110
|
+
and the eye in a drawer, which hides the
|
|
107
111
|
node in the view being edited. It stays on the canvas,
|
|
108
112
|
faded, so you can show it again; in All sizes a badge says
|
|
109
113
|
at which breakpoints it is hidden. The sidebar below is
|
|
@@ -116,10 +120,10 @@
|
|
|
116
120
|
comes first on phones only.
|
|
117
121
|
</p>
|
|
118
122
|
<p class="form-text">
|
|
119
|
-
<strong>Alignment:</strong>
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
small desktop up.
|
|
123
|
+
<strong>Alignment:</strong> a row justifies and aligns its
|
|
124
|
+
columns with fields in the Style accordion's Flex section,
|
|
125
|
+
and a column aligns itself with a field in Responsive. The
|
|
126
|
+
third row centres its narrow column from small desktop up.
|
|
123
127
|
</p>
|
|
124
128
|
<p class="form-text">
|
|
125
129
|
<strong>Gutters:</strong> fields in a row's panel. A row
|
|
@@ -129,13 +133,14 @@
|
|
|
129
133
|
</p>
|
|
130
134
|
<p class="form-text">
|
|
131
135
|
<strong>Spacing:</strong> a padding and a margin group in
|
|
132
|
-
|
|
136
|
+
the Style accordion's Spacing section, each a side and a
|
|
137
|
+
value. The centred column
|
|
133
138
|
below gets more padding from small desktop up.
|
|
134
139
|
</p>
|
|
135
140
|
<p class="form-text">
|
|
136
|
-
<strong>Text alignment:</strong> a field in
|
|
141
|
+
<strong>Text alignment:</strong> a field in the Text section.
|
|
137
142
|
The centred column's text is centred from small desktop
|
|
138
|
-
up. <strong>Float:</strong> a field in an element's
|
|
143
|
+
up. <strong>Float:</strong> a field in an element's Position section;
|
|
139
144
|
the quote in the last row floats to the end from tablet up,
|
|
140
145
|
with the text flowing round it.
|
|
141
146
|
</p>
|
package/package.json
CHANGED
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"comment": "A scoped package publishes restricted unless it is told otherwise.",
|
|
34
34
|
"access": "public"
|
|
35
35
|
},
|
|
36
|
-
"version": "
|
|
36
|
+
"version": "8.0.0-beta.2",
|
|
37
37
|
"main": "dist/grideditor.js",
|
|
38
38
|
"module": "dist/grideditor.esm.js",
|
|
39
39
|
"types": "dist/grideditor.d.ts",
|
package/src/js/dom.js
CHANGED
|
@@ -314,8 +314,7 @@ export function fire(node, type) {
|
|
|
314
314
|
/* ------------------------------------------------------------------
|
|
315
315
|
* Taking a node away, visibly.
|
|
316
316
|
*
|
|
317
|
-
* The durations are the
|
|
318
|
-
* caller says otherwise. `done` runs once the node is out of sight, which is
|
|
317
|
+
* The durations are jQuery's: 400 ms unless the caller says otherwise. `done` runs once the node is out of sight, which is
|
|
319
318
|
* when the caller removes it; a node that is already out of sight is done at
|
|
320
319
|
* once, on the next task, as jQuery had it.
|
|
321
320
|
* ------------------------------------------------------------------ */
|
|
@@ -1,20 +1,18 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* The jQuery API of grid-editor 6, on top of the
|
|
2
|
+
* The jQuery API of grid-editor 6, on top of the plain DOM editor.
|
|
3
3
|
*
|
|
4
|
-
*
|
|
5
|
-
*
|
|
6
|
-
*
|
|
7
|
-
*
|
|
4
|
+
* A page written for 6.x - one that calls $(el).gridEditor(...), listens
|
|
5
|
+
* with $(el).on('grideditor:...') and reads jQuery objects out of the
|
|
6
|
+
* payloads - loads jQuery 4 and this file after grideditor.js, and runs
|
|
7
|
+
* unchanged:
|
|
8
8
|
*
|
|
9
9
|
* <script src="jquery.min.js"></script>
|
|
10
10
|
* <script src="dist/grideditor.min.js"></script>
|
|
11
11
|
* <script src="dist/grideditor.jquery.min.js"></script>
|
|
12
12
|
* <script src="dist/plugins/grideditor.tabs.min.js"></script>
|
|
13
13
|
*
|
|
14
|
-
* What it keeps is the host's side of 6.x. Plugins are not:
|
|
15
|
-
*
|
|
16
|
-
* .utilities or .texts, and is warned about and left out, since the plugin
|
|
17
|
-
* contract hands out elements now. UPGRADING.md says how to port one.
|
|
14
|
+
* What it keeps is the host's side of 6.x. Plugins are not: they register
|
|
15
|
+
* on GridEditor, and the plugin contract hands out elements.
|
|
18
16
|
*
|
|
19
17
|
* Every value 6.x gave host code as a jQuery object is one again: the event
|
|
20
18
|
* payloads and the callbacks' arguments, what the create* methods return,
|
|
@@ -250,15 +248,6 @@ function install() {
|
|
|
250
248
|
};
|
|
251
249
|
});
|
|
252
250
|
|
|
253
|
-
/** Plugins registered the 6.x way: said once each, and never called. */
|
|
254
|
-
function warnAboutLegacyPlugins() {
|
|
255
|
-
['containers', 'features', 'utilities', 'texts'].forEach(function(registry) {
|
|
256
|
-
Object.keys(legacy[registry]).forEach(function(name) {
|
|
257
|
-
warnOnce('plugin-6x:' + registry + ':' + name, english('warning.plugin_6x', { name: name }));
|
|
258
|
-
});
|
|
259
|
-
});
|
|
260
|
-
}
|
|
261
|
-
|
|
262
251
|
function dispatchMethod(set, name, args) {
|
|
263
252
|
var descriptor = METHODS[name];
|
|
264
253
|
|
|
@@ -300,8 +289,6 @@ function install() {
|
|
|
300
289
|
return dispatchMethod(this, optionsOrMethod, Array.prototype.slice.call(arguments, 1));
|
|
301
290
|
}
|
|
302
291
|
|
|
303
|
-
warnAboutLegacyPlugins();
|
|
304
|
-
|
|
305
292
|
var options = adaptOptions(optionsOrMethod);
|
|
306
293
|
|
|
307
294
|
this.each(function() {
|
|
@@ -311,14 +298,6 @@ function install() {
|
|
|
311
298
|
return this;
|
|
312
299
|
};
|
|
313
300
|
|
|
314
|
-
// Where a 6.x plugin registers. Kept, so one does not throw as it
|
|
315
|
-
// loads, and read only to say it is not used.
|
|
316
|
-
var legacy = { containers: {}, features: {}, utilities: {}, texts: {} };
|
|
317
|
-
$.fn.gridEditor.containers = legacy.containers;
|
|
318
|
-
$.fn.gridEditor.features = legacy.features;
|
|
319
|
-
$.fn.gridEditor.utilities = legacy.utilities;
|
|
320
|
-
$.fn.gridEditor.texts = legacy.texts;
|
|
321
|
-
|
|
322
301
|
// Strings are the same thing in both: a 6.x locale file loads unchanged
|
|
323
302
|
$.fn.gridEditor.locales = GridEditor.locales;
|
|
324
303
|
$.fn.gridEditor.t = GridEditor.t;
|