Skip to content

Commit 03ff817

Browse files
jyyanjyyan
committed
add dist
1 parent 7b15ba6 commit 03ff817

File tree

6 files changed

+759
-2
lines changed

6 files changed

+759
-2
lines changed

‎.gitignore

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
.DS_Store
22
node_modules/
33
npm-debug.log
4-
dist/
5-
es/
64
package-lock.json

‎dist/vue-froala.js

Lines changed: 407 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/vue-froala.min.js

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎es/index.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
"use strict";
2+
3+
var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");
4+
5+
var _Object$defineProperty = require("@babel/runtime-corejs2/core-js/object/define-property");
6+
7+
_Object$defineProperty(exports, "__esModule", {
8+
value: true
9+
});
10+
11+
exports["default"] = void 0;
12+
13+
var _vueFroala = _interopRequireDefault(require("./vue-froala"));
14+
15+
var _default = _vueFroala["default"];
16+
exports["default"] = _default;

‎es/main.js

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
"use strict";
2+
3+
var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");
4+
5+
require("froala-editor/css/froala_editor.pkgd.min.css");
6+
7+
require("froala-editor/css/froala_style.min.css");
8+
9+
require("froala-editor/js/plugins.pkgd.min.js");
10+
11+
var _App = _interopRequireDefault(require("./examples/App"));
12+
13+
var _vue = _interopRequireDefault(require("vue"));
14+
15+
var _src = _interopRequireDefault(require("src"));
16+
17+
// The Vue build version to load with the `import` command
18+
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
19+
_vue["default"].use(_src["default"]);
20+
21+
new _vue["default"]({
22+
render: function render(h) {
23+
return h(_App["default"]);
24+
}
25+
}).$mount('#app');

‎es/vue-froala.js

