self.createLoadingWrapper = function(eID)
{
var wrapDiv = element('div', {id: eID + "-wrap", class: "colObject"});
var loadingDiv = element('div', {id: eID + "-object", class: "loading innerObject"});
var bottomRow = element('div', {id: eID + "-bot", style : "height: " + self.bottomElementSize + "px;", class: "row mOR border"});
//create a like button with an inner like div -- content == like graphic
var likeButton = element('div', {id: eID + "-like", class: "col-auto pOR border"}, element('div', 'like'));
var publishButton = element('div', {id: eID + "-publish", class: "col-auto pOR border"}, element('div', 'pub'));
//create some managers...
var likeManager = events(likeButton, self);
var pubManager = events(publishButton, self);
//bind click events to self.like and self.publish callbacks
likeManager.bind('click', 'likeElement');
pubManager.bind('click', 'publishElement');
bottomRow.appendChild(likeButton);
bottomRow.appendChild(publishButton);
wrapDiv.appendChild(loadingDiv);
wrapDiv.appendChild(bottomRow);
//send it back all done up
return {full: wrapDiv, object: loadingDiv};
}
function Scrollbar (pane) {
this.pane = pane;
this.pane.el.appendChild(this.el);
this.dragging = false;
this.enter = false;
this.shown = false;
// hovering
this.paneEvents = events(this.pane.el, this);
this.paneEvents.bind('mouseenter', 'mouseenter');
this.paneEvents.bind('mouseleave', 'mouseleave');
// dragging
this.events = events(this.el, this);
this.events.bind('mousedown', 'mousedown');
// scrolling
this.innerEvents = events(this.pane.inner, this);
this.innerEvents.bind('scroll', 'scroll');
this.innerEvents.bind('mousewheel', 'mousewheel');
// show
var initialDisplay = this.pane.options.initialDisplay;
if (initialDisplay !== false) {
this.show();
if (this.pane.autoHide) {
this.hiding = setTimeout(bind(this, 'hide'), parseInt(initialDisplay, 10) || 3000);
}
}
}
fn.events = function() {
this.windowEvents = events(window, this);
this.windowEvents.bind('resize', 'onResize');
this.inputEvents = events(this.input, this);
this.inputEvents.bind('keyup', 'onInputChange');
return this;
};
constructor(el) {
this.el = el
this.events = events(el, this)
this.events.bind('mousedown')
this.events.bind('mousemove')
this.events.bind('mouseup')
this.docEvents = events(document, this)
this.docEvents.bind('mouseup')
}
var CanvasView = exports.CanvasView = function(wrapper, context){
this.context = context;
var canvas = this.canvas = document.createElement('canvas');
var dr = this.devicePixelRatio = window.devicePixelRatio;
canvas.width = constants.CONTAINER_WIDTH * dr;
canvas.height = constants.CONTAINER_HEIGHT * dr;
canvas.style.width = constants.CONTAINER_WIDTH + 'px';
canvas.style.height = constants.CONTAINER_HEIGHT + 'px';
wrapper.appendChild(canvas);
// If Canvas isn't supported, let it be known...
if (!this.canvas.getContext){
var noCanvas = document.createElement('div');
noCanvas.style.color = 'red';
noCanvas.innerHTML = 'Your browser does not support this technology. Please upgrade.';
wrapper.appendChild(noCanvas);
return;
}
this.scale = window.devicePixelRatio || 1;
this.originX = 0;
this.originY = 0;
// Canvas events
this.events = events(canvas, this);
this.events.bind('mousemove');
this.events.bind('mousedown');
this.events.bind('touchmove', 'onmousemove');
this.events.bind('touchstart', 'onmousedown');
this.events.bind('mousewheel');
var self = this;
window.onscroll = function(e){
self.getOffset();
}
pinch(canvas, function(e){
var x = e.x * self.devicePixelRatio;
var y = e.y * self.devicePixelRatio;
self.emit('pinch', x, y, e.scale);
});
mouseleave(canvas, function(e){
self.emit('mouseleave');
});
// Controller events
this.controllerEvents = events(this.context, this);
this.controllerEvents.bind('hoverNode', 'onHover');
this.controllerEvents.bind('hoverOutNode', 'onHover');
this.controllerEvents.bind('containerwidth');
this.controllerEvents.bind('loading');
this.controllerEvents.bind('containerheight');
this.setContextConstants();
};
Swipe.prototype.bind = function(){
this.events = events(this.child, this);
this.events.bind('mousedown', 'ontouchstart');
this.events.bind('mousemove', 'ontouchmove');
this.events.bind('touchstart');
this.events.bind('touchmove');
this.docEvents = events(document, this);
this.docEvents.bind('mouseup', 'ontouchend');
this.docEvents.bind('touchend');
};
function RedactPopover(el){
if (!(this instanceof RedactPopover)) return new RedactPopover(el);
this.options = {};
this.tip = new Tip('');
this.el = this.tip.inner;
this.classes = this.tip.classes;
this.classes.add('redact-popover');
this.events = events(this.el, this);
this.winEvents = events(window, this);
this.editor = el;
this.bind();
}
function Select(){
if (!(this instanceof Select)) return new Select;
this.el = tpl.cloneNode(true);
this.classes = classes(this.el);
this.opts = query('.select-options', this.el);
this.dropdown = query('.select-dropdown', this.el);
this.input = query('.select-input', this.el);
this.inputEvents = events(this.input, this);
this.docEvents = events(document, this);
this.events = events(this.el, this);
this._selected = [];
this.options = {};
this.bind();
}
function Tip(content, options) {
options = options || {};
if (!(this instanceof Tip)) return tip(content, options);
Emitter.call(this);
this.classname = '';
this.delay = options.delay || 300;
this.el = html.cloneNode(true);
this.events = events(this.el, this);
this.winEvents = events(window, this);
this.classes = classes(this.el);
this.inner = query('.tip-inner', this.el);
this.message(content);
this.position('top');
if (Tip.effect) this.effect(Tip.effect);
}
function ProposalArticle (proposal) {
if (!(this instanceof ProposalArticle)) {
return new ProposalArticle(proposal);
};
this.proposal = proposal;
this.clauses = proposal.clauses.sort(function(a, b) {
var sort = a.order - b.order;
sort = sort > 0 ? 1 : -1;
return sort;
})
this.clausesContent = this.clauses.map(function(c) {
if (c.text) return (c.clauseName ? c.clauseName + ': ' : '') + c.text;
});
var baseUrl = config.protocol + "://" + config.host + (config.publicPort ? (":" + config.publicPort) : "");
this.el = render.dom(article, {
proposal: proposal,
clauses: this.clauses,
clausesContent: this.clausesContent,
baseUrl: baseUrl,
truncate: truncate,
config: config
});
this.events = events(this.el, this);
this.participants = new Participants(proposal.participants || []);
this.participants.render(o('.participants', this.el));
this.participants.fetch();
this.switchOn();
}
function Sortable(el){
if (!(this instanceof Sortable)) return new Sortable(el);
if (!el) throw new TypeError('sortable(): expects an element');
this.events = events(el, this);
this.els = el.children;
this.el = el;
}
Tip.prototype.show = function(el){
if ('string' == typeof el) el = query(el);
// show it
this.target = el;
document.body.appendChild(this.el);
this.classes.add('tip-' + this._position.replace(/\s+/g, '-'));
this.classes.remove('tip-hide');
// x,y
if ('number' == typeof el) {
var x = arguments[0];
var y = arguments[1];
this.emit('show');
css(this.el, {
top: y,
left: x
});
return this;
}
// el
this.reposition();
this.emit('show', this.target);
if (!this.winEvents) {
this.winEvents = events(window, this);
this.winEvents.bind('resize', 'reposition');
this.winEvents.bind('scroll', 'reposition');
}
return this;
};
function PinView(model) {
this.el = domify(html);
this.model = model;
// Assigning featured style to featured pins only
if (this.model.featuredStatus === true) {
this.el.className = 'pin featured';
} else {
this.el.className = 'pin';
}
loadComments(this.el, this.model);
reactive(this.el, this.model);
this.thumbnail = this.el.querySelector('img');
this.thumbnail.addEventListener('load', this.onloaded.bind(this));
this.commentField = this.el.querySelector('.commentField');
this.commentsContainer = this.el.querySelector('.comment-box');
this.pinControlContainer = this.el.querySelector('.pin-controls');
this.events = events(this.el, this);
this.events.bind('click [data-js-action=showCommentInput]', 'onShowCommentInput');
this.events.bind('click [data-js-action=hideCommentInput]', 'onHideCommentInput');
this.events.bind('click [data-js-action=addComment]', 'onAddComment');
this.events.bind('click [data-js-action=featurePin]', 'onFeaturePin');
};
Project.get(id, function (project) {
var html = minstache(template, project.attrs);
var el = this.el = domify(html);
this.events = events(el, this);
context.parent.appendChild(el);
this.events.bind('click [type="submit"]', 'post');
this.initUsers(id);
}.bind(this));
function Video(el){
this.events = events(el, this);
this.events.bind('canplaythrough');
this.events.bind('progress');
this.events.bind('timeupdate');
this.events.bind('ended');
this.el = el;
}
function Input(el) {
if (!(this instanceof Input)) return new Input(el);
this.classes = classes(el);
this.events = events(el, this);
this.events.bind('keydown');
this.events.bind('keyup');
this.el = el;
}
function View(el){
Emitter.call(this);
this.$el = dom(el);
this.el = this.$el[0];
this.events = events(this.el, this);
this.classes = classes(this.el);
this._bound = {};
}
Tip.prototype.attach = function(el){
this.target = el;
this.handleEvents = events(el, this);
this.handleEvents.bind('mouseover');
this.handleEvents.bind('mouseout');
this.handleEvents.bind('touchstart', 'showOnTouch');
return this;
};
function Dropload(el,selector) {
if (!(this instanceof Dropload)) return new Dropload(el);
Emitter.call(this);
this.el = el;
this.selector = selector || '';
this.events = events(el, this);
this.ignored = {};
}
function Overlay(el) {
if (!(this instanceof Overlay)) return new Overlay(el)
var root = this.el = create('div', 'overlay')
body.appendChild(root)
var close = create('a', 'overlay-close')
close.innerHTML = '×'
close.setAttribute('href', '#')
root.appendChild(close)
var container = create('div', 'overlay-container')
container.appendChild(el)
root.appendChild(container)
this.events = events(root, this)
this.events.bind('click a.overlay-close', 'hide')
this.docEvents = events(document, this)
this.docEvents.bind('keyup')
classes(body).add('overlay-active')
}
AddSourceView.prototype.bind = function(){
this.events = events(this.$el.get(0), this);
this.events.bind('submit #add-directory', 'addSource');
this.events.bind('click a.browse', 'browse');
this.events.bind('click .back', 'back');
this.listenTo(this.currentDirectory, 'directoryListing', this.renderChildren);
this.listenTo(this.currentDirectory, 'currentDirectory', this.updateForm);
};
Tip.prototype.attach = function(el){
var self = this;
this.target = el;
this.handleEvents = events(el, this);
this.handleEvents.bind('mouseover');
this.handleEvents.bind('mouseout');
return this;
};
YouTubeCute.prototype.showPlaceholder = function(){
this.events = events(this.el, this);
this.events.bind('click', 'playVideo');
var id = getId(this.src);
var url = 'http://img.youtube.com/vi/'+ id +'/hqdefault.jpg'
this.el.style['background-image'] = 'url("'+ url +'")';
this.target.appendChild(this.el);
return this;
};
Powerange.prototype.bindEvents = function () {
this.handle = this.slider.querySelector('.range-handle');
this.touch = events(this.handle, this);
this.touch.bind('touchstart', 'onmousedown');
this.touch.bind('touchmove', 'onmousemove');
this.touch.bind('touchend', 'onmouseup');
this.mouse = mouse(this.handle, this);
this.mouse.bind();
};
MindMap.prototype.bind = function(){
this.viewEvents = events(this.view, this);
this.viewEvents.bind('mousedown');
this.viewEvents.bind('mousemove');
this.viewEvents.bind('mouseup');
this.viewEvents.bind('mousewheel', 'onzoom');
this.viewEvents.bind('pinch');
this.viewEvents.bind('mouseleave');
};
constructor(opts) {
super()
this.opts = opts
this.root = document.createElement('div')
document.body.appendChild(this.root)
this.events = events(this.root, this);
this.events.bind('click .cancel', 'cancel');
this.events.bind('click .confirm', 'confirm');
}
Sketch.prototype.bind = function(){
this.events = events(this.canvas, this);
this.events.bind('mousedown');
this.events.bind('mousemove');
this.events.bind('mouseup');
this.events.bind('touchstart', 'onmousedown');
this.events.bind('touchmove', 'onmousemove');
this.events.bind('touchend', 'onmouseup');
};
Switchery.prototype.create = function() {
this.switcher = document.createElement('span');
this.jack = document.createElement('small');
this.switcher.appendChild(this.jack);
this.switcher.className = this.options.className;
this.events = events(this.switcher, this);
return this.switcher;
};
function Placeholder(el, str, editor){
if (!(this instanceof Placeholder)) return new Placeholder(el, str, editor);
this.classes = classes(el);
this.events = events(editor || el, this);
this.editor = editor;
this.el = el;
this.str = str;
this.place();
}
function ModalView(model) {
this.model = model;
this.link = createStyle();
this.el = createEl();
this.events = events(this.el, this);
this.events.bind('click [data-js-action=select]', 'onSelect');
this.events.bind('click [data-js-action=cancel]', 'onCancel');
};