mirror of https://github.com/artf/grapesjs.git
114 changed files with 4303 additions and 1806 deletions
File diff suppressed because one or more lines are too long
@ -1,26 +1,24 @@ |
|||
module.exports = { |
|||
|
|||
run(editor, sender) { |
|||
var config = editor.Config; |
|||
var pfx = config.stylePrefix; |
|||
var bm = editor.BlockManager; |
|||
var panelC; |
|||
if(!this.blocks){ |
|||
this.blocks = $('<div/>').get(0); |
|||
this.blocks.appendChild(bm.render()); |
|||
var panels = editor.Panels; |
|||
if(!panels.getPanel('views-container')) |
|||
panelC = panels.addPanel({id: 'views-container'}); |
|||
else |
|||
panelC = panels.getPanel('views-container'); |
|||
panelC.set('appendContent', this.blocks).trigger('change:appendContent'); |
|||
const bm = editor.BlockManager; |
|||
const pn = editor.Panels; |
|||
|
|||
if (!this.blocks) { |
|||
bm.render(); |
|||
const id = 'views-container'; |
|||
const blocks = document.createElement('div'); |
|||
const panels = pn.getPanel(id) || pn.addPanel({id}); |
|||
blocks.appendChild(bm.getContainer()); |
|||
panels.set('appendContent', blocks).trigger('change:appendContent'); |
|||
this.blocks = blocks; |
|||
} |
|||
|
|||
this.blocks.style.display = 'block'; |
|||
}, |
|||
|
|||
stop() { |
|||
if(this.blocks) |
|||
this.blocks.style.display = 'none'; |
|||
const blocks = this.blocks; |
|||
blocks && (blocks.style.display = 'none'); |
|||
} |
|||
}; |
|||
|
|||
File diff suppressed because it is too large
@ -0,0 +1,303 @@ |
|||
module.exports = ({$, Backbone}) => { |
|||
if (Backbone) { |
|||
const ViewProt = Backbone.View.prototype; |
|||
const eventNsMap = {}; |
|||
ViewProt.eventNsMap = eventNsMap; |
|||
|
|||
ViewProt.delegate = function(eventName, selector, listener) { |
|||
const vid = '.delegateEvents' + this.cid; |
|||
this.$el.on(eventName, selector, listener); |
|||
//return this;
|
|||
let eventMap = eventNsMap[vid]; |
|||
|
|||
if (!eventMap) { |
|||
eventMap = []; |
|||
eventNsMap[vid] = eventMap; |
|||
} |
|||
|
|||
eventMap.push({eventName, selector, listener}); |
|||
return this; |
|||
}; |
|||
|
|||
ViewProt.undelegateEvents = function() { |
|||
const vid = '.delegateEvents' + this.cid; |
|||
if (this.$el) { |
|||
//this.$el.off(); return this;
|
|||
let eventMap = eventNsMap[vid]; |
|||
|
|||
if (eventMap) { |
|||
eventMap.forEach(({eventName, selector, listener}) => { |
|||
this.$el.off(eventName); |
|||
}); |
|||
} |
|||
} |
|||
return this; |
|||
}; |
|||
|
|||
ViewProt.undelegate = function(ev, sel, list) { |
|||
const vid = '.delegateEvents' + this.cid; |
|||
//this.$el.off(ev, sel, list); return this;
|
|||
let eventMap = eventNsMap[vid]; |
|||
|
|||
if (eventMap) { |
|||
eventMap.forEach(({eventName, selector, listener}) => { |
|||
if (eventName == ev && selector == sel) { |
|||
this.$el.off(eventName); |
|||
} |
|||
}); |
|||
} |
|||
|
|||
return this; |
|||
}; |
|||
} |
|||
|
|||
if ($) { |
|||
const fn = $.fn; |
|||
|
|||
const splitNamespace = function(name) { |
|||
const namespaceArray = name.split('.') |
|||
return ( name.indexOf('.') !== 0 ? [namespaceArray[0], namespaceArray.slice(1)] : [null, namespaceArray] ); |
|||
} |
|||
/* |
|||
const CashEvent = function(node, eventName, namespaces, delegate, originalCallback, runOnce) { |
|||
|
|||
const eventCache = getData(node,'_cashEvents') || setData(node, '_cashEvents', {}); |
|||
const remove = function(c, namespace){ |
|||
if ( c && originalCallback !== c ) { return; } |
|||
if ( namespace && this.namespaces.indexOf(namespace) < 0 ) { return; } |
|||
node.removeEventListener(eventName, callback); |
|||
}; |
|||
const callback = function(e) { |
|||
var t = this; |
|||
if (delegate) { |
|||
t = e.target; |
|||
|
|||
while (t && !matches(t, delegate)) { |
|||
if (t === this) { |
|||
return (t = false); |
|||
} |
|||
t = t.parentNode; |
|||
} |
|||
} |
|||
|
|||
if (t) { |
|||
originalCallback.call(t, e, e.data); |
|||
if ( runOnce ) { remove(); } |
|||
} |
|||
|
|||
}; |
|||
|
|||
this.remove = remove; |
|||
this.namespaces = namespaces; |
|||
|
|||
node.addEventListener(eventName, callback); |
|||
|
|||
eventCache[eventName] = eventCache[eventName] || []; |
|||
eventCache[eventName].push(this); |
|||
|
|||
return this; |
|||
} |
|||
*/ |
|||
|
|||
const on = $.prototype.on; |
|||
const off = $.prototype.off; |
|||
const trigger = $.prototype.trigger; |
|||
const offset = $.prototype.offset; |
|||
const getEvents = (eventName) => eventName.split(/[,\s]+/g); |
|||
const getNamespaces = (eventName) => eventName.split('.'); |
|||
|
|||
fn.on = function(eventName, delegate, callback, runOnce) { |
|||
|
|||
if (typeof eventName == 'string') { |
|||
const events = getEvents(eventName); |
|||
|
|||
if (events.length == 1) { |
|||
eventName = events[0]; |
|||
let namespaces = getNamespaces(eventName); |
|||
|
|||
if (eventName.indexOf('.') !== 0) { |
|||
eventName = namespaces[0]; |
|||
} |
|||
|
|||
namespaces = namespaces.slice(1); |
|||
|
|||
if (namespaces.length) { |
|||
//console.log('Found event with namespaces', namespaces, eventName, delegate, this);
|
|||
const cashNs = this.data('_cashNs') || []; |
|||
// cashNs[namespace]
|
|||
this.data('_cashNs', namespaces); // for each ns need to store '.store' => eventName, delegate, callback
|
|||
} |
|||
|
|||
return on.call(this, eventName, delegate, callback, runOnce); |
|||
} else { |
|||
events.forEach((eventName) => |
|||
this.on(eventName, delegate, callback, runOnce)); |
|||
return this; |
|||
} |
|||
} else { |
|||
return on.call(this, eventName, delegate, callback, runOnce) |
|||
} |
|||
} |
|||
|
|||
fn.off = function(eventName, callback) { |
|||
if (typeof eventName == 'string') { |
|||
const events = getEvents(eventName); |
|||
|
|||
if (events.length == 1) { |
|||
eventName = events[0]; |
|||
let namespaces = getNamespaces(eventName); |
|||
|
|||
if (eventName.indexOf('.') !== 0) { |
|||
eventName = namespaces[0]; |
|||
} |
|||
|
|||
namespaces = namespaces.slice(1); |
|||
|
|||
if (namespaces.length) { |
|||
// Have to off only with the same namespace
|
|||
} |
|||
|
|||
return off.call(this, eventName, callback); |
|||
} else { |
|||
events.forEach((eventName) => this.off(eventName, callback)); |
|||
return this; |
|||
} |
|||
} else { |
|||
return off.call(this, eventName, callback); |
|||
} |
|||
} |
|||
|
|||
fn.trigger = function(eventName, data) { |
|||
if (eventName instanceof $.Event) { |
|||
return this.trigger(eventName.type, data); |
|||
} |
|||
|
|||
if (typeof eventName == 'string') { |
|||
const events = getEvents(eventName); |
|||
|
|||
if (events.length == 1) { |
|||
eventName = events[0]; |
|||
let namespaces = getNamespaces(eventName); |
|||
|
|||
if (eventName.indexOf('.') !== 0) { |
|||
eventName = namespaces[0]; |
|||
} |
|||
|
|||
namespaces = namespaces.slice(1); |
|||
|
|||
if (namespaces.length) { |
|||
// have to trigger with same namespaces and eventName
|
|||
} |
|||
|
|||
return trigger.call(this, eventName, data); |
|||
} else { |
|||
events.forEach((eventName) => this.trigger(eventName, data)); |
|||
return this; |
|||
} |
|||
} else { |
|||
return trigger.call(this, eventName, data); |
|||
} |
|||
} |
|||
|
|||
fn.hide = function() { |
|||
return this.css('display', 'none'); |
|||
} |
|||
|
|||
fn.show = function() { |
|||
return this.css('display', 'block'); |
|||
} |
|||
|
|||
fn.focus = function() { |
|||
const el = this.get(0); |
|||
el && el.focus(); |
|||
return this; |
|||
} |
|||
|
|||
// For spectrum compatibility
|
|||
fn.bind = function(ev, h) { |
|||
return this.on(ev, h); |
|||
} |
|||
|
|||
fn.unbind = function(ev, h) { |
|||
return this.off(ev, h); |
|||
} |
|||
|
|||
fn.click = function(h) { |
|||
return h ? this.on('click', h) : this.trigger('click'); |
|||
} |
|||
|
|||
fn.change = function(h) { |
|||
return h ? this.on('change', h) : this.trigger('change'); |
|||
} |
|||
|
|||
fn.keydown = function(h) { |
|||
return h ? this.on('keydown', h) : this.trigger('keydown'); |
|||
} |
|||
|
|||
fn.delegate = function(selector, events, data, handler) { |
|||
if (!handler) { |
|||
handler = data; |
|||
} |
|||
|
|||
return this.on(events, selector, function(e) { |
|||
e.data = data; |
|||
handler(e); |
|||
}); |
|||
} |
|||
|
|||
fn.scrollLeft = function() { |
|||
let el = this.get(0); |
|||
el = el.nodeType == 9 ? el.defaultView : el; |
|||
let win = el instanceof Window ? el : null; |
|||
return win ? win.pageXOffset : el.scrollLeft || 0; |
|||
} |
|||
|
|||
fn.scrollTop = function() { |
|||
let el = this.get(0); |
|||
el = el.nodeType == 9 ? el.defaultView : el; |
|||
let win = el instanceof Window ? el : null; |
|||
return win ? win.pageYOffset : el.scrollTop || 0; |
|||
} |
|||
|
|||
fn.offset = function(coords) { |
|||
let top, left; |
|||
|
|||
if (coords) { |
|||
top = coords.top; |
|||
left = coords.left; |
|||
} |
|||
|
|||
if (typeof top != 'undefined') { |
|||
this.css('top', `${top}px`); |
|||
} |
|||
if (typeof left != 'undefined') { |
|||
this.css('left', `${left}px`); |
|||
} |
|||
|
|||
return offset.call(this); |
|||
}; |
|||
|
|||
$.map = function(items, clb) { |
|||
const ar = []; |
|||
|
|||
for (var i = 0; i < items.length; i++) { |
|||
ar.push(clb(items[i], i)); |
|||
} |
|||
|
|||
return ar; |
|||
} |
|||
|
|||
$.inArray = function(val, arr) { |
|||
return arr.indexOf(val); |
|||
} |
|||
|
|||
$.Event = function(src, props) { |
|||
if (!(this instanceof $.Event) ) { |
|||
return new $.Event(src, props); |
|||
} |
|||
|
|||
this.type = src; |
|||
this.isDefaultPrevented = () => false; |
|||
} |
|||
} |
|||
} |
|||
@ -0,0 +1,19 @@ |
|||
const on = (el, ev, fn) => { |
|||
ev = ev.split(/\s+/); |
|||
el = el instanceof Array ? el : [el]; |
|||
|
|||
for (let i = 0; i < ev.length; ++i) { |
|||
el.forEach(elem => elem.addEventListener(ev[i], fn)); |
|||
} |
|||
} |
|||
|
|||
const off = (el, ev, fn) => { |
|||
ev = ev.split(/\s+/); |
|||
el = el instanceof Array ? el : [el]; |
|||
|
|||
for (let i = 0; i < ev.length; ++i) { |
|||
el.forEach(elem => elem.removeEventListener(ev[i], fn)); |
|||
} |
|||
} |
|||
|
|||
export {on, off} |
|||
Some files were not shown because too many files changed in this diff
Loading…
Reference in new issue