<NME> materialnote.js <BEF> /** * Super simple wysiwyg editor v2.0.0 * http://materialnote.org/ * * materialnote.js * Copyright 2013- Alan Hong. and other contributors * materialnote may be freely distributed under the MIT license./ * * Date: 2017-08-09T16:15Z */ (function (factory) { /* global define */ if (typeof define === 'function' && define.amd) { // AMD. Register as an anonymous module. define(['jquery'], factory); } else if (typeof module === 'object' && module.exports) { // Node/CommonJS module.exports = factory(require('jquery')); } else { // Browser globals factory(window.jQuery); } }(function ($) { 'use strict'; var isSupportAmd = typeof define === 'function' && define.amd; /** * returns whether font is installed or not. * * @param {String} fontName * @return {Boolean} */ var isFontInstalled = function (fontName) { var testFontName = fontName === 'Comic Sans MS' ? 'Courier New' : 'Comic Sans MS'; var $tester = $('<div>').css({ position: 'absolute', left: '-9999px', top: '-9999px', fontSize: '200px' }).text('mmmmmmmmmwwwwwww').appendTo(document.body); var originalWidth = $tester.css('fontFamily', testFontName).width(); var width = $tester.css('fontFamily', fontName + ',' + testFontName).width(); $tester.remove(); return originalWidth !== width; }; var userAgent = navigator.userAgent; var isMSIE = /MSIE|Trident/i.test(userAgent); var browserVersion; if (isMSIE) { var matches = /MSIE (\d+[.]\d+)/.exec(userAgent); if (matches) { browserVersion = parseFloat(matches[1]); } matches = /Trident\/.*rv:([0-9]{1,}[\.0-9]{0,})/.exec(userAgent); if (matches) { browserVersion = parseFloat(matches[1]); } } var isEdge = /Edge\/\d+/.test(userAgent); var hasCodeMirror = !!window.CodeMirror; if (!hasCodeMirror && isSupportAmd && typeof require !== 'undefined') { if (typeof require.resolve !== 'undefined') { try { // If CodeMirror can't be resolved, `require.resolve` will throw an // exception and `hasCodeMirror` won't be set to `true`. require.resolve('codemirror'); hasCodeMirror = true; } catch (e) { // Do nothing. } } else if (typeof eval('require').specified !== 'undefined') { hasCodeMirror = eval('require').specified('codemirror'); } } var isSupportTouch = (('ontouchstart' in window) || (navigator.MaxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0)); /** * @class core.agent * * Object which check platform and agent * * @singleton * @alternateClassName agent */ var agent = { isMac: navigator.appVersion.indexOf('Mac') > -1, isMSIE: isMSIE, isEdge: isEdge, isFF: !isEdge && /firefox/i.test(userAgent), isPhantom: /PhantomJS/i.test(userAgent), isWebkit: !isEdge && /webkit/i.test(userAgent), isChrome: !isEdge && /chrome/i.test(userAgent), isSafari: !isEdge && /safari/i.test(userAgent), browserVersion: browserVersion, jqueryVersion: parseFloat($.fn.jquery), isSupportAmd: isSupportAmd, isSupportTouch: isSupportTouch, hasCodeMirror: hasCodeMirror, isFontInstalled: isFontInstalled, isW3CRangeSupport: !!document.createRange }; /** * @class core.func * * func utils (for high-order func's arg) * * @singleton * @alternateClassName func */ var func = (function () { var eq = function (itemA) { return function (itemB) { return itemA === itemB; }; }; var eq2 = function (itemA, itemB) { return itemA === itemB; }; var peq2 = function (propName) { return function (itemA, itemB) { return itemA[propName] === itemB[propName]; }; }; var ok = function () { return true; }; var fail = function () { return false; }; var not = function (f) { return function () { return !f.apply(f, arguments); }; }; var and = function (fA, fB) { return function (item) { return fA(item) && fB(item); }; }; var self = function (a) { return a; }; var invoke = function (obj, method) { return function () { return obj[method].apply(obj, arguments); }; }; var idCounter = 0; /** * generate a globally-unique id * * @param {String} [prefix] */ var uniqueId = function (prefix) { var id = ++idCounter + ''; return prefix ? prefix + id : id; }; /** * returns bnd (bounds) from rect * * - IE Compatibility Issue: http://goo.gl/sRLOAo * - Scroll Issue: http://goo.gl/sNjUc * * @param {Rect} rect * @return {Object} bounds * @return {Number} bounds.top * @return {Number} bounds.left * @return {Number} bounds.width * @return {Number} bounds.height */ var rect2bnd = function (rect) { var $document = $(document); return { top: rect.top + $document.scrollTop(), left: rect.left + $document.scrollLeft(), width: rect.right - rect.left, height: rect.bottom - rect.top }; }; /** * returns a copy of the object where the keys have become the values and the values the keys. * @param {Object} obj * @return {Object} */ var invertObject = function (obj) { var inverted = {}; for (var key in obj) { if (obj.hasOwnProperty(key)) { inverted[obj[key]] = key; } } return inverted; }; /** * @param {String} namespace * @param {String} [prefix] * @return {String} */ var namespaceToCamel = function (namespace, prefix) { prefix = prefix || ''; return prefix + namespace.split('.').map(function (name) { return name.substring(0, 1).toUpperCase() + name.substring(1); }).join(''); }; /** * Returns a function, that, as long as it continues to be invoked, will not * be triggered. The function will be called after it stops being called for * N milliseconds. If `immediate` is passed, trigger the function on the * leading edge, instead of the trailing. * @param {Function} func * @param {Number} wait * @param {Boolean} immediate * @return {Function} */ var debounce = function (func, wait, immediate) { var timeout; return function () { var context = this, args = arguments; var later = function () { timeout = null; if (!immediate) { func.apply(context, args); } }; var callNow = immediate && !timeout; clearTimeout(timeout); timeout = setTimeout(later, wait); if (callNow) { func.apply(context, args); } }; }; return { eq: eq, eq2: eq2, peq2: peq2, ok: ok, fail: fail, self: self, not: not, and: and, invoke: invoke, uniqueId: uniqueId, rect2bnd: rect2bnd, invertObject: invertObject, namespaceToCamel: namespaceToCamel, debounce: debounce }; })(); /** * @class core.list * * list utils * * @singleton * @alternateClassName list */ var list = (function () { /** * returns the first item of an array. * * @param {Array} array */ var head = function (array) { return array[0]; }; /** * returns the last item of an array. * * @param {Array} array */ var last = function (array) { return array[array.length - 1]; }; /** * returns everything but the last entry of the array. * * @param {Array} array */ var initial = function (array) { return array.slice(0, array.length - 1); }; /** * returns the rest of the items in an array. * * @param {Array} array */ var tail = function (array) { return array.slice(1); }; /** * returns item of array */ var find = function (array, pred) { for (var idx = 0, len = array.length; idx < len; idx ++) { var item = array[idx]; if (pred(item)) { return item; } } }; /** * returns true if all of the values in the array pass the predicate truth test. */ var all = function (array, pred) { for (var idx = 0, len = array.length; idx < len; idx ++) { if (!pred(array[idx])) { return false; } } return true; }; /** * returns index of item */ var indexOf = function (array, item) { return $.inArray(item, array); }; /** * returns true if the value is present in the list. */ var contains = function (array, item) { return indexOf(array, item) !== -1; }; /** * get sum from a list * * @param {Array} array - array * @param {Function} fn - iterator */ var sum = function (array, fn) { fn = fn || func.self; return array.reduce(function (memo, v) { return memo + fn(v); }, 0); }; /** * returns a copy of the collection with array type. * @param {Collection} collection - collection eg) node.childNodes, ... */ var from = function (collection) { var result = [], idx = -1, length = collection.length; while (++idx < length) { result[idx] = collection[idx]; } return result; }; /** * returns whether list is empty or not */ var isEmpty = function (array) { return !array || !array.length; }; /** * cluster elements by predicate function. * * @param {Array} array - array * @param {Function} fn - predicate function for cluster rule * @param {Array[]} */ var clusterBy = function (array, fn) { if (!array.length) { return []; } var aTail = tail(array); return aTail.reduce(function (memo, v) { var aLast = last(memo); if (fn(last(aLast), v)) { aLast[aLast.length] = v; } else { memo[memo.length] = [v]; } return memo; }, [[head(array)]]); }; /** * returns a copy of the array with all false values removed * * @param {Array} array - array * @param {Function} fn - predicate function for cluster rule */ var compact = function (array) { var aResult = []; for (var idx = 0, len = array.length; idx < len; idx ++) { if (array[idx]) { aResult.push(array[idx]); } } return aResult; }; /** * produces a duplicate-free version of the array * * @param {Array} array */ var unique = function (array) { var results = []; for (var idx = 0, len = array.length; idx < len; idx ++) { if (!contains(results, array[idx])) { results.push(array[idx]); } } return results; }; /** * returns next item. * @param {Array} array */ var next = function (array, item) { var idx = indexOf(array, item); if (idx === -1) { return null; } return array[idx + 1]; }; /** * returns prev item. * @param {Array} array */ var prev = function (array, item) { var idx = indexOf(array, item); if (idx === -1) { return null; } return array[idx - 1]; }; return { head: head, last: last, initial: initial, tail: tail, prev: prev, next: next, find: find, contains: contains, all: all, sum: sum, from: from, isEmpty: isEmpty, clusterBy: clusterBy, compact: compact, unique: unique }; })(); var NBSP_CHAR = String.fromCharCode(160); var ZERO_WIDTH_NBSP_CHAR = '\ufeff'; /** * @class core.dom * * Dom functions * * @singleton * @alternateClassName dom */ var dom = (function () { /** * @method isEditable * * returns whether node is `note-editable` or not. * * @param {Node} node * @return {Boolean} */ var isEditable = function (node) { return node && $(node).hasClass('note-editable'); }; /** * @method isControlSizing * * returns whether node is `note-control-sizing` or not. * * @param {Node} node * @return {Boolean} */ var isControlSizing = function (node) { return node && $(node).hasClass('note-control-sizing'); }; /** * @method makePredByNodeName * * returns predicate which judge whether nodeName is same * * @param {String} nodeName * @return {Function} */ var makePredByNodeName = function (nodeName) { nodeName = nodeName.toUpperCase(); return function (node) { return node && node.nodeName.toUpperCase() === nodeName; }; }; /** * @method isText * * * * @param {Node} node * @return {Boolean} true if node's type is text(3) */ var isText = function (node) { return node && node.nodeType === 3; }; /** * @method isElement * * * * @param {Node} node * @return {Boolean} true if node's type is element(1) */ var isElement = function (node) { return node && node.nodeType === 1; }; /** * ex) br, col, embed, hr, img, input, ... * @see http://www.w3.org/html/wg/drafts/html/master/syntax.html#void-elements */ var isVoid = function (node) { return node && /^BR|^IMG|^HR|^IFRAME|^BUTTON|^INPUT/.test(node.nodeName.toUpperCase()); }; var isPara = function (node) { if (isEditable(node)) { return false; } // Chrome(v31.0), FF(v25.0.1) use DIV for paragraph return node && /^DIV|^P|^LI|^H[1-7]/.test(node.nodeName.toUpperCase()); }; var isHeading = function (node) { return node && /^H[1-7]/.test(node.nodeName.toUpperCase()); }; var isPre = makePredByNodeName('PRE'); var isLi = makePredByNodeName('LI'); var isPurePara = function (node) { return isPara(node) && !isLi(node); }; var isTable = makePredByNodeName('TABLE'); var isData = makePredByNodeName('DATA'); var isInline = function (node) { return !isBodyContainer(node) && !isList(node) && !isHr(node) && !isPara(node) && !isTable(node) && !isBlockquote(node) && !isData(node); }; var isList = function (node) { return node && /^UL|^OL/.test(node.nodeName.toUpperCase()); }; var isHr = makePredByNodeName('HR'); var isCell = function (node) { return node && /^TD|^TH/.test(node.nodeName.toUpperCase()); }; var isBlockquote = makePredByNodeName('BLOCKQUOTE'); var isBodyContainer = function (node) { return isCell(node) || isBlockquote(node) || isEditable(node); }; var isAnchor = makePredByNodeName('A'); var isParaInline = function (node) { return isInline(node) && !!ancestor(node, isPara); }; var isBodyInline = function (node) { return isInline(node) && !ancestor(node, isPara); }; var isBody = makePredByNodeName('BODY'); /** * returns whether nodeB is closest sibling of nodeA * * @param {Node} nodeA * @param {Node} nodeB * @return {Boolean} */ var isClosestSibling = function (nodeA, nodeB) { return nodeA.nextSibling === nodeB || nodeA.previousSibling === nodeB; }; /** * returns array of closest siblings with node * * @param {Node} node * @param {function} [pred] - predicate function * @return {Node[]} */ var withClosestSiblings = function (node, pred) { pred = pred || func.ok; var siblings = []; if (node.previousSibling && pred(node.previousSibling)) { siblings.push(node.previousSibling); } siblings.push(node); if (node.nextSibling && pred(node.nextSibling)) { siblings.push(node.nextSibling); } return siblings; }; /** * blank HTML for cursor position * - [workaround] old IE only works with &nbsp; * - [workaround] IE11 and other browser works with bogus br */ var blankHTML = agent.isMSIE && agent.browserVersion < 11 ? '&nbsp;' : '<br>'; /** * @method nodeLength * * returns #text's text size or element's childNodes size * * @param {Node} node */ var nodeLength = function (node) { if (isText(node)) { return node.nodeValue.length; } if (node) { return node.childNodes.length; } return 0; }; /** * returns whether node is empty or not. * * @param {Node} node * @return {Boolean} */ var isEmpty = function (node) { var len = nodeLength(node); if (len === 0) { return true; } else if (!isText(node) && len === 1 && node.innerHTML === blankHTML) { // ex) <p><br></p>, <span><br></span> return true; } else if (list.all(node.childNodes, isText) && node.innerHTML === '') { // ex) <p></p>, <span></span> return true; } return false; }; /** * padding blankHTML if node is empty (for cursor position) */ var paddingBlankHTML = function (node) { if (!isVoid(node) && !nodeLength(node)) { node.innerHTML = blankHTML; } }; /** * find nearest ancestor predicate hit * * @param {Node} node * @param {Function} pred - predicate function */ var ancestor = function (node, pred) { while (node) { if (pred(node)) { return node; } if (isEditable(node)) { break; } node = node.parentNode; } return null; }; /** * find nearest ancestor only single child blood line and predicate hit * * @param {Node} node * @param {Function} pred - predicate function */ var singleChildAncestor = function (node, pred) { node = node.parentNode; while (node) { if (nodeLength(node) !== 1) { break; } if (pred(node)) { return node; } if (isEditable(node)) { break; } node = node.parentNode; } return null; }; /** * returns new array of ancestor nodes (until predicate hit). * * @param {Node} node * @param {Function} [optional] pred - predicate function */ var listAncestor = function (node, pred) { pred = pred || func.fail; var ancestors = []; ancestor(node, function (el) { if (!isEditable(el)) { ancestors.push(el); } return pred(el); }); return ancestors; }; /** * find farthest ancestor predicate hit */ var lastAncestor = function (node, pred) { var ancestors = listAncestor(node); return list.last(ancestors.filter(pred)); }; /** * returns common ancestor node between two nodes. * * @param {Node} nodeA * @param {Node} nodeB */ var commonAncestor = function (nodeA, nodeB) { var ancestors = listAncestor(nodeA); for (var n = nodeB; n; n = n.parentNode) { if ($.inArray(n, ancestors) > -1) { return n; } } return null; // difference document area }; /** * listing all previous siblings (until predicate hit). * * @param {Node} node * @param {Function} [optional] pred - predicate function */ var listPrev = function (node, pred) { pred = pred || func.fail; var nodes = []; while (node) { if (pred(node)) { break; } nodes.push(node); node = node.previousSibling; } return nodes; }; /** * listing next siblings (until predicate hit). * * @param {Node} node * @param {Function} [pred] - predicate function */ var listNext = function (node, pred) { pred = pred || func.fail; var nodes = []; while (node) { if (pred(node)) { break; } nodes.push(node); node = node.nextSibling; } return nodes; }; /** * listing descendant nodes * * @param {Node} node * @param {Function} [pred] - predicate function */ var listDescendant = function (node, pred) { var descendants = []; pred = pred || func.ok; // start DFS(depth first search) with node (function fnWalk(current) { if (node !== current && pred(current)) { descendants.push(current); } for (var idx = 0, len = current.childNodes.length; idx < len; idx++) { fnWalk(current.childNodes[idx]); } })(node); return descendants; }; /** * wrap node with new tag. * * @param {Node} node * @param {Node} tagName of wrapper * @return {Node} - wrapper */ var wrap = function (node, wrapperName) { var parent = node.parentNode; var wrapper = $('<' + wrapperName + '>')[0]; parent.insertBefore(wrapper, node); wrapper.appendChild(node); return wrapper; }; /** * insert node after preceding * * @param {Node} node * @param {Node} preceding - predicate function */ var insertAfter = function (node, preceding) { var next = preceding.nextSibling, parent = preceding.parentNode; if (next) { parent.insertBefore(node, next); } else { parent.appendChild(node); } return node; }; /** * append elements. * * @param {Node} node * @param {Collection} aChild */ var appendChildNodes = function (node, aChild) { $.each(aChild, function (idx, child) { node.appendChild(child); }); return node; }; /** * returns whether boundaryPoint is left edge or not. * * @param {BoundaryPoint} point * @return {Boolean} */ var isLeftEdgePoint = function (point) { return point.offset === 0; }; /** * returns whether boundaryPoint is right edge or not. * * @param {BoundaryPoint} point * @return {Boolean} */ var isRightEdgePoint = function (point) { return point.offset === nodeLength(point.node); }; /** * returns whether boundaryPoint is edge or not. * * @param {BoundaryPoint} point * @return {Boolean} */ var isEdgePoint = function (point) { return isLeftEdgePoint(point) || isRightEdgePoint(point); }; /** * returns whether node is left edge of ancestor or not. * * @param {Node} node * @param {Node} ancestor * @return {Boolean} */ var isLeftEdgeOf = function (node, ancestor) { while (node && node !== ancestor) { if (position(node) !== 0) { return false; } node = node.parentNode; } return true; }; /** * returns whether node is right edge of ancestor or not. * * @param {Node} node * @param {Node} ancestor * @return {Boolean} */ var isRightEdgeOf = function (node, ancestor) { if (!ancestor) { return false; } while (node && node !== ancestor) { if (position(node) !== nodeLength(node.parentNode) - 1) { return false; } node = node.parentNode; } return true; }; /** * returns whether point is left edge of ancestor or not. * @param {BoundaryPoint} point * @param {Node} ancestor * @return {Boolean} */ var isLeftEdgePointOf = function (point, ancestor) { return isLeftEdgePoint(point) && isLeftEdgeOf(point.node, ancestor); }; /** * returns whether point is right edge of ancestor or not. * @param {BoundaryPoint} point * @param {Node} ancestor * @return {Boolean} */ var isRightEdgePointOf = function (point, ancestor) { return isRightEdgePoint(point) && isRightEdgeOf(point.node, ancestor); }; /** * returns offset from parent. * * @param {Node} node */ var position = function (node) { var offset = 0; while ((node = node.previousSibling)) { offset += 1; } return offset; }; var hasChildren = function (node) { return !!(node && node.childNodes && node.childNodes.length); }; /** * returns previous boundaryPoint * * @param {BoundaryPoint} point * @param {Boolean} isSkipInnerOffset * @return {BoundaryPoint} */ var prevPoint = function (point, isSkipInnerOffset) { var node, offset; if (point.offset === 0) { if (isEditable(point.node)) { return null; } node = point.node.parentNode; offset = position(point.node); } else if (hasChildren(point.node)) { node = point.node.childNodes[point.offset - 1]; offset = nodeLength(node); } else { node = point.node; offset = isSkipInnerOffset ? 0 : point.offset - 1; } return { node: node, offset: offset }; }; /** * returns next boundaryPoint * * @param {BoundaryPoint} point * @param {Boolean} isSkipInnerOffset * @return {BoundaryPoint} */ var nextPoint = function (point, isSkipInnerOffset) { var node, offset; if (nodeLength(point.node) === point.offset) { if (isEditable(point.node)) { return null; } node = point.node.parentNode; offset = position(point.node) + 1; } else if (hasChildren(point.node)) { node = point.node.childNodes[point.offset]; offset = 0; } else { node = point.node; offset = isSkipInnerOffset ? nodeLength(point.node) : point.offset + 1; } return { node: node, offset: offset }; }; /** * returns whether pointA and pointB is same or not. * * @param {BoundaryPoint} pointA * @param {BoundaryPoint} pointB * @return {Boolean} */ var isSamePoint = function (pointA, pointB) { return pointA.node === pointB.node && pointA.offset === pointB.offset; }; /** * returns whether point is visible (can set cursor) or not. * * @param {BoundaryPoint} point * @return {Boolean} */ var isVisiblePoint = function (point) { if (isText(point.node) || !hasChildren(point.node) || isEmpty(point.node)) { return true; } var leftNode = point.node.childNodes[point.offset - 1]; var rightNode = point.node.childNodes[point.offset]; if ((!leftNode || isVoid(leftNode)) && (!rightNode || isVoid(rightNode))) { return true; } return false; }; /** * @method prevPointUtil * * @param {BoundaryPoint} point * @param {Function} pred * @return {BoundaryPoint} */ var prevPointUntil = function (point, pred) { while (point) { if (pred(point)) { return point; } point = prevPoint(point); } return null; }; /** * @method nextPointUntil * * @param {BoundaryPoint} point * @param {Function} pred * @return {BoundaryPoint} */ var nextPointUntil = function (point, pred) { while (point) { if (pred(point)) { return point; } point = nextPoint(point); } return null; }; /** * returns whether point has character or not. * * @param {Point} point * @return {Boolean} */ var isCharPoint = function (point) { if (!isText(point.node)) { return false; } var ch = point.node.nodeValue.charAt(point.offset - 1); return ch && (ch !== ' ' && ch !== NBSP_CHAR); }; /** * @method walkPoint * * @param {BoundaryPoint} startPoint * @param {BoundaryPoint} endPoint * @param {Function} handler * @param {Boolean} isSkipInnerOffset */ var walkPoint = function (startPoint, endPoint, handler, isSkipInnerOffset) { var point = startPoint; while (point) { handler(point); if (isSamePoint(point, endPoint)) { break; } var isSkipOffset = isSkipInnerOffset && startPoint.node !== point.node && endPoint.node !== point.node; point = nextPoint(point, isSkipOffset); } }; /** * @method makeOffsetPath * * return offsetPath(array of offset) from ancestor * * @param {Node} ancestor - ancestor node * @param {Node} node */ var makeOffsetPath = function (ancestor, node) { var ancestors = listAncestor(node, func.eq(ancestor)); return ancestors.map(position).reverse(); }; /** * @method fromOffsetPath * * return element from offsetPath(array of offset) * * @param {Node} ancestor - ancestor node * @param {array} offsets - offsetPath */ var fromOffsetPath = function (ancestor, offsets) { var current = ancestor; for (var i = 0, len = offsets.length; i < len; i++) { if (current.childNodes.length <= offsets[i]) { current = current.childNodes[current.childNodes.length - 1]; } else { current = current.childNodes[offsets[i]]; } } return current; }; /** * @method splitNode * * split element or #text * * @param {BoundaryPoint} point * @param {Object} [options] * @param {Boolean} [options.isSkipPaddingBlankHTML] - default: false * @param {Boolean} [options.isNotSplitEdgePoint] - default: false * @return {Node} right node of boundaryPoint */ var splitNode = function (point, options) { var isSkipPaddingBlankHTML = options && options.isSkipPaddingBlankHTML; var isNotSplitEdgePoint = options && options.isNotSplitEdgePoint; // edge case if (isEdgePoint(point) && (isText(point.node) || isNotSplitEdgePoint)) { if (isLeftEdgePoint(point)) { return point.node; } else if (isRightEdgePoint(point)) { return point.node.nextSibling; } } // split #text if (isText(point.node)) { return point.node.splitText(point.offset); } else { var childNode = point.node.childNodes[point.offset]; var clone = insertAfter(point.node.cloneNode(false), point.node); appendChildNodes(clone, listNext(childNode)); if (!isSkipPaddingBlankHTML) { paddingBlankHTML(point.node); paddingBlankHTML(clone); } return clone; } }; /** * @method splitTree * * split tree by point * * @param {Node} root - split root * @param {BoundaryPoint} point * @param {Object} [options] * @param {Boolean} [options.isSkipPaddingBlankHTML] - default: false * @param {Boolean} [options.isNotSplitEdgePoint] - default: false * @return {Node} right node of boundaryPoint */ var splitTree = function (root, point, options) { // ex) [#text, <span>, <p>] var ancestors = listAncestor(point.node, func.eq(root)); if (!ancestors.length) { return null; } else if (ancestors.length === 1) { return splitNode(point, options); } return ancestors.reduce(function (node, parent) { if (node === point.node) { node = splitNode(point, options); } return splitNode({ node: parent, offset: node ? dom.position(node) : nodeLength(parent) }, options); }); }; /** * split point * * @param {Point} point * @param {Boolean} isInline * @return {Object} */ var splitPoint = function (point, isInline) { // find splitRoot, container // - inline: splitRoot is a child of paragraph // - block: splitRoot is a child of bodyContainer var pred = isInline ? isPara : isBodyContainer; var ancestors = listAncestor(point.node, pred); var topAncestor = list.last(ancestors) || point.node; var splitRoot, container; if (pred(topAncestor)) { splitRoot = ancestors[ancestors.length - 2]; container = topAncestor; } else { splitRoot = topAncestor; container = splitRoot.parentNode; } // if splitRoot is exists, split with splitTree var pivot = splitRoot && splitTree(splitRoot, point, { isSkipPaddingBlankHTML: isInline, isNotSplitEdgePoint: isInline }); // if container is point.node, find pivot with point.offset if (!pivot && container === point.node) { pivot = point.node.childNodes[point.offset]; } return { rightNode: pivot, container: container }; }; var create = function (nodeName) { return document.createElement(nodeName); }; var createText = function (text) { return document.createTextNode(text); }; /** * @method remove * * remove node, (isRemoveChild: remove child or not) * * @param {Node} node * @param {Boolean} isRemoveChild */ var remove = function (node, isRemoveChild) { if (!node || !node.parentNode) { return; } if (node.removeNode) { return node.removeNode(isRemoveChild); } var parent = node.parentNode; if (!isRemoveChild) { var nodes = []; var i, len; for (i = 0, len = node.childNodes.length; i < len; i++) { nodes.push(node.childNodes[i]); } for (i = 0, len = nodes.length; i < len; i++) { parent.insertBefore(nodes[i], node); } } parent.removeChild(node); }; /** * @method removeWhile * * @param {Node} node * @param {Function} pred */ var removeWhile = function (node, pred) { while (node) { if (isEditable(node) || !pred(node)) { break; } var parent = node.parentNode; remove(node); node = parent; } }; /** * @method replace * * replace node with provided nodeName * * @param {Node} node * @param {String} nodeName * @return {Node} - new node */ var replace = function (node, nodeName) { if (node.nodeName.toUpperCase() === nodeName.toUpperCase()) { return node; } var newNode = create(nodeName); if (node.style.cssText) { newNode.style.cssText = node.style.cssText; } appendChildNodes(newNode, list.from(node.childNodes)); insertAfter(newNode, node); remove(node); return newNode; }; var isTextarea = makePredByNodeName('TEXTAREA'); /** * @param {jQuery} $node * @param {Boolean} [stripLinebreaks] - default: false */ var value = function ($node, stripLinebreaks) { var val = isTextarea($node[0]) ? $node.val() : $node.html(); if (stripLinebreaks) { return val.replace(/[\n\r]/g, ''); } return val; }; /** * @method html * * get the HTML contents of node * * @param {jQuery} $node * @param {Boolean} [isNewlineOnBlock] */ var html = function ($node, isNewlineOnBlock) { var markup = value($node); if (isNewlineOnBlock) { var regexTag = /<(\/?)(\b(?!!)[^>\s]*)(.*?)(\s*\/?>)/g; markup = markup.replace(regexTag, function (match, endSlash, name) { name = name.toUpperCase(); var isEndOfInlineContainer = /^DIV|^TD|^TH|^P|^LI|^H[1-7]/.test(name) && !!endSlash; var isBlockNode = /^BLOCKQUOTE|^TABLE|^TBODY|^TR|^HR|^UL|^OL/.test(name); return match + ((isEndOfInlineContainer || isBlockNode) ? '\n' : ''); }); markup = $.trim(markup); } return markup; }; var posFromPlaceholder = function (placeholder) { var $placeholder = $(placeholder); var pos = $placeholder.offset(); var height = $placeholder.outerHeight(true); // include margin return { left: pos.left, top: pos.top + height }; }; var attachEvents = function ($node, events) { Object.keys(events).forEach(function (key) { $node.on(key, events[key]); }); }; var detachEvents = function ($node, events) { Object.keys(events).forEach(function (key) { $node.off(key, events[key]); }); }; /** * @method isCustomStyleTag * * assert if a node contains a "note-styletag" class, * which implies that's a custom-made style tag node * * @param {Node} an HTML DOM node */ var isCustomStyleTag = function (node) { return node && !dom.isText(node) && list.contains(node.classList, 'note-styletag'); }; return { /** @property {String} NBSP_CHAR */ NBSP_CHAR: NBSP_CHAR, /** @property {String} ZERO_WIDTH_NBSP_CHAR */ ZERO_WIDTH_NBSP_CHAR: ZERO_WIDTH_NBSP_CHAR, /** @property {String} blank */ blank: blankHTML, /** @property {String} emptyPara */ emptyPara: '<p>' + blankHTML + '</p>', makePredByNodeName: makePredByNodeName, isEditable: isEditable, isControlSizing: isControlSizing, isText: isText, isElement: isElement, isVoid: isVoid, isPara: isPara, isPurePara: isPurePara, isHeading: isHeading, isInline: isInline, isBlock: func.not(isInline), isBodyInline: isBodyInline, isBody: isBody, isParaInline: isParaInline, isPre: isPre, isList: isList, isTable: isTable, isData: isData, isCell: isCell, isBlockquote: isBlockquote, isBodyContainer: isBodyContainer, isAnchor: isAnchor, isDiv: makePredByNodeName('DIV'), isLi: isLi, isBR: makePredByNodeName('BR'), isSpan: makePredByNodeName('SPAN'), isB: makePredByNodeName('B'), isU: makePredByNodeName('U'), isS: makePredByNodeName('S'), isI: makePredByNodeName('I'), isImg: makePredByNodeName('IMG'), isTextarea: isTextarea, isEmpty: isEmpty, isEmptyAnchor: func.and(isAnchor, isEmpty), isClosestSibling: isClosestSibling, withClosestSiblings: withClosestSiblings, nodeLength: nodeLength, isLeftEdgePoint: isLeftEdgePoint, isRightEdgePoint: isRightEdgePoint, isEdgePoint: isEdgePoint, isLeftEdgeOf: isLeftEdgeOf, isRightEdgeOf: isRightEdgeOf, isLeftEdgePointOf: isLeftEdgePointOf, isRightEdgePointOf: isRightEdgePointOf, prevPoint: prevPoint, nextPoint: nextPoint, isSamePoint: isSamePoint, isVisiblePoint: isVisiblePoint, prevPointUntil: prevPointUntil, nextPointUntil: nextPointUntil, isCharPoint: isCharPoint, walkPoint: walkPoint, ancestor: ancestor, singleChildAncestor: singleChildAncestor, listAncestor: listAncestor, lastAncestor: lastAncestor, listNext: listNext, listPrev: listPrev, listDescendant: listDescendant, commonAncestor: commonAncestor, wrap: wrap, insertAfter: insertAfter, appendChildNodes: appendChildNodes, position: position, hasChildren: hasChildren, makeOffsetPath: makeOffsetPath, fromOffsetPath: fromOffsetPath, splitTree: splitTree, splitPoint: splitPoint, create: create, createText: createText, remove: remove, removeWhile: removeWhile, replace: replace, html: html, value: value, posFromPlaceholder: posFromPlaceholder, attachEvents: attachEvents, detachEvents: detachEvents, isCustomStyleTag: isCustomStyleTag }; })(); /** * @param {jQuery} $note * @param {Object} options * @return {Context} */ var Context = function ($note, options) { var self = this; var ui = $.materialnote.ui; this.memos = {}; this.modules = {}; this.layoutInfo = {}; this.options = options; /** * create layout and initialize modules and other resources */ this.initialize = function () { this.layoutInfo = ui.createLayout($note, options); this._initialize(); $note.hide(); return this; }; /** * destroy modules and other resources and remove layout */ this.destroy = function () { this._destroy(); $note.removeData('materialnote'); ui.removeLayout($note, this.layoutInfo); }; /** * destory modules and other resources and initialize it again */ this.reset = function () { var disabled = self.isDisabled(); this.code(dom.emptyPara); this._destroy(); this._initialize(); if (disabled) { self.disable(); } }; this._initialize = function () { // add optional buttons var buttons = $.extend({}, this.options.buttons); Object.keys(buttons).forEach(function (key) { self.memo('button.' + key, buttons[key]); }); var modules = $.extend({}, this.options.modules, $.materialnote.plugins || {}); // add and initialize modules Object.keys(modules).forEach(function (key) { self.module(key, modules[key], true); }); Object.keys(this.modules).forEach(function (key) { self.initializeModule(key); }); }; this._destroy = function () { // destroy modules with reversed order Object.keys(this.modules).reverse().forEach(function (key) { self.removeModule(key); }); Object.keys(this.memos).forEach(function (key) { self.removeMemo(key); }); // trigger custom onDestroy callback this.triggerEvent('destroy', this); }; this.code = function (html) { var isActivated = this.invoke('codeview.isActivated'); if (html === undefined) { this.invoke('codeview.sync'); return isActivated ? this.layoutInfo.codable.val() : this.layoutInfo.editable.html(); } else { if (isActivated) { this.layoutInfo.codable.val(html); } else { this.layoutInfo.editable.html(html); } $note.val(html); this.triggerEvent('change', html); } }; this.isDisabled = function () { return this.layoutInfo.editable.attr('contenteditable') === 'false'; }; this.enable = function () { this.layoutInfo.editable.attr('contenteditable', true); this.invoke('toolbar.activate', true); this.triggerEvent('disable', false); }; this.disable = function () { // close codeview if codeview is opend if (this.invoke('codeview.isActivated')) { this.invoke('codeview.deactivate'); } this.layoutInfo.editable.attr('contenteditable', false); this.invoke('toolbar.deactivate', true); this.triggerEvent('disable', true); }; this.triggerEvent = function () { var namespace = list.head(arguments); var args = list.tail(list.from(arguments)); var callback = this.options.callbacks[func.namespaceToCamel(namespace, 'on')]; if (callback) { callback.apply($note[0], args); } $note.trigger('materialnote.' + namespace, args); }; this.initializeModule = function (key) { var module = this.modules[key]; module.shouldInitialize = module.shouldInitialize || func.ok; if (!module.shouldInitialize()) { return; } // initialize module if (module.initialize) { module.initialize(); } // attach events if (module.events) { dom.attachEvents($note, module.events); } }; this.module = function (key, ModuleClass, withoutIntialize) { if (arguments.length === 1) { return this.modules[key]; } this.modules[key] = new ModuleClass(this); if (!withoutIntialize) { this.initializeModule(key); } }; this.removeModule = function (key) { var module = this.modules[key]; if (module.shouldInitialize()) { if (module.events) { dom.detachEvents($note, module.events); } if (module.destroy) { module.destroy(); } } delete this.modules[key]; }; this.memo = function (key, obj) { if (arguments.length === 1) { return this.memos[key]; } this.memos[key] = obj; }; this.removeMemo = function (key) { if (this.memos[key] && this.memos[key].destroy) { this.memos[key].destroy(); } delete this.memos[key]; }; /** *Some buttons need to change their visual style immediately once they get pressed */ this.createInvokeHandlerAndUpdateState = function (namespace, value) { return function (event) { self.createInvokeHandler(namespace, value)(event); self.invoke('buttons.updateCurrentStyle'); }; }; this.createInvokeHandler = function (namespace, value) { return function (event) { event.preventDefault(); var $target = $(event.target); self.invoke(namespace, value || $target.closest('[data-value]').data('value'), $target); }; }; this.invoke = function () { var namespace = list.head(arguments); var args = list.tail(list.from(arguments)); var splits = namespace.split('.'); var hasSeparator = splits.length > 1; var moduleName = hasSeparator && list.head(splits); var methodName = hasSeparator ? list.last(splits) : list.head(splits); var module = this.modules[moduleName || 'editor']; if (!moduleName && this[methodName]) { return this[methodName].apply(this, args); } else if (module && module[methodName] && module.shouldInitialize()) { return module[methodName].apply(module, args); } }; return this.initialize(); }; $.fn.extend({ /** * materialnote API * * @param {Object|String} * @return {this} */ materialnote: function () { var type = $.type(list.head(arguments)); var isExternalAPICalled = type === 'string'; var hasInitOptions = type === 'object'; var options = hasInitOptions ? list.head(arguments) : {}; options = $.extend({}, $.materialnote.options, options); // Update options options.langInfo = $.extend(true, {}, $.materialnote.lang['en-US'], $.materialnote.lang[options.lang]); options.icons = $.extend(true, {}, $.materialnote.options.icons, options.icons); options.tooltip = options.tooltip === 'auto' ? !agent.isSupportTouch : options.tooltip; this.each(function (idx, note) { var $note = $(note); if (!$note.data('materialnote')) { var context = new Context($note, options); $note.data('materialnote', context); $note.data('materialnote').triggerEvent('init', context.layoutInfo); } }); var $note = this.first(); if ($note.length) { var context = $note.data('materialnote'); if (isExternalAPICalled) { return context.invoke.apply(context, list.from(arguments)); } else if (options.focus) { context.invoke('editor.focus'); } } // activate plugins var $noteEditor = $note.next('.note-editor'); $noteEditor.find('.dropdown-button').dropdown({ inDuration: 300, outDuration: 225, constrainWidth: false, // Does not change width of dropdown to that of the activator //hover: true, // Activate on hover gutter: 0, // Spacing from edge belowOrigin: false, // Displays dropdown below the button alignment: 'left', // Displays dropdown with edge aligned to the left of button stopPropagation: false // Stops event propagation } ); return this; } }); var Renderer = function (markup, children, options, callback) { this.render = function ($parent) { var $node = $(markup); if (options && options.id) { //>>> add id to dropdown-content $element $node.attr('id', options.id); } if (options && options.contents) { $node.html(options.contents); } if (options && options.className) { $node.addClass(options.className); } if (options && options.data) { $.each(options.data, function (k, v) { $node.attr('data-' + k, v); }); } if (options && options.click) { $node.on('click', options.click); } if (children) { var $container = $node.find('.note-children-container'); children.forEach(function (child) { child.render($container.length ? $container : $node); }); } if (callback) { callback($node, options); } if (options && options.callback) { options.callback($node); } if ($parent) { $parent.append($node); } return $node; }; }; var renderer = { create: function (markup, callback) { return function () { var children = $.isArray(arguments[0]) ? arguments[0] : []; var options = typeof arguments[1] === 'object' ? arguments[1] : arguments[0]; if (options && options.children) { children = options.children; } return new Renderer(markup, children, options, callback); }; } }; var editor = renderer.create('<div class="note-editor note-frame panel panel-default"/>'); var toolbar = renderer.create('<div class="note-toolbar panel-heading"/>'); var editingArea = renderer.create('<div class="note-editing-area"/>'); var codable = renderer.create('<textarea class="note-codable"/>'); var editable = renderer.create('<div class="note-editable panel-body" contentEditable="true"/>'); var statusbar = renderer.create([ '<div class="note-statusbar">', ' <div class="note-resizebar">', ' <div class="note-icon-bar"/>', ' <div class="note-icon-bar"/>', ' <div class="note-icon-bar"/>', ' </div>', '</div>' ].join('')); var airEditor = renderer.create('<div class="note-editor"/>'); var airEditable = renderer.create('<div class="note-editable" contentEditable="true"/>'); var buttonGroup = renderer.create('<div class="note-btn-group btn-group">'); var dropdown = renderer.create('<div class="dropdown-content">', function ($node, options) { var markup = $.isArray(options.items) ? options.items.map(function (item) { var value = (typeof item === 'string') ? item : (item.value || ''); var content = options.template ? options.template(item) : item; var option = (typeof item === 'object') ? item.option : undefined; var dataValue = 'data-value="' + value + '"'; var dataOption = (option !== undefined) ? ' data-option="' + option + '"' : ''; return '<li><a href="#" ' + (dataValue + dataOption) + '>' + content + '</a></li>'; }).join('') : options.items; $node.html(markup); }); var dropdownCheck = renderer.create('<div class="dropdown-content note-check">', function ($node, options) { var markup = $.isArray(options.items) ? options.items.map(function (item) { var value = (typeof item === 'string') ? item : (item.value || ''); var content = options.template ? options.template(item) : item; return '<li><a href="#" data-value="' + value + '">' + icon(options.checkClassName) + ' ' + content + '</a></li>'; }).join('') : options.items; $node.html(markup); }); var palette = renderer.create('<div class="note-color-palette"/>', function ($node, options) { var contents = []; for (var row = 0, rowSize = options.colors.length; row < rowSize; row++) { var eventName = options.eventName; var colors = options.colors[row]; var colorNames = options.colorNames[row]; var buttons = []; for (var col = 0, colSize = colors.length; col < colSize; col++) { var color = colors[col]; var colorName = colorNames[col]; buttons.push([ '<button type="button" class="note-color-btn"', 'style="background-color:', color, '" ', 'data-event="', eventName, '" ', 'data-value="', color, '" ', 'data-description="', colorName, '" ', 'data-toggle="button" tabindex="-1"></button>' ].join('')); } contents.push('<div class="note-color-row">' + buttons.join('') + '</div>'); } $node.html(contents.join('')); let $btns = $node.find('.note-color-btn').toArray(); $btns.forEach(function(btn) { let $btn = $(btn); let hexColor = $btn.data('value'); let colorDescription = $btn.data('description'); $btn.tooltip({ tooltip: hexColor, position: 'bottom', delay: 200 }); $btn.hover(function() { let $colorName = $(this).closest('.note-holder').prev('.row.noMargins').find('.color-name'); $colorName.stop(true, false).fadeTo(150, 1.0, function() { $colorName.html(colorDescription); }); }); $btn.mouseleave(function() { let $colorName = $(this).closest('.note-holder').prev('.row.noMargins').find('.color-name'); $colorName.stop(true, false).fadeTo(150, 0); }); }); }); var dialog = renderer.create('<div class="modal modal-fixed-footer" tabindex="-1"/>', function ($node, options) { if (options.fade) { $node.addClass('fade'); } if (options.id) { $node.attr('id', options.id); } $node.html([ ' <div class="modal-content">', (options.title ? ' <div class="row"><div class="col s12">' + ' <h4 class="modal-title">' + options.title + '</h4>' + '</div></div>' : '' ), ' <div class="row"><div class="col s12">' + options.body + '</div></div>', ' </div>', (options.footer ? '<div class="modal-footer">' + options.footer + '</div>' : '' ) ].join('')); }); var popover = renderer.create([ '<div class="note-popover popover in">', ' <div class="arrow"/>', ' <div class="popover-content note-children-container"/>', '</div>' ].join(''), function ($node, options) { var direction = typeof options.direction !== 'undefined' ? options.direction : 'bottom'; $node.addClass(direction); if (options.hideArrow) { $node.find('.arrow').hide(); } }); var icon = function (iconName, customClasses, tagName) { tagName = tagName || 'i'; if (!customClasses) { customClasses = ''; } return '<' + tagName + ' class="material-icons ' + customClasses + '">' + iconName + '</i>'; }; var ui = { editor: editor, toolbar: toolbar, editingArea: editingArea, codable: codable, editable: editable, statusbar: statusbar, airEditor: airEditor, airEditable: airEditable, buttonGroup: buttonGroup, dropdown: dropdown, dropdownCheck: dropdownCheck, palette: palette, dialog: dialog, popover: popover, icon: icon, options: {}, button: function ($node, options) { return renderer.create('<div type="button" class="note-btn btn waves-effect waves-light" tabindex="-1">', function ($node, options) { if (options && options.tooltip && self.options.tooltip) { $node.attr({ }).tooltip({ for (j = 0; j < matrix[i].length; j++) { if (matrix[i][j] === color) { found = true; break; } } if (found) { break; } } if (found) { return {row: i, column: j}; } return null; } }, button: function ($node, options) { return renderer.create('<div class="note-btn btn waves-effect waves-light" tabindex="-1">', function ($node, options) { if (options && options.tooltip && self.options.tooltip) { $node.attr({ }).tooltip({ tooltip: options.tooltip, position: 'bottom', delay: 200 }); } })($node, options); }, toggleBtn: function ($btn, isEnable) { $btn.toggleClass('disabled', !isEnable); $btn.attr('disabled', !isEnable); }, toggleBtnActive: function ($btn, isActive) { $btn.toggleClass('active', isActive); }, onDialogShown: function ($dialog, handler) { $dialog.one('shown.bs.modal', handler); }, onDialogHidden: function ($dialog, handler) { $dialog.one('hidden.bs.modal', handler); }, showDialog: function ($dialog) { $dialog.modal('open'); }, hideDialog: function ($dialog) { $dialog.modal('close'); }, createLayout: function ($note, options) { self.options = options; var $editor = (options.airMode ? ui.airEditor([ ui.editingArea([ ui.airEditable() ]) ]) : ui.editor([ ui.toolbar(), ui.editingArea([ } }; $.materialnote = $.materialnote || { lang: {} }; $.extend($.materialnote.lang, { 'en-US': { font: { bold: 'Bold', italic: 'Italic', underline: 'Underline', clear: 'Remove Font Style', height: 'Line Height', name: 'Font Family', strikethrough: 'Strikethrough', subscript: 'Subscript', superscript: 'Superscript', size: 'Font Size' }, image: { image: 'Picture', insert: 'Insert Image', resizeFull: 'Resize Full', resizeHalf: 'Resize Half', resizeQuarter: 'Resize Quarter', floatLeft: 'Float Left', floatRight: 'Float Right', floatNone: 'Float None', shapeRounded: 'Shape: Rounded', shapeCircle: 'Shape: Circle', shapeThumbnail: 'Shape: Thumbnail', shapeNone: 'Shape: None', dragImageHere: 'Drag image or text here', dropImage: 'Drop image or Text', selectFromFiles: 'Select from files', maximumFileSize: 'Maximum file size', maximumFileSizeError: 'Maximum file size exceeded.', url: 'Image URL', remove: 'Remove Image' }, video: { video: 'Video', videoLink: 'Video Link', insert: 'Insert Video', url: 'Video URL?', providers: '(YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku)' }, link: { link: 'Link', insert: 'Insert Link', unlink: 'Unlink', edit: 'Edit', textToDisplay: 'Text to display', url: 'To what URL should this link go?', openInNewWindow: 'Open in new window' }, table: { table: 'Table', addRowAbove: 'Add row above', addRowBelow: 'Add row below', addColLeft: 'Add column left', addColRight: 'Add column right', delRow: 'Delete row', delCol: 'Delete column', delTable: 'Delete table' }, hr: { insert: 'Insert Horizontal Rule' }, style: { style: 'Style', p: 'Normal', blockquote: 'Quote', pre: 'Code', h1: 'Header 1', h2: 'Header 2', h3: 'Header 3', h4: 'Header 4', h5: 'Header 5', h6: 'Header 6' }, lists: { unordered: 'Unordered list', ordered: 'Ordered list' }, options: { help: 'Help', fullscreen: 'Full Screen', codeview: 'Code View' }, paragraph: { paragraph: 'Paragraph', outdent: 'Outdent', indent: 'Indent', left: 'Align left', center: 'Align center', right: 'Align right', justify: 'Justify full' }, color: { recent: 'Recent Color', more: 'More Color', background: 'Background', foreground: 'Foreground', transparent: 'Transparent', setTransparent: 'Set transparent', reset: 'Reset', resetToDefault: 'Reset to default' }, shortcut: { shortcuts: 'Keyboard shortcuts', close: 'Close', textFormatting: 'Text formatting', action: 'Action', paragraphFormatting: 'Paragraph formatting', documentStyle: 'Document Style', extraKeys: 'Extra keys' }, help: { 'insertParagraph': 'Insert Paragraph', 'undo': 'Undoes the last command', 'redo': 'Redoes the last command', 'tab': 'Tab', 'untab': 'Untab', 'bold': 'Set a bold style', 'italic': 'Set a italic style', 'underline': 'Set a underline style', 'strikethrough': 'Set a strikethrough style', 'removeFormat': 'Clean a style', 'justifyLeft': 'Set left align', 'justifyCenter': 'Set center align', 'justifyRight': 'Set right align', 'justifyFull': 'Set full align', 'insertUnorderedList': 'Toggle unordered list', 'insertOrderedList': 'Toggle ordered list', 'outdent': 'Outdent on current paragraph', 'indent': 'Indent on current paragraph', 'formatPara': 'Change current block\'s format as a paragraph(P tag)', 'formatH1': 'Change current block\'s format as H1', 'formatH2': 'Change current block\'s format as H2', 'formatH3': 'Change current block\'s format as H3', 'formatH4': 'Change current block\'s format as H4', 'formatH5': 'Change current block\'s format as H5', 'formatH6': 'Change current block\'s format as H6', 'insertHorizontalRule': 'Insert horizontal rule', 'linkDialog.show': 'Show Link Dialog' }, history: { undo: 'Undo', redo: 'Redo' }, specialChar: { specialChar: 'SPECIAL CHARACTERS', select: 'Select Special characters' } } }); /** 'insertOrderedList': 'Toggle ordered list', 'outdent': 'Outdent on current paragraph', 'indent': 'Indent on current paragraph', 'formatPara': 'Change current block\'s format as a paragraph(P tag)', 'formatH1': 'Change current block\'s format as H1', 'formatH2': 'Change current block\'s format as H2', 'formatH3': 'Change current block\'s format as H3', 'formatH4': 'Change current block\'s format as H4', 'formatH5': 'Change current block\'s format as H5', 'formatH6': 'Change current block\'s format as H6', 'insertHorizontalRule': 'Insert horizontal rule', 'linkDialog.show': 'Show Link Dialog', project: 'Project', issues: 'Issues' }, history: { undo: 'Undo', redo: 'Redo' }, specialChar: { specialChar: 'SPECIAL CHARACTERS', select: 'Select Special characters' } } }); /** * @class core.key * * Object for keycodes. * * @singleton * @alternateClassName key */ var key = (function () { var keyMap = { 'BACKSPACE': 8, 'TAB': 9, 'ENTER': 13, 'SPACE': 32, 'DELETE': 46, // Arrow 'LEFT': 37, 'UP': 38, 'RIGHT': 39, 'DOWN': 40, // Number: 0-9 'NUM0': 48, 'NUM1': 49, 'NUM2': 50, 'NUM3': 51, 'NUM4': 52, 'NUM5': 53, 'NUM6': 54, 'NUM7': 55, 'NUM8': 56, // Alphabet: a-z 'B': 66, 'E': 69, 'I': 73, 'J': 74, 'K': 75, 'L': 76, 'R': 82, 'S': 83, 'U': 85, 'V': 86, 'Y': 89, 'Z': 90, 'SLASH': 191, 'LEFTBRACKET': 219, 'BACKSLASH': 220, 'RIGHTBRACKET': 221 }; return { /** * @method isEdit * * @param {Number} keyCode * @return {Boolean} */ isEdit: function (keyCode) { }; })(); var range = (function () { /** * return boundaryPoint from TextRange, inspired by Andy Na's HuskyRange.js * * @param {TextRange} textRange * @param {Boolean} isStart * @return {BoundaryPoint} * * @see http://msdn.microsoft.com/en-us/library/ie/ms535872(v=vs.85).aspx */ var textRangeToPoint = function (textRange, isStart) { var container = textRange.parentElement(), offset; var tester = document.body.createTextRange(), prevContainer; var childNodes = list.from(container.childNodes); for (offset = 0; offset < childNodes.length; offset++) { if (dom.isText(childNodes[offset])) { continue; } tester.moveToElementText(childNodes[offset]); if (tester.compareEndPoints('StartToStart', textRange) >= 0) { break; } prevContainer = childNodes[offset]; } if (offset !== 0 && dom.isText(childNodes[offset - 1])) { var textRangeStart = document.body.createTextRange(), curTextNode = null; textRangeStart.moveToElementText(prevContainer || container); textRangeStart.collapse(!prevContainer); curTextNode = prevContainer ? prevContainer.nextSibling : container.firstChild; var pointTester = textRange.duplicate(); pointTester.setEndPoint('StartToStart', textRangeStart); var textCount = pointTester.text.replace(/[\r\n]/g, '').length; while (textCount > curTextNode.nodeValue.length && curTextNode.nextSibling) { textCount -= curTextNode.nodeValue.length; curTextNode = curTextNode.nextSibling; } /* jshint ignore:start */ var dummy = curTextNode.nodeValue; // enforce IE to re-reference curTextNode, hack /* jshint ignore:end */ if (isStart && curTextNode.nextSibling && dom.isText(curTextNode.nextSibling) && textCount === curTextNode.nodeValue.length) { textCount -= curTextNode.nodeValue.length; curTextNode = curTextNode.nextSibling; } container = curTextNode; offset = textCount; } return { cont: container, offset: offset }; }; /** * return TextRange from boundary point (inspired by google closure-library) * @param {BoundaryPoint} point * @return {TextRange} */ var pointToTextRange = function (point) { var textRangeInfo = function (container, offset) { var node, isCollapseToStart; if (dom.isText(container)) { var prevTextNodes = dom.listPrev(container, func.not(dom.isText)); var prevContainer = list.last(prevTextNodes).previousSibling; node = prevContainer || container.parentNode; offset += list.sum(list.tail(prevTextNodes), dom.nodeLength); isCollapseToStart = !prevContainer; } else { node = container.childNodes[offset] || container; if (dom.isText(node)) { return textRangeInfo(node, 0); } offset = 0; isCollapseToStart = false; } return { node: node, collapseToStart: isCollapseToStart, offset: offset }; }; var textRange = document.body.createTextRange(); var info = textRangeInfo(point.node, point.offset); textRange.moveToElementText(info.node); textRange.collapse(info.collapseToStart); textRange.moveStart('character', info.offset); return textRange; }; /** * Wrapped Range * * @constructor * @param {Node} sc - start container * @param {Number} so - start offset * @param {Node} ec - end container * @param {Number} eo - end offset */ var WrappedRange = function (sc, so, ec, eo) { this.sc = sc; this.so = so; this.ec = ec; this.eo = eo; // nativeRange: get nativeRange from sc, so, ec, eo var nativeRange = function () { if (agent.isW3CRangeSupport) { var w3cRange = document.createRange(); w3cRange.setStart(sc, so); w3cRange.setEnd(ec, eo); return w3cRange; } else { var textRange = pointToTextRange({ node: sc, offset: so }); textRange.setEndPoint('EndToEnd', pointToTextRange({ node: ec, offset: eo })); return textRange; } }; this.getPoints = function () { return { sc: sc, so: so, ec: ec, eo: eo }; }; this.getStartPoint = function () { return { node: sc, offset: so }; }; this.getEndPoint = function () { return { node: ec, offset: eo }; }; /** * select update visible range */ this.select = function () { var nativeRng = nativeRange(); if (agent.isW3CRangeSupport) { var selection = document.getSelection(); if (selection.rangeCount > 0) { selection.removeAllRanges(); } selection.addRange(nativeRng); } else { nativeRng.select(); } return this; }; /** * Moves the scrollbar to start container(sc) of current range * * @return {WrappedRange} */ this.scrollIntoView = function (container) { var height = $(container).height(); if (container.scrollTop + height < this.sc.offsetTop) { container.scrollTop += Math.abs(container.scrollTop + height - this.sc.offsetTop); } return this; }; /** * @return {WrappedRange} */ this.normalize = function () { /** * @param {BoundaryPoint} point * @param {Boolean} isLeftToRight * @return {BoundaryPoint} */ var getVisiblePoint = function (point, isLeftToRight) { if ((dom.isVisiblePoint(point) && !dom.isEdgePoint(point)) || (dom.isVisiblePoint(point) && dom.isRightEdgePoint(point) && !isLeftToRight) || (dom.isVisiblePoint(point) && dom.isLeftEdgePoint(point) && isLeftToRight) || (dom.isVisiblePoint(point) && dom.isBlock(point.node) && dom.isEmpty(point.node))) { return point; } // point on block's edge var block = dom.ancestor(point.node, dom.isBlock); if (((dom.isLeftEdgePointOf(point, block) || dom.isVoid(dom.prevPoint(point).node)) && !isLeftToRight) || ((dom.isRightEdgePointOf(point, block) || dom.isVoid(dom.nextPoint(point).node)) && isLeftToRight)) { // returns point already on visible point if (dom.isVisiblePoint(point)) { return point; } // reverse direction isLeftToRight = !isLeftToRight; } var nextPoint = isLeftToRight ? dom.nextPointUntil(dom.nextPoint(point), dom.isVisiblePoint) : dom.prevPointUntil(dom.prevPoint(point), dom.isVisiblePoint); return nextPoint || point; }; var endPoint = getVisiblePoint(this.getEndPoint(), false); var startPoint = this.isCollapsed() ? endPoint : getVisiblePoint(this.getStartPoint(), true); return new WrappedRange( startPoint.node, startPoint.offset, endPoint.node, endPoint.offset ); }; /** * returns matched nodes on range * * @param {Function} [pred] - predicate function * @param {Object} [options] * @param {Boolean} [options.includeAncestor] * @param {Boolean} [options.fullyContains] * @return {Node[]} */ this.nodes = function (pred, options) { pred = pred || func.ok; var includeAncestor = options && options.includeAncestor; var fullyContains = options && options.fullyContains; // TODO compare points and sort var startPoint = this.getStartPoint(); var endPoint = this.getEndPoint(); var nodes = []; var leftEdgeNodes = []; dom.walkPoint(startPoint, endPoint, function (point) { if (dom.isEditable(point.node)) { return; } var node; if (fullyContains) { if (dom.isLeftEdgePoint(point)) { leftEdgeNodes.push(point.node); } if (dom.isRightEdgePoint(point) && list.contains(leftEdgeNodes, point.node)) { node = point.node; } } else if (includeAncestor) { node = dom.ancestor(point.node, pred); } else { node = point.node; } if (node && pred(node)) { nodes.push(node); } }, true); return list.unique(nodes); }; /** * returns commonAncestor of range * @return {Element} - commonAncestor */ this.commonAncestor = function () { return dom.commonAncestor(sc, ec); }; /** * returns expanded range by pred * * @param {Function} pred - predicate function * @return {WrappedRange} */ this.expand = function (pred) { var startAncestor = dom.ancestor(sc, pred); var endAncestor = dom.ancestor(ec, pred); if (!startAncestor && !endAncestor) { return new WrappedRange(sc, so, ec, eo); } var boundaryPoints = this.getPoints(); if (startAncestor) { boundaryPoints.sc = startAncestor; boundaryPoints.so = 0; } if (endAncestor) { boundaryPoints.ec = endAncestor; boundaryPoints.eo = dom.nodeLength(endAncestor); } return new WrappedRange( boundaryPoints.sc, boundaryPoints.so, boundaryPoints.ec, boundaryPoints.eo ); }; /** * @param {Boolean} isCollapseToStart * @return {WrappedRange} */ this.collapse = function (isCollapseToStart) { if (isCollapseToStart) { return new WrappedRange(sc, so, sc, so); } else { return new WrappedRange(ec, eo, ec, eo); } }; /** * splitText on range */ this.splitText = function () { var isSameContainer = sc === ec; var boundaryPoints = this.getPoints(); if (dom.isText(ec) && !dom.isEdgePoint(this.getEndPoint())) { ec.splitText(eo); } if (dom.isText(sc) && !dom.isEdgePoint(this.getStartPoint())) { boundaryPoints.sc = sc.splitText(so); boundaryPoints.so = 0; if (isSameContainer) { boundaryPoints.ec = boundaryPoints.sc; boundaryPoints.eo = eo - so; } } return new WrappedRange( boundaryPoints.sc, boundaryPoints.so, boundaryPoints.ec, boundaryPoints.eo ); }; /** * delete contents on range * @return {WrappedRange} */ this.deleteContents = function () { if (this.isCollapsed()) { return this; } var rng = this.splitText(); var nodes = rng.nodes(null, { fullyContains: true }); // find new cursor point var point = dom.prevPointUntil(rng.getStartPoint(), function (point) { return !list.contains(nodes, point.node); }); var emptyParents = []; $.each(nodes, function (idx, node) { // find empty parents var parent = node.parentNode; if (point.node !== parent && dom.nodeLength(parent) === 1) { emptyParents.push(parent); } dom.remove(node, false); }); // remove empty parents $.each(emptyParents, function (idx, node) { dom.remove(node, false); }); return new WrappedRange( point.node, point.offset, point.node, point.offset ).normalize(); }; /** * makeIsOn: return isOn(pred) function */ var makeIsOn = function (pred) { return function () { var ancestor = dom.ancestor(sc, pred); return !!ancestor && (ancestor === dom.ancestor(ec, pred)); }; }; // isOnEditable: judge whether range is on editable or not this.isOnEditable = makeIsOn(dom.isEditable); // isOnList: judge whether range is on list node or not this.isOnList = makeIsOn(dom.isList); // isOnAnchor: judge whether range is on anchor node or not this.isOnAnchor = makeIsOn(dom.isAnchor); // isOnCell: judge whether range is on cell node or not this.isOnCell = makeIsOn(dom.isCell); // isOnData: judge whether range is on data node or not this.isOnData = makeIsOn(dom.isData); /** * @param {Function} pred * @return {Boolean} */ this.isLeftEdgeOf = function (pred) { if (!dom.isLeftEdgePoint(this.getStartPoint())) { return false; } var node = dom.ancestor(this.sc, pred); return node && dom.isLeftEdgeOf(this.sc, node); }; /** * returns whether range was collapsed or not */ this.isCollapsed = function () { return sc === ec &&
uploading dist