@themarioga/grid-editor 5.1.2 → 5.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/BUILDING.md +6 -0
- package/CHANGELOG.md +58 -0
- package/README.md +46 -9
- package/UPGRADING.md +25 -0
- package/dist/grideditor.css +28 -0
- package/dist/grideditor.min.css +1 -1
- package/dist/grideditor.min.css.map +1 -1
- package/dist/jquery.grideditor.bundle.min.js +2 -2
- package/dist/jquery.grideditor.js +760 -245
- package/dist/jquery.grideditor.min.js +1 -1
- package/dist/jquery.grideditor.min.js.map +1 -1
- package/dist/locales/grideditor.es.js +11 -0
- package/dist/locales/grideditor.es.min.js +1 -1
- package/dist/locales/grideditor.es.min.js.map +1 -1
- package/dist/plugins/grideditor.ckeditor.js +120 -0
- package/dist/plugins/grideditor.ckeditor.min.js +2 -0
- package/dist/plugins/grideditor.ckeditor.min.js.map +1 -0
- package/dist/plugins/grideditor.clipboard.js +8 -7
- package/dist/plugins/grideditor.clipboard.min.js +1 -1
- package/dist/plugins/grideditor.clipboard.min.js.map +1 -1
- package/dist/plugins/grideditor.spacing.js +1 -1
- package/dist/plugins/grideditor.spacing.min.js +1 -1
- package/dist/plugins/grideditor.spacing.min.js.map +1 -1
- package/dist/plugins/grideditor.summernote.js +98 -0
- package/dist/plugins/grideditor.summernote.min.js +2 -0
- package/dist/plugins/grideditor.summernote.min.js.map +1 -0
- package/dist/plugins/grideditor.textalign.js +1 -1
- package/dist/plugins/grideditor.textalign.min.js +1 -1
- package/dist/plugins/grideditor.textalign.min.js.map +1 -1
- package/dist/plugins/grideditor.tinymce.js +162 -0
- package/dist/plugins/grideditor.tinymce.min.js +2 -0
- package/dist/plugins/grideditor.tinymce.min.js.map +1 -0
- package/dist/plugins/grideditor.visibility.js +3 -3
- package/dist/plugins/grideditor.visibility.min.js +1 -1
- package/dist/plugins/grideditor.visibility.min.js.map +1 -1
- package/docs/events.md +5 -2
- package/docs/locale-keys.md +23 -1
- package/docs/plugins.md +61 -4
- package/example/attributes.html +4 -2
- package/example/autosave.html +2 -0
- package/example/basic.html +2 -0
- package/example/ckeditor.html +2 -0
- package/example/clipboard.html +2 -0
- package/example/containers.html +2 -0
- package/example/elements.html +2 -0
- package/example/summernote.html +2 -0
- package/example/wrap_content.html +2 -0
- package/package.json +1 -1
- package/src/js/compat/bundled-texts.js +14 -0
- package/src/js/jquery.grideditor.js +444 -33
- package/src/js/locales/grideditor.es.js +11 -0
- package/src/js/plugins/grideditor.ckeditor.js +120 -0
- package/src/js/plugins/grideditor.clipboard.js +8 -7
- package/src/js/plugins/grideditor.spacing.js +1 -1
- package/src/js/plugins/grideditor.summernote.js +98 -0
- package/src/js/plugins/grideditor.textalign.js +1 -1
- package/src/js/plugins/grideditor.tinymce.js +162 -0
- package/src/js/plugins/grideditor.visibility.js +3 -3
- package/src/less/grideditor.less +34 -0
- package/src/js/jquery.grideditor.ckeditor.js +0 -77
- package/src/js/jquery.grideditor.summernote.js +0 -72
- package/src/js/jquery.grideditor.tinymce.js +0 -143
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(o=>{function a(e){e.removeClass("active").removeClass("ge-rte-active").removeAttr("id").removeAttr("style").removeAttr("spellcheck").removeAttr("contenteditable").removeAttr("data-mce-style")}o.extend(o.fn.gridEditor.locales.en,{"text.tinymce":"tinyMCE"});var c="<p>Lorem ipsum dolores</p>";o.fn.gridEditor.texts.tinymce=function(n){return{labelKey:"text.tinymce",initialContent:c,missingKey:"error.tinymce_missing",available:function(){return!!window.tinymce},start:function(e){var t=n.settings,i=t.tinymce&&t.tinymce.config?t.tinymce.config:{};e.each(function(){var e,t=o(this);t.hasClass("active")||(t.html()==c&&t.html(""),t.addClass("active"),delete(e=o.extend({promotion:!1},i,{target:this,inline:!0,init_instance_callback:function(e){t.data("ge-tinymce-pending-remove")?(t.removeData("ge-tinymce-pending-remove"),e.remove(),a(t)):(t.data("ge-tinymce",e),n.textReady(t),e.on("Undo Redo",function(){n.textReady(t)}),window.requestAnimationFrame(function(){!e.removed&&e.ui&&e.ui.show&&e.ui.show()}),e.on("focus",function(){window.requestAnimationFrame(function(){!e.removed&&e.ui&&e.ui.show&&e.ui.show()})}),e.focus(),i.init_instance_callback&&i.init_instance_callback.call(this,e),i.oninit&&i.oninit.call(this,e))}})).selector,window.tinymce.init(e))})},stop:function(e){e.filter(".active").each(function(){var e=o(this),t=e.data("ge-tinymce");t?(e.removeData("ge-tinymce"),t.remove()):e.data("ge-tinymce-pending-remove",!0),a(e)})}}}})(jQuery);
|
|
2
|
+
//# sourceMappingURL=grideditor.tinymce.min.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"grideditor.tinymce.min.js","sources":["../../src/js/plugins/grideditor.tinymce.js"],"names":["$","cleanUp","contentArea","removeClass","removeAttr","extend","fn","gridEditor","locales","en","text.tinymce","INITIAL_CONTENT","texts","tinymce","ge","labelKey","initialContent","missingKey","available","window","start","contentAreas","settings","userConfig","config","each","configuration","this","hasClass","html","addClass","promotion","target","inline","init_instance_callback","editor","data","removeData","remove","textReady","on","requestAnimationFrame","removed","ui","show","focus","call","oninit","selector","init","stop","filter","jQuery"],"mappings":"CAcUA,IASN,SAASC,EAAQC,GACbA,EACKC,YAAY,QAAQ,EACpBA,YAAY,eAAe,EAC3BC,WAAW,IAAI,EACfA,WAAW,OAAO,EAClBA,WAAW,YAAY,EACvBA,WAAW,iBAAiB,EAC5BA,WAAW,gBAAgB,CAEpC,CAjBAJ,EAAEK,OAAOL,EAAEM,GAAGC,WAAWC,QAAQC,GAAI,CACjCC,eAAgB,SACpB,CAAC,EAiBD,IAAIC,EAAkB,6BAEtBX,EAAEM,GAAGC,WAAWK,MAAMC,QAAU,SAASC,GACrC,MAAO,CACHC,SAAU,eACVC,eAAgBL,EAChBM,WAAY,wBAEZC,UAAW,WAAa,MAAO,CAAC,CAACC,OAAON,OAAS,EAEjDO,MAAO,SAASC,GACZ,IAAIC,EAAWR,EAAGQ,SACdC,EAAcD,EAAST,SAAWS,EAAST,QAAQW,OAAUF,EAAST,QAAQW,OAAS,GAE3FH,EAAaI,KAAK,WACd,IAQIC,EARAxB,EAAcF,EAAE2B,IAAI,EACpBzB,EAAY0B,SAAS,QAAQ,IAE7B1B,EAAY2B,KAAK,GAAKlB,GACtBT,EAAY2B,KAAK,EAAE,EAEvB3B,EAAY4B,SAAS,QAAQ,EAgF7B,OA9EIJ,EAAgB1B,EAAEK,OAAO,CAKzB0B,UAAW,CAAA,CACf,EAAGR,EAAY,CACXS,OAAQL,KACRM,OAAQ,CAAA,EACRC,uBAAwB,SAASC,GAEzBjC,EAAYkC,KAAK,2BAA2B,GAC5ClC,EAAYmC,WAAW,2BAA2B,EAClDF,EAAOG,OAAO,EAGdrC,EAAQC,CAAW,IAIvBA,EAAYkC,KAAK,aAAcD,CAAM,EAMrCrB,EAAGyB,UAAUrC,CAAW,EAMxBiC,EAAOK,GAAG,YAAa,WACnB1B,EAAGyB,UAAUrC,CAAW,CAC5B,CAAC,EAUDiB,OAAOsB,sBAAsB,WACrBN,CAAAA,EAAOO,SAAYP,EAAOQ,IAAOR,EAAOQ,GAAGC,MAE/CT,EAAOQ,GAAGC,KAAK,CACnB,CAAC,EAODT,EAAOK,GAAG,QAAS,WACfrB,OAAOsB,sBAAsB,WACrBN,CAAAA,EAAOO,SAAYP,EAAOQ,IAAOR,EAAOQ,GAAGC,MAE/CT,EAAOQ,GAAGC,KAAK,CACnB,CAAC,CACL,CAAC,EAGDT,EAAOU,MAAM,EAGTtB,EAAWW,wBACXX,EAAWW,uBAAuBY,KAAKnB,KAAMQ,CAAM,EAGnDZ,EAAWwB,QACXxB,EAAWwB,OAAOD,KAAKnB,KAAMQ,CAAM,EAE3C,CACJ,CAAC,GAGoBa,SAErB7B,OAAON,QAAQoC,KAAKvB,CAAa,EACrC,CAAC,CACL,EAEAwB,KAAM,SAAS7B,GACXA,EAAa8B,OAAO,SAAS,EAAE1B,KAAK,WAChC,IAAIvB,EAAcF,EAAE2B,IAAI,EACpBQ,EAASjC,EAAYkC,KAAK,YAAY,EAEtCD,GACAjC,EAAYmC,WAAW,YAAY,EACnCF,EAAOG,OAAO,GAIdpC,EAAYkC,KAAK,4BAA6B,CAAA,CAAI,EAGtDnC,EAAQC,CAAW,CACvB,CAAC,CACL,CACJ,CACJ,CACH,GAAEkD,MAAM"}
|
|
@@ -32,7 +32,7 @@ $.extend($.fn.gridEditor.locales.en, {
|
|
|
32
32
|
/** A node that carries any class of the family, at any breakpoint. */
|
|
33
33
|
var CLASS_PATTERN = /(?:^|\s)d-(?:(?:sm|md|lg|xl|xxl)-)?(?:none|block|flex)(?:\s|$)/;
|
|
34
34
|
|
|
35
|
-
var NODES = '.row, .column, .ge-element, [data-ge-container]';
|
|
35
|
+
var NODES = '.row, .column, .ge-content, .ge-element, [data-ge-container]';
|
|
36
36
|
|
|
37
37
|
$.fn.gridEditor.utilities.visibility = function(ge) {
|
|
38
38
|
|
|
@@ -44,7 +44,7 @@ $.fn.gridEditor.utilities.visibility = function(ge) {
|
|
|
44
44
|
}
|
|
45
45
|
|
|
46
46
|
function applies(node, kind) {
|
|
47
|
-
return kind === 'row' || kind === 'column' || kind === 'element' ||
|
|
47
|
+
return kind === 'row' || kind === 'column' || kind === 'element' || kind === 'text' ||
|
|
48
48
|
node.is('[data-ge-container]');
|
|
49
49
|
}
|
|
50
50
|
|
|
@@ -143,7 +143,7 @@ $.fn.gridEditor.utilities.visibility = function(ge) {
|
|
|
143
143
|
name: 'visibility',
|
|
144
144
|
prefix: 'd',
|
|
145
145
|
values: ['none', 'block', 'flex'],
|
|
146
|
-
appliesTo: ['row', 'column', 'element', 'container'],
|
|
146
|
+
appliesTo: ['row', 'column', 'text', 'element', 'container'],
|
|
147
147
|
labelKey: 'utility.visibility',
|
|
148
148
|
|
|
149
149
|
/** Hidden, or shown the way this kind of node is shown. */
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
(
|
|
1
|
+
(c=>{c.extend(c.fn.gridEditor.locales.en,{"utility.visibility":"Visibility","utility.visibility_hidden":"Hidden","utility.visibility_shown":"Shown","tool.hide_in_view":"Hide in this view","tool.show_in_view":"Show in this view","badge.hidden_in":"Hidden at {breakpoints}"});var v=/(?:^|\s)d-(?:(?:sm|md|lg|xl|xxl)-)?(?:none|block|flex)(?:\s|$)/,n=".row, .column, .ge-content, .ge-element, [data-ge-container]";c.fn.gridEditor.utilities.visibility=function(o){var e=c.extend({drawer:!0},o.settings.utilities.visibility);function r(i){return"row"===i?"flex":"block"}function s(i,e){return"row"===e||"column"===e||"element"===e||"text"===e||i.is("[data-ge-container]")}function t(i,e){return"none"===o.getUtility(i,"visibility",e)}function a(e){return o.breakpoints.filter(function(i){return t(e,i)})}function d(i){return"all"===o.view()?a(i).length===o.breakpoints.length:t(i,o.view())}function u(i){var e=o.breakpoints.indexOf(o.view());return 0<e&&t(i,o.breakpoints[e-1])}return{families:[{name:"visibility",prefix:"d",values:["none","block","flex"],appliesTo:["row","column","text","element","container"],labelKey:"utility.visibility",choices:function(i,e){return["none",r(e)]},label:function(i){return"none"===i?o.t("utility.visibility_hidden"):o.t("utility.visibility_shown")}}],drawerTools:function(i,n,l){e.drawer&&s(n,l)&&o.createTool(i,o.t("tool.hide_in_view"),"ge-visibility-tool","bi bi-eye",function(){var i,e,t;e=l,t=!d(i=n),t="all"===o.view()?t?"none":null:t?u(i)?null:"none":u(i)?r(e):null,o.setUtility(i,"visibility",t,{source:"tool"})})},onRefresh:function(i){i.find(n).addBack(n).each(function(){var i=c(this),e=s(i,o.kindOf(i))&&v.test(i.attr("class")||""),t=e?a(i):[],n=e&&d(i),l=e&&"all"===o.view()&&0<t.length&&!n;i.toggleClass("ge-visibility",e).toggleClass("ge-hidden-in-view",n),l?i.attr("data-ge-hidden-in",o.t("badge.hidden_in",{breakpoints:t.join(", ")})):i.removeAttr("data-ge-hidden-in"),i.children(".ge-tools-drawer").children(".ge-visibility-tool").each(function(){c(this).attr("title",n?o.t("tool.show_in_view"):o.t("tool.hide_in_view")).find("i").attr("class",n?"bi bi-eye-slash":"bi bi-eye")})})},onDeinit:function(){o.canvas.find(".ge-visibility, .ge-hidden-in-view, [data-ge-hidden-in]").each(function(){var i=c(this).removeClass("ge-visibility ge-hidden-in-view").removeAttr("data-ge-hidden-in");i.attr("class")||i.removeAttr("class")})}}}})(jQuery);
|
|
2
2
|
//# sourceMappingURL=grideditor.visibility.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grideditor.visibility.min.js","sources":["../../src/js/plugins/grideditor.visibility.js"],"names":["$","extend","fn","gridEditor","locales","en","utility.visibility","utility.visibility_hidden","utility.visibility_shown","tool.hide_in_view","tool.show_in_view","badge.hidden_in","CLASS_PATTERN","NODES","utilities","visibility","ge","options","drawer","settings","shown","kind","applies","node","is","hiddenAt","view","getUtility","hiddenTiers","breakpoints","filter","key","hiddenHere","length","hiddenBelow","index","indexOf","families","name","prefix","values","appliesTo","labelKey","choices","label","value","t","drawerTools","createTool","hide","setUtility","source","onRefresh","scope","find","addBack","each","this","carries","kindOf","test","attr","tiers","here","partly","toggleClass","join","removeAttr","children","onDeinit","canvas","removeClass","jQuery"],"mappings":"CAoBUA,IAEVA,EAAEC,OAAOD,EAAEE,GAAGC,WAAWC,QAAQC,GAAI,CACjCC,qBAAsB,aACtBC,4BAA6B,SAC7BC,2BAA4B,QAC5BC,oBAAqB,oBACrBC,oBAAqB,oBACrBC,kBAAmB,yBACvB,CAAC,EAGD,IAAIC,EAAgB,iEAEhBC,EAAQ,
|
|
1
|
+
{"version":3,"file":"grideditor.visibility.min.js","sources":["../../src/js/plugins/grideditor.visibility.js"],"names":["$","extend","fn","gridEditor","locales","en","utility.visibility","utility.visibility_hidden","utility.visibility_shown","tool.hide_in_view","tool.show_in_view","badge.hidden_in","CLASS_PATTERN","NODES","utilities","visibility","ge","options","drawer","settings","shown","kind","applies","node","is","hiddenAt","view","getUtility","hiddenTiers","breakpoints","filter","key","hiddenHere","length","hiddenBelow","index","indexOf","families","name","prefix","values","appliesTo","labelKey","choices","label","value","t","drawerTools","createTool","hide","setUtility","source","onRefresh","scope","find","addBack","each","this","carries","kindOf","test","attr","tiers","here","partly","toggleClass","join","removeAttr","children","onDeinit","canvas","removeClass","jQuery"],"mappings":"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"}
|
package/docs/events.md
CHANGED
|
@@ -47,6 +47,8 @@ about every insertion can bind `grideditor:before-add` and switch on
|
|
|
47
47
|
| `grideditor:after-add-accordion-item` | `grideditor:after-add` | no | |
|
|
48
48
|
| `grideditor:before-add-element` | `grideditor:before-add` | yes | before an element is inserted |
|
|
49
49
|
| `grideditor:after-add-element` | `grideditor:after-add` | no | |
|
|
50
|
+
| `grideditor:before-add-text` | `grideditor:before-add` | yes | before a text block is inserted, from the add text tool, the toolbar or `createText` |
|
|
51
|
+
| `grideditor:after-add-text` | `grideditor:after-add` | no | |
|
|
50
52
|
| `grideditor:before-delete` | — | yes | before any node is removed, whatever its kind |
|
|
51
53
|
| `grideditor:after-delete` | — | no | after removal completes, animation included |
|
|
52
54
|
| `grideditor:before-move` | — | yes | on drag start (see *Canceling*) |
|
|
@@ -127,8 +129,9 @@ listens for what the user does: `api` is your own call coming back to you,
|
|
|
127
129
|
the clipboard plugin put in, from a paste tool or the toolbar. A paste is an add
|
|
128
130
|
like any other, so canceling its `before-add-*` turns it away.
|
|
129
131
|
|
|
130
|
-
`kind: '
|
|
131
|
-
|
|
132
|
+
A text block is `kind: 'text'`, with its content area as the node, when it is
|
|
133
|
+
added or deleted, and in `drawerTools`. Dragged between columns it is still
|
|
134
|
+
`kind: 'content'`, as it was in 5.x; 6.0 makes that `text` too. The kinds for containers are the container's own type, so a listener
|
|
132
135
|
can tell a tabs container from an accordion without reading the markup.
|
|
133
136
|
|
|
134
137
|
|
package/docs/locale-keys.md
CHANGED
|
@@ -100,6 +100,27 @@ The sections plugin: Bootstrap's `.container` and its kin, on the canvas.
|
|
|
100
100
|
| `confirm.delete_section` | Delete this section and everything in it? | Asked before a section is deleted |
|
|
101
101
|
|
|
102
102
|
|
|
103
|
+
text.*
|
|
104
|
+
------
|
|
105
|
+
|
|
106
|
+
Text blocks: a content area, the text editor that edits it, and its drawer.
|
|
107
|
+
`{editor}` is an editor's label, one of the `text.<type>` keys below or, for a
|
|
108
|
+
plugin with no label, its type.
|
|
109
|
+
|
|
110
|
+
| Key | English | Where |
|
|
111
|
+
| --- | --- | --- |
|
|
112
|
+
| `text.add` | Text | Toolbar button that adds a text block, when one editor is offered |
|
|
113
|
+
| `text.add_type` | Text ({editor}) | The same, one per editor, when several are offered |
|
|
114
|
+
| `text.no_editor` | No text editor "{type}" is loaded: this text can be moved and deleted, not edited | Text drawer, for a content area whose editor's plugin is not loaded |
|
|
115
|
+
| `text.tinymce` | tinyMCE | The tinyMCE plugin's label |
|
|
116
|
+
| `text.ckeditor` | CKEditor | The CKEditor plugin's label |
|
|
117
|
+
| `text.summernote` | Summernote | The summernote plugin's label |
|
|
118
|
+
| `tool.add_text` | Add text | Column drawer, adds a text block of the first editor offered |
|
|
119
|
+
| `tool.add_text_type` | Add {editor} text | Title of each choice the add text tool offers, held, when several editors are |
|
|
120
|
+
| `tool.text_info` | Text: {editor} | Text drawer, says which editor edits it |
|
|
121
|
+
| `tool.delete_text` | Remove text | Text drawer |
|
|
122
|
+
|
|
123
|
+
|
|
103
124
|
clipboard.*
|
|
104
125
|
-----------
|
|
105
126
|
|
|
@@ -107,7 +128,7 @@ The clipboard plugin: copy and paste.
|
|
|
107
128
|
|
|
108
129
|
| Key | English | Where |
|
|
109
130
|
| --- | --- | --- |
|
|
110
|
-
| `tool.copy` | Copy | Row, column, section, container and element drawers |
|
|
131
|
+
| `tool.copy` | Copy | Row, column, section, text, container and element drawers |
|
|
111
132
|
| `tool.paste` | Paste | Column, row and section drawers, while something that fits there is copied |
|
|
112
133
|
| `clipboard.paste_row` | Paste row | Title of the toolbar's paste button, while a row is copied |
|
|
113
134
|
| `clipboard.paste_section` | Paste section | Title of the toolbar's paste button, while a section is copied |
|
|
@@ -130,6 +151,7 @@ browser's own confirm instead.
|
|
|
130
151
|
| `confirm.cancel` | Cancel | The button that does not, and the close button's label |
|
|
131
152
|
| `confirm.delete_row` | Delete row? | Before a row is removed |
|
|
132
153
|
| `confirm.delete_column` | Delete column? | Before a column is removed |
|
|
154
|
+
| `confirm.delete_text` | Delete this text? | Before a text block is removed |
|
|
133
155
|
| `confirm.delete_element` | Delete element? | Before an element is removed |
|
|
134
156
|
| `confirm.delete_container` | Delete this container and everything in it? | Before a container is removed |
|
|
135
157
|
| `confirm.delete_tab` | Delete this tab and everything in it? | Before a tab and its pane are removed |
|
package/docs/plugins.md
CHANGED
|
@@ -14,13 +14,15 @@ the one to read first if you are about to write your own.
|
|
|
14
14
|
<script src="dist/plugins/grideditor.elements.min.js"></script>
|
|
15
15
|
```
|
|
16
16
|
|
|
17
|
-
There are
|
|
17
|
+
There are four kinds. A **container plugin** builds a type of container — it
|
|
18
18
|
registers under `$.fn.gridEditor.containers`, and the toolbar offers a button
|
|
19
19
|
for it. A **utility plugin** declares families of Bootstrap's responsive
|
|
20
20
|
utility classes — `$.fn.gridEditor.utilities` — and the editor edits them per
|
|
21
|
-
breakpoint. A **
|
|
21
|
+
breakpoint. A **text editor plugin** edits content areas with a rich text
|
|
22
|
+
editor — `$.fn.gridEditor.texts`, one per editor: tinyMCE, CKEditor,
|
|
23
|
+
summernote. A **feature plugin** is anything else the editor can do —
|
|
22
24
|
`$.fn.gridEditor.features`, hooks into the canvas, and may contribute methods.
|
|
23
|
-
All
|
|
25
|
+
All four are factories called once per editor with the same handle.
|
|
24
26
|
|
|
25
27
|
The `plugins` setting names which of the loaded ones to use:
|
|
26
28
|
|
|
@@ -124,6 +126,8 @@ not change without a major version.
|
|
|
124
126
|
| `ge.setUtility(node, family, value, options?)` | Write one through the events. `options` is a view key or `{ view, source }` |
|
|
125
127
|
| `ge.utilityField(node, family)` | A panel field for one family, for a plugin that builds its own panel |
|
|
126
128
|
| `ge.rowFromLayout(layout)` | A detached row from a layout: `[8, 4]`, `['auto', 'equal']` or `{ row_cols, columns }` |
|
|
129
|
+
| `ge.drawerOf(node)` | A node's drawer: its first child, or for a content area the one beside it in its text block |
|
|
130
|
+
| `ge.textReady(block)` | A text editor has rewritten a content area: whatever the editor and its plugins put in there goes back in |
|
|
127
131
|
| `ge.nodeHtml(node)` | One node's markup as `getHtml` would give it. The canvas leaves editing to read it and comes back, as it does for `getHtml` |
|
|
128
132
|
| `ge.toolbarItems(name)` | The toolbar buttons the feature plugin `name` declared, for showing and hiding them |
|
|
129
133
|
| `ge.bareStyle(node, family, property)` | A css property's value on the node with none of the family's classes: what a preview shows when no class applies and that is not a constant |
|
|
@@ -173,7 +177,10 @@ needs to put a new kind of block on the canvas:
|
|
|
173
177
|
|
|
174
178
|
- **`drawerTools(drawer, node, kind)`** runs for every drawer that has a gear,
|
|
175
179
|
as a utility plugin's does, so a tool can go on any node. The clipboard
|
|
176
|
-
plugin puts its copy and paste tools in with it.
|
|
180
|
+
plugin puts its copy and paste tools in with it. A text block's drawer is
|
|
181
|
+
`kind: 'text'` with its content area as the node, and is not the node's
|
|
182
|
+
child: it sits beside it, in a wrapper that only exists while editing, so
|
|
183
|
+
`ge.drawerOf(node)` is how to find it.
|
|
177
184
|
|
|
178
185
|
### Settings of your own, saved on the node
|
|
179
186
|
|
|
@@ -251,6 +258,56 @@ plugin knows which of its parts move: the tabs plugin makes its strip sortable
|
|
|
251
258
|
and puts the panes back in strip order in `afterPaneMove`.
|
|
252
259
|
|
|
253
260
|
|
|
261
|
+
Text editor plugins
|
|
262
|
+
-------------------
|
|
263
|
+
|
|
264
|
+
A text editor plugin edits content areas with a rich text editor. It is
|
|
265
|
+
registered under the content type it edits - the name `content_types` uses -
|
|
266
|
+
and the three that ship, `grideditor.tinymce.js`, `grideditor.ckeditor.js` and
|
|
267
|
+
`grideditor.summernote.js`, are the ones to read:
|
|
268
|
+
|
|
269
|
+
```javascript
|
|
270
|
+
$.fn.gridEditor.texts.mytext = function(ge) {
|
|
271
|
+
return {
|
|
272
|
+
labelKey: 'text.mytext', // its name, in the toolbar and the drawer, optional
|
|
273
|
+
initialContent: '<p>Write here</p>', // what a new text holds
|
|
274
|
+
missingKey: 'error.mytext_missing', // the error when the library is not loaded, optional
|
|
275
|
+
available: function() { return !!window.MyText; }, // optional, true otherwise
|
|
276
|
+
|
|
277
|
+
start: function(block) { … }, // open the editor on this content area
|
|
278
|
+
stop: function(block) { … }, // close it, and leave the content area as it was
|
|
279
|
+
};
|
|
280
|
+
};
|
|
281
|
+
```
|
|
282
|
+
|
|
283
|
+
- **`start(block)`** is called when the user clicks a content area of this
|
|
284
|
+
type. The editor marks it `ge-rte-active` first, and does not call `start`
|
|
285
|
+
again until it has been stopped. Once the library has taken the content
|
|
286
|
+
area over, call **`ge.textReady(block)`**: it rewrote what was inside, and
|
|
287
|
+
the editor and its plugins put their own furniture back - an element's
|
|
288
|
+
drawer, for one. Call it again whenever the library rewrites the content
|
|
289
|
+
area again, as tinyMCE's undo does.
|
|
290
|
+
- **`stop(block)`** is called for every content area of this type on each
|
|
291
|
+
`deinit`, which `getHtml` runs: a content area whose editor never started is
|
|
292
|
+
the plugin's to ignore. Whatever the library and `start` added - classes,
|
|
293
|
+
`contenteditable`, inline styles, ids - comes off here.
|
|
294
|
+
- **`available()`** false and the editor logs `missingKey`'s message and
|
|
295
|
+
starts nothing, without marking the content area, so a later click tries
|
|
296
|
+
again once the library is there.
|
|
297
|
+
|
|
298
|
+
A text editor is chosen by `content_types`, never by the `plugins` setting: a
|
|
299
|
+
page that names its containers there has named no editor.
|
|
300
|
+
|
|
301
|
+
Up to 6.0 the main bundle carries a copy of the three shipped ones, marked
|
|
302
|
+
`bundled`; editing with a copy warns once that 6.0 leaves them out. A plugin's
|
|
303
|
+
own file, loaded after, registers itself again and is the one used.
|
|
304
|
+
|
|
305
|
+
5.x's `$.fn.gridEditor.RTEs.mytext = { init, deinit, initialContent }` still
|
|
306
|
+
works: `init(settings, contentAreas)` and `deinit(settings, contentAreas)` are
|
|
307
|
+
wrapped as `start` and `stop`, with a warning that `RTEs` is deprecated. It goes
|
|
308
|
+
in 7.0.
|
|
309
|
+
|
|
310
|
+
|
|
254
311
|
Utility plugins
|
|
255
312
|
---------------
|
|
256
313
|
|
package/example/attributes.html
CHANGED
|
@@ -17,6 +17,8 @@
|
|
|
17
17
|
<!-- Grid editor javascript -->
|
|
18
18
|
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.6/Sortable.min.js"></script>
|
|
19
19
|
<script src="../dist/jquery.grideditor.min.js"></script>
|
|
20
|
+
<!-- The text editor is a plugin of its own, loaded after the editor -->
|
|
21
|
+
<script src="../dist/plugins/grideditor.tinymce.min.js"></script>
|
|
20
22
|
<script src="../dist/plugins/grideditor.card.min.js"></script>
|
|
21
23
|
<script src="../dist/plugins/grideditor.elements.min.js"></script>
|
|
22
24
|
|
|
@@ -187,7 +189,7 @@
|
|
|
187
189
|
// Every drawer that has a gear, and the kind of its node:
|
|
188
190
|
// a row, a column, an element, a container's type, a pane
|
|
189
191
|
drawerTools: function(drawer, node, kind) {
|
|
190
|
-
var animated = ['row', 'column', 'section', 'element'].indexOf(kind) !== -1 ||
|
|
192
|
+
var animated = ['row', 'column', 'section', 'text', 'element'].indexOf(kind) !== -1 ||
|
|
191
193
|
!!$.fn.gridEditor.containers[kind];
|
|
192
194
|
if (!animated) { return; }
|
|
193
195
|
|
|
@@ -287,7 +289,7 @@
|
|
|
287
289
|
<h1 class="h4">A plugin with a modal</h1>
|
|
288
290
|
<p class="form-text">
|
|
289
291
|
The <i class="bi bi-magic"></i> tool in the drawer of a row,
|
|
290
|
-
a column, a card or an element is a plugin written on this
|
|
292
|
+
a column, a text, a card or an element is a plugin written on this
|
|
291
293
|
page. It opens a modal, and what you choose there is saved
|
|
292
294
|
on the node as a <code>data-animation</code> attribute, which
|
|
293
295
|
<code>getPlainHtml</code> keeps: only <code>data-ge-*</code>
|
package/example/autosave.html
CHANGED
|
@@ -18,6 +18,8 @@
|
|
|
18
18
|
<!-- Grid editor javascript -->
|
|
19
19
|
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.6/Sortable.min.js"></script>
|
|
20
20
|
<script src="../dist/jquery.grideditor.min.js"></script>
|
|
21
|
+
<!-- The text editor is a plugin of its own, loaded after the editor -->
|
|
22
|
+
<script src="../dist/plugins/grideditor.tinymce.min.js"></script>
|
|
21
23
|
</head>
|
|
22
24
|
<body>
|
|
23
25
|
<!-- Back to the demo index -->
|
package/example/basic.html
CHANGED
|
@@ -18,6 +18,8 @@
|
|
|
18
18
|
<!-- The editor with SortableJS inside it. Every other example loads the
|
|
19
19
|
two files separately; a page does one or the other, never both. -->
|
|
20
20
|
<script src="../dist/jquery.grideditor.bundle.min.js"></script>
|
|
21
|
+
<!-- The text editor is a plugin of its own, loaded after the editor -->
|
|
22
|
+
<script src="../dist/plugins/grideditor.tinymce.min.js"></script>
|
|
21
23
|
|
|
22
24
|
<script>
|
|
23
25
|
$(function() {
|
package/example/ckeditor.html
CHANGED
|
@@ -19,6 +19,8 @@
|
|
|
19
19
|
<!-- Grid editor javascript -->
|
|
20
20
|
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.6/Sortable.min.js"></script>
|
|
21
21
|
<script src="../dist/jquery.grideditor.min.js"></script>
|
|
22
|
+
<!-- The text editor is a plugin of its own, loaded after the editor -->
|
|
23
|
+
<script src="../dist/plugins/grideditor.ckeditor.min.js"></script>
|
|
22
24
|
|
|
23
25
|
<script>
|
|
24
26
|
$(function() {
|
package/example/clipboard.html
CHANGED
|
@@ -17,6 +17,8 @@
|
|
|
17
17
|
<!-- Grid editor javascript -->
|
|
18
18
|
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.6/Sortable.min.js"></script>
|
|
19
19
|
<script src="../dist/jquery.grideditor.min.js"></script>
|
|
20
|
+
<!-- The text editor is a plugin of its own, loaded after the editor -->
|
|
21
|
+
<script src="../dist/plugins/grideditor.tinymce.min.js"></script>
|
|
20
22
|
<!-- Copy and paste is a plugin of its own. The others are here so there
|
|
21
23
|
is a bit of everything to copy. -->
|
|
22
24
|
<script src="../dist/plugins/grideditor.clipboard.min.js"></script>
|
package/example/containers.html
CHANGED
|
@@ -17,6 +17,8 @@
|
|
|
17
17
|
<!-- Grid editor javascript -->
|
|
18
18
|
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.6/Sortable.min.js"></script>
|
|
19
19
|
<script src="../dist/jquery.grideditor.min.js"></script>
|
|
20
|
+
<!-- The text editor is a plugin of its own, loaded after the editor -->
|
|
21
|
+
<script src="../dist/plugins/grideditor.tinymce.min.js"></script>
|
|
20
22
|
<!-- One file per container type: load the ones this page offers -->
|
|
21
23
|
<script src="../dist/plugins/grideditor.tabs.min.js"></script>
|
|
22
24
|
<script src="../dist/plugins/grideditor.accordion.min.js"></script>
|
package/example/elements.html
CHANGED
|
@@ -17,6 +17,8 @@
|
|
|
17
17
|
<!-- Grid editor javascript -->
|
|
18
18
|
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.6/Sortable.min.js"></script>
|
|
19
19
|
<script src="../dist/jquery.grideditor.min.js"></script>
|
|
20
|
+
<!-- The text editor is a plugin of its own, loaded after the editor -->
|
|
21
|
+
<script src="../dist/plugins/grideditor.tinymce.min.js"></script>
|
|
20
22
|
<script src="../dist/plugins/grideditor.elements.min.js"></script>
|
|
21
23
|
|
|
22
24
|
<style>
|
package/example/summernote.html
CHANGED
|
@@ -21,6 +21,8 @@
|
|
|
21
21
|
<!-- Grid editor javascript -->
|
|
22
22
|
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.6/Sortable.min.js"></script>
|
|
23
23
|
<script src="../dist/jquery.grideditor.min.js"></script>
|
|
24
|
+
<!-- The text editor is a plugin of its own, loaded after the editor -->
|
|
25
|
+
<script src="../dist/plugins/grideditor.summernote.min.js"></script>
|
|
24
26
|
|
|
25
27
|
<script>
|
|
26
28
|
$(function() {
|
|
@@ -17,6 +17,8 @@
|
|
|
17
17
|
<!-- Grid editor javascript -->
|
|
18
18
|
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.6/Sortable.min.js"></script>
|
|
19
19
|
<script src="../dist/jquery.grideditor.min.js"></script>
|
|
20
|
+
<!-- The text editor is a plugin of its own, loaded after the editor -->
|
|
21
|
+
<script src="../dist/plugins/grideditor.tinymce.min.js"></script>
|
|
20
22
|
|
|
21
23
|
<script>
|
|
22
24
|
$(function() {
|
package/package.json
CHANGED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Up to 6.0 the main bundle carries a copy of each text editor plugin, so a
|
|
3
|
+
* page that loaded only the editor keeps the editor it had. This marks those
|
|
4
|
+
* copies, and the editor warns once when a content area is edited with one:
|
|
5
|
+
* 6.0 leaves them out. Loaded on its own, a plugin's file registers itself
|
|
6
|
+
* again, unmarked, and is the one used.
|
|
7
|
+
*
|
|
8
|
+
* Only ever concatenated after the plugins it marks, never built on its own.
|
|
9
|
+
*/
|
|
10
|
+
(function($) {
|
|
11
|
+
['tinymce', 'ckeditor', 'summernote'].forEach(function(type) {
|
|
12
|
+
if ($.fn.gridEditor.texts[type]) { $.fn.gridEditor.texts[type].bundled = true; }
|
|
13
|
+
});
|
|
14
|
+
})(jQuery);
|