@ostendis/grapesjs-preset-ostendis-adv 1.3.0 → 1.3.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/README.md +118 -118
- package/dist/grapesjs-preset-ostendis-adv.min.js +12 -70
- package/dist/grapesjs-preset-ostendis-adv.min.js.map +1 -1
- package/package.json +1 -1
- package/style/tooltip.css +89 -89
package/README.md
CHANGED
|
@@ -1,118 +1,118 @@
|
|
|
1
|
-
# GrapesJS Ostendis Preset
|
|
2
|
-
|
|
3
|
-
This preset configures GrapesJS to be used with some unique features and blocks for the [Ostendis E-Recruiting system](https://www.ostendis.com/en)
|
|
4
|
-
|
|
5
|
-
## Summary
|
|
6
|
-
|
|
7
|
-
TODO
|
|
8
|
-
|
|
9
|
-
## Download
|
|
10
|
-
|
|
11
|
-
Download using one of the options:
|
|
12
|
-
|
|
13
|
-
- `npm i grapesjs-preset-ostendis-adv`
|
|
14
|
-
- Latest release link https://github.com/ostendisorg/grapesjs-preset-ostendis-adv/releases
|
|
15
|
-
|
|
16
|
-
## Usage
|
|
17
|
-
|
|
18
|
-
Directly in the browser
|
|
19
|
-
|
|
20
|
-
```html
|
|
21
|
-
<link href="path/to/grapes.min.css" rel="stylesheet" />
|
|
22
|
-
<link href="path/to/grapesjs-preset-ostendis-adv.css" rel="stylesheet" />
|
|
23
|
-
|
|
24
|
-
<script src="path/to/grapes.min.js"></script>
|
|
25
|
-
<script src="path/to/grapesjs-preset-ostendis-adv.min.js"></script>
|
|
26
|
-
|
|
27
|
-
<div id="gjs"></div>
|
|
28
|
-
|
|
29
|
-
<script type="text/javascript">
|
|
30
|
-
var editor = grapesjs.init({
|
|
31
|
-
container: "#gjs",
|
|
32
|
-
plugins: ["grapesjs-preset-ostendis-adv"],
|
|
33
|
-
pluginsOpts: {
|
|
34
|
-
"grapesjs-preset-ostendis-adv": {
|
|
35
|
-
// options
|
|
36
|
-
},
|
|
37
|
-
},
|
|
38
|
-
});
|
|
39
|
-
</script>
|
|
40
|
-
```
|
|
41
|
-
|
|
42
|
-
Modern javascript
|
|
43
|
-
|
|
44
|
-
```js
|
|
45
|
-
import grapesjs from 'grapesjs';
|
|
46
|
-
import plugin from 'grapesjs-preset-ostendis-adv';
|
|
47
|
-
|
|
48
|
-
const editor = grapesjs.init({
|
|
49
|
-
container : '#gjs',
|
|
50
|
-
// ...
|
|
51
|
-
plugins: [plugin],
|
|
52
|
-
pluginsOpts: {
|
|
53
|
-
[plugin]: { /* options */ }
|
|
54
|
-
}
|
|
55
|
-
// or
|
|
56
|
-
plugins: [
|
|
57
|
-
editor => plugin(editor, { /* options */ }),
|
|
58
|
-
],
|
|
59
|
-
});
|
|
60
|
-
```
|
|
61
|
-
|
|
62
|
-
## Development
|
|
63
|
-
|
|
64
|
-
Clone the repository
|
|
65
|
-
|
|
66
|
-
```sh
|
|
67
|
-
$ git clone https://github.com/ostendisorg/grapesjs-preset-ostendis-adv.git
|
|
68
|
-
$ cd grapesjs-preset-ostendis
|
|
69
|
-
```
|
|
70
|
-
|
|
71
|
-
Install dependencies (use Node version 18.x)
|
|
72
|
-
|
|
73
|
-
```sh
|
|
74
|
-
$ npm i
|
|
75
|
-
```
|
|
76
|
-
|
|
77
|
-
Start the dev server
|
|
78
|
-
|
|
79
|
-
```sh
|
|
80
|
-
$ npm start
|
|
81
|
-
```
|
|
82
|
-
|
|
83
|
-
Build before the commit. This will also increase the patch level version of the package
|
|
84
|
-
|
|
85
|
-
```sh
|
|
86
|
-
$ npm run build
|
|
87
|
-
```
|
|
88
|
-
|
|
89
|
-
## Test Version (test.html)
|
|
90
|
-
|
|
91
|
-
The file test.html was created for testing purposes. It can be used either with the Ostendis plugin or in its original version (see comments for details).
|
|
92
|
-
|
|
93
|
-
URL: http://localhost:8080/test.html
|
|
94
|
-
|
|
95
|
-
## Release
|
|
96
|
-
|
|
97
|
-
To install publishing dependency
|
|
98
|
-
|
|
99
|
-
```sh
|
|
100
|
-
$ npm install --global np
|
|
101
|
-
```
|
|
102
|
-
|
|
103
|
-
Publish the package
|
|
104
|
-
|
|
105
|
-
```sh
|
|
106
|
-
$ npm run release
|
|
107
|
-
```
|
|
108
|
-
|
|
109
|
-
**ONLY** workes with package:
|
|
110
|
-
https://www.npmjs.com/package/np
|
|
111
|
-
|
|
112
|
-
## License
|
|
113
|
-
|
|
114
|
-
BSD 3-Clause
|
|
115
|
-
|
|
116
|
-
Based on: [GrapesJS Newsletter Preset](http://grapesjs.com/demo-newsletter-editor.html)
|
|
117
|
-
Copyright (c) 2016, [Artur Arseniev](https://github.com/artf)
|
|
118
|
-
All rights reserved.
|
|
1
|
+
# GrapesJS Ostendis Preset
|
|
2
|
+
|
|
3
|
+
This preset configures GrapesJS to be used with some unique features and blocks for the [Ostendis E-Recruiting system](https://www.ostendis.com/en)
|
|
4
|
+
|
|
5
|
+
## Summary
|
|
6
|
+
|
|
7
|
+
TODO
|
|
8
|
+
|
|
9
|
+
## Download
|
|
10
|
+
|
|
11
|
+
Download using one of the options:
|
|
12
|
+
|
|
13
|
+
- `npm i grapesjs-preset-ostendis-adv`
|
|
14
|
+
- Latest release link https://github.com/ostendisorg/grapesjs-preset-ostendis-adv/releases
|
|
15
|
+
|
|
16
|
+
## Usage
|
|
17
|
+
|
|
18
|
+
Directly in the browser
|
|
19
|
+
|
|
20
|
+
```html
|
|
21
|
+
<link href="path/to/grapes.min.css" rel="stylesheet" />
|
|
22
|
+
<link href="path/to/grapesjs-preset-ostendis-adv.css" rel="stylesheet" />
|
|
23
|
+
|
|
24
|
+
<script src="path/to/grapes.min.js"></script>
|
|
25
|
+
<script src="path/to/grapesjs-preset-ostendis-adv.min.js"></script>
|
|
26
|
+
|
|
27
|
+
<div id="gjs"></div>
|
|
28
|
+
|
|
29
|
+
<script type="text/javascript">
|
|
30
|
+
var editor = grapesjs.init({
|
|
31
|
+
container: "#gjs",
|
|
32
|
+
plugins: ["grapesjs-preset-ostendis-adv"],
|
|
33
|
+
pluginsOpts: {
|
|
34
|
+
"grapesjs-preset-ostendis-adv": {
|
|
35
|
+
// options
|
|
36
|
+
},
|
|
37
|
+
},
|
|
38
|
+
});
|
|
39
|
+
</script>
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
Modern javascript
|
|
43
|
+
|
|
44
|
+
```js
|
|
45
|
+
import grapesjs from 'grapesjs';
|
|
46
|
+
import plugin from 'grapesjs-preset-ostendis-adv';
|
|
47
|
+
|
|
48
|
+
const editor = grapesjs.init({
|
|
49
|
+
container : '#gjs',
|
|
50
|
+
// ...
|
|
51
|
+
plugins: [plugin],
|
|
52
|
+
pluginsOpts: {
|
|
53
|
+
[plugin]: { /* options */ }
|
|
54
|
+
}
|
|
55
|
+
// or
|
|
56
|
+
plugins: [
|
|
57
|
+
editor => plugin(editor, { /* options */ }),
|
|
58
|
+
],
|
|
59
|
+
});
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
## Development
|
|
63
|
+
|
|
64
|
+
Clone the repository
|
|
65
|
+
|
|
66
|
+
```sh
|
|
67
|
+
$ git clone https://github.com/ostendisorg/grapesjs-preset-ostendis-adv.git
|
|
68
|
+
$ cd grapesjs-preset-ostendis
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
Install dependencies (use Node version 18.x)
|
|
72
|
+
|
|
73
|
+
```sh
|
|
74
|
+
$ npm i
|
|
75
|
+
```
|
|
76
|
+
|
|
77
|
+
Start the dev server
|
|
78
|
+
|
|
79
|
+
```sh
|
|
80
|
+
$ npm start
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
Build before the commit. This will also increase the patch level version of the package
|
|
84
|
+
|
|
85
|
+
```sh
|
|
86
|
+
$ npm run build
|
|
87
|
+
```
|
|
88
|
+
|
|
89
|
+
## Test Version (test.html)
|
|
90
|
+
|
|
91
|
+
The file test.html was created for testing purposes. It can be used either with the Ostendis plugin or in its original version (see comments for details).
|
|
92
|
+
|
|
93
|
+
URL: http://localhost:8080/test.html
|
|
94
|
+
|
|
95
|
+
## Release
|
|
96
|
+
|
|
97
|
+
To install publishing dependency
|
|
98
|
+
|
|
99
|
+
```sh
|
|
100
|
+
$ npm install --global np
|
|
101
|
+
```
|
|
102
|
+
|
|
103
|
+
Publish the package
|
|
104
|
+
|
|
105
|
+
```sh
|
|
106
|
+
$ npm run release
|
|
107
|
+
```
|
|
108
|
+
|
|
109
|
+
**ONLY** workes with package:
|
|
110
|
+
https://www.npmjs.com/package/np
|
|
111
|
+
|
|
112
|
+
## License
|
|
113
|
+
|
|
114
|
+
BSD 3-Clause
|
|
115
|
+
|
|
116
|
+
Based on: [GrapesJS Newsletter Preset](http://grapesjs.com/demo-newsletter-editor.html)
|
|
117
|
+
Copyright (c) 2016, [Artur Arseniev](https://github.com/artf)
|
|
118
|
+
All rights reserved.
|
|
@@ -24061,7 +24061,7 @@ const plugin = (editor_1, ...args_1) => __awaiter(void 0, [editor_1, ...args_1],
|
|
|
24061
24061
|
showOstToolbar(selected.closest("li"));
|
|
24062
24062
|
}
|
|
24063
24063
|
else if (((_c = selected.getEl()) === null || _c === void 0 ? void 0 : _c.tagName) === "UL") {
|
|
24064
|
-
// UL is selected - show
|
|
24064
|
+
// UL is selected - show toolbar with paste-from-word and standard buttons with SVG icons
|
|
24065
24065
|
const ulToolbar = [
|
|
24066
24066
|
{
|
|
24067
24067
|
attributes: {
|
|
@@ -24071,38 +24071,32 @@ const plugin = (editor_1, ...args_1) => __awaiter(void 0, [editor_1, ...args_1],
|
|
|
24071
24071
|
},
|
|
24072
24072
|
command: "paste-from-word",
|
|
24073
24073
|
},
|
|
24074
|
-
];
|
|
24075
|
-
selected.set({
|
|
24076
|
-
toolbar: ulToolbar,
|
|
24077
|
-
});
|
|
24078
|
-
// Hide OST toolbar for UL elements
|
|
24079
|
-
const ostToolbar = document.querySelector(".gjs-ost-toolbar");
|
|
24080
|
-
ostToolbar === null || ostToolbar === void 0 ? void 0 : ostToolbar.classList.remove("show");
|
|
24081
|
-
}
|
|
24082
|
-
else {
|
|
24083
|
-
// For other elements, show default toolbar without paste button
|
|
24084
|
-
const defaultToolbar = [
|
|
24085
24074
|
{
|
|
24086
|
-
|
|
24075
|
+
label: '<svg viewBox="0 0 24 24"><path fill="currentColor" d="M13,20H11V8L5.5,13.5L4.08,12.08L12,4.16L19.92,12.08L18.5,13.5L13,8V20Z"></path></svg>',
|
|
24087
24076
|
command: "select-parent",
|
|
24088
24077
|
},
|
|
24089
24078
|
{
|
|
24090
|
-
|
|
24079
|
+
label: '<svg viewBox="0 0 24 24"><path fill="currentColor" d="M13,6V11H18V7.75L22.25,12L18,16.25V13H13V18H16.25L12,22.25L7.75,18H11V13H6V16.25L1.75,12L6,7.75V11H11V6H7.75L12,1.75L16.25,6H13Z"></path></svg>',
|
|
24091
24080
|
command: "tlb-move",
|
|
24092
24081
|
},
|
|
24093
24082
|
{
|
|
24094
|
-
|
|
24083
|
+
label: '<svg viewBox="0 0 24 24"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg>',
|
|
24095
24084
|
command: "tlb-clone"
|
|
24096
24085
|
},
|
|
24097
24086
|
{
|
|
24098
|
-
|
|
24087
|
+
label: '<svg viewBox="0 0 24 24"><path fill="currentColor" d="M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z"></path></svg>',
|
|
24099
24088
|
command: "tlb-delete"
|
|
24100
24089
|
},
|
|
24101
24090
|
];
|
|
24102
24091
|
selected.set({
|
|
24103
|
-
toolbar:
|
|
24092
|
+
toolbar: ulToolbar,
|
|
24104
24093
|
});
|
|
24105
|
-
// Hide OST toolbar for
|
|
24094
|
+
// Hide OST toolbar for UL elements
|
|
24095
|
+
const ostToolbar = document.querySelector(".gjs-ost-toolbar");
|
|
24096
|
+
ostToolbar === null || ostToolbar === void 0 ? void 0 : ostToolbar.classList.remove("show");
|
|
24097
|
+
}
|
|
24098
|
+
else {
|
|
24099
|
+
// For other elements, just hide OST toolbar
|
|
24106
24100
|
const ostToolbar = document.querySelector(".gjs-ost-toolbar");
|
|
24107
24101
|
ostToolbar === null || ostToolbar === void 0 ? void 0 : ostToolbar.classList.remove("show");
|
|
24108
24102
|
}
|
|
@@ -24210,58 +24204,6 @@ const plugin = (editor_1, ...args_1) => __awaiter(void 0, [editor_1, ...args_1],
|
|
|
24210
24204
|
ostToolbar.classList.add("show");
|
|
24211
24205
|
}
|
|
24212
24206
|
}
|
|
24213
|
-
// On storage start
|
|
24214
|
-
editor.on("storage:start", () => {
|
|
24215
|
-
// Reset all Components
|
|
24216
|
-
const getAllComponents = (model, result = []) => {
|
|
24217
|
-
result.push(model);
|
|
24218
|
-
model.components().each((mod) => getAllComponents(mod, result));
|
|
24219
|
-
return result;
|
|
24220
|
-
};
|
|
24221
|
-
const allComponents = getAllComponents(editor.DomComponents.getWrapper());
|
|
24222
|
-
allComponents.forEach((compo) => {
|
|
24223
|
-
var _a;
|
|
24224
|
-
const defaultToolbar = [
|
|
24225
|
-
{
|
|
24226
|
-
attributes: { class: "fa-solid fa-arrow-up" },
|
|
24227
|
-
command: "select-parent",
|
|
24228
|
-
},
|
|
24229
|
-
{
|
|
24230
|
-
attributes: { class: "fa-solid fa-arrows-up-down-left-right" },
|
|
24231
|
-
command: "tlb-move",
|
|
24232
|
-
},
|
|
24233
|
-
{
|
|
24234
|
-
attributes: {
|
|
24235
|
-
class: "fa-regular fa-copy"
|
|
24236
|
-
},
|
|
24237
|
-
command: "tlb-clone"
|
|
24238
|
-
},
|
|
24239
|
-
{
|
|
24240
|
-
attributes: {
|
|
24241
|
-
class: "fa-solid fa-trash"
|
|
24242
|
-
},
|
|
24243
|
-
command: "tlb-delete"
|
|
24244
|
-
},
|
|
24245
|
-
];
|
|
24246
|
-
// Add paste button only for UL elements
|
|
24247
|
-
if (compo.getEl && ((_a = compo.getEl()) === null || _a === void 0 ? void 0 : _a.tagName) === "UL") {
|
|
24248
|
-
defaultToolbar.push({
|
|
24249
|
-
attributes: {
|
|
24250
|
-
class: "fa-solid fa-file-word",
|
|
24251
|
-
"data-tooltip": options.t9n.ostToolbarPasteFromWord,
|
|
24252
|
-
"data-tooltip-pos": "bottom"
|
|
24253
|
-
},
|
|
24254
|
-
command: "paste-from-word",
|
|
24255
|
-
});
|
|
24256
|
-
}
|
|
24257
|
-
compo.set({
|
|
24258
|
-
draggable: true,
|
|
24259
|
-
removable: true,
|
|
24260
|
-
copyable: true,
|
|
24261
|
-
toolbar: defaultToolbar,
|
|
24262
|
-
});
|
|
24263
|
-
});
|
|
24264
|
-
});
|
|
24265
24207
|
});
|
|
24266
24208
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (plugin);
|
|
24267
24209
|
|