Mercurial > hg > OKFNAnnotator
view annotator_files/lib/editor.js @ 4:6979313586cf
new version of annotator.
author | casties |
---|---|
date | Mon, 27 Aug 2012 19:05:38 +0200 |
parents | 6356e78ccf5c |
children |
line wrap: on
line source
// Generated by CoffeeScript 1.3.3 var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; }, __hasProp = {}.hasOwnProperty, __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }; Annotator.Editor = (function(_super) { __extends(Editor, _super); Editor.prototype.events = { "form submit": "submit", ".annotator-save click": "submit", ".annotator-cancel click": "hide", ".annotator-cancel mouseover": "onCancelButtonMouseover", "textarea keydown": "processKeypress" }; Editor.prototype.classes = { hide: 'annotator-hide', focus: 'annotator-focus' }; Editor.prototype.html = "<div class=\"annotator-outer annotator-editor\">\n <form class=\"annotator-widget\">\n <ul class=\"annotator-listing\"></ul>\n <div class=\"annotator-controls\">\n <a href=\"#cancel\" class=\"annotator-cancel\">" + _t('Cancel') + "</a>\n<a href=\"#save\" class=\"annotator-save annotator-focus\">" + _t('Save') + "</a>\n </div>\n </form>\n</div>"; Editor.prototype.options = {}; function Editor(options) { this.onCancelButtonMouseover = __bind(this.onCancelButtonMouseover, this); this.processKeypress = __bind(this.processKeypress, this); this.submit = __bind(this.submit, this); this.load = __bind(this.load, this); this.hide = __bind(this.hide, this); this.show = __bind(this.show, this); Editor.__super__.constructor.call(this, $(this.html)[0], options); this.fields = []; this.annotation = {}; } Editor.prototype.show = function(event) { util.preventEventDefault(event); this.element.removeClass(this.classes.hide); this.element.find('.annotator-save').addClass(this.classes.focus); this.checkOrientation(); this.element.find(":input:first").focus(); this.setupDraggables(); return this.publish('show'); }; Editor.prototype.hide = function(event) { util.preventEventDefault(event); this.element.addClass(this.classes.hide); return this.publish('hide'); }; Editor.prototype.load = function(annotation) { var field, _i, _len, _ref; this.annotation = annotation; this.publish('load', [this.annotation]); _ref = this.fields; for (_i = 0, _len = _ref.length; _i < _len; _i++) { field = _ref[_i]; field.load(field.element, this.annotation); } return this.show(); }; Editor.prototype.submit = function(event) { var field, _i, _len, _ref; util.preventEventDefault(event); _ref = this.fields; for (_i = 0, _len = _ref.length; _i < _len; _i++) { field = _ref[_i]; field.submit(field.element, this.annotation); } this.publish('save', [this.annotation]); return this.hide(); }; Editor.prototype.addField = function(options) { var element, field, input; field = $.extend({ id: 'annotator-field-' + util.uuid(), type: 'input', label: '', load: function() {}, submit: function() {} }, options); input = null; element = $('<li class="annotator-item" />'); field.element = element[0]; switch (field.type) { case 'textarea': input = $('<textarea />'); break; case 'input': case 'checkbox': input = $('<input />'); } element.append(input); input.attr({ id: field.id, placeholder: field.label }); if (field.type === 'checkbox') { input[0].type = 'checkbox'; element.addClass('annotator-checkbox'); element.append($('<label />', { "for": field.id, html: field.label })); } this.element.find('ul:first').append(element); this.fields.push(field); return field.element; }; Editor.prototype.checkOrientation = function() { var controls, list; Editor.__super__.checkOrientation.apply(this, arguments); list = this.element.find('ul'); controls = this.element.find('.annotator-controls'); if (this.element.hasClass(this.classes.invert.y)) { controls.insertBefore(list); } else if (controls.is(':first-child')) { controls.insertAfter(list); } return this; }; Editor.prototype.processKeypress = function(event) { if (event.keyCode === 27) { return this.hide(); } else if (event.keyCode === 13 && !event.shiftKey) { return this.submit(); } }; Editor.prototype.onCancelButtonMouseover = function() { return this.element.find('.' + this.classes.focus).removeClass(this.classes.focus); }; Editor.prototype.setupDraggables = function() { var classes, controls, cornerItem, editor, mousedown, onMousedown, onMousemove, onMouseup, resize, textarea, throttle, _this = this; this.element.find('.annotator-resize').remove(); if (this.element.hasClass(this.classes.invert.y)) { cornerItem = this.element.find('.annotator-item:last'); } else { cornerItem = this.element.find('.annotator-item:first'); } if (cornerItem) { $('<span class="annotator-resize"></span>').appendTo(cornerItem); } mousedown = null; classes = this.classes; editor = this.element; textarea = null; resize = editor.find('.annotator-resize'); controls = editor.find('.annotator-controls'); throttle = false; onMousedown = function(event) { if (event.target === this) { mousedown = { element: this, top: event.pageY, left: event.pageX }; textarea = editor.find('textarea:first'); $(window).bind({ 'mouseup.annotator-editor-resize': onMouseup, 'mousemove.annotator-editor-resize': onMousemove }); return event.preventDefault(); } }; onMouseup = function() { mousedown = null; return $(window).unbind('.annotator-editor-resize'); }; onMousemove = function(event) { var diff, directionX, directionY, height, width; if (mousedown && throttle === false) { diff = { top: event.pageY - mousedown.top, left: event.pageX - mousedown.left }; if (mousedown.element === resize[0]) { height = textarea.outerHeight(); width = textarea.outerWidth(); directionX = editor.hasClass(classes.invert.x) ? -1 : 1; directionY = editor.hasClass(classes.invert.y) ? 1 : -1; textarea.height(height + (diff.top * directionY)); textarea.width(width + (diff.left * directionX)); if (textarea.outerHeight() !== height) { mousedown.top = event.pageY; } if (textarea.outerWidth() !== width) { mousedown.left = event.pageX; } } else if (mousedown.element === controls[0]) { editor.css({ top: parseInt(editor.css('top'), 10) + diff.top, left: parseInt(editor.css('left'), 10) + diff.left }); mousedown.top = event.pageY; mousedown.left = event.pageX; } throttle = true; return setTimeout(function() { return throttle = false; }, 1000 / 60); } }; resize.bind('mousedown', onMousedown); return controls.bind('mousedown', onMousedown); }; return Editor; })(Annotator.Widget);