Lines changed: 304 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,304 @@
1+
"use strict";
2+
3+
var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");
4+
5+
var _Object$defineProperty = require("@babel/runtime-corejs2/core-js/object/define-property");
6+
7+
_Object$defineProperty(exports, "__esModule", {
8+
value: true
9+
});
10+
11+
exports["default"] = void 0;
12+
13+
var _stringify = _interopRequireDefault(require("@babel/runtime-corejs2/core-js/json/stringify"));
14+
15+
var _froalaEditor = _interopRequireDefault(require("froala-editor"));
16+
17+
var _default = function _default(Vue) {
18+
var Options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
19+
var froalaEditorFunctionality = {
20+
props: ['tag', 'value', 'config', 'onManualControllerReady'],
21+
watch: {
22+
value: function value() {
23+
this.model = this.value;
24+
this.updateValue();
25+
}
26+
},
27+
render: function render(createElement) {
28+
return createElement(this.currentTag, [this.$slots["default"]]);
29+
},
30+
created: function created() {
31+
this.currentTag = this.tag || this.currentTag;
32+
this.model = this.value;
33+
},
34+
// After first time render.
35+
mounted: function mounted() {
36+
if (this.SPECIAL_TAGS.indexOf(this.currentTag) != -1) {
37+
this.hasSpecialTag = true;
38+
}
39+
40+
if (this.onManualControllerReady) {
41+
this.generateManualController();
42+
} else {
43+
this.createEditor();
44+
}
45+
},
46+
beforeDestroy: function beforeDestroy() {
47+
this.destroyEditor();
48+
},
49+
data: function data() {
50+
return {
51+
initEvents: [],
52+
// Tag on which the editor is initialized.
53+
currentTag: 'div',
54+
// Editor element.
55+
_editor: null,
56+
// Current config.
57+
currentConfig: null,
58+
// Editor options config
59+
defaultConfig: {
60+
immediateVueModelUpdate: false,
61+
vueIgnoreAttrs: null
62+
},
63+
editorInitialized: false,
64+
SPECIAL_TAGS: ['img', 'button', 'input', 'a'],
65+
INNER_HTML_ATTR: 'innerHTML',
66+
hasSpecialTag: false,
67+
model: null,
68+
oldModel: null
69+
};
70+
},
71+
methods: {
72+
updateValue: function updateValue() {
73+
if ((0, _stringify["default"])(this.oldModel) == (0, _stringify["default"])(this.model)) {
74+
return;
75+
}
76+
77+
this.setContent();
78+
},
79+
createEditor: function createEditor() {
80+
if (this.editorInitialized) {
81+
return;
82+
}
83+
84+
this.currentConfig = this.config || this.defaultConfig;
85+
this.setContent(true); // Bind editor events.
86+
87+
this.registerEvents();
88+
this.initListeners();
89+
this._editor = new _froalaEditor["default"](this.$el, this.currentConfig);
90+
this.editorInitialized = true;
91+
},
92+
setContent: function setContent(firstTime) {
93+
if (!this.editorInitialized && !firstTime) {
94+
return;
95+
}
96+
97+
if (this.model || this.model == '') {
98+
this.oldModel = this.model;
99+
100+
if (this.hasSpecialTag) {
101+
this.setSpecialTagContent();
102+
} else {
103+
this.setNormalTagContent(firstTime);
104+
}
105+
}
106+
},
107+
setNormalTagContent: function setNormalTagContent(firstTime) {
108+
var self = this;
109+
110+
function htmlSet() {
111+
if (self._editor === null) {
112+
self.createEditor();
113+
}
114+
115+
self._editor.html.set(self.model || ''); //This will reset the undo stack everytime the model changes externally. Can we fix this?
116+
117+
118+
self._editor.undo.saveStep();
119+
120+
self._editor.undo.reset();
121+
}
122+
123+
if (firstTime) {
124+
this.registerEvent('initialized', function () {
125+
htmlSet();
126+
});
127+
} else {
128+
htmlSet();
129+
}
130+
},
131+
setSpecialTagContent: function setSpecialTagContent() {
132+
var tags = this.model; // add tags on element
133+
134+
if (tags) {
135+
for (var attr in tags) {
136+
if (tags.hasOwnProperty(attr) && attr != this.INNER_HTML_ATTR) {
137+
this.$el.setAttribute(attr, tags[attr]);
138+
}
139+
}
140+
141+
if (tags.hasOwnProperty(this.INNER_HTML_ATTR)) {
142+
this.$el.innerHTML = tags[this.INNER_HTML_ATTR];
143+
}
144+
}
145+
},
146+
destroyEditor: function destroyEditor() {
147+
if (this._editor) {
148+
this._editor.destroy();
149+
150+
this.editorInitialized = false;
151+
this._editor = null;
152+
}
153+
},
154+
getEditor: function getEditor() {
155+
return this._editor;
156+
},
157+
generateManualController: function generateManualController() {
158+
var controls = {
159+
initialize: this.createEditor,
160+
destroy: this.destroyEditor,
161+
getEditor: this.getEditor
162+
};
163+
this.onManualControllerReady(controls);
164+
},
165+
updateModel: function updateModel() {
166+
var modelContent = '';
167+
168+
if (this.hasSpecialTag) {
169+
var attributeNodes = this.$el[0].attributes;
170+
var attrs = {};
171+
172+
for (var i = 0; i < attributeNodes.length; i++) {
173+
var attrName = attributeNodes[i].name;
174+
175+
if (this.currentConfig.vueIgnoreAttrs && this.currentConfig.vueIgnoreAttrs.indexOf(attrName) != -1) {
176+
continue;
177+
}
178+
179+
attrs[attrName] = attributeNodes[i].value;
180+
}
181+
182+
if (this.$el[0].innerHTML) {
183+
attrs[this.INNER_HTML_ATTR] = this.$el[0].innerHTML;
184+
}
185+
186+
modelContent = attrs;
187+
} else {
188+
var returnedHtml = this._editor.html.get();
189+
190+
if (typeof returnedHtml === 'string') {
191+
modelContent = returnedHtml;
192+
}
193+
}
194+
195+
this.oldModel = modelContent;
196+
this.$emit('input', modelContent);
197+
},
198+
initListeners: function initListeners() {
199+
var self = this;
200+
this.registerEvent('initialized', function () {
201+
if (self._editor.events) {
202+
// bind contentChange and keyup event to froalaModel
203+
self._editor.events.on('contentChanged', function () {
204+
self.updateModel();
205+
});
206+
207+
if (self.currentConfig.immediateVueModelUpdate) {
208+
self._editor.events.on('keyup', function () {
209+
self.updateModel();
210+
});
211+
}
212+
}
213+
});
214+
},
215+
// register event on editor element
216+
registerEvent: function registerEvent(eventName, callback) {
217+
if (!eventName || !callback) {
218+
return;
219+
} // Initialized event.
220+
221+
222+
if (eventName == 'initialized') {
223+
this.initEvents.push(callback);
224+
} else {
225+
if (!this.currentConfig.events) {
226+
this.currentConfig.events = {};
227+
}
228+
229+
this.currentConfig.events[eventName] = callback;
230+
}
231+
},
232+
registerEvents: function registerEvents() {
233+
// Handle initialized on its own.
234+
this.registerInitialized(); // Get current events.
235+
236+
var events = this.currentConfig.events;
237+
238+
if (!events) {
239+
return;
240+
}
241+
242+
for (var event in events) {
243+
if (events.hasOwnProperty(event) && event != 'initialized') {
244+
this.registerEvent(event, events[event]);
245+
}
246+
}
247+
},
248+
registerInitialized: function registerInitialized() {
249+
var _this = this;
250+
251+
// Bind initialized.
252+
if (!this.currentConfig.events) {
253+
this.currentConfig.events = {};
254+
} // Set original initialized event.
255+
256+
257+
if (this.currentConfig.events.initialized) {
258+
this.registerEvent('initialized', this.currentConfig.events.initialized);
259+
} // Bind initialized event.
260+
261+
262+
this.currentConfig.events.initialized = function () {
263+
for (var i = 0; i < _this.initEvents.length; i++) {
264+
_this.initEvents[i].call(_this._editor);
265+
}
266+
};
267+
}
268+
}
269+
};
270+
Vue.component('Froala', froalaEditorFunctionality);
271+
var froalaViewFunctionality = {
272+
props: ['tag', 'value'],
273+
watch: {
274+
value: function value(newValue) {
275+
this._element.innerHTML = newValue;
276+
}
277+
},
278+
created: function created() {
279+
this.currentTag = this.tag || this.currentTag;
280+
},
281+
render: function render(createElement) {
282+
return createElement(this.currentTag, {
283+
"class": 'fr-view'
284+
});
285+
},
286+
// After first time render.
287+
mounted: function mounted() {
288+
this._element = this.$el;
289+
290+
if (this.value) {
291+
this._element.innerHTML = this.value;
292+
}
293+
},
294+
data: function data() {
295+
return {
296+
currentTag: 'div',
297+
_element: null
298+
};
299+
}
300+
};
301+
Vue.component('FroalaView', froalaViewFunctionality);
302+
};
303+
304+
exports["default"] = _default;

0 commit comments

Comments
 (0)