From: Aleksander Łukasz Date: Mon, 1 Jul 2013 07:48:16 +0000 (+0200) Subject: Converting end of lines from crlf to lf X-Git-Url: https://git.mdrn.pl/fnpeditor.git/commitdiff_plain/a398f2a96740ebe6dd60559d90e74c648e7009af?ds=sidebyside Converting end of lines from crlf to lf --- diff --git a/entrypoint.js b/entrypoint.js index 6f81c94..f15a832 100644 --- a/entrypoint.js +++ b/entrypoint.js @@ -1,7 +1,7 @@ (function() { 'use strict'; - requirejs.config({ + requirejs.config({ baseUrl: '/static/editor', shim: { @@ -19,7 +19,7 @@ deps: ['libs/jquery-1.9.1.min', 'libs/underscore-min'] } } - + }); requirejs([ diff --git a/fnpjs/layout.js b/fnpjs/layout.js index d5fa098..05252fb 100644 --- a/fnpjs/layout.js +++ b/fnpjs/layout.js @@ -1,37 +1,37 @@ -define(['libs/jquery-1.9.1.min', 'libs/underscore-min'], function($ ,_) { - 'use strict'; - - var Layout = function(template) { - var layout = this; - this.dom = $(_.template(template)()); - this.views = {}; - - this.dom.onShow = function() { - _.values(layout.views).forEach(function(view) { - if(view.onShow) - view.onShow(); - }); - }; - this.dom.onHide = function() { - _.values(layout.views).forEach(function(view) { - if(view.onHide) - view.onHide(); - }); - }; - - }; - - Layout.prototype.setView = function(place, view) { - this.dom.find('[fnpjs-place=' + place + ']').append(view); - this.views[place] = view; - if(this.dom.is(':visible') && view.onShow) { - view.onShow(); - } - }; - - Layout.prototype.getAsView = function() { - return this.dom; - }; - - return {Layout: Layout}; +define(['libs/jquery-1.9.1.min', 'libs/underscore-min'], function($ ,_) { + 'use strict'; + + var Layout = function(template) { + var layout = this; + this.dom = $(_.template(template)()); + this.views = {}; + + this.dom.onShow = function() { + _.values(layout.views).forEach(function(view) { + if(view.onShow) + view.onShow(); + }); + }; + this.dom.onHide = function() { + _.values(layout.views).forEach(function(view) { + if(view.onHide) + view.onHide(); + }); + }; + + }; + + Layout.prototype.setView = function(place, view) { + this.dom.find('[fnpjs-place=' + place + ']').append(view); + this.views[place] = view; + if(this.dom.is(':visible') && view.onShow) { + view.onShow(); + } + }; + + Layout.prototype.getAsView = function() { + return this.dom; + }; + + return {Layout: Layout}; }); \ No newline at end of file diff --git a/fnpjs/runner.js b/fnpjs/runner.js index 817011d..d8dcda9 100644 --- a/fnpjs/runner.js +++ b/fnpjs/runner.js @@ -1,77 +1,77 @@ -define(['libs/jquery-1.9.1.min', 'libs/underscore-min'], function($, _) { - -var Runner = function(app, modules) { - - function getModuleInstance(moduleName) { - var module = moduleInstances[moduleName] = (moduleInstances[moduleName] || modules[moduleName](new Sandbox(moduleName))); - return module; - } - - var bootstrappedData = {}, - options = {}, - moduleInstances = {}, - eventListeners = []; - - _.each(_.keys(modules || {}), function(moduleName) { - if(_.contains(app.permissions[moduleName] || [], 'handleEvents')) { - eventListeners.push(moduleName); - } - }); - - - - var Sandbox = function(moduleName) { - this.$ = $; - this._ = _; - - this.getBootstrappedData = function() { - return bootstrappedData[moduleName]; - }; - - this.getTemplate = function(templateName) { - return _.template($('[data-template-name="' + moduleName + '.' + templateName + '"]').html().trim()); - }; - - this.publish = function(eventName) { - console.log(moduleName + ': ' + eventName); - var eventArgs = Array.prototype.slice.call(arguments, 1); - _.each(eventListeners, function(listenerModuleName) { - var listener = moduleInstances[listenerModuleName]; - if(listener) { - listener.handleEvent(moduleName, eventName, eventArgs); - } - }); - }; - - var permissions = app.permissions[moduleName]; - - this.getModule = _.contains(permissions, 'getModule') ? function(requestedModuleName) { - return getModuleInstance(requestedModuleName); - } : undefined; - - this.getDOM = _.contains(permissions, 'getDOM') ? function() { - return $(options.rootSelector); - } : undefined; - - }; - - - this.setBootstrappedData = function(moduleName, data) { - bootstrappedData[moduleName] = data; - }; - - this.start = function(_options) { - options = _.extend({ - rootSelector: 'body' - }, _options); - app.initModules.forEach(function(moduleName) { - getModuleInstance(moduleName).start(); - }); - }; -}; - -return { - Runner: Runner -}; - +define(['libs/jquery-1.9.1.min', 'libs/underscore-min'], function($, _) { + +var Runner = function(app, modules) { + + function getModuleInstance(moduleName) { + var module = moduleInstances[moduleName] = (moduleInstances[moduleName] || modules[moduleName](new Sandbox(moduleName))); + return module; + } + + var bootstrappedData = {}, + options = {}, + moduleInstances = {}, + eventListeners = []; + + _.each(_.keys(modules || {}), function(moduleName) { + if(_.contains(app.permissions[moduleName] || [], 'handleEvents')) { + eventListeners.push(moduleName); + } + }); + + + + var Sandbox = function(moduleName) { + this.$ = $; + this._ = _; + + this.getBootstrappedData = function() { + return bootstrappedData[moduleName]; + }; + + this.getTemplate = function(templateName) { + return _.template($('[data-template-name="' + moduleName + '.' + templateName + '"]').html().trim()); + }; + + this.publish = function(eventName) { + console.log(moduleName + ': ' + eventName); + var eventArgs = Array.prototype.slice.call(arguments, 1); + _.each(eventListeners, function(listenerModuleName) { + var listener = moduleInstances[listenerModuleName]; + if(listener) { + listener.handleEvent(moduleName, eventName, eventArgs); + } + }); + }; + + var permissions = app.permissions[moduleName]; + + this.getModule = _.contains(permissions, 'getModule') ? function(requestedModuleName) { + return getModuleInstance(requestedModuleName); + } : undefined; + + this.getDOM = _.contains(permissions, 'getDOM') ? function() { + return $(options.rootSelector); + } : undefined; + + }; + + + this.setBootstrappedData = function(moduleName, data) { + bootstrappedData[moduleName] = data; + }; + + this.start = function(_options) { + options = _.extend({ + rootSelector: 'body' + }, _options); + app.initModules.forEach(function(moduleName) { + getModuleInstance(moduleName).start(); + }); + }; +}; + +return { + Runner: Runner +}; + }); \ No newline at end of file diff --git a/fnpjs/vbox.js b/fnpjs/vbox.js index 84ac6db..569bf16 100644 --- a/fnpjs/vbox.js +++ b/fnpjs/vbox.js @@ -1,13 +1,13 @@ -define(['libs/jquery-1.9.1.min', './layout'], function($, layout) { - - var VBox = function() {}; - - VBox.prototype = new layout.Layout('
'); - VBox.prototype.appendView = function(view) { - var item = $('
').addClass('fnpjs-vbox-item').append(view); - this.dom.append(item); - }; - - return {VBox: VBox}; - +define(['libs/jquery-1.9.1.min', './layout'], function($, layout) { + + var VBox = function() {}; + + VBox.prototype = new layout.Layout('
'); + VBox.prototype.appendView = function(view) { + var item = $('
').addClass('fnpjs-vbox-item').append(view); + this.dom.append(item); + }; + + return {VBox: VBox}; + }); \ No newline at end of file diff --git a/karma.conf.js b/karma.conf.js index 9f3fa53..5153a22 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -1,42 +1,42 @@ -basePath = ''; - -files = [ - MOCHA, - MOCHA_ADAPTER, - REQUIRE, - REQUIRE_ADAPTER, - - 'vkbeautify.js', - {pattern: 'libs/*.js', included: false}, - {pattern: 'fnpjs/**/*.js', included: false}, - {pattern: 'modules/**/*.js', included: false}, - {pattern: 'views/**/*.js', included: false}, - {pattern: 'fnpjs/**/*.html', included: false}, - {pattern: 'modules/**/*.html', included: false}, - {pattern: 'views/**/*.html', included: false}, - - 'tests/main.js', -]; - -reporters = ['progress']; - -port = 9876; -runnerPort = 9100; -captureTimeout = 60000; - -autoWatch = true; -singleRun = false; - -browsers = ['PhantomJS']; - -colors = true; -logLevel = LOG_INFO; - - - - - - - - - +basePath = ''; + +files = [ + MOCHA, + MOCHA_ADAPTER, + REQUIRE, + REQUIRE_ADAPTER, + + 'vkbeautify.js', + {pattern: 'libs/*.js', included: false}, + {pattern: 'fnpjs/**/*.js', included: false}, + {pattern: 'modules/**/*.js', included: false}, + {pattern: 'views/**/*.js', included: false}, + {pattern: 'fnpjs/**/*.html', included: false}, + {pattern: 'modules/**/*.html', included: false}, + {pattern: 'views/**/*.html', included: false}, + + 'tests/main.js', +]; + +reporters = ['progress']; + +port = 9876; +runnerPort = 9100; +captureTimeout = 60000; + +autoWatch = true; +singleRun = false; + +browsers = ['PhantomJS']; + +colors = true; +logLevel = LOG_INFO; + + + + + + + + + diff --git a/modules.js b/modules.js index 46d787e..bb4d439 100644 --- a/modules.js +++ b/modules.js @@ -1,28 +1,28 @@ -define(function(require) { - /* - Each module must be required explicitly by apropriate 'require' function call - in order for requirejs optimizer to work. - */ - - 'use strict'; - - return { - data: require('modules/data/data'), - rng: require('modules/rng/rng'), - mainBar: require('modules/mainBar/mainBar'), - indicator: require('modules/indicator/indicator'), - - sourceEditor: require('modules/sourceEditor/sourceEditor'), - - documentCanvas: require('modules/documentCanvas/documentCanvas'), - documentToolbar: require('modules/documentToolbar/documentToolbar'), - nodePane: require('modules/nodePane/nodePane'), - metadataEditor: require('modules/metadataEditor/metadataEditor'), - nodeFamilyTree: require('modules/nodeFamilyTree/nodeFamilyTree'), - nodeBreadCrumbs: require('modules/nodeBreadCrumbs/nodeBreadCrumbs'), - - documentHistory: require('modules/documentHistory/documentHistory'), - diffViewer: require('modules/diffViewer/diffViewer') - - } +define(function(require) { + /* + Each module must be required explicitly by apropriate 'require' function call + in order for requirejs optimizer to work. + */ + + 'use strict'; + + return { + data: require('modules/data/data'), + rng: require('modules/rng/rng'), + mainBar: require('modules/mainBar/mainBar'), + indicator: require('modules/indicator/indicator'), + + sourceEditor: require('modules/sourceEditor/sourceEditor'), + + documentCanvas: require('modules/documentCanvas/documentCanvas'), + documentToolbar: require('modules/documentToolbar/documentToolbar'), + nodePane: require('modules/nodePane/nodePane'), + metadataEditor: require('modules/metadataEditor/metadataEditor'), + nodeFamilyTree: require('modules/nodeFamilyTree/nodeFamilyTree'), + nodeBreadCrumbs: require('modules/nodeBreadCrumbs/nodeBreadCrumbs'), + + documentHistory: require('modules/documentHistory/documentHistory'), + diffViewer: require('modules/diffViewer/diffViewer') + + } }); \ No newline at end of file diff --git a/modules/data/data.js b/modules/data/data.js index 8bd553c..9b2f163 100644 --- a/modules/data/data.js +++ b/modules/data/data.js @@ -1,133 +1,133 @@ -define(['./saveDialog'], function(saveDialog) { - -'use strict'; - -return function(sandbox) { - - var doc = sandbox.getBootstrappedData().document; - var document_id = sandbox.getBootstrappedData().document_id; - var document_version = sandbox.getBootstrappedData().version; - var history = sandbox.getBootstrappedData().history; - - - if(doc === '') { - doc = '\n\ - \n\ - \n\ -
\n\ - '; - } - - - function readCookie(name) { - var nameEQ = escape(name) + "="; - var ca = document.cookie.split(';'); - for (var i = 0; i < ca.length; i++) { - var c = ca[i]; - while (c.charAt(0) == ' ') c = c.substring(1, c.length); - if (c.indexOf(nameEQ) === 0) return unescape(c.substring(nameEQ.length, c.length)); - } - return null; - } - - $.ajaxSetup({ - crossDomain: false, - beforeSend: function(xhr, settings) { - if (!(/^(GET|HEAD|OPTIONS|TRACE)$/.test(settings.type))) { - xhr.setRequestHeader("X-CSRFToken", readCookie('csrftoken')); - } - } - }); - - var reloadHistory = function() { - $.ajax({ - method: 'get', - url: '/' + gettext('editor') + '/' + document_id + '/history', - success: function(data) { - history = data; - sandbox.publish('historyItemAdded', data.slice(-1)[0]); - }, - }); - }; - - return { - start: function() { - sandbox.publish('ready'); - }, - getDocument: function() { - return doc; - }, - commitDocument: function(newDocument, reason) { - doc = newDocument; - sandbox.publish('documentChanged', doc, reason); - }, - saveDocument: function() { - - var dialog = saveDialog.create(); - dialog.on('save', function(event) { - sandbox.publish('savingStarted'); - dialog.toggleButtons(false); - $.ajax({ - method: 'post', - url: '/' + gettext('editor') + '/' + document_id, - data: JSON.stringify({document:doc, description: event.data.description}), - success: function() { - event.success(); - sandbox.publish('savingEnded', 'success'); - reloadHistory(); - }, - error: function() {event.error(); sandbox.publish('savingEnded', 'error');} - }); - console.log('save'); - }); - dialog.on('cancel', function() { - }); - dialog.show(); - - - }, - getHistory: function() { - return history; - }, - fetchDiff: function(ver1, ver2) { - $.ajax({ - method: 'get', - url: '/' + gettext('editor') + '/' + document_id + '/diff', - data: {from: ver1, to: ver2}, - success: function(data) { - sandbox.publish('diffFetched', {table: data, ver1: ver1, ver2: ver2}); - }, - }); - }, - restoreVersion: function(options) { - if(options.version && options.description) { - sandbox.publish('restoringStarted', {version: options.version}); - $.ajax({ - method: 'post', - dataType: 'json', - url: '/' + gettext('editor') + '/' + document_id + '/revert', - data: JSON.stringify(options), - success: function(data) { - doc = data.document; - document_version = data.version; - reloadHistory(); - sandbox.publish('documentReverted', data); - }, - }); - } - }, - getDocumentId: function() { - return document_id; - }, - getDocumentVersion: function() { - return document_version; - } - }; -}; - +define(['./saveDialog'], function(saveDialog) { + +'use strict'; + +return function(sandbox) { + + var doc = sandbox.getBootstrappedData().document; + var document_id = sandbox.getBootstrappedData().document_id; + var document_version = sandbox.getBootstrappedData().version; + var history = sandbox.getBootstrappedData().history; + + + if(doc === '') { + doc = '\n\ + \n\ + \n\ +
\n\ + '; + } + + + function readCookie(name) { + var nameEQ = escape(name) + "="; + var ca = document.cookie.split(';'); + for (var i = 0; i < ca.length; i++) { + var c = ca[i]; + while (c.charAt(0) == ' ') c = c.substring(1, c.length); + if (c.indexOf(nameEQ) === 0) return unescape(c.substring(nameEQ.length, c.length)); + } + return null; + } + + $.ajaxSetup({ + crossDomain: false, + beforeSend: function(xhr, settings) { + if (!(/^(GET|HEAD|OPTIONS|TRACE)$/.test(settings.type))) { + xhr.setRequestHeader("X-CSRFToken", readCookie('csrftoken')); + } + } + }); + + var reloadHistory = function() { + $.ajax({ + method: 'get', + url: '/' + gettext('editor') + '/' + document_id + '/history', + success: function(data) { + history = data; + sandbox.publish('historyItemAdded', data.slice(-1)[0]); + }, + }); + }; + + return { + start: function() { + sandbox.publish('ready'); + }, + getDocument: function() { + return doc; + }, + commitDocument: function(newDocument, reason) { + doc = newDocument; + sandbox.publish('documentChanged', doc, reason); + }, + saveDocument: function() { + + var dialog = saveDialog.create(); + dialog.on('save', function(event) { + sandbox.publish('savingStarted'); + dialog.toggleButtons(false); + $.ajax({ + method: 'post', + url: '/' + gettext('editor') + '/' + document_id, + data: JSON.stringify({document:doc, description: event.data.description}), + success: function() { + event.success(); + sandbox.publish('savingEnded', 'success'); + reloadHistory(); + }, + error: function() {event.error(); sandbox.publish('savingEnded', 'error');} + }); + console.log('save'); + }); + dialog.on('cancel', function() { + }); + dialog.show(); + + + }, + getHistory: function() { + return history; + }, + fetchDiff: function(ver1, ver2) { + $.ajax({ + method: 'get', + url: '/' + gettext('editor') + '/' + document_id + '/diff', + data: {from: ver1, to: ver2}, + success: function(data) { + sandbox.publish('diffFetched', {table: data, ver1: ver1, ver2: ver2}); + }, + }); + }, + restoreVersion: function(options) { + if(options.version && options.description) { + sandbox.publish('restoringStarted', {version: options.version}); + $.ajax({ + method: 'post', + dataType: 'json', + url: '/' + gettext('editor') + '/' + document_id + '/revert', + data: JSON.stringify(options), + success: function(data) { + doc = data.document; + document_version = data.version; + reloadHistory(); + sandbox.publish('documentReverted', data); + }, + }); + } + }, + getDocumentId: function() { + return document_id; + }, + getDocumentVersion: function() { + return document_version; + } + }; +}; + }); \ No newline at end of file diff --git a/modules/data/saveDialog.html b/modules/data/saveDialog.html index 496d886..0846910 100644 --- a/modules/data/saveDialog.html +++ b/modules/data/saveDialog.html @@ -1,14 +1,14 @@ -
-
- -

Zapisz dokument

-
-
- - -
-
- Zapisz - Anuluj -
+
+
+ +

Zapisz dokument

+
+
+ + +
+
+ Zapisz + Anuluj +
\ No newline at end of file diff --git a/modules/data/saveDialog.js b/modules/data/saveDialog.js index 0bdb718..d0049d5 100644 --- a/modules/data/saveDialog.js +++ b/modules/data/saveDialog.js @@ -1,56 +1,56 @@ -define([ -'libs/text!./saveDialog.html', -'libs/underscore-min', -'libs/backbone-min', -'libs/jquery-1.9.1.min' -], function(saveDialogTemplate, _, Backbone, $) { - - var DialogView = Backbone.View.extend({ - template: _.template(saveDialogTemplate), - events: { - 'click .save-btn': 'onSave', - 'click .cancel-btn': 'close', - 'click .close': 'close' - }, - initialize: function() { - _.bindAll(this); - this.actionsDisabled = false; - }, - show: function() { - this.setElement(this.template()); - this.$el.modal({backdrop: 'static'}); - this.$el.modal('show'); - this.$('textarea').focus(); - - }, - onSave: function(e) { - e.preventDefault(); - var view = this; - this.trigger('save', { - data: {description: view.$el.find('textarea').val()}, - success: function() { view.actionsDisabled = false; view.close(); }, - error: function() { view.actionsDisabled = false; view.close(); }, - }); - }, - close: function(e) { - if(e) - e.preventDefault(); - if(!this.actionsDisabled) { - this.$el.modal('hide'); - this.$el.remove(); - } - }, - toggleButtons: function(toggle) { - this.$('.btn, button').toggleClass('disabled', !toggle); - this.$('textarea').attr('disabled', !toggle); - this.actionsDisabled = !toggle; - } - }); - - return { - create: function() { - return new DialogView(); - } - }; - +define([ +'libs/text!./saveDialog.html', +'libs/underscore-min', +'libs/backbone-min', +'libs/jquery-1.9.1.min' +], function(saveDialogTemplate, _, Backbone, $) { + + var DialogView = Backbone.View.extend({ + template: _.template(saveDialogTemplate), + events: { + 'click .save-btn': 'onSave', + 'click .cancel-btn': 'close', + 'click .close': 'close' + }, + initialize: function() { + _.bindAll(this); + this.actionsDisabled = false; + }, + show: function() { + this.setElement(this.template()); + this.$el.modal({backdrop: 'static'}); + this.$el.modal('show'); + this.$('textarea').focus(); + + }, + onSave: function(e) { + e.preventDefault(); + var view = this; + this.trigger('save', { + data: {description: view.$el.find('textarea').val()}, + success: function() { view.actionsDisabled = false; view.close(); }, + error: function() { view.actionsDisabled = false; view.close(); }, + }); + }, + close: function(e) { + if(e) + e.preventDefault(); + if(!this.actionsDisabled) { + this.$el.modal('hide'); + this.$el.remove(); + } + }, + toggleButtons: function(toggle) { + this.$('.btn, button').toggleClass('disabled', !toggle); + this.$('textarea').attr('disabled', !toggle); + this.actionsDisabled = !toggle; + } + }); + + return { + create: function() { + return new DialogView(); + } + }; + }); \ No newline at end of file diff --git a/modules/data/saveDialog.less b/modules/data/saveDialog.less index 53c7d47..e863e93 100644 --- a/modules/data/saveDialog.less +++ b/modules/data/saveDialog.less @@ -1,19 +1,19 @@ -.rng-module-data-saveDialog { - textarea { - padding: 3px 3px; - margin: 5px auto; - width: 95%; - display: block; - } - - h1, label { - font-size: 12px; - line-height: 12px; - - } - - h1 { - margin: 2px 5px; - font-weight: bold; - } +.rng-module-data-saveDialog { + textarea { + padding: 3px 3px; + margin: 5px auto; + width: 95%; + display: block; + } + + h1, label { + font-size: 12px; + line-height: 12px; + + } + + h1 { + margin: 2px 5px; + font-weight: bold; + } } \ No newline at end of file diff --git a/modules/diffViewer/diffViewer.js b/modules/diffViewer/diffViewer.js index 12e022a..be0e431 100644 --- a/modules/diffViewer/diffViewer.js +++ b/modules/diffViewer/diffViewer.js @@ -1,38 +1,38 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/underscore-min', -'views/tabs/tabs', -'libs/text!./diff.html' -], function($, _, tabs, diffTemplateSrc) { - -'use strict'; - -return function(sandbox) { - - var dom = $('
').addClass('rng-module-diffViewer'); - var tabsView = (new tabs.View({position: 'right'})).render(); - dom.append(tabsView.getAsView()); - - var DiffView = function() { - this.dom = $(diffTemplateSrc); - }; - - DiffView.prototype.setTable = function(table) { - this.dom.append(table); - }; - - - return { - start: function() {sandbox.publish('ready');}, - getView: function() {return dom;}, - setDiff: function(diff) { - var diffView = new DiffView(); - diffView.setTable(diff.table); - var slug = diff.ver1 + '-' + diff.ver2; - tabsView.addTab(diff.ver1 + '->' + diff.ver2, slug, diffView.dom); - tabsView.selectTab(slug); - } - }; -}; - +define([ +'libs/jquery-1.9.1.min', +'libs/underscore-min', +'views/tabs/tabs', +'libs/text!./diff.html' +], function($, _, tabs, diffTemplateSrc) { + +'use strict'; + +return function(sandbox) { + + var dom = $('
').addClass('rng-module-diffViewer'); + var tabsView = (new tabs.View({position: 'right'})).render(); + dom.append(tabsView.getAsView()); + + var DiffView = function() { + this.dom = $(diffTemplateSrc); + }; + + DiffView.prototype.setTable = function(table) { + this.dom.append(table); + }; + + + return { + start: function() {sandbox.publish('ready');}, + getView: function() {return dom;}, + setDiff: function(diff) { + var diffView = new DiffView(); + diffView.setTable(diff.table); + var slug = diff.ver1 + '-' + diff.ver2; + tabsView.addTab(diff.ver1 + '->' + diff.ver2, slug, diffView.dom); + tabsView.selectTab(slug); + } + }; +}; + }); \ No newline at end of file diff --git a/modules/diffViewer/diffViewer.less b/modules/diffViewer/diffViewer.less index 1ab9c32..34ab240 100644 --- a/modules/diffViewer/diffViewer.less +++ b/modules/diffViewer/diffViewer.less @@ -1,77 +1,77 @@ -.rng-module-diffViewer { - .nav-tabs > li > a { - min-width: 0; - font-size: 0.9em; - padding: 4px 6px; - } - - .tab-content { - position: absolute; - top:0; - bottom:0; - left:0; - right:60px; - overflow-y: scroll; - &::-webkit-scrollbar { - .rng-mixin-scrollbar; - } - &::-webkit-scrollbar-track { - .rng-mixin-scrollbar-track; - } - &::-webkit-scrollbar-thumb { - .rng-mixin-scrollbar-thumb; - } - &::-webkit-scrollbar-thumb:window-inactive { - .rng-mixin-scrollbar-thumb-window-inactive; - } - } - - .diff_table { - border-width: 1px 0 1px 1px; - border-style: solid; - border-color: #ddd; - empty-cells: show; - border-spacing: 0px; - } - - .diff_table td { - border-width: 0px 1px 1px 0px; - border-style: dotted; - border-color: grey; - font-size: 10px; - line-height: 20px; - font-family: monospace; - padding: 0px; - white-space: pre-line; - /*word-wrap:break-word; - word-break:break-all; */ - } - - .diff_table th { - border-width: 0px 1px 1px 0px; - border-style: solid; - border-color: #ddd; - background: #e5ffe5; - } - - .diff_table tr.change { - background-color: #dcdcdc; - } - - .diff_mark { - display: inline-block; - padding: 2px; - } - - .diff_mark_removed { - background-color: #ff9c94; - } - - .diff_mark_added { - background-color: #90ee90; - } - - .diff_mark_changed { - background-color: yellow; - } +.rng-module-diffViewer { + .nav-tabs > li > a { + min-width: 0; + font-size: 0.9em; + padding: 4px 6px; + } + + .tab-content { + position: absolute; + top:0; + bottom:0; + left:0; + right:60px; + overflow-y: scroll; + &::-webkit-scrollbar { + .rng-mixin-scrollbar; + } + &::-webkit-scrollbar-track { + .rng-mixin-scrollbar-track; + } + &::-webkit-scrollbar-thumb { + .rng-mixin-scrollbar-thumb; + } + &::-webkit-scrollbar-thumb:window-inactive { + .rng-mixin-scrollbar-thumb-window-inactive; + } + } + + .diff_table { + border-width: 1px 0 1px 1px; + border-style: solid; + border-color: #ddd; + empty-cells: show; + border-spacing: 0px; + } + + .diff_table td { + border-width: 0px 1px 1px 0px; + border-style: dotted; + border-color: grey; + font-size: 10px; + line-height: 20px; + font-family: monospace; + padding: 0px; + white-space: pre-line; + /*word-wrap:break-word; + word-break:break-all; */ + } + + .diff_table th { + border-width: 0px 1px 1px 0px; + border-style: solid; + border-color: #ddd; + background: #e5ffe5; + } + + .diff_table tr.change { + background-color: #dcdcdc; + } + + .diff_mark { + display: inline-block; + padding: 2px; + } + + .diff_mark_removed { + background-color: #ff9c94; + } + + .diff_mark_added { + background-color: #90ee90; + } + + .diff_mark_changed { + background-color: yellow; + } } \ No newline at end of file diff --git a/modules/documentCanvas/canvas.js b/modules/documentCanvas/canvas.js index 4a953d1..9c926e9 100644 --- a/modules/documentCanvas/canvas.js +++ b/modules/documentCanvas/canvas.js @@ -1,246 +1,246 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/underscore-min', -'modules/documentCanvas/transformations', -'modules/documentCanvas/canvasNode', -'libs/text!./template.html' -], function($, _, transformations, canvasNode, template) { - -'use strict'; - -var Canvas = function(html) { - this.dom = $(template); - this.content = this.dom.find('#rng-module-documentCanvas-content'); - this.setHTML(html); -}; - -Canvas.prototype.setHTML = function(html) { - if(html) { - this.content.html(html); - } -}; - -Canvas.prototype.getContent = function() { - return this.content.contents(); -}; - -Canvas.prototype.findNodes = function(desc) { - var selector = ''; - if(typeof desc === 'string') { - selector = desc; - } - else { - if(desc.klass) - selector += '[wlxml-class=' + desc.klass + ']'; - if(desc.tag) - selector += '[wlxml-tag=' + desc.tag + ']'; - } - var toret = []; - this.content.find(selector).each(function() { - toret.push(canvasNode.create($(this))); - }); - return toret; -}; - -Canvas.prototype.getNodeById = function(id) { - return canvasNode.create($(this.content.find('#' +id))); -}; - -Canvas.prototype.nodeAppend = function(options) { - var element; // = $(this.content.find('#' + options.context.id).get(0)); - if(options.to === 'root') { - element = this.content; - } else { - element = $(this.content.find('#' + options.to.getId()).get(0)); - } - element.append(options.node.dom); -}; - -Canvas.prototype.nodeInsertAfter = function(options) { - var element = $(this.content.find('#' + options.after.getId()).get(0)); - element.after(options.node.dom); -}; - -Canvas.prototype.nodeWrap = function(options) { - options = _.extend({textNodeIdx: 0}, options); - if(typeof options.textNodeIdx === 'number') - options.textNodeIdx = [options.textNodeIdx]; - - var container = $(this.content.find('#' + options.inside.getId()).get(0)), - containerContent = container.contents(), - idx1 = Math.min.apply(Math, options.textNodeIdx), - idx2 = Math.max.apply(Math, options.textNodeIdx), - textNode1 = $(containerContent.get(idx1)), - textNode2 = $(containerContent.get(idx2)), - sameNode = textNode1.get(0) === textNode2.get(0), - prefixOutside = textNode1.text().substr(0, options.offsetStart), - prefixInside = textNode1.text().substr(options.offsetStart), - suffixInside = textNode2.text().substr(0, options.offsetEnd), - suffixOutside = textNode2.text().substr(options.offsetEnd) - ; - - textNode1.after(options._with.dom); - textNode1.detach(); - - options._with.dom.before(prefixOutside); - if(sameNode) { - var core = textNode1.text().substr(options.offsetStart, options.offsetEnd - options.offsetStart); - options._with.setContent(core); - } else { - textNode2.detach(); - options._with.dom.append(prefixInside); - for(var i = idx1 + 1; i < idx2; i++) { - options._with.dom.append(containerContent[i]); - } - options._with.dom.append(suffixInside); - } - options._with.dom.after(suffixOutside); -}; - -Canvas.prototype.nodeSplit = function(options) { - options = _.extend({textNodeIdx: 0}, options); - - var nodeToSplit = $(this.content.find('#' + options.node.getId()).get(0)); - - var nodeContents = nodeToSplit.contents(); - if(nodeContents.length === 0 || - nodeContents.length - 1 < options.textNodeIdx || - nodeContents.get(options.textNodeIdx).nodeType != 3) - return false; - - var textNode = $(nodeContents.get(options.textNodeIdx)); - - var succeedingNodes = []; - var passed = false; - nodeContents.each(function() { - var node = this; - if(passed) - succeedingNodes.push(node); - if(node === textNode.get(0)) - passed = true; - }); - - var prefix = $.trim(textNode.text().substr(0, options.offset)); - var suffix = $.trim(textNode.text().substr(options.offset)); - - textNode.before(prefix); - textNode.remove(); - - var newNode = canvasNode.create({tag: nodeToSplit.attr('wlxml-tag'), klass: nodeToSplit.attr('wlxml-class')}); - newNode.dom.append(suffix); - succeedingNodes.forEach(function(node) { - newNode.dom.append(node); - }); - nodeToSplit.after(newNode.dom); - return newNode; -}; - -Canvas.prototype.nodeRemove = function(options) { - var toRemove = $(this.content.find('#' + options.node.getId()).get(0)); - toRemove.remove(); -}; - -Canvas.prototype.listCreate = function(options) { - var element1 = $(this.content.find('#' + options.start.getId()).get(0)); - var element2 = $(this.content.find('#' + options.end.getId()).get(0)); - if(element1.parent().get(0) !== element2.parent().get(0)) - return false; - - var parent = element1.parent(); - - if(parent.contents().index(element1) > parent.contents().index(element2)) { - var tmp = element1; - element1 = element2; - element2 = tmp; - } - - var nodesToWrap = []; - - var place = 'before'; - var canvas = this; - parent.contents().each(function() { - var node = this; - if(node === element1.get(0)) - place = 'inside'; - if(place === 'inside') { - var $node; - if(node.nodeType === 3) { - $node = canvasNode.create({tag: 'div', content: $.trim(node.data)}).dom; //canvas._createNode('div').text(node.data); - $(node).remove(); - } - else { - $node = $(node); - } - $node.attr('wlxml-class', 'item'); - nodesToWrap.push($node); - } - if(node === element2.get(0)) - return false; - }); - - var list = canvasNode.create({tag: 'div', klass: 'list-items' + (options.type === 'enum' ? '-enum' : '')}).dom; //this._createNode('div', 'list-items'); - - var parentNode = options.start.parent(); - - var toret; - if(parentNode && parentNode.isOfClass('list-items')) { - list.wrap('
'); - toret = list.parent(); - } else { - toret = list; - } - - - element1.before(toret); - - nodesToWrap.forEach(function(node) { - node.remove(); - list.append(node); - }); -}; - -Canvas.prototype.listRemove = function(options) { - var pointerElement = $(this.content.find('#' + options.pointer.getId())); - var listElement = options.pointer.getClass() === 'list-items' ? pointerElement : - pointerElement.parents('[wlxml-class|="list-items"][wlxml-tag]'); - - var nested = false; - if(listElement.length > 1) { - listElement = $(listElement[0]); - nested = true; - } - - if(nested) { - listElement.unwrap(); - } else { - listElement.find('[wlxml-class=item]').each(function() { - $(this).removeAttr('wlxml-class'); - }); - } - listElement.children().unwrap(); -}; - -Canvas.prototype.getPrecedingNode = function(options) { - var element = $(this.content.find('#' + options.node.getId()).get(0)); - var prev = element.prev(); - if(prev.length === 0) - prev = element.parent(); - return canvasNode.create(prev); -}; - -Canvas.prototype.nodeInsideList = function(options) { - if(options.node) { - if(options.node.isOfClass('list-items') || options.node.isOfClass('item')) - return true; - var pointerElement = $(this.content.find('#' + options.node.getId())); - return pointerElement.parents('[wlxml-class=list-items], [wlxml-class=item]').length > 0; - } - return false; -}; - - -return { - create: function(desc) { return new Canvas(desc); } -}; - +define([ +'libs/jquery-1.9.1.min', +'libs/underscore-min', +'modules/documentCanvas/transformations', +'modules/documentCanvas/canvasNode', +'libs/text!./template.html' +], function($, _, transformations, canvasNode, template) { + +'use strict'; + +var Canvas = function(html) { + this.dom = $(template); + this.content = this.dom.find('#rng-module-documentCanvas-content'); + this.setHTML(html); +}; + +Canvas.prototype.setHTML = function(html) { + if(html) { + this.content.html(html); + } +}; + +Canvas.prototype.getContent = function() { + return this.content.contents(); +}; + +Canvas.prototype.findNodes = function(desc) { + var selector = ''; + if(typeof desc === 'string') { + selector = desc; + } + else { + if(desc.klass) + selector += '[wlxml-class=' + desc.klass + ']'; + if(desc.tag) + selector += '[wlxml-tag=' + desc.tag + ']'; + } + var toret = []; + this.content.find(selector).each(function() { + toret.push(canvasNode.create($(this))); + }); + return toret; +}; + +Canvas.prototype.getNodeById = function(id) { + return canvasNode.create($(this.content.find('#' +id))); +}; + +Canvas.prototype.nodeAppend = function(options) { + var element; // = $(this.content.find('#' + options.context.id).get(0)); + if(options.to === 'root') { + element = this.content; + } else { + element = $(this.content.find('#' + options.to.getId()).get(0)); + } + element.append(options.node.dom); +}; + +Canvas.prototype.nodeInsertAfter = function(options) { + var element = $(this.content.find('#' + options.after.getId()).get(0)); + element.after(options.node.dom); +}; + +Canvas.prototype.nodeWrap = function(options) { + options = _.extend({textNodeIdx: 0}, options); + if(typeof options.textNodeIdx === 'number') + options.textNodeIdx = [options.textNodeIdx]; + + var container = $(this.content.find('#' + options.inside.getId()).get(0)), + containerContent = container.contents(), + idx1 = Math.min.apply(Math, options.textNodeIdx), + idx2 = Math.max.apply(Math, options.textNodeIdx), + textNode1 = $(containerContent.get(idx1)), + textNode2 = $(containerContent.get(idx2)), + sameNode = textNode1.get(0) === textNode2.get(0), + prefixOutside = textNode1.text().substr(0, options.offsetStart), + prefixInside = textNode1.text().substr(options.offsetStart), + suffixInside = textNode2.text().substr(0, options.offsetEnd), + suffixOutside = textNode2.text().substr(options.offsetEnd) + ; + + textNode1.after(options._with.dom); + textNode1.detach(); + + options._with.dom.before(prefixOutside); + if(sameNode) { + var core = textNode1.text().substr(options.offsetStart, options.offsetEnd - options.offsetStart); + options._with.setContent(core); + } else { + textNode2.detach(); + options._with.dom.append(prefixInside); + for(var i = idx1 + 1; i < idx2; i++) { + options._with.dom.append(containerContent[i]); + } + options._with.dom.append(suffixInside); + } + options._with.dom.after(suffixOutside); +}; + +Canvas.prototype.nodeSplit = function(options) { + options = _.extend({textNodeIdx: 0}, options); + + var nodeToSplit = $(this.content.find('#' + options.node.getId()).get(0)); + + var nodeContents = nodeToSplit.contents(); + if(nodeContents.length === 0 || + nodeContents.length - 1 < options.textNodeIdx || + nodeContents.get(options.textNodeIdx).nodeType != 3) + return false; + + var textNode = $(nodeContents.get(options.textNodeIdx)); + + var succeedingNodes = []; + var passed = false; + nodeContents.each(function() { + var node = this; + if(passed) + succeedingNodes.push(node); + if(node === textNode.get(0)) + passed = true; + }); + + var prefix = $.trim(textNode.text().substr(0, options.offset)); + var suffix = $.trim(textNode.text().substr(options.offset)); + + textNode.before(prefix); + textNode.remove(); + + var newNode = canvasNode.create({tag: nodeToSplit.attr('wlxml-tag'), klass: nodeToSplit.attr('wlxml-class')}); + newNode.dom.append(suffix); + succeedingNodes.forEach(function(node) { + newNode.dom.append(node); + }); + nodeToSplit.after(newNode.dom); + return newNode; +}; + +Canvas.prototype.nodeRemove = function(options) { + var toRemove = $(this.content.find('#' + options.node.getId()).get(0)); + toRemove.remove(); +}; + +Canvas.prototype.listCreate = function(options) { + var element1 = $(this.content.find('#' + options.start.getId()).get(0)); + var element2 = $(this.content.find('#' + options.end.getId()).get(0)); + if(element1.parent().get(0) !== element2.parent().get(0)) + return false; + + var parent = element1.parent(); + + if(parent.contents().index(element1) > parent.contents().index(element2)) { + var tmp = element1; + element1 = element2; + element2 = tmp; + } + + var nodesToWrap = []; + + var place = 'before'; + var canvas = this; + parent.contents().each(function() { + var node = this; + if(node === element1.get(0)) + place = 'inside'; + if(place === 'inside') { + var $node; + if(node.nodeType === 3) { + $node = canvasNode.create({tag: 'div', content: $.trim(node.data)}).dom; //canvas._createNode('div').text(node.data); + $(node).remove(); + } + else { + $node = $(node); + } + $node.attr('wlxml-class', 'item'); + nodesToWrap.push($node); + } + if(node === element2.get(0)) + return false; + }); + + var list = canvasNode.create({tag: 'div', klass: 'list-items' + (options.type === 'enum' ? '-enum' : '')}).dom; //this._createNode('div', 'list-items'); + + var parentNode = options.start.parent(); + + var toret; + if(parentNode && parentNode.isOfClass('list-items')) { + list.wrap('
'); + toret = list.parent(); + } else { + toret = list; + } + + + element1.before(toret); + + nodesToWrap.forEach(function(node) { + node.remove(); + list.append(node); + }); +}; + +Canvas.prototype.listRemove = function(options) { + var pointerElement = $(this.content.find('#' + options.pointer.getId())); + var listElement = options.pointer.getClass() === 'list-items' ? pointerElement : + pointerElement.parents('[wlxml-class|="list-items"][wlxml-tag]'); + + var nested = false; + if(listElement.length > 1) { + listElement = $(listElement[0]); + nested = true; + } + + if(nested) { + listElement.unwrap(); + } else { + listElement.find('[wlxml-class=item]').each(function() { + $(this).removeAttr('wlxml-class'); + }); + } + listElement.children().unwrap(); +}; + +Canvas.prototype.getPrecedingNode = function(options) { + var element = $(this.content.find('#' + options.node.getId()).get(0)); + var prev = element.prev(); + if(prev.length === 0) + prev = element.parent(); + return canvasNode.create(prev); +}; + +Canvas.prototype.nodeInsideList = function(options) { + if(options.node) { + if(options.node.isOfClass('list-items') || options.node.isOfClass('item')) + return true; + var pointerElement = $(this.content.find('#' + options.node.getId())); + return pointerElement.parents('[wlxml-class=list-items], [wlxml-class=item]').length > 0; + } + return false; +}; + + +return { + create: function(desc) { return new Canvas(desc); } +}; + }); \ No newline at end of file diff --git a/modules/documentCanvas/canvasManager.js b/modules/documentCanvas/canvasManager.js index 87fa834..3b7f72d 100644 --- a/modules/documentCanvas/canvasManager.js +++ b/modules/documentCanvas/canvasManager.js @@ -1,255 +1,255 @@ -define([ -'libs/jquery-1.9.1.min', -'./canvasNode' -], function($, canvasNode) { - -'use strict'; - -var getCursorPosition = function() { - var selection = window.getSelection(); - var anchorNode = $(selection.anchorNode); - var parent = anchorNode.parent(); - return { - textNode: anchorNode, - textNodeOffset: selection.anchorOffset, - textNodeIndex: parent.contents().index(anchorNode), - parentNode: parent, - focusNode: $(selection.focusNode).parent(), - isAtEnd: selection.anchorOffset === anchorNode.text().length - }; -}; - -var Manager = function(canvas, sandbox) { - this.canvas = canvas; - this.sandbox = sandbox; - this.shownAlready = false; - this.gridToggled = false; - this.scrollbarPosition = 0; - this.currentNode = null; - var manager = this; - - canvas.dom.find('#rng-module-documentCanvas-content').on('keyup', function() { - manager.sandbox.publish('contentChanged'); - }); - - canvas.dom.on('mouseover', '[wlxml-tag]', function(e) { - e.stopPropagation(); - manager.sandbox.publish('nodeHovered', canvasNode.create($(e.target))); - }); - canvas.dom.on('mouseout', '[wlxml-tag]', function(e) { - e.stopPropagation(); - manager.sandbox.publish('nodeBlured', canvasNode.create($(e.target))); - }); - canvas.dom.on('click', '[wlxml-tag]', function(e) { - e.stopPropagation(); - console.log('clicked node type: '+e.target.nodeType); - manager.selectNode(canvasNode.create($(e.target))); - }); - - canvas.dom.on('keyup', '#rng-module-documentCanvas-contentWrapper', function(e) { - var anchor = $(window.getSelection().anchorNode); - - if(anchor[0].nodeType === Node.TEXT_NODE) - anchor = anchor.parent(); - if(!anchor.is('[wlxml-tag]')) - return; - manager.selectNode(canvasNode.create(anchor)); - }); - - canvas.dom.on('keydown', '#rng-module-documentCanvas-contentWrapper', function(e) { - if(e.which === 13) { - manager.onEnterKey(e); - } - if(e.which === 8) { - manager.onBackspaceKey(e); - } - }); - - canvas.dom.onShow = function() { - if(!manager.shownAlready) { - manager.shownAlready = true; - manager.selectFirstNode(); - } else if(manager.currentNode) { - manager.movecaretToNode(manager.getNodeElement(manager.currentNode)); - canvas.dom.find('#rng-module-documentCanvas-contentWrapper').scrollTop(manager.scrollbarPosition); - } - }; - canvas.dom.onHide = function() { - manager.scrollbarPosition = canvas.dom.find('#rng-module-documentCanvas-contentWrapper').scrollTop(); - }; -}; - -Manager.prototype.selectNode = function(cnode, options) { - options = options || {}; - var nodeElement = this.getNodeElement(cnode); - - this.dimNode(cnode); - - this.canvas.dom.find('.rng-module-documentCanvas-currentNode').removeClass('rng-module-documentCanvas-currentNode'); - nodeElement.addClass('rng-module-documentCanvas-currentNode'); - - if(options.movecaret) { - this.movecaretToNode(nodeElement, options.movecaret); - } - - this.currentNode = cnode; - this.sandbox.publish('nodeSelected', cnode); -}; - -Manager.prototype.insertNewNode = function(wlxmlTag, wlxmlClass) { - var selection = window.getSelection(), - $anchorNode = $(selection.anchorNode), - $focusNode = $(selection.focusNode); - - - if(!selection.isCollapsed && $anchorNode.parent()[0] === $focusNode.parent()[0]) { - var textNodeIdx, - parent = $anchorNode.parent(), - parentContents = parent.contents(), - offsetStart = selection.anchorOffset, - offsetEnd = selection.focusOffset; - - if(selection.anchorNode === selection.focusNode) { - if(offsetStart > offsetEnd) { - var tmp = offsetStart; - offsetStart = offsetEnd; - offsetEnd = tmp; - } - textNodeIdx = parentContents.index($anchorNode); - } else { - if(parentContents.index($anchorNode) > parentContents.index($focusNode)) { - offsetStart = selection.focusOffset; - offsetEnd = selection.anchorOffset; - } - textNodeIdx = [parentContents.index($anchorNode), parentContents.index($focusNode)]; - } - - var wrapper = canvasNode.create({tag: wlxmlTag, klass: wlxmlClass}); - this.canvas.nodeWrap({inside: canvasNode.create(parent), - _with: wrapper, - offsetStart: offsetStart, - offsetEnd: offsetEnd, - textNodeIdx: textNodeIdx - }); - this.selectNode(wrapper, {movecaret: 'end'}); - } - - -}; - -Manager.prototype.getNodeElement = function(cnode) { - return this.canvas.dom.find('#'+cnode.getId()); -}; - -Manager.prototype.highlightNode = function(cnode) { - var nodeElement = this.getNodeElement(cnode); - if(!this.gridToggled) { - nodeElement.addClass('rng-common-hoveredNode'); - var label = nodeElement.attr('wlxml-tag'); - if(nodeElement.attr('wlxml-class')) - label += ' / ' + nodeElement.attr('wlxml-class'); - var tag = $('
').addClass('rng-module-documentCanvas-hoveredNodeTag').text(label); - nodeElement.append(tag); - } -}; - -Manager.prototype.dimNode = function(cnode) { - var nodeElement = this.getNodeElement(cnode); - if(!this.gridToggled) { - nodeElement.removeClass('rng-common-hoveredNode'); - nodeElement.find('.rng-module-documentCanvas-hoveredNodeTag').remove(); - } -}; - -Manager.prototype.selectFirstNode = function() { - var firstNodeWithText = this.canvas.dom.find('[wlxml-tag]').filter(function() { - return $(this).clone().children().remove().end().text().trim() !== ''; - }).first(); - var node; - if(firstNodeWithText.length) - node = $(firstNodeWithText[0]); - else { - node = this.canvas.dom.find('[wlxml-class|="p"]'); - } - this.selectNode(canvasNode.create(node), {movecaret: true}); -}; - -Manager.prototype.movecaretToNode = function(nodeElement, where) { - if(!nodeElement.length) - return; - var range = document.createRange(); - range.selectNodeContents(nodeElement[0]); - - var collapseArg = true; - if(where === 'end') - collapseArg = false; - range.collapse(collapseArg); - var selection = document.getSelection(); - selection.removeAllRanges(); - selection.addRange(range); -}; - -Manager.prototype.toggleGrid = function(toggle) { - this.canvas.dom.find('[wlxml-tag]').toggleClass('rng-common-hoveredNode', toggle); - this.gridToggled = toggle; -}; - -Manager.prototype.onEnterKey = function(e) { - e.preventDefault(); - var pos = getCursorPosition(); - var contextNode = this.canvas.getNodeById(pos.parentNode.attr('id')); - var newNode; - - if(pos.isAtEnd) { - newNode = canvasNode.create({tag: pos.parentNode.attr('wlxml-tag'), klass: pos.parentNode.attr('wlxml-class')}); - this.canvas.nodeInsertAfter({node: newNode, after: this.canvas.getNodeById(pos.parentNode.attr('id'))}); - } else { - newNode = this.canvas.nodeSplit({node: contextNode, textNodeIdx: pos.textNodeIndex, offset: pos.textNodeOffset}); - } - if(newNode) - this.selectNode(newNode, {movecaret: true}); - this.sandbox.publish('contentChanged'); -}; - -Manager.prototype.onBackspaceKey = function(e) { - var pos = getCursorPosition(); - var len = pos.textNode.text().length; - if(len === 1) { - // Prevent deleting node by browser after last character removed; - e.preventDefault(); - pos.parentNode.text(''); - } - if(len === 0) { - e.preventDefault(); - var toRemove = canvasNode.create(pos.textNode); - var prevNode = this.canvas.getPrecedingNode({node:toRemove}); - this.canvas.nodeRemove({node: toRemove}); // jesli nie ma tekstu, to anchor nie jest tex nodem - this.selectNode(prevNode, {movecaret: 'end'}); - } -}; - -Manager.prototype.command = function(command, meta) { - var pos = getCursorPosition(); - - if(command === 'createList') { - var node = canvasNode.create(pos.parentNode); - if(window.getSelection().getRangeAt(0).collapsed && this.canvas.nodeInsideList({node: node})) { - this.canvas.listRemove({pointer: node}); - this.selectNode(node, {movecaret: 'end'}); - this.sandbox.publish('contentChanged'); - } - else { - //if(!this.canvas.nodeInsideList({node: node})) { - this.canvas.listCreate({start: node, end: canvasNode.create(pos.focusNode), type: meta}); - this.selectNode(node, {movecaret: 'end'}); - this.sandbox.publish('contentChanged'); - //} - } - } - -}; - - -return Manager; - +define([ +'libs/jquery-1.9.1.min', +'./canvasNode' +], function($, canvasNode) { + +'use strict'; + +var getCursorPosition = function() { + var selection = window.getSelection(); + var anchorNode = $(selection.anchorNode); + var parent = anchorNode.parent(); + return { + textNode: anchorNode, + textNodeOffset: selection.anchorOffset, + textNodeIndex: parent.contents().index(anchorNode), + parentNode: parent, + focusNode: $(selection.focusNode).parent(), + isAtEnd: selection.anchorOffset === anchorNode.text().length + }; +}; + +var Manager = function(canvas, sandbox) { + this.canvas = canvas; + this.sandbox = sandbox; + this.shownAlready = false; + this.gridToggled = false; + this.scrollbarPosition = 0; + this.currentNode = null; + var manager = this; + + canvas.dom.find('#rng-module-documentCanvas-content').on('keyup', function() { + manager.sandbox.publish('contentChanged'); + }); + + canvas.dom.on('mouseover', '[wlxml-tag]', function(e) { + e.stopPropagation(); + manager.sandbox.publish('nodeHovered', canvasNode.create($(e.target))); + }); + canvas.dom.on('mouseout', '[wlxml-tag]', function(e) { + e.stopPropagation(); + manager.sandbox.publish('nodeBlured', canvasNode.create($(e.target))); + }); + canvas.dom.on('click', '[wlxml-tag]', function(e) { + e.stopPropagation(); + console.log('clicked node type: '+e.target.nodeType); + manager.selectNode(canvasNode.create($(e.target))); + }); + + canvas.dom.on('keyup', '#rng-module-documentCanvas-contentWrapper', function(e) { + var anchor = $(window.getSelection().anchorNode); + + if(anchor[0].nodeType === Node.TEXT_NODE) + anchor = anchor.parent(); + if(!anchor.is('[wlxml-tag]')) + return; + manager.selectNode(canvasNode.create(anchor)); + }); + + canvas.dom.on('keydown', '#rng-module-documentCanvas-contentWrapper', function(e) { + if(e.which === 13) { + manager.onEnterKey(e); + } + if(e.which === 8) { + manager.onBackspaceKey(e); + } + }); + + canvas.dom.onShow = function() { + if(!manager.shownAlready) { + manager.shownAlready = true; + manager.selectFirstNode(); + } else if(manager.currentNode) { + manager.movecaretToNode(manager.getNodeElement(manager.currentNode)); + canvas.dom.find('#rng-module-documentCanvas-contentWrapper').scrollTop(manager.scrollbarPosition); + } + }; + canvas.dom.onHide = function() { + manager.scrollbarPosition = canvas.dom.find('#rng-module-documentCanvas-contentWrapper').scrollTop(); + }; +}; + +Manager.prototype.selectNode = function(cnode, options) { + options = options || {}; + var nodeElement = this.getNodeElement(cnode); + + this.dimNode(cnode); + + this.canvas.dom.find('.rng-module-documentCanvas-currentNode').removeClass('rng-module-documentCanvas-currentNode'); + nodeElement.addClass('rng-module-documentCanvas-currentNode'); + + if(options.movecaret) { + this.movecaretToNode(nodeElement, options.movecaret); + } + + this.currentNode = cnode; + this.sandbox.publish('nodeSelected', cnode); +}; + +Manager.prototype.insertNewNode = function(wlxmlTag, wlxmlClass) { + var selection = window.getSelection(), + $anchorNode = $(selection.anchorNode), + $focusNode = $(selection.focusNode); + + + if(!selection.isCollapsed && $anchorNode.parent()[0] === $focusNode.parent()[0]) { + var textNodeIdx, + parent = $anchorNode.parent(), + parentContents = parent.contents(), + offsetStart = selection.anchorOffset, + offsetEnd = selection.focusOffset; + + if(selection.anchorNode === selection.focusNode) { + if(offsetStart > offsetEnd) { + var tmp = offsetStart; + offsetStart = offsetEnd; + offsetEnd = tmp; + } + textNodeIdx = parentContents.index($anchorNode); + } else { + if(parentContents.index($anchorNode) > parentContents.index($focusNode)) { + offsetStart = selection.focusOffset; + offsetEnd = selection.anchorOffset; + } + textNodeIdx = [parentContents.index($anchorNode), parentContents.index($focusNode)]; + } + + var wrapper = canvasNode.create({tag: wlxmlTag, klass: wlxmlClass}); + this.canvas.nodeWrap({inside: canvasNode.create(parent), + _with: wrapper, + offsetStart: offsetStart, + offsetEnd: offsetEnd, + textNodeIdx: textNodeIdx + }); + this.selectNode(wrapper, {movecaret: 'end'}); + } + + +}; + +Manager.prototype.getNodeElement = function(cnode) { + return this.canvas.dom.find('#'+cnode.getId()); +}; + +Manager.prototype.highlightNode = function(cnode) { + var nodeElement = this.getNodeElement(cnode); + if(!this.gridToggled) { + nodeElement.addClass('rng-common-hoveredNode'); + var label = nodeElement.attr('wlxml-tag'); + if(nodeElement.attr('wlxml-class')) + label += ' / ' + nodeElement.attr('wlxml-class'); + var tag = $('
').addClass('rng-module-documentCanvas-hoveredNodeTag').text(label); + nodeElement.append(tag); + } +}; + +Manager.prototype.dimNode = function(cnode) { + var nodeElement = this.getNodeElement(cnode); + if(!this.gridToggled) { + nodeElement.removeClass('rng-common-hoveredNode'); + nodeElement.find('.rng-module-documentCanvas-hoveredNodeTag').remove(); + } +}; + +Manager.prototype.selectFirstNode = function() { + var firstNodeWithText = this.canvas.dom.find('[wlxml-tag]').filter(function() { + return $(this).clone().children().remove().end().text().trim() !== ''; + }).first(); + var node; + if(firstNodeWithText.length) + node = $(firstNodeWithText[0]); + else { + node = this.canvas.dom.find('[wlxml-class|="p"]'); + } + this.selectNode(canvasNode.create(node), {movecaret: true}); +}; + +Manager.prototype.movecaretToNode = function(nodeElement, where) { + if(!nodeElement.length) + return; + var range = document.createRange(); + range.selectNodeContents(nodeElement[0]); + + var collapseArg = true; + if(where === 'end') + collapseArg = false; + range.collapse(collapseArg); + var selection = document.getSelection(); + selection.removeAllRanges(); + selection.addRange(range); +}; + +Manager.prototype.toggleGrid = function(toggle) { + this.canvas.dom.find('[wlxml-tag]').toggleClass('rng-common-hoveredNode', toggle); + this.gridToggled = toggle; +}; + +Manager.prototype.onEnterKey = function(e) { + e.preventDefault(); + var pos = getCursorPosition(); + var contextNode = this.canvas.getNodeById(pos.parentNode.attr('id')); + var newNode; + + if(pos.isAtEnd) { + newNode = canvasNode.create({tag: pos.parentNode.attr('wlxml-tag'), klass: pos.parentNode.attr('wlxml-class')}); + this.canvas.nodeInsertAfter({node: newNode, after: this.canvas.getNodeById(pos.parentNode.attr('id'))}); + } else { + newNode = this.canvas.nodeSplit({node: contextNode, textNodeIdx: pos.textNodeIndex, offset: pos.textNodeOffset}); + } + if(newNode) + this.selectNode(newNode, {movecaret: true}); + this.sandbox.publish('contentChanged'); +}; + +Manager.prototype.onBackspaceKey = function(e) { + var pos = getCursorPosition(); + var len = pos.textNode.text().length; + if(len === 1) { + // Prevent deleting node by browser after last character removed; + e.preventDefault(); + pos.parentNode.text(''); + } + if(len === 0) { + e.preventDefault(); + var toRemove = canvasNode.create(pos.textNode); + var prevNode = this.canvas.getPrecedingNode({node:toRemove}); + this.canvas.nodeRemove({node: toRemove}); // jesli nie ma tekstu, to anchor nie jest tex nodem + this.selectNode(prevNode, {movecaret: 'end'}); + } +}; + +Manager.prototype.command = function(command, meta) { + var pos = getCursorPosition(); + + if(command === 'createList') { + var node = canvasNode.create(pos.parentNode); + if(window.getSelection().getRangeAt(0).collapsed && this.canvas.nodeInsideList({node: node})) { + this.canvas.listRemove({pointer: node}); + this.selectNode(node, {movecaret: 'end'}); + this.sandbox.publish('contentChanged'); + } + else { + //if(!this.canvas.nodeInsideList({node: node})) { + this.canvas.listCreate({start: node, end: canvasNode.create(pos.focusNode), type: meta}); + this.selectNode(node, {movecaret: 'end'}); + this.sandbox.publish('contentChanged'); + //} + } + } + +}; + + +return Manager; + }); \ No newline at end of file diff --git a/modules/documentCanvas/canvasNode.js b/modules/documentCanvas/canvasNode.js index 321a7ce..8cf61b1 100644 --- a/modules/documentCanvas/canvasNode.js +++ b/modules/documentCanvas/canvasNode.js @@ -1,88 +1,88 @@ -define(['libs/jquery-1.9.1.min'], function($) { - -'use strict'; - - -var tagSelector = '[wlxml-tag]'; - -var CanvasNode = function(desc) { - if(desc instanceof $) { - this.dom = desc; - if(!this.dom.attr('id')) { - this.dom.attr('id', 'xxxxxxxx-xxxx-xxxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {var r = Math.random()*16|0,v=c=='x'?r:r&0x3|0x8;return v.toString(16);})); - } - } else { - var toBlock = ['div', 'document', 'section', 'header']; - var htmlTag = _.contains(toBlock, desc.tag) ? 'div' : 'span'; - this.dom = $('<' + htmlTag + '>'); - this.dom.attr('wlxml-tag', desc.tag); - if(desc.klass) - this.dom.attr('wlxml-class', desc.klass); - if(desc.content) - this.dom.text(desc.content); - this.dom.attr('id', 'xxxxxxxx-xxxx-xxxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {var r = Math.random()*16|0,v=c=='x'?r:r&0x3|0x8;return v.toString(16);})); - } -}; - -CanvasNode.prototype.getTag = function() { - return this.dom.attr('wlxml-tag'); -}; - -CanvasNode.prototype.getClass = function() { - return this.dom.attr('wlxml-class'); -}; - -CanvasNode.prototype.getId = function() { - return this.dom.attr('id'); -}; - -CanvasNode.prototype.getContent = function() { - return this.dom.text(); -}; - -CanvasNode.prototype.setContent = function(content) { - this.dom.text(content); -}; - -CanvasNode.prototype.isSame = function(other) { - return (other instanceof CanvasNode) && this.dom.get(0) === other.dom.get(0); -}; - -CanvasNode.prototype.children = function() { - var list = []; - this.dom.children(tagSelector).each(function() { - list.push(new CanvasNode($(this))); - }); - return $(list); -}; - - -CanvasNode.prototype.parent = function() { - var node = this.dom.parent(tagSelector); - if(node.length) - return new CanvasNode(node); - return null; -}; - -CanvasNode.prototype.parents = function() { - var list = []; - this.dom.parents(tagSelector).each(function() { - list.push(new CanvasNode($(this))); - }); - return $(list); -}; - - -CanvasNode.prototype.isOfClass = function(klass) { - return this.getClass() && this.getClass().substr(0, klass.length) === klass; -}; - -return { - create: function(desc) { - return new CanvasNode(desc); - } - -}; - - +define(['libs/jquery-1.9.1.min'], function($) { + +'use strict'; + + +var tagSelector = '[wlxml-tag]'; + +var CanvasNode = function(desc) { + if(desc instanceof $) { + this.dom = desc; + if(!this.dom.attr('id')) { + this.dom.attr('id', 'xxxxxxxx-xxxx-xxxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {var r = Math.random()*16|0,v=c=='x'?r:r&0x3|0x8;return v.toString(16);})); + } + } else { + var toBlock = ['div', 'document', 'section', 'header']; + var htmlTag = _.contains(toBlock, desc.tag) ? 'div' : 'span'; + this.dom = $('<' + htmlTag + '>'); + this.dom.attr('wlxml-tag', desc.tag); + if(desc.klass) + this.dom.attr('wlxml-class', desc.klass); + if(desc.content) + this.dom.text(desc.content); + this.dom.attr('id', 'xxxxxxxx-xxxx-xxxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {var r = Math.random()*16|0,v=c=='x'?r:r&0x3|0x8;return v.toString(16);})); + } +}; + +CanvasNode.prototype.getTag = function() { + return this.dom.attr('wlxml-tag'); +}; + +CanvasNode.prototype.getClass = function() { + return this.dom.attr('wlxml-class'); +}; + +CanvasNode.prototype.getId = function() { + return this.dom.attr('id'); +}; + +CanvasNode.prototype.getContent = function() { + return this.dom.text(); +}; + +CanvasNode.prototype.setContent = function(content) { + this.dom.text(content); +}; + +CanvasNode.prototype.isSame = function(other) { + return (other instanceof CanvasNode) && this.dom.get(0) === other.dom.get(0); +}; + +CanvasNode.prototype.children = function() { + var list = []; + this.dom.children(tagSelector).each(function() { + list.push(new CanvasNode($(this))); + }); + return $(list); +}; + + +CanvasNode.prototype.parent = function() { + var node = this.dom.parent(tagSelector); + if(node.length) + return new CanvasNode(node); + return null; +}; + +CanvasNode.prototype.parents = function() { + var list = []; + this.dom.parents(tagSelector).each(function() { + list.push(new CanvasNode($(this))); + }); + return $(list); +}; + + +CanvasNode.prototype.isOfClass = function(klass) { + return this.getClass() && this.getClass().substr(0, klass.length) === klass; +}; + +return { + create: function(desc) { + return new CanvasNode(desc); + } + +}; + + }); \ No newline at end of file diff --git a/modules/documentCanvas/documentCanvas.js b/modules/documentCanvas/documentCanvas.js index 37e8377..deebfca 100644 --- a/modules/documentCanvas/documentCanvas.js +++ b/modules/documentCanvas/documentCanvas.js @@ -1,59 +1,59 @@ -// Module that implements main WYSIWIG edit area - -define([ -'libs/underscore-min', -'./transformations', -'./canvas', -'./canvasManager', -'libs/text!./template.html'], function(_, transformations, Canvas, CanvasManager, template) { - -'use strict'; - -return function(sandbox) { - - var canvas = Canvas.create(); - var manager = new CanvasManager(canvas, sandbox); - - /* public api */ - return { - start: function() { sandbox.publish('ready'); }, - getView: function() { - return canvas.dom; - }, - setDocument: function(xml) { - canvas.setHTML(transformations.fromXML.getHTMLTree(xml)); - sandbox.publish('documentSet'); - }, - getDocument: function() { - return transformations.toXML.getXML(canvas.getContent()); - }, - modifyCurrentNode: function(attr, value) { - if(manager.currentNode) { - manager.getNodeElement(manager.currentNode).attr('wlxml-'+attr, value); - sandbox.publish('contentChanged'); - } - }, - highlightNode: function(canvasNode) { - manager.highlightNode(canvasNode); - }, - dimNode: function(canvasNode) { - manager.dimNode(canvasNode); - }, - selectNode: function(canvasNode) { - if(!canvasNode.isSame(manager.currentNode)) - manager.selectNode(canvasNode, {movecaret: true}); - }, - toggleGrid: function(toggle) { - manager.toggleGrid(toggle); - }, - insertNewNode: function(wlxmlTag, wlxmlClass) { - manager.insertNewNode(wlxmlTag, wlxmlClass); - }, - command: function(command, meta) { - manager.command(command, meta); - } - }; - -}; - +// Module that implements main WYSIWIG edit area + +define([ +'libs/underscore-min', +'./transformations', +'./canvas', +'./canvasManager', +'libs/text!./template.html'], function(_, transformations, Canvas, CanvasManager, template) { + +'use strict'; + +return function(sandbox) { + + var canvas = Canvas.create(); + var manager = new CanvasManager(canvas, sandbox); + + /* public api */ + return { + start: function() { sandbox.publish('ready'); }, + getView: function() { + return canvas.dom; + }, + setDocument: function(xml) { + canvas.setHTML(transformations.fromXML.getHTMLTree(xml)); + sandbox.publish('documentSet'); + }, + getDocument: function() { + return transformations.toXML.getXML(canvas.getContent()); + }, + modifyCurrentNode: function(attr, value) { + if(manager.currentNode) { + manager.getNodeElement(manager.currentNode).attr('wlxml-'+attr, value); + sandbox.publish('contentChanged'); + } + }, + highlightNode: function(canvasNode) { + manager.highlightNode(canvasNode); + }, + dimNode: function(canvasNode) { + manager.dimNode(canvasNode); + }, + selectNode: function(canvasNode) { + if(!canvasNode.isSame(manager.currentNode)) + manager.selectNode(canvasNode, {movecaret: true}); + }, + toggleGrid: function(toggle) { + manager.toggleGrid(toggle); + }, + insertNewNode: function(wlxmlTag, wlxmlClass) { + manager.insertNewNode(wlxmlTag, wlxmlClass); + }, + command: function(command, meta) { + manager.command(command, meta); + } + }; + +}; + }); \ No newline at end of file diff --git a/modules/documentCanvas/documentCanvas.less b/modules/documentCanvas/documentCanvas.less index 94a8b6e..4d04285 100644 --- a/modules/documentCanvas/documentCanvas.less +++ b/modules/documentCanvas/documentCanvas.less @@ -1,60 +1,60 @@ -@import 'nodes.less'; - -#rng-module-documentCanvas { - height: 100%; -} - -#rng-module-documentCanvas-mainArea { - height: 100%; - margin-bottom: 20px; -} - -#rng-module-documentCanvas-contentWrapper { - border-color: #ddd; - border-style: solid; - border-width: 1px; - float:left; - width: 100%; - height: 100%; - overflow-y: scroll; - padding: 0 10px; - - &::-webkit-scrollbar { - .rng-mixin-scrollbar; - } - &::-webkit-scrollbar-track { - .rng-mixin-scrollbar-track; - } - &::-webkit-scrollbar-thumb { - .rng-mixin-scrollbar-thumb; - } - &::-webkit-scrollbar-thumb:window-inactive { - .rng-mixin-scrollbar-thumb-window-inactive; - } - - #rng-module-documentCanvas-content { - outline: 0px solid transparent; - } -} - -.rng-module-documentCanvas-currentNode { - background: #fffacd; - border-color: grey; - border-style:dashed; - border-width:1px; -} - -.rng-module-documentCanvas-hoveredNodeTag { - position:absolute; - height:20px; - top:-20px; - left:0; - background: #bd362f; - color: white; - font-size:9px; - font-weight: normal; - font-style: normal; - font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; - padding: 0 5px; - text-indent: 0; +@import 'nodes.less'; + +#rng-module-documentCanvas { + height: 100%; +} + +#rng-module-documentCanvas-mainArea { + height: 100%; + margin-bottom: 20px; +} + +#rng-module-documentCanvas-contentWrapper { + border-color: #ddd; + border-style: solid; + border-width: 1px; + float:left; + width: 100%; + height: 100%; + overflow-y: scroll; + padding: 0 10px; + + &::-webkit-scrollbar { + .rng-mixin-scrollbar; + } + &::-webkit-scrollbar-track { + .rng-mixin-scrollbar-track; + } + &::-webkit-scrollbar-thumb { + .rng-mixin-scrollbar-thumb; + } + &::-webkit-scrollbar-thumb:window-inactive { + .rng-mixin-scrollbar-thumb-window-inactive; + } + + #rng-module-documentCanvas-content { + outline: 0px solid transparent; + } +} + +.rng-module-documentCanvas-currentNode { + background: #fffacd; + border-color: grey; + border-style:dashed; + border-width:1px; +} + +.rng-module-documentCanvas-hoveredNodeTag { + position:absolute; + height:20px; + top:-20px; + left:0; + background: #bd362f; + color: white; + font-size:9px; + font-weight: normal; + font-style: normal; + font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; + padding: 0 5px; + text-indent: 0; } \ No newline at end of file diff --git a/modules/documentCanvas/nodes.less b/modules/documentCanvas/nodes.less index 4e6a817..3c52bce 100644 --- a/modules/documentCanvas/nodes.less +++ b/modules/documentCanvas/nodes.less @@ -1,124 +1,124 @@ -[wlxml-tag] { - float: none !important; /* temporaty workaround for Bootstrap's influence via [class*="span"] { float: left; } */ - border-color: white; - border-style:solid; - border-width:1px; - min-height:20px; - position:relative; - text-indent: 0; -} - -span[wlxml-tag] { - display:inline-block; - min-width: 10px; -} - -[wlxml-tag=header] { - font-size: 13px; - font-weight: bold; - margin: 10px 0; -} - -[wlxml-tag=section] { - margin-top: 10px; - margin-bottom: 10px; -} - -[wlxml-tag=section] [wlxml-tag=section] { - margin-left:10px; -} - -[wlxml-class|="cite"] { - font-style: italic; -} - -[wlxml-class|="cite-code"] { - font-family: monospace; -} - -[wlxml-class|="cite-code-xml"] { - color: blue; -} - -[wlxml-tag=header] > [wlxml-class=author] { - font-size: 14px; -} - -[wlxml-tag=header] > [wlxml-class=title] { - font-size:18px; -} - -[wlxml-class|="uri"] { - color: blue; - text-decoration: underline; -} - -[wlxml-class|="p"] { - text-indent: 1.5em; -} - -[wlxml-class|="emph-tech"] { - font-style: italic; -} - -[wlxml-tag] metadata { - display:none; -} - -[wlxml-class="list-items"] { - - > [wlxml-class="item"] { - display: list-item; - margin-left: 10px; - padding-left: 5px; - } -} - -[wlxml-class="item"] { - > [wlxml-class="list-items"] { - display: block; - } -} - - -[wlxml-class="list-items-enum"] { - - counter-reset: myitem; - - > [wlxml-class="item"] { - counter-increment: myitem; - margin-left: 10px; - padding-left: 5px; - - &:before { - content: counter(myitem) '. '; - margin-right:10px; - padding-right:10px; - } - } -} - -.canvas-silent-item { - display: block !important; - counter-increment: none !important; - &:before { - content: normal !important; - } -} - -[wlxml-class="table"] { - - display: table; - border: 1px solid black; - - [wlxml-class="row"] { - display: table-row; - border: 1px solid black; - } - [wlxml-class="cell"] { - display: table-cell; - border: 1px solid black; - padding: 5px; - } - +[wlxml-tag] { + float: none !important; /* temporaty workaround for Bootstrap's influence via [class*="span"] { float: left; } */ + border-color: white; + border-style:solid; + border-width:1px; + min-height:20px; + position:relative; + text-indent: 0; +} + +span[wlxml-tag] { + display:inline-block; + min-width: 10px; +} + +[wlxml-tag=header] { + font-size: 13px; + font-weight: bold; + margin: 10px 0; +} + +[wlxml-tag=section] { + margin-top: 10px; + margin-bottom: 10px; +} + +[wlxml-tag=section] [wlxml-tag=section] { + margin-left:10px; +} + +[wlxml-class|="cite"] { + font-style: italic; +} + +[wlxml-class|="cite-code"] { + font-family: monospace; +} + +[wlxml-class|="cite-code-xml"] { + color: blue; +} + +[wlxml-tag=header] > [wlxml-class=author] { + font-size: 14px; +} + +[wlxml-tag=header] > [wlxml-class=title] { + font-size:18px; +} + +[wlxml-class|="uri"] { + color: blue; + text-decoration: underline; +} + +[wlxml-class|="p"] { + text-indent: 1.5em; +} + +[wlxml-class|="emph-tech"] { + font-style: italic; +} + +[wlxml-tag] metadata { + display:none; +} + +[wlxml-class="list-items"] { + + > [wlxml-class="item"] { + display: list-item; + margin-left: 10px; + padding-left: 5px; + } +} + +[wlxml-class="item"] { + > [wlxml-class="list-items"] { + display: block; + } +} + + +[wlxml-class="list-items-enum"] { + + counter-reset: myitem; + + > [wlxml-class="item"] { + counter-increment: myitem; + margin-left: 10px; + padding-left: 5px; + + &:before { + content: counter(myitem) '. '; + margin-right:10px; + padding-right:10px; + } + } +} + +.canvas-silent-item { + display: block !important; + counter-increment: none !important; + &:before { + content: normal !important; + } +} + +[wlxml-class="table"] { + + display: table; + border: 1px solid black; + + [wlxml-class="row"] { + display: table-row; + border: 1px solid black; + } + [wlxml-class="cell"] { + display: table-cell; + border: 1px solid black; + padding: 5px; + } + } \ No newline at end of file diff --git a/modules/documentCanvas/template.html b/modules/documentCanvas/template.html index c973f1b..5be1a42 100644 --- a/modules/documentCanvas/template.html +++ b/modules/documentCanvas/template.html @@ -1,7 +1,7 @@ -
-
-
-
-
-
+
+
+
+
+
+
\ No newline at end of file diff --git a/modules/documentCanvas/tests/canvas.test.js b/modules/documentCanvas/tests/canvas.test.js index ac3e69a..a9ed767 100644 --- a/modules/documentCanvas/tests/canvas.test.js +++ b/modules/documentCanvas/tests/canvas.test.js @@ -1,265 +1,265 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/chai', -'./utils.js', -'modules/documentCanvas/canvas', -'modules/documentCanvas/canvasNode' -], function($, chai, utils, canvas, canvasNode) { - - 'use strict'; - - var assert = chai.assert; - var assertDomEqual = utils.assertDomEqual; - - - suite('Quering nodes', function() { - test('getting preceding node', function() { - var c = canvas.create('
a
b
'); - var secondP = c.findNodes({tag: 'p'})[1]; - var firstP = c.getPrecedingNode({node: secondP}); - assert.equal(firstP.getContent(), 'a'); - }); - - test('pervious node of node without "previous siblings" is its parent', function() { - var c = canvas.create('
a
'); - var paragraph = c.findNodes({tag: 'p'})[0]; - assert.equal(c.getPrecedingNode({node: paragraph}).getTag(), 'section'); - }); - - }); - - - suite('Inserting nodes', function() { - test('append node to root', function() { - var c = canvas.create(); - var node = canvasNode.create({tag: 'header', klass: 'some-class'}); - c.nodeAppend({node: node, to: 'root'}); - assertDomEqual(c.getContent(), '
'); - }); - - test('append node to another node', function() { - var c = canvas.create('
'); - var node = canvasNode.create({tag: 'header', klass: 'some-class'}); - var to = c.findNodes('div')[0]; - c.nodeAppend({node: node, to: to}); - assertDomEqual(c.getContent(), '
'); - }); - - test('insert node after another node', function() { - var c = canvas.create('
'); - var node = canvasNode.create({tag: 'header', klass: 'some-class'}); - var after = c.findNodes('div')[0]; - c.nodeInsertAfter({node: node, after: after}); - assertDomEqual(c.getContent(), '
'); - }); - - test('wrap text in node', function() { - var c = canvas.create('
Header 1
'); - var header = c.findNodes({tag: 'header'})[0]; - var wrapper = canvasNode.create({tag: 'aside'}); - c.nodeWrap({inside: header, _with: wrapper, offsetStart: 1, offsetEnd: 6}); - assertDomEqual(c.getContent(), '
Header 1
'); - }); - - test('wrap text in node - text not a first node', function() { - var c = canvas.create('
Alice has a cat
'); - var header = c.findNodes({tag: 'header'})[0]; - var wrapper = canvasNode.create({tag: 'aside'}); - c.nodeWrap({inside: header, _with: wrapper, offsetStart: 1, offsetEnd: 4, textNodeIdx: 2}); - assertDomEqual(c.getContent(), '
Alice has a cat
'); - }); - - test('wrap text with nodes inside', function() { - var c = canvas.create('
Alice has a small cat
'); - var header = c.findNodes({tag: 'header'})[0]; - var wrapper = canvasNode.create({tag: 'aside'}); - c.nodeWrap({inside: header, _with: wrapper, offsetStart: 6, offsetEnd: 4, textNodeIdx: [0,2]}); - assertDomEqual(c.getContent(), '
Alice has a small cat
'); - }); - - test('split node', function() { - var c = canvas.create('
Header 1
'); - var header = c.findNodes({tag: 'header'})[0]; - var newNode = c.nodeSplit({node: header, offset: 4}); - assertDomEqual(c.getContent(), utils.cleanUp('\ -
\ -
Head
\ -
er 1
\ -
')); - assert.ok(newNode.isSame(c.findNodes({tag: 'header'})[1])); - }); - - test('split root node', function() { - var c = canvas.create('
cat
'); - var header = c.findNodes({tag: 'header'})[0]; - var newNode = c.nodeSplit({node: header, offset: 1}); - assertDomEqual(c.getContent(), utils.cleanUp('\ -
c
\ -
at
')); - assert.ok(newNode.isSame(c.findNodes({tag: 'header'})[1])); - }); - - test('split node with subnodes', function() { - var c = canvas.create(utils.cleanUp('\ -
\ -
Fancy and niceheader 1
\ -
')); - var header = c.findNodes({tag: 'header'})[0]; - var newNode = c.nodeSplit({node: header, offset: 5}); - assertDomEqual(c.getContent(), utils.cleanUp('\ -
\ -
Fancy
\ -
and niceheader 1
\ -
')); - }); - - test('remove node', function() { - var c = canvas.create('
some text
'); - var span = c.findNodes({tag: 'span'})[0]; - c.nodeRemove({node: span}); - assertDomEqual(c.getContent(), '
'); - }); - }); - - - suite('Lists', function() { - test('create from existing nodes', function() { - var c = canvas.create(utils.cleanUp('\ -
\ -
alice
\ - has\ -
a
\ -
cat
\ -
or not
\ -
' - )); - - var div_alice = c.findNodes({tag: 'div'})[0]; - var div_cat = c.findNodes({tag:'div'})[2]; - - c.listCreate({start: div_alice, end: div_cat}); - - assertDomEqual(c.getContent(), utils.cleanUp('\ -
\ -
\ -
alice
\ -
has
\ -
a
\ -
cat
\ -
\ -
or not
\ -
')); - }); - - test('create from existing nodes - start/end order doesn\'t matter', function() { - var html = utils.cleanUp('\ -
alice
\ -
cat
'); - var expected = utils.cleanUp('\ -
\ -
alice
\ -
cat
\ -
'); - - var c = canvas.create(html); - var div_alice = c.findNodes({tag: 'div'})[0]; - var div_cat = c.findNodes({tag:'div'})[1]; - c.listCreate({start: div_cat, end: div_alice}); - assertDomEqual(c.getContent(), expected); - - c = canvas.create(html); - div_alice = c.findNodes({tag: 'div'})[0]; - div_cat = c.findNodes({tag:'div'})[1]; - c.listCreate({start: div_alice, end: div_cat}); - assertDomEqual(c.getContent(), expected); - }); - - test('remove', function() { - var c = canvas.create(utils.cleanUp('\ -
\ -
\ -
alice
\ -
cat
\ -
\ -
')); - var item = c.findNodes({klass: 'item'})[1]; - c.listRemove({pointer: item}); - assertDomEqual(c.getContent(), utils.cleanUp('\ -
\ -
alice
\ -
cat
\ -
')); - }); - - test('checking if node is inside a list', function() { - var c = canvas.create(utils.cleanUp('\ -
\ -
\ -
alice \ -
cat
\ -
\ -
')); - assert.ok(c.nodeInsideList({node: c.findNodes({klass: 'item'})[1]}), 'item is inside a list'); - assert.ok(c.nodeInsideList({node: c.findNodes({tag: 'span'})[0]}), 'things nested in item are inside a list'); - }); - - test('moving items to nested list', function() { - var listHTML = utils.cleanUp('\ -
\ -
alice
\ -
cat
\ -
dog
\ -
bee
\ -
'); - var c = canvas.create(listHTML); - var items = c.findNodes({klass: 'item'}); - var cat_item = items[1]; - var dog_item = items[2]; - - c.listCreate({start: cat_item, end: dog_item}); - - assertDomEqual(c.getContent(), utils.cleanUp('\ -
\ -
alice
\ -
\ -
\ -
cat
\ -
dog
\ -
\ -
\ -
bee
\ -
' - )); - }); - - test('removing nested list', function() { - var nestedList = utils.cleanUp('\ -
\ -
alice
\ -
\ -
\ -
cat
\ -
dog
\ -
\ -
\ -
bee
\ -
'); - - var c = canvas.create(nestedList); - var dog_item = c.findNodes('[wlxml-class=list-items] [wlxml-class=list-items] > div')[1]; - assert.equal(dog_item.getContent(), 'dog'); - - c.listRemove({pointer: dog_item}); - - assertDomEqual(c.getContent(), utils.cleanUp('\ -
\ -
alice
\ -
cat
\ -
dog
\ -
bee
\ -
')); - - - }); - }); +define([ +'libs/jquery-1.9.1.min', +'libs/chai', +'./utils.js', +'modules/documentCanvas/canvas', +'modules/documentCanvas/canvasNode' +], function($, chai, utils, canvas, canvasNode) { + + 'use strict'; + + var assert = chai.assert; + var assertDomEqual = utils.assertDomEqual; + + + suite('Quering nodes', function() { + test('getting preceding node', function() { + var c = canvas.create('
a
b
'); + var secondP = c.findNodes({tag: 'p'})[1]; + var firstP = c.getPrecedingNode({node: secondP}); + assert.equal(firstP.getContent(), 'a'); + }); + + test('pervious node of node without "previous siblings" is its parent', function() { + var c = canvas.create('
a
'); + var paragraph = c.findNodes({tag: 'p'})[0]; + assert.equal(c.getPrecedingNode({node: paragraph}).getTag(), 'section'); + }); + + }); + + + suite('Inserting nodes', function() { + test('append node to root', function() { + var c = canvas.create(); + var node = canvasNode.create({tag: 'header', klass: 'some-class'}); + c.nodeAppend({node: node, to: 'root'}); + assertDomEqual(c.getContent(), '
'); + }); + + test('append node to another node', function() { + var c = canvas.create('
'); + var node = canvasNode.create({tag: 'header', klass: 'some-class'}); + var to = c.findNodes('div')[0]; + c.nodeAppend({node: node, to: to}); + assertDomEqual(c.getContent(), '
'); + }); + + test('insert node after another node', function() { + var c = canvas.create('
'); + var node = canvasNode.create({tag: 'header', klass: 'some-class'}); + var after = c.findNodes('div')[0]; + c.nodeInsertAfter({node: node, after: after}); + assertDomEqual(c.getContent(), '
'); + }); + + test('wrap text in node', function() { + var c = canvas.create('
Header 1
'); + var header = c.findNodes({tag: 'header'})[0]; + var wrapper = canvasNode.create({tag: 'aside'}); + c.nodeWrap({inside: header, _with: wrapper, offsetStart: 1, offsetEnd: 6}); + assertDomEqual(c.getContent(), '
Header 1
'); + }); + + test('wrap text in node - text not a first node', function() { + var c = canvas.create('
Alice has a cat
'); + var header = c.findNodes({tag: 'header'})[0]; + var wrapper = canvasNode.create({tag: 'aside'}); + c.nodeWrap({inside: header, _with: wrapper, offsetStart: 1, offsetEnd: 4, textNodeIdx: 2}); + assertDomEqual(c.getContent(), '
Alice has a cat
'); + }); + + test('wrap text with nodes inside', function() { + var c = canvas.create('
Alice has a small cat
'); + var header = c.findNodes({tag: 'header'})[0]; + var wrapper = canvasNode.create({tag: 'aside'}); + c.nodeWrap({inside: header, _with: wrapper, offsetStart: 6, offsetEnd: 4, textNodeIdx: [0,2]}); + assertDomEqual(c.getContent(), '
Alice has a small cat
'); + }); + + test('split node', function() { + var c = canvas.create('
Header 1
'); + var header = c.findNodes({tag: 'header'})[0]; + var newNode = c.nodeSplit({node: header, offset: 4}); + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
Head
\ +
er 1
\ +
')); + assert.ok(newNode.isSame(c.findNodes({tag: 'header'})[1])); + }); + + test('split root node', function() { + var c = canvas.create('
cat
'); + var header = c.findNodes({tag: 'header'})[0]; + var newNode = c.nodeSplit({node: header, offset: 1}); + assertDomEqual(c.getContent(), utils.cleanUp('\ +
c
\ +
at
')); + assert.ok(newNode.isSame(c.findNodes({tag: 'header'})[1])); + }); + + test('split node with subnodes', function() { + var c = canvas.create(utils.cleanUp('\ +
\ +
Fancy and niceheader 1
\ +
')); + var header = c.findNodes({tag: 'header'})[0]; + var newNode = c.nodeSplit({node: header, offset: 5}); + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
Fancy
\ +
and niceheader 1
\ +
')); + }); + + test('remove node', function() { + var c = canvas.create('
some text
'); + var span = c.findNodes({tag: 'span'})[0]; + c.nodeRemove({node: span}); + assertDomEqual(c.getContent(), '
'); + }); + }); + + + suite('Lists', function() { + test('create from existing nodes', function() { + var c = canvas.create(utils.cleanUp('\ +
\ +
alice
\ + has\ +
a
\ +
cat
\ +
or not
\ +
' + )); + + var div_alice = c.findNodes({tag: 'div'})[0]; + var div_cat = c.findNodes({tag:'div'})[2]; + + c.listCreate({start: div_alice, end: div_cat}); + + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
\ +
alice
\ +
has
\ +
a
\ +
cat
\ +
\ +
or not
\ +
')); + }); + + test('create from existing nodes - start/end order doesn\'t matter', function() { + var html = utils.cleanUp('\ +
alice
\ +
cat
'); + var expected = utils.cleanUp('\ +
\ +
alice
\ +
cat
\ +
'); + + var c = canvas.create(html); + var div_alice = c.findNodes({tag: 'div'})[0]; + var div_cat = c.findNodes({tag:'div'})[1]; + c.listCreate({start: div_cat, end: div_alice}); + assertDomEqual(c.getContent(), expected); + + c = canvas.create(html); + div_alice = c.findNodes({tag: 'div'})[0]; + div_cat = c.findNodes({tag:'div'})[1]; + c.listCreate({start: div_alice, end: div_cat}); + assertDomEqual(c.getContent(), expected); + }); + + test('remove', function() { + var c = canvas.create(utils.cleanUp('\ +
\ +
\ +
alice
\ +
cat
\ +
\ +
')); + var item = c.findNodes({klass: 'item'})[1]; + c.listRemove({pointer: item}); + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
alice
\ +
cat
\ +
')); + }); + + test('checking if node is inside a list', function() { + var c = canvas.create(utils.cleanUp('\ +
\ +
\ +
alice \ +
cat
\ +
\ +
')); + assert.ok(c.nodeInsideList({node: c.findNodes({klass: 'item'})[1]}), 'item is inside a list'); + assert.ok(c.nodeInsideList({node: c.findNodes({tag: 'span'})[0]}), 'things nested in item are inside a list'); + }); + + test('moving items to nested list', function() { + var listHTML = utils.cleanUp('\ +
\ +
alice
\ +
cat
\ +
dog
\ +
bee
\ +
'); + var c = canvas.create(listHTML); + var items = c.findNodes({klass: 'item'}); + var cat_item = items[1]; + var dog_item = items[2]; + + c.listCreate({start: cat_item, end: dog_item}); + + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
alice
\ +
\ +
\ +
cat
\ +
dog
\ +
\ +
\ +
bee
\ +
' + )); + }); + + test('removing nested list', function() { + var nestedList = utils.cleanUp('\ +
\ +
alice
\ +
\ +
\ +
cat
\ +
dog
\ +
\ +
\ +
bee
\ +
'); + + var c = canvas.create(nestedList); + var dog_item = c.findNodes('[wlxml-class=list-items] [wlxml-class=list-items] > div')[1]; + assert.equal(dog_item.getContent(), 'dog'); + + c.listRemove({pointer: dog_item}); + + assertDomEqual(c.getContent(), utils.cleanUp('\ +
\ +
alice
\ +
cat
\ +
dog
\ +
bee
\ +
')); + + + }); + }); }); \ No newline at end of file diff --git a/modules/documentCanvas/tests/canvasNode.test.js b/modules/documentCanvas/tests/canvasNode.test.js index f9507d9..a1595f7 100644 --- a/modules/documentCanvas/tests/canvasNode.test.js +++ b/modules/documentCanvas/tests/canvasNode.test.js @@ -1,62 +1,62 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/chai', -'./utils.js', -'modules/documentCanvas/canvasNode' -], function($, chai, utils, canvasNode) { - -'use strict'; - -var assert = chai.assert; - -var assertDomEqual = function(lhs, rhs) { - lhs.attr('id', ''); - rhs.attr('id', ''); - return assert.ok(lhs[0].isEqualNode(rhs[0]), 'nodes are equal'); - -}; - -suite('Create canvas node', function() { - test('from description', function() { - var node = canvasNode.create({tag: 'header', klass: 'some-class', content: 'some text content'}); - assert.equal(node.getTag(), 'header'); - assert.equal(node.getClass(), 'some-class'); - assert.equal(node.getContent(), 'some text content'); - assertDomEqual($('
some text content
'), node.dom); - }); - - test('from dom object', function() { - var node = canvasNode.create($('
')); - assert.equal(node.getTag(), 'header'); - assert.equal(node.getClass(), 'some-class'); - //assertDomEqual($('
'), node.dom); - }); -}); - -suite('class information', function() { - test('class of', function() { - var node = canvasNode.create({tag: 'header', klass: 'a-b-c'}); - assert.ok(node.isOfClass('a'), 'first level'); - assert.ok(node.isOfClass('a-b'), 'second level'); - assert.ok(node.isOfClass('a-b-c'), 'third level'); - assert.notOk(node.isOfClass('b-c')); - - var node2 = canvasNode.create({tag: 'header'}); - assert.notOk(node2.isOfClass('b')); - - }); - -}); - -suite('comparing nodes', function() { - test('isSame', function() { - var html = '
'; - var dom1 = $(html); - var dom2 = $(html); - assert.ok(canvasNode.create(dom1).isSame(canvasNode.create(dom1))); - assert.notOk(canvasNode.create(dom1).isSame(canvasNode.create(dom2))); - }); -}); - - +define([ +'libs/jquery-1.9.1.min', +'libs/chai', +'./utils.js', +'modules/documentCanvas/canvasNode' +], function($, chai, utils, canvasNode) { + +'use strict'; + +var assert = chai.assert; + +var assertDomEqual = function(lhs, rhs) { + lhs.attr('id', ''); + rhs.attr('id', ''); + return assert.ok(lhs[0].isEqualNode(rhs[0]), 'nodes are equal'); + +}; + +suite('Create canvas node', function() { + test('from description', function() { + var node = canvasNode.create({tag: 'header', klass: 'some-class', content: 'some text content'}); + assert.equal(node.getTag(), 'header'); + assert.equal(node.getClass(), 'some-class'); + assert.equal(node.getContent(), 'some text content'); + assertDomEqual($('
some text content
'), node.dom); + }); + + test('from dom object', function() { + var node = canvasNode.create($('
')); + assert.equal(node.getTag(), 'header'); + assert.equal(node.getClass(), 'some-class'); + //assertDomEqual($('
'), node.dom); + }); +}); + +suite('class information', function() { + test('class of', function() { + var node = canvasNode.create({tag: 'header', klass: 'a-b-c'}); + assert.ok(node.isOfClass('a'), 'first level'); + assert.ok(node.isOfClass('a-b'), 'second level'); + assert.ok(node.isOfClass('a-b-c'), 'third level'); + assert.notOk(node.isOfClass('b-c')); + + var node2 = canvasNode.create({tag: 'header'}); + assert.notOk(node2.isOfClass('b')); + + }); + +}); + +suite('comparing nodes', function() { + test('isSame', function() { + var html = '
'; + var dom1 = $(html); + var dom2 = $(html); + assert.ok(canvasNode.create(dom1).isSame(canvasNode.create(dom1))); + assert.notOk(canvasNode.create(dom1).isSame(canvasNode.create(dom2))); + }); +}); + + }); \ No newline at end of file diff --git a/modules/documentCanvas/tests/utils.js b/modules/documentCanvas/tests/utils.js index 93d4c03..fcb9853 100644 --- a/modules/documentCanvas/tests/utils.js +++ b/modules/documentCanvas/tests/utils.js @@ -1,49 +1,49 @@ -define(['libs/jquery-1.9.1.min', 'libs/chai'], function($, chai) { - return { - cleanUp: function(xml) { - var rmws = function(node) { - if(node.nodeType === 3) { - node.data = $.trim(node.data); - } - else { - $(node).contents().each(function() { - rmws(this); - }); - } - }; - - xml = $($.trim(xml)); - xml.each(function() { - rmws(this); - }); - - /*var toret = xml - .replace(/(<.*>)\s*(<.*>)/gm, '$1$2') - .replace(/(<\/.*>)\s*(<\/.*>)/gm, '$1$2') - .replace(/(<\/.*>)\s*(<.*>)/gm, '$1$2'); - return $.trim(toret);*/ - return $('
').append(xml).html(); - }, - - assertDomEqual: function(lhs, rhs) { - lhs = lhs.clone(); - var rhsArr = $.parseHTML(rhs); - if(rhsArr.length === 1) { - rhs = $(rhsArr[0]); - } else { - rhs = $('
'); - $.each(rhsArr, function(i, el) { - rhs.append(el); - }); - } - if(lhs.length > 1) { - lhs = $('
').append(lhs); - } - lhs.attr('id', ''); - rhs.attr('id', ''); - lhs.find('*').each(function() {$(this).attr('id', '');}); - rhs.find('*').each(function() {$(this).attr('id', '');}); - return chai.assert.ok(lhs[0].isEqualNode(rhs[0]), 'nodes are equal'); - } - }; +define(['libs/jquery-1.9.1.min', 'libs/chai'], function($, chai) { + return { + cleanUp: function(xml) { + var rmws = function(node) { + if(node.nodeType === 3) { + node.data = $.trim(node.data); + } + else { + $(node).contents().each(function() { + rmws(this); + }); + } + }; + + xml = $($.trim(xml)); + xml.each(function() { + rmws(this); + }); + + /*var toret = xml + .replace(/(<.*>)\s*(<.*>)/gm, '$1$2') + .replace(/(<\/.*>)\s*(<\/.*>)/gm, '$1$2') + .replace(/(<\/.*>)\s*(<.*>)/gm, '$1$2'); + return $.trim(toret);*/ + return $('
').append(xml).html(); + }, + + assertDomEqual: function(lhs, rhs) { + lhs = lhs.clone(); + var rhsArr = $.parseHTML(rhs); + if(rhsArr.length === 1) { + rhs = $(rhsArr[0]); + } else { + rhs = $('
'); + $.each(rhsArr, function(i, el) { + rhs.append(el); + }); + } + if(lhs.length > 1) { + lhs = $('
').append(lhs); + } + lhs.attr('id', ''); + rhs.attr('id', ''); + lhs.find('*').each(function() {$(this).attr('id', '');}); + rhs.find('*').each(function() {$(this).attr('id', '');}); + return chai.assert.ok(lhs[0].isEqualNode(rhs[0]), 'nodes are equal'); + } + }; }); \ No newline at end of file diff --git a/modules/documentCanvas/tests/utils.test.js b/modules/documentCanvas/tests/utils.test.js index 7001359..c82e6fb 100644 --- a/modules/documentCanvas/tests/utils.test.js +++ b/modules/documentCanvas/tests/utils.test.js @@ -1,29 +1,29 @@ -define(['libs/chai', './utils.js'], function(chai, utils) { - -'use strict'; -var assert = chai.assert; - -test('open+open', function() { - assert.equal(utils.cleanUp('
\n
'), '
'); -}); - -test('close+close', function() { - assert.equal(utils.cleanUp('
\n
'), '
'); -}); - -test('close+open', function() { - assert.equal(utils.cleanUp('
\n
'), '
'); -}); - -test('bug', function() { - var txt = '\ -
\ -
Head
\ -
er 1
\ -
'; - var txt2 = '
Head
er 1
'; - assert.equal(utils.cleanUp(txt), txt2); -}); - - +define(['libs/chai', './utils.js'], function(chai, utils) { + +'use strict'; +var assert = chai.assert; + +test('open+open', function() { + assert.equal(utils.cleanUp('
\n
'), '
'); +}); + +test('close+close', function() { + assert.equal(utils.cleanUp('
\n
'), '
'); +}); + +test('close+open', function() { + assert.equal(utils.cleanUp('
\n
'), '
'); +}); + +test('bug', function() { + var txt = '\ +
\ +
Head
\ +
er 1
\ +
'; + var txt2 = '
Head
er 1
'; + assert.equal(utils.cleanUp(txt), txt2); +}); + + }); \ No newline at end of file diff --git a/modules/documentCanvas/transformations.js b/modules/documentCanvas/transformations.js index 79c28b6..effe253 100644 --- a/modules/documentCanvas/transformations.js +++ b/modules/documentCanvas/transformations.js @@ -1,107 +1,107 @@ -define(['libs/jquery-1.9.1.min'], function($) { - - 'use strict'; - - var transformations = {}; - - transformations.fromXML = { - getHTMLTree: function(xml) { - var inner = $(xml).clone(); - var toret = $('
'); - toret.append(inner); - - var toBlock = ['div', 'section', 'header']; - var toInline = ['aside', 'span']; - - var transform = function(tags, replacingTagName) { - tags.forEach(function(tagName) { - tagName = tagName.toLowerCase(); - console.log('running ' + tagName); - toret.find(tagName).replaceWith(function() { - var currentTag = $(this); - if(currentTag.attr('wlxml-tag')) - return; - var toret = $('<' + replacingTagName + '>').attr('wlxml-tag', tagName); - toret.attr('id', 'xxxxxxxx-xxxx-xxxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {var r = Math.random()*16|0,v=c=='x'?r:r&0x3|0x8;return v.toString(16);})); - for(var i = 0; i < this.attributes.length; i++) { - var attr = this.attributes.item(i); - var value = attr.name === 'class' ? attr.value.replace(/\./g, '-') : attr.value; - toret.attr('wlxml-' + attr.name, value); - } - toret.append(currentTag.contents()); - return toret; - }); - }); - }; - - transform(toBlock, 'div'); - transform(toInline, 'span'); - - toret.find(":not(iframe)").addBack().contents().filter(function() { - return this.nodeType == 3;} ).each(function() { - var n = $(this); - var hasText = /\S/g.test(n.text()); - if(!hasText) { - n.remove(); - return; - } - var startSpace = /\s/g.test(n.text().substr(0,1)); - var endSpace = /\s/g.test(n.text().substr(-1)) && n.text().length > 1; - var trimmed = $.trim(n.text()); - n.get(0).data = (startSpace ? ' ' : '') + trimmed + (endSpace ? ' ' : ''); - }); - - return toret.children(); - }, - getMetaData: function(xml) { - var toret = {}; - $(xml).find('metadata').children().each(function() { - var node = $(this); - toret[this.nodeName.split(':')[1].toLowerCase()] = node.text(); - }); - return toret; - }, - getDocumentDescription: function(xml) { - return { - HTMLTree: this.getHTMLTree(xml), - metadata: this.getMetaData(xml) - }; - } - }; - - transformations.toXML = { - getXML: function(body) { - - var inner = body.clone(); - var toret = $('
'); - toret.append(inner); - - toret.find('div, span').replaceWith(function() { - var div = $(this); - var tagName = div.attr('wlxml-tag'); - var toret = $('<'+tagName+'>'); - - for(var i = 0; i < this.attributes.length; i++) { - var attr = this.attributes.item(i); - var split = attr.name.split('-'); - console.log(split); - if(split[0] !== 'wlxml' || (split.length > 1 && split[1] === 'tag')) - continue; - var wlxmlName = split.splice(1).join('-'); - var value = wlxmlName === 'class' ? attr.value.replace(/-/g, '.') : attr.value; - console.log(name + ': ' + value); - if(value.length && value.length > 0) - toret.attr(wlxmlName, value); - } - - toret.append(div.contents()); - return toret; - }); - - return vkbeautify.xml(toret.html()); - } - }; - - return transformations; - +define(['libs/jquery-1.9.1.min'], function($) { + + 'use strict'; + + var transformations = {}; + + transformations.fromXML = { + getHTMLTree: function(xml) { + var inner = $(xml).clone(); + var toret = $('
'); + toret.append(inner); + + var toBlock = ['div', 'section', 'header']; + var toInline = ['aside', 'span']; + + var transform = function(tags, replacingTagName) { + tags.forEach(function(tagName) { + tagName = tagName.toLowerCase(); + console.log('running ' + tagName); + toret.find(tagName).replaceWith(function() { + var currentTag = $(this); + if(currentTag.attr('wlxml-tag')) + return; + var toret = $('<' + replacingTagName + '>').attr('wlxml-tag', tagName); + toret.attr('id', 'xxxxxxxx-xxxx-xxxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {var r = Math.random()*16|0,v=c=='x'?r:r&0x3|0x8;return v.toString(16);})); + for(var i = 0; i < this.attributes.length; i++) { + var attr = this.attributes.item(i); + var value = attr.name === 'class' ? attr.value.replace(/\./g, '-') : attr.value; + toret.attr('wlxml-' + attr.name, value); + } + toret.append(currentTag.contents()); + return toret; + }); + }); + }; + + transform(toBlock, 'div'); + transform(toInline, 'span'); + + toret.find(":not(iframe)").addBack().contents().filter(function() { + return this.nodeType == 3;} ).each(function() { + var n = $(this); + var hasText = /\S/g.test(n.text()); + if(!hasText) { + n.remove(); + return; + } + var startSpace = /\s/g.test(n.text().substr(0,1)); + var endSpace = /\s/g.test(n.text().substr(-1)) && n.text().length > 1; + var trimmed = $.trim(n.text()); + n.get(0).data = (startSpace ? ' ' : '') + trimmed + (endSpace ? ' ' : ''); + }); + + return toret.children(); + }, + getMetaData: function(xml) { + var toret = {}; + $(xml).find('metadata').children().each(function() { + var node = $(this); + toret[this.nodeName.split(':')[1].toLowerCase()] = node.text(); + }); + return toret; + }, + getDocumentDescription: function(xml) { + return { + HTMLTree: this.getHTMLTree(xml), + metadata: this.getMetaData(xml) + }; + } + }; + + transformations.toXML = { + getXML: function(body) { + + var inner = body.clone(); + var toret = $('
'); + toret.append(inner); + + toret.find('div, span').replaceWith(function() { + var div = $(this); + var tagName = div.attr('wlxml-tag'); + var toret = $('<'+tagName+'>'); + + for(var i = 0; i < this.attributes.length; i++) { + var attr = this.attributes.item(i); + var split = attr.name.split('-'); + console.log(split); + if(split[0] !== 'wlxml' || (split.length > 1 && split[1] === 'tag')) + continue; + var wlxmlName = split.splice(1).join('-'); + var value = wlxmlName === 'class' ? attr.value.replace(/-/g, '.') : attr.value; + console.log(name + ': ' + value); + if(value.length && value.length > 0) + toret.attr(wlxmlName, value); + } + + toret.append(div.contents()); + return toret; + }); + + return vkbeautify.xml(toret.html()); + } + }; + + return transformations; + }); \ No newline at end of file diff --git a/modules/documentHistory/documentHistory.js b/modules/documentHistory/documentHistory.js index 2647ee3..8e686e6 100644 --- a/modules/documentHistory/documentHistory.js +++ b/modules/documentHistory/documentHistory.js @@ -1,146 +1,146 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/underscore-min', -'./restoreDialog', -'libs/text!./templates/main.html', -'libs/text!./templates/item.html' -], function($, _, restoreDialog, mainTemplateSrc, itemTemplateSrc) { - -'use strict'; - -return function(sandbox) { - - var dom = $(_.template(mainTemplateSrc)()); - var domNodes = { - itemList: dom.find('.rng-module-documentHistory-itemsList'), - }; - var itemViews = []; - - - dom.find('.btn.compare').click(function(e) { - var selected = historyItems.getSelected(); - sandbox.publish('compare', selected[0], selected[1]); - }); - - dom.find('.btn.restore').click(function(e) { - var dialog = restoreDialog.create(); - dialog.on('restore', function(event) { - sandbox.publish('restoreVersion', {version: historyItems.getSelected()[0], description: event.data.description}); - event.success(); - }); - dialog.show(); - }); - - dom.find('.btn.display').click(function(e) { - sandbox.publish('displayVersion', {version: historyItems.getSelected()[0]}); - }); - - var addHistoryItem = function(item, options) { - historyItems.add(item); - var view = new itemView(item); - itemViews.push(view); - domNodes.itemList.prepend(view.dom); - if(options.animate) { - view.dom.hide().slideDown(); - } - }; - - var toggleItemViews = function(toggle) { - itemViews.forEach(function(view) { - if(!historyItems.isSelected(view.item)) - view.toggle(toggle); - }); - }; - - var toggleButton = function(btn, toggle) { - dom.find('button.'+btn).toggleClass('disabled', !toggle); - }; - - var historyItems = { - _itemsById: {}, - _selected: [], - select: function(item) { - if(this._selected.length < 2) { - this._selected.push(item.version); - this._updateUI(); - return true; - } - return false; - }, - unselect: function(item) { - this._selected = _.without(this._selected, item.version); - this._updateUI(); - }, - add: function(item) { - this._itemsById[item.version] = item; - }, - isSelected: function(item) { - return _.contains(this._selected, item.version); - }, - getSelected: function() { - return this._selected; - }, - _updateUI: function() { - var len = this._selected.length; - if(len === 0) { - toggleButton('compare', false); - toggleButton('display', false); - toggleButton('restore', false); - } - if(len === 1) { - toggleButton('compare', false); - toggleButton('display', true); - toggleButton('restore', true); - } - if(len === 2) { - toggleItemViews(false); - toggleButton('compare', true); - toggleButton('display', false); - toggleButton('restore', false); - } else { - toggleItemViews(true); - } - } - }; - historyItems._updateUI(); - - var itemView = function(item) { - this.item = item; - this.dom = $(this.template(item)); - this.dom.on('click', _.bind(this.onItemClicked, this)); - }; - itemView.prototype.template = _.template(itemTemplateSrc); - itemView.prototype.onItemClicked = function() { - if(historyItems.isSelected(this.item)) { - historyItems.unselect(this.item); - this.dimItem(); - } else if(historyItems.select(this.item)) { - this.highlightItem(); - } - }; - itemView.prototype.highlightItem = function() { - this.dom.addClass('highlighted'); - }; - itemView.prototype.dimItem = function() { - this.dom.removeClass('highlighted'); - }; - itemView.prototype.toggle = function(toggle) { - this.dom.toggleClass('disabled', !toggle); - }; - - - - return { +define([ +'libs/jquery-1.9.1.min', +'libs/underscore-min', +'./restoreDialog', +'libs/text!./templates/main.html', +'libs/text!./templates/item.html' +], function($, _, restoreDialog, mainTemplateSrc, itemTemplateSrc) { + +'use strict'; + +return function(sandbox) { + + var dom = $(_.template(mainTemplateSrc)()); + var domNodes = { + itemList: dom.find('.rng-module-documentHistory-itemsList'), + }; + var itemViews = []; + + + dom.find('.btn.compare').click(function(e) { + var selected = historyItems.getSelected(); + sandbox.publish('compare', selected[0], selected[1]); + }); + + dom.find('.btn.restore').click(function(e) { + var dialog = restoreDialog.create(); + dialog.on('restore', function(event) { + sandbox.publish('restoreVersion', {version: historyItems.getSelected()[0], description: event.data.description}); + event.success(); + }); + dialog.show(); + }); + + dom.find('.btn.display').click(function(e) { + sandbox.publish('displayVersion', {version: historyItems.getSelected()[0]}); + }); + + var addHistoryItem = function(item, options) { + historyItems.add(item); + var view = new itemView(item); + itemViews.push(view); + domNodes.itemList.prepend(view.dom); + if(options.animate) { + view.dom.hide().slideDown(); + } + }; + + var toggleItemViews = function(toggle) { + itemViews.forEach(function(view) { + if(!historyItems.isSelected(view.item)) + view.toggle(toggle); + }); + }; + + var toggleButton = function(btn, toggle) { + dom.find('button.'+btn).toggleClass('disabled', !toggle); + }; + + var historyItems = { + _itemsById: {}, + _selected: [], + select: function(item) { + if(this._selected.length < 2) { + this._selected.push(item.version); + this._updateUI(); + return true; + } + return false; + }, + unselect: function(item) { + this._selected = _.without(this._selected, item.version); + this._updateUI(); + }, + add: function(item) { + this._itemsById[item.version] = item; + }, + isSelected: function(item) { + return _.contains(this._selected, item.version); + }, + getSelected: function() { + return this._selected; + }, + _updateUI: function() { + var len = this._selected.length; + if(len === 0) { + toggleButton('compare', false); + toggleButton('display', false); + toggleButton('restore', false); + } + if(len === 1) { + toggleButton('compare', false); + toggleButton('display', true); + toggleButton('restore', true); + } + if(len === 2) { + toggleItemViews(false); + toggleButton('compare', true); + toggleButton('display', false); + toggleButton('restore', false); + } else { + toggleItemViews(true); + } + } + }; + historyItems._updateUI(); + + var itemView = function(item) { + this.item = item; + this.dom = $(this.template(item)); + this.dom.on('click', _.bind(this.onItemClicked, this)); + }; + itemView.prototype.template = _.template(itemTemplateSrc); + itemView.prototype.onItemClicked = function() { + if(historyItems.isSelected(this.item)) { + historyItems.unselect(this.item); + this.dimItem(); + } else if(historyItems.select(this.item)) { + this.highlightItem(); + } + }; + itemView.prototype.highlightItem = function() { + this.dom.addClass('highlighted'); + }; + itemView.prototype.dimItem = function() { + this.dom.removeClass('highlighted'); + }; + itemView.prototype.toggle = function(toggle) { + this.dom.toggleClass('disabled', !toggle); + }; + + + + return { start: function() { sandbox.publish('ready'); }, - addHistory: function(history, options) { - history.forEach(function(historyItem) { - addHistoryItem(historyItem, options || {}); - }); - }, - getView: function() { - return dom; - } - }; -}; - + addHistory: function(history, options) { + history.forEach(function(historyItem) { + addHistoryItem(historyItem, options || {}); + }); + }, + getView: function() { + return dom; + } + }; +}; + }); \ No newline at end of file diff --git a/modules/documentHistory/documentHistory.less b/modules/documentHistory/documentHistory.less index 592b22a..608c9df 100644 --- a/modules/documentHistory/documentHistory.less +++ b/modules/documentHistory/documentHistory.less @@ -1,62 +1,62 @@ -.rng-module-documentHistory { - - .item { - padding: 5px 5px; - margin: 0 0 15px 0; - cursor: pointer; - - .version { - float: left; - width: 30px; - font-weight: bold; - } - - .date, .author, .description { - margin: 5px 10px 0 40px; - } - - .description { - font-size: .9em; - } - } - - .item.highlighted { - background: #ffec63; - } - - .item.disabled { - cursor: default; - } - - .toolbar { - margin: 0 0 15px 0; - white-space:nowrap; - word-spacing:0; - min-height: 22px; - button { - margin-right: 10px; - } - } - - .rng-module-documentHistory-itemsList { - overflow-y: scroll; - position: absolute; - top: 30px; - bottom: 0; - left: 0; - right: 0; - &::-webkit-scrollbar { - .rng-mixin-scrollbar; - } - &::-webkit-scrollbar-track { - .rng-mixin-scrollbar-track; - } - &::-webkit-scrollbar-thumb { - .rng-mixin-scrollbar-thumb; - } - &::-webkit-scrollbar-thumb:window-inactive { - .rng-mixin-scrollbar-thumb-window-inactive; - } - } -} - +.rng-module-documentHistory { + + .item { + padding: 5px 5px; + margin: 0 0 15px 0; + cursor: pointer; + + .version { + float: left; + width: 30px; + font-weight: bold; + } + + .date, .author, .description { + margin: 5px 10px 0 40px; + } + + .description { + font-size: .9em; + } + } + + .item.highlighted { + background: #ffec63; + } + + .item.disabled { + cursor: default; + } + + .toolbar { + margin: 0 0 15px 0; + white-space:nowrap; + word-spacing:0; + min-height: 22px; + button { + margin-right: 10px; + } + } + + .rng-module-documentHistory-itemsList { + overflow-y: scroll; + position: absolute; + top: 30px; + bottom: 0; + left: 0; + right: 0; + &::-webkit-scrollbar { + .rng-mixin-scrollbar; + } + &::-webkit-scrollbar-track { + .rng-mixin-scrollbar-track; + } + &::-webkit-scrollbar-thumb { + .rng-mixin-scrollbar-thumb; + } + &::-webkit-scrollbar-thumb:window-inactive { + .rng-mixin-scrollbar-thumb-window-inactive; + } + } +} + diff --git a/modules/documentHistory/restoreDialog.js b/modules/documentHistory/restoreDialog.js index 97ea2af..a9de353 100644 --- a/modules/documentHistory/restoreDialog.js +++ b/modules/documentHistory/restoreDialog.js @@ -1,55 +1,55 @@ -define([ -'libs/text!./templates/restoreDialog.html', -'libs/underscore-min', -'libs/backbone-min', -'libs/jquery-1.9.1.min' -], function(restoreDialogTemplate, _, Backbone, $) { - - var DialogView = Backbone.View.extend({ - template: _.template(restoreDialogTemplate), - events: { - 'click .restore-btn': 'onSave', - 'click .cancel-btn': 'close', - 'click .close': 'close' - }, - initialize: function() { - _.bindAll(this); - this.actionsDisabled = false; - }, - show: function() { - this.setElement(this.template()); - this.$el.modal({backdrop: 'static'}); - this.$el.modal('show'); - this.$('textarea').focus(); - }, - onSave: function(e) { - e.preventDefault(); - var view = this; - this.trigger('restore', { - data: {description: view.$el.find('textarea').val()}, - success: function() { view.actionsDisabled = false; view.close(); }, - error: function() { view.actionsDisabled = false; view.close(); }, - }); - }, - close: function(e) { - if(e) - e.preventDefault(); - if(!this.actionsDisabled) { - this.$el.modal('hide'); - this.$el.remove(); - } - }, - toggleButtons: function(toggle) { - this.$('.btn, button').toggleClass('disabled', !toggle); - this.$('textarea').attr('disabled', !toggle); - this.actionsDisabled = !toggle; - } - }); - - return { - create: function() { - return new DialogView(); - } - }; - +define([ +'libs/text!./templates/restoreDialog.html', +'libs/underscore-min', +'libs/backbone-min', +'libs/jquery-1.9.1.min' +], function(restoreDialogTemplate, _, Backbone, $) { + + var DialogView = Backbone.View.extend({ + template: _.template(restoreDialogTemplate), + events: { + 'click .restore-btn': 'onSave', + 'click .cancel-btn': 'close', + 'click .close': 'close' + }, + initialize: function() { + _.bindAll(this); + this.actionsDisabled = false; + }, + show: function() { + this.setElement(this.template()); + this.$el.modal({backdrop: 'static'}); + this.$el.modal('show'); + this.$('textarea').focus(); + }, + onSave: function(e) { + e.preventDefault(); + var view = this; + this.trigger('restore', { + data: {description: view.$el.find('textarea').val()}, + success: function() { view.actionsDisabled = false; view.close(); }, + error: function() { view.actionsDisabled = false; view.close(); }, + }); + }, + close: function(e) { + if(e) + e.preventDefault(); + if(!this.actionsDisabled) { + this.$el.modal('hide'); + this.$el.remove(); + } + }, + toggleButtons: function(toggle) { + this.$('.btn, button').toggleClass('disabled', !toggle); + this.$('textarea').attr('disabled', !toggle); + this.actionsDisabled = !toggle; + } + }); + + return { + create: function() { + return new DialogView(); + } + }; + }); \ No newline at end of file diff --git a/modules/documentHistory/templates/item.html b/modules/documentHistory/templates/item.html index f3afb3d..1629226 100644 --- a/modules/documentHistory/templates/item.html +++ b/modules/documentHistory/templates/item.html @@ -1,6 +1,6 @@ -
-
<%= version %>
-
<%= date %>
-
<%= author %>
-
<%= description %>
+
+
<%= version %>
+
<%= date %>
+
<%= author %>
+
<%= description %>
\ No newline at end of file diff --git a/modules/documentHistory/templates/main.html b/modules/documentHistory/templates/main.html index 0e581f6..83cd627 100644 --- a/modules/documentHistory/templates/main.html +++ b/modules/documentHistory/templates/main.html @@ -1,11 +1,11 @@ -
-
-
- - - -
-
-
-
+
+
+
+ + + +
+
+
+
\ No newline at end of file diff --git a/modules/documentHistory/templates/restoreDialog.html b/modules/documentHistory/templates/restoreDialog.html index 72fea22..ded0a11 100644 --- a/modules/documentHistory/templates/restoreDialog.html +++ b/modules/documentHistory/templates/restoreDialog.html @@ -1,14 +1,14 @@ -
-
- -

Przywróć wersję

-
-
- - -
-
- Przywróć - Anuluj -
+
+
+ +

Przywróć wersję

+
+
+ + +
+
+ Przywróć + Anuluj +
\ No newline at end of file diff --git a/modules/documentToolbar/documentToolbar.js b/modules/documentToolbar/documentToolbar.js index a6dd0be..2d963d2 100644 --- a/modules/documentToolbar/documentToolbar.js +++ b/modules/documentToolbar/documentToolbar.js @@ -1,57 +1,57 @@ -define(['libs/jquery-1.9.1.min', 'libs/underscore-min', 'libs/text!./template.html'], function($, _, template) { - -'use strict'; - -return function(sandbox) { - - var view = { - node: $(_.template(template)()), - setup: function() { - var view = this; - - this.node.find('button').click(function(e) { - e.stopPropagation(); - var btn = $(e.currentTarget); - if(btn.attr('data-btn-type') === 'toggle') { - btn.toggleClass('active'); - var event; - var btnId = btn.attr('data-btn'); - if(btnId === 'grid') - event = 'toggleGrid'; - if(btnId === 'tags') - event = 'toggleTags'; - sandbox.publish(event, btn.hasClass('active')); - } - if(btn.attr('data-btn-type') === 'cmd') { - var command = btn.attr('data-btn'); - var meta = btn.attr('data-meta'); - if(command === 'new-node') { - var wlxmlTag = view.getOption('newTag-tag'); - var wlxmlClass = view.getOption('newTag-class'); - if(meta) { - var split = meta.split('/'); - wlxmlTag = split[0]; - wlxmlClass = split[1]; - } - sandbox.publish('newNodeRequested', wlxmlTag, wlxmlClass); - } else { - sandbox.publish('command', btn.attr('data-btn'), btn.attr('data-meta')); - } - } - }); - }, - getOption: function(option) { - return this.node.find('.rng-module-documentToolbar-toolbarOption[data-option=' + option +']').val(); - } - }; - - view.setup(); - - return { - start: function() { sandbox.publish('ready'); }, - getView: function() { return view.node; }, - getOption: function(option) { return view.getOption(option); } - }; -}; - +define(['libs/jquery-1.9.1.min', 'libs/underscore-min', 'libs/text!./template.html'], function($, _, template) { + +'use strict'; + +return function(sandbox) { + + var view = { + node: $(_.template(template)()), + setup: function() { + var view = this; + + this.node.find('button').click(function(e) { + e.stopPropagation(); + var btn = $(e.currentTarget); + if(btn.attr('data-btn-type') === 'toggle') { + btn.toggleClass('active'); + var event; + var btnId = btn.attr('data-btn'); + if(btnId === 'grid') + event = 'toggleGrid'; + if(btnId === 'tags') + event = 'toggleTags'; + sandbox.publish(event, btn.hasClass('active')); + } + if(btn.attr('data-btn-type') === 'cmd') { + var command = btn.attr('data-btn'); + var meta = btn.attr('data-meta'); + if(command === 'new-node') { + var wlxmlTag = view.getOption('newTag-tag'); + var wlxmlClass = view.getOption('newTag-class'); + if(meta) { + var split = meta.split('/'); + wlxmlTag = split[0]; + wlxmlClass = split[1]; + } + sandbox.publish('newNodeRequested', wlxmlTag, wlxmlClass); + } else { + sandbox.publish('command', btn.attr('data-btn'), btn.attr('data-meta')); + } + } + }); + }, + getOption: function(option) { + return this.node.find('.rng-module-documentToolbar-toolbarOption[data-option=' + option +']').val(); + } + }; + + view.setup(); + + return { + start: function() { sandbox.publish('ready'); }, + getView: function() { return view.node; }, + getOption: function(option) { return view.getOption(option); } + }; +}; + }); \ No newline at end of file diff --git a/modules/documentToolbar/documentToolbar.less b/modules/documentToolbar/documentToolbar.less index 6189f32..91d45c9 100644 --- a/modules/documentToolbar/documentToolbar.less +++ b/modules/documentToolbar/documentToolbar.less @@ -1,28 +1,28 @@ -.rng-module-documentToolbar { - margin: 0 0 10px 0; - white-space:nowrap; - word-spacing:0; - - select { - line-height: 14px; - font-size:9px; - height: auto; - width: 50px; - padding: 1px; - -webkit-appearance: button; - -moz-appearance: button; - appearance: button; - margin-bottom: 0; - } - - .rng-module-documentToolbar-toolbarGroup { - border-width: 0 1px 0 0; - border-style: solid; - border-color: #ddd; - padding: 0 8px 0 0; - margin: 0 8px 0 0; - float:left; - } - -} - +.rng-module-documentToolbar { + margin: 0 0 10px 0; + white-space:nowrap; + word-spacing:0; + + select { + line-height: 14px; + font-size:9px; + height: auto; + width: 50px; + padding: 1px; + -webkit-appearance: button; + -moz-appearance: button; + appearance: button; + margin-bottom: 0; + } + + .rng-module-documentToolbar-toolbarGroup { + border-width: 0 1px 0 0; + border-style: solid; + border-color: #ddd; + padding: 0 8px 0 0; + margin: 0 8px 0 0; + float:left; + } + +} + diff --git a/modules/documentToolbar/template.html b/modules/documentToolbar/template.html index f10459f..31ecbf6 100644 --- a/modules/documentToolbar/template.html +++ b/modules/documentToolbar/template.html @@ -1,30 +1,30 @@ -
-
- - - - - - - -
-
- - -
-
- - -
-
+
+
+ + + + + + + +
+
+ + +
+
+ + +
+
\ No newline at end of file diff --git a/modules/indicator/indicator.js b/modules/indicator/indicator.js index 007dcff..d98fe04 100644 --- a/modules/indicator/indicator.js +++ b/modules/indicator/indicator.js @@ -1,35 +1,35 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/underscore-min', -'libs/text!./template.html' -], function($, _, template) { - -'use strict'; - -return function(sandbox) { - - var view = { - dom: $(_.template(template)()), - setup: function() { - - } - }; - - return { - start: function() { sandbox.publish('ready'); }, - getView: function() { return view.dom; }, - showMessage: function(msg) { - view.dom.html('' + msg + '').show(); - }, - clearMessage: function(report) { - view.dom.empty(); - if(report && report.message) { - view.dom.html('' + report.message + '').show().fadeOut(4000); - } - } - - }; - -}; - -}); +define([ +'libs/jquery-1.9.1.min', +'libs/underscore-min', +'libs/text!./template.html' +], function($, _, template) { + +'use strict'; + +return function(sandbox) { + + var view = { + dom: $(_.template(template)()), + setup: function() { + + } + }; + + return { + start: function() { sandbox.publish('ready'); }, + getView: function() { return view.dom; }, + showMessage: function(msg) { + view.dom.html('' + msg + '').show(); + }, + clearMessage: function(report) { + view.dom.empty(); + if(report && report.message) { + view.dom.html('' + report.message + '').show().fadeOut(4000); + } + } + + }; + +}; + +}); diff --git a/modules/indicator/indicator.less b/modules/indicator/indicator.less index 909cede..48f6e3b 100644 --- a/modules/indicator/indicator.less +++ b/modules/indicator/indicator.less @@ -1,14 +1,14 @@ -.rng-module-indicator { - span { - font-weight: bold; - background: #f9edbe; - padding: 2px 5px; - border: solid 1px #f6e39c; - font-size:12px; - } - - span.success { - background: #cef9be; - border-color: darken(#cef9be, 10%); - } +.rng-module-indicator { + span { + font-weight: bold; + background: #f9edbe; + padding: 2px 5px; + border: solid 1px #f6e39c; + font-size:12px; + } + + span.success { + background: #cef9be; + border-color: darken(#cef9be, 10%); + } } \ No newline at end of file diff --git a/modules/indicator/template.html b/modules/indicator/template.html index 48933d9..e4e449b 100644 --- a/modules/indicator/template.html +++ b/modules/indicator/template.html @@ -1,3 +1,3 @@ -
- +
+
\ No newline at end of file diff --git a/modules/mainBar/mainBar.js b/modules/mainBar/mainBar.js index 6966e4a..85551fc 100644 --- a/modules/mainBar/mainBar.js +++ b/modules/mainBar/mainBar.js @@ -1,29 +1,29 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/underscore-min', -'libs/text!./template.html'], function($, _, template) { - -'use strict'; - -return function(sandbox) { - - var view = $(_.template(template)()); - view.find('button').click(function(e) { - e.preventDefault(); - sandbox.publish('cmd.' + $(e.target).attr('data-cmd')); - }); - - return { - start: function() { sandbox.publish('ready'); }, - getView: function() {return view;}, - setCommandEnabled: function(cmd, enabled) { - view.find('[data-cmd='+cmd+']').toggleClass('disabled', !enabled); - }, - setVersion: function(version) { - view.find('.version').text(version); - } - }; - -}; - +define([ +'libs/jquery-1.9.1.min', +'libs/underscore-min', +'libs/text!./template.html'], function($, _, template) { + +'use strict'; + +return function(sandbox) { + + var view = $(_.template(template)()); + view.find('button').click(function(e) { + e.preventDefault(); + sandbox.publish('cmd.' + $(e.target).attr('data-cmd')); + }); + + return { + start: function() { sandbox.publish('ready'); }, + getView: function() {return view;}, + setCommandEnabled: function(cmd, enabled) { + view.find('[data-cmd='+cmd+']').toggleClass('disabled', !enabled); + }, + setVersion: function(version) { + view.find('.version').text(version); + } + }; + +}; + }); \ No newline at end of file diff --git a/modules/mainBar/mainBar.less b/modules/mainBar/mainBar.less index 327fa56..0e2a899 100644 --- a/modules/mainBar/mainBar.less +++ b/modules/mainBar/mainBar.less @@ -1,21 +1,21 @@ -/*#rng-skelton-menu { - float: right; -}*/ - -.rng-module-mainBar { - - font-size: 10px; - - li { - display: inline; - border-width: 0 1px 0 0; - border-color: #ddd; - border-style: solid; - margin: 0 5px 0 0; - padding: 0 5px 0 0; - } - - ul { - list-style-type: none; - } +/*#rng-skelton-menu { + float: right; +}*/ + +.rng-module-mainBar { + + font-size: 10px; + + li { + display: inline; + border-width: 0 1px 0 0; + border-color: #ddd; + border-style: solid; + margin: 0 5px 0 0; + padding: 0 5px 0 0; + } + + ul { + list-style-type: none; + } } \ No newline at end of file diff --git a/modules/mainBar/template.html b/modules/mainBar/template.html index f8d4641..3c43ee6 100644 --- a/modules/mainBar/template.html +++ b/modules/mainBar/template.html @@ -1,7 +1,7 @@ -
- +
+
\ No newline at end of file diff --git a/modules/metadataEditor/metadataEditor.js b/modules/metadataEditor/metadataEditor.js index 12578ba..63b2404 100644 --- a/modules/metadataEditor/metadataEditor.js +++ b/modules/metadataEditor/metadataEditor.js @@ -1,115 +1,115 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/underscore-min', -'./transformations', -'libs/text!./templates/main.html', -'libs/text!./templates/item.html' -], function($, _, transformations, mainTemplate, itemTemplate) { - -'use strict'; - -return function(sandbox) { - - - var view = { - node: $(_.template(mainTemplate)()), - setup: function() { - var view = this; - var metaTable = this.metaTable = this.node.find('table'); - - this.node.find('.rng-module-metadataEditor-addBtn').click(function() { - var newRow = view._addMetaRow('', ''); - $(newRow.find('td div')[0]).focus(); - sandbox.publish('metadataChanged', view.getMetadata()); - }); - - this.metaTable.on('click', '.rng-visualEditor-metaRemoveBtn', function(e) { - $(e.target).closest('tr').remove(); - sandbox.publish('metadataChanged', view.getMetadata()); - }); - - this.metaTable.on('keydown', '[contenteditable]', function(e) { - console.log(e.which); - if(e.which === 13) { - if($(document.activeElement).hasClass('rng-module-metadataEditor-metaItemKey')) { - metaTable.find('.rng-module-metadataEditor-metaItemValue').focus(); - } else { - var input = $(''); - input.appendTo('body').focus(); - view.node.find('.rng-module-metadataEditor-addBtn').focus(); - input.remove(); - } - e.preventDefault(); - } - }); - - - var onKeyUp = function(e) { - if(e.which !== 13) - sandbox.publish('metadataChanged', view.getMetadata()); - }; - this.metaTable.on('keyup', '[contenteditable]', _.throttle(onKeyUp, 500)); - }, - getMetadata: function() { - var toret = {}; - this.node.find('tr').each(function() { - var tr = $(this); - var inputs = $(this).find('td [contenteditable]'); - var key = $(inputs[0]).text(); - var value = $(inputs[1]).text(); - toret[key] = value; - }); - return toret; - }, - setMetadata: function(metadata) { - var view = this; - this.metaTable.find('tr').remove(); - _.each(_.keys(metadata), function(key) { - view._addMetaRow(key, metadata[key]); - }); - }, - _addMetaRow: function(key, value) { - var newRow = $(_.template(itemTemplate)({key: key || '', value: value || ''})); - newRow.appendTo(this.metaTable); - return newRow; - } - }; - - view.setup(); - - return { - start: function() { - sandbox.publish('ready'); - }, - setDocument: function(xml) { - view.setMetadata(transformations.getMetadata(xml)); - sandbox.publish('metadataSet'); - }, - getMetadata: function() { - return transformations.getXML(view.getMetadata()); - }, - getView: function() { - return view.node; - }, - attachMetadata: function(document) { - var toret = $('
'); - toret.append($(document)); - var meta = $('\n').append(transformations.getXML(view.getMetadata())); - - var metadata = toret.find('metadata'); - if(metadata.length === 0) { - var section = toret.find('section'); - section = section.length ? $(section[0]) : null; - if(section) { - section.prepend(meta); - } - } else { - metadata.replaceWith(meta); - } - return toret.html(); - } - - }; -}; - +define([ +'libs/jquery-1.9.1.min', +'libs/underscore-min', +'./transformations', +'libs/text!./templates/main.html', +'libs/text!./templates/item.html' +], function($, _, transformations, mainTemplate, itemTemplate) { + +'use strict'; + +return function(sandbox) { + + + var view = { + node: $(_.template(mainTemplate)()), + setup: function() { + var view = this; + var metaTable = this.metaTable = this.node.find('table'); + + this.node.find('.rng-module-metadataEditor-addBtn').click(function() { + var newRow = view._addMetaRow('', ''); + $(newRow.find('td div')[0]).focus(); + sandbox.publish('metadataChanged', view.getMetadata()); + }); + + this.metaTable.on('click', '.rng-visualEditor-metaRemoveBtn', function(e) { + $(e.target).closest('tr').remove(); + sandbox.publish('metadataChanged', view.getMetadata()); + }); + + this.metaTable.on('keydown', '[contenteditable]', function(e) { + console.log(e.which); + if(e.which === 13) { + if($(document.activeElement).hasClass('rng-module-metadataEditor-metaItemKey')) { + metaTable.find('.rng-module-metadataEditor-metaItemValue').focus(); + } else { + var input = $(''); + input.appendTo('body').focus(); + view.node.find('.rng-module-metadataEditor-addBtn').focus(); + input.remove(); + } + e.preventDefault(); + } + }); + + + var onKeyUp = function(e) { + if(e.which !== 13) + sandbox.publish('metadataChanged', view.getMetadata()); + }; + this.metaTable.on('keyup', '[contenteditable]', _.throttle(onKeyUp, 500)); + }, + getMetadata: function() { + var toret = {}; + this.node.find('tr').each(function() { + var tr = $(this); + var inputs = $(this).find('td [contenteditable]'); + var key = $(inputs[0]).text(); + var value = $(inputs[1]).text(); + toret[key] = value; + }); + return toret; + }, + setMetadata: function(metadata) { + var view = this; + this.metaTable.find('tr').remove(); + _.each(_.keys(metadata), function(key) { + view._addMetaRow(key, metadata[key]); + }); + }, + _addMetaRow: function(key, value) { + var newRow = $(_.template(itemTemplate)({key: key || '', value: value || ''})); + newRow.appendTo(this.metaTable); + return newRow; + } + }; + + view.setup(); + + return { + start: function() { + sandbox.publish('ready'); + }, + setDocument: function(xml) { + view.setMetadata(transformations.getMetadata(xml)); + sandbox.publish('metadataSet'); + }, + getMetadata: function() { + return transformations.getXML(view.getMetadata()); + }, + getView: function() { + return view.node; + }, + attachMetadata: function(document) { + var toret = $('
'); + toret.append($(document)); + var meta = $('\n').append(transformations.getXML(view.getMetadata())); + + var metadata = toret.find('metadata'); + if(metadata.length === 0) { + var section = toret.find('section'); + section = section.length ? $(section[0]) : null; + if(section) { + section.prepend(meta); + } + } else { + metadata.replaceWith(meta); + } + return toret.html(); + } + + }; +}; + }); \ No newline at end of file diff --git a/modules/metadataEditor/metadataEditor.less b/modules/metadataEditor/metadataEditor.less index 8a9446c..42bf5c0 100644 --- a/modules/metadataEditor/metadataEditor.less +++ b/modules/metadataEditor/metadataEditor.less @@ -1,32 +1,32 @@ -.rng-module-metadataEditor { - - table { - margin-bottom:10px; - - [contenteditable] { - cursor: pointer; - } - - li:last-child { - border-bottom: none !important; - } - - tr td:nth-child(1){ - width: 20%; - } - - tr td:nth-child(2) { - width:80%; - } - } - - .rng-module-metadataEditor-addBtn { - float:right; - margin-right:6px; - } - - .btn { - padding:3px; - line-height:10px; - } +.rng-module-metadataEditor { + + table { + margin-bottom:10px; + + [contenteditable] { + cursor: pointer; + } + + li:last-child { + border-bottom: none !important; + } + + tr td:nth-child(1){ + width: 20%; + } + + tr td:nth-child(2) { + width:80%; + } + } + + .rng-module-metadataEditor-addBtn { + float:right; + margin-right:6px; + } + + .btn { + padding:3px; + line-height:10px; + } } \ No newline at end of file diff --git a/modules/metadataEditor/templates/item.html b/modules/metadataEditor/templates/item.html index ef91cab..3920f68 100644 --- a/modules/metadataEditor/templates/item.html +++ b/modules/metadataEditor/templates/item.html @@ -1,5 +1,5 @@ - -
<%= key %>
-
<%= value %>
- + +
<%= key %>
+
<%= value %>
+ \ No newline at end of file diff --git a/modules/metadataEditor/templates/main.html b/modules/metadataEditor/templates/main.html index e163cbb..5826f82 100644 --- a/modules/metadataEditor/templates/main.html +++ b/modules/metadataEditor/templates/main.html @@ -1,8 +1,8 @@ -
-
- Meta dane - -
- -
+
+
+ Meta dane + +
+ +
\ No newline at end of file diff --git a/modules/metadataEditor/transformations.js b/modules/metadataEditor/transformations.js index ba7092e..4b55488 100644 --- a/modules/metadataEditor/transformations.js +++ b/modules/metadataEditor/transformations.js @@ -1,24 +1,24 @@ -define(['libs/jquery-1.9.1.min'], function($) { - - 'use strict'; - - return { - getMetadata: function(xml) { - var toret = {}; - $(xml).find('metadata').children().each(function() { - var node = $(this); - toret[this.nodeName.split(':')[1].toLowerCase()] = node.text(); - }); - return toret; - }, - getXML: function(metadata) { - var meta = $('\n'); - _.each(_.keys(metadata), function(key) { - meta.append('\n\t' + metadata[key] + ''); - }); - meta.append('\n'); - return vkbeautify.xml(meta.html()); - } - }; - +define(['libs/jquery-1.9.1.min'], function($) { + + 'use strict'; + + return { + getMetadata: function(xml) { + var toret = {}; + $(xml).find('metadata').children().each(function() { + var node = $(this); + toret[this.nodeName.split(':')[1].toLowerCase()] = node.text(); + }); + return toret; + }, + getXML: function(metadata) { + var meta = $('\n'); + _.each(_.keys(metadata), function(key) { + meta.append('\n\t' + metadata[key] + ''); + }); + meta.append('\n'); + return vkbeautify.xml(meta.html()); + } + }; + }); \ No newline at end of file diff --git a/modules/nodeBreadCrumbs/nodeBreadCrumbs.js b/modules/nodeBreadCrumbs/nodeBreadCrumbs.js index 7331def..e9fc107 100644 --- a/modules/nodeBreadCrumbs/nodeBreadCrumbs.js +++ b/modules/nodeBreadCrumbs/nodeBreadCrumbs.js @@ -1,67 +1,67 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/underscore-min', -'libs/text!./template.html'], function($, _, templateSrc) { - -'use strict'; - -return function(sandbox) { - - var template = _.template(templateSrc); - - var view = { - dom: $('
' + template({node:null, parents: null}) + '
'), - setup: function() { - var view = this; - this.dom.on('mouseenter', 'a', function(e) { - var target = $(e.target); - sandbox.publish('nodeHighlighted', view.nodes[target.attr('data-id')]); - }); - this.dom.on('mouseleave', 'a', function(e) { - var target = $(e.target); - sandbox.publish('nodeDimmed', view.nodes[target.attr('data-id')]); - }); - this.dom.on('click', 'a', function(e) { - e.preventDefault(); - var target = $(e.target); - sandbox.publish('nodeSelected', view.nodes[target.attr('data-id')]); - }); - }, - - setNode: function(node) { - this.dom.empty(); - var nodes = this.nodes = {}; - this.currentNode = node; - this.nodes[node.getId()] = node; - var parents = node.parents(); - parents.each(function() { - var parent = this; - nodes[parent.getId()] = parent; - }); - this.dom.html(template({node: node, parents: parents})); - }, - - highlightNode: function(node) { - this.dom.find('a[data-id="'+node.id+'"]').addClass('rng-common-hoveredNode'); - }, - dimNode: function(node) { - this.dom.find('a[data-id="'+node.id+'"]').removeClass('rng-common-hoveredNode'); - } - }; - - view.setup(); - - return { - start: function() { sandbox.publish('ready'); }, - getView: function() { return view.dom; }, - setNode: function(canvasNode) { - if(!canvasNode.isSame(view.currentNode)) { - view.setNode(canvasNode); - } - }, - highlightNode: function(id) { view.highlightNode(id); }, - dimNode: function(id) { view.dimNode(id); } - }; -}; - +define([ +'libs/jquery-1.9.1.min', +'libs/underscore-min', +'libs/text!./template.html'], function($, _, templateSrc) { + +'use strict'; + +return function(sandbox) { + + var template = _.template(templateSrc); + + var view = { + dom: $('
' + template({node:null, parents: null}) + '
'), + setup: function() { + var view = this; + this.dom.on('mouseenter', 'a', function(e) { + var target = $(e.target); + sandbox.publish('nodeHighlighted', view.nodes[target.attr('data-id')]); + }); + this.dom.on('mouseleave', 'a', function(e) { + var target = $(e.target); + sandbox.publish('nodeDimmed', view.nodes[target.attr('data-id')]); + }); + this.dom.on('click', 'a', function(e) { + e.preventDefault(); + var target = $(e.target); + sandbox.publish('nodeSelected', view.nodes[target.attr('data-id')]); + }); + }, + + setNode: function(node) { + this.dom.empty(); + var nodes = this.nodes = {}; + this.currentNode = node; + this.nodes[node.getId()] = node; + var parents = node.parents(); + parents.each(function() { + var parent = this; + nodes[parent.getId()] = parent; + }); + this.dom.html(template({node: node, parents: parents})); + }, + + highlightNode: function(node) { + this.dom.find('a[data-id="'+node.id+'"]').addClass('rng-common-hoveredNode'); + }, + dimNode: function(node) { + this.dom.find('a[data-id="'+node.id+'"]').removeClass('rng-common-hoveredNode'); + } + }; + + view.setup(); + + return { + start: function() { sandbox.publish('ready'); }, + getView: function() { return view.dom; }, + setNode: function(canvasNode) { + if(!canvasNode.isSame(view.currentNode)) { + view.setNode(canvasNode); + } + }, + highlightNode: function(id) { view.highlightNode(id); }, + dimNode: function(id) { view.dimNode(id); } + }; +}; + }); \ No newline at end of file diff --git a/modules/nodeFamilyTree/nodeFamilyTree.js b/modules/nodeFamilyTree/nodeFamilyTree.js index 049352e..39ea20f 100644 --- a/modules/nodeFamilyTree/nodeFamilyTree.js +++ b/modules/nodeFamilyTree/nodeFamilyTree.js @@ -1,85 +1,85 @@ -define([ -'libs/jquery-1.9.1.min', -'libs/underscore-min', -'libs/text!./template.html' -], function($, _, templateSrc) { - -'use strict'; - -return function(sandbox) { - - var template = _.template(templateSrc); - - var view = { - dom: $('
' + template({children: null, parent: null}) + '
'), - setup: function() { - var view = this; - this.dom.on('click', 'a', function(e) { - var target = $(e.target); - sandbox.publish('nodeSelected', view.nodes[target.attr('data-id')]); - }); - - this.dom.on('mouseenter', 'a', function(e) { - var target = $(e.target); - sandbox.publish('nodeEntered', view.nodes[target.attr('data-id')]); - }); - this.dom.on('mouseleave', 'a', function(e) { - var target = $(e.target); - sandbox.publish('nodeLeft', view.nodes[target.attr('data-id')]); - }); - }, - setNode: function(node) { - console.log('familyTree sets node'); - var nodes = this.nodes = {}; - this.currentNode = node; - var parentNode = node.parent(); - var parent; - - if(parentNode) { - parent = { - repr: parentNode.getTag() + (parentNode.getClass() ? ' / ' + parentNode.getClass() : ''), - id: parentNode.getId() - }; - this.nodes[parentNode.getId()] = parentNode; - } - - var children = []; - node.children().each(function() { - var child = this; - children.push({repr: child.getTag() + (child.getClass() ? ' / ' + child.getClass() : ''), id: child.getId()}); - nodes[child.getId()] = child; - }); - this.dom.empty(); - this.dom.append($(template({parent: parent, children: children}))); - }, - highlightNode: function(canvasNode) { - this.dom.find('a[data-id="'+canvasNode.getId()+'"]').addClass('rng-common-hoveredNode'); - }, - dimNode: function(canvasNode) { - this.dom.find('a[data-id="'+canvasNode.getId()+'"]').removeClass('rng-common-hoveredNode'); - } - }; - - view.setup(); - - return { - start: function() { - sandbox.publish('ready'); - }, - setNode: function(canvasNode) { - if(!canvasNode.isSame(view.currentNode)) - view.setNode(canvasNode); - }, - getView: function() { - return view.dom; - }, - highlightNode: function(canvasNode) { - view.highlightNode(canvasNode); - }, - dimNode: function(canvasNode) { - view.dimNode(canvasNode); - } - }; -}; - +define([ +'libs/jquery-1.9.1.min', +'libs/underscore-min', +'libs/text!./template.html' +], function($, _, templateSrc) { + +'use strict'; + +return function(sandbox) { + + var template = _.template(templateSrc); + + var view = { + dom: $('
' + template({children: null, parent: null}) + '
'), + setup: function() { + var view = this; + this.dom.on('click', 'a', function(e) { + var target = $(e.target); + sandbox.publish('nodeSelected', view.nodes[target.attr('data-id')]); + }); + + this.dom.on('mouseenter', 'a', function(e) { + var target = $(e.target); + sandbox.publish('nodeEntered', view.nodes[target.attr('data-id')]); + }); + this.dom.on('mouseleave', 'a', function(e) { + var target = $(e.target); + sandbox.publish('nodeLeft', view.nodes[target.attr('data-id')]); + }); + }, + setNode: function(node) { + console.log('familyTree sets node'); + var nodes = this.nodes = {}; + this.currentNode = node; + var parentNode = node.parent(); + var parent; + + if(parentNode) { + parent = { + repr: parentNode.getTag() + (parentNode.getClass() ? ' / ' + parentNode.getClass() : ''), + id: parentNode.getId() + }; + this.nodes[parentNode.getId()] = parentNode; + } + + var children = []; + node.children().each(function() { + var child = this; + children.push({repr: child.getTag() + (child.getClass() ? ' / ' + child.getClass() : ''), id: child.getId()}); + nodes[child.getId()] = child; + }); + this.dom.empty(); + this.dom.append($(template({parent: parent, children: children}))); + }, + highlightNode: function(canvasNode) { + this.dom.find('a[data-id="'+canvasNode.getId()+'"]').addClass('rng-common-hoveredNode'); + }, + dimNode: function(canvasNode) { + this.dom.find('a[data-id="'+canvasNode.getId()+'"]').removeClass('rng-common-hoveredNode'); + } + }; + + view.setup(); + + return { + start: function() { + sandbox.publish('ready'); + }, + setNode: function(canvasNode) { + if(!canvasNode.isSame(view.currentNode)) + view.setNode(canvasNode); + }, + getView: function() { + return view.dom; + }, + highlightNode: function(canvasNode) { + view.highlightNode(canvasNode); + }, + dimNode: function(canvasNode) { + view.dimNode(canvasNode); + } + }; +}; + }); \ No newline at end of file diff --git a/modules/nodeFamilyTree/nodeFamilyTree.less b/modules/nodeFamilyTree/nodeFamilyTree.less index b2a734f..6b4dc77 100644 --- a/modules/nodeFamilyTree/nodeFamilyTree.less +++ b/modules/nodeFamilyTree/nodeFamilyTree.less @@ -1,38 +1,38 @@ -.rng-module-nodeFamilyTree { - overflow-y: scroll; - max-height: 150px; - width:100%; - margin-top:10px; - - table { - width: 90%; - margin: 0; - - tr { - td:nth-child(1) { - width: 30%; - } - td:nth-child(2) { - width: 70%; - } - td ul { - list-style-type: none; - margin: 0; - } - - } - } - - &::-webkit-scrollbar { - .rng-mixin-scrollbar; - } - &::-webkit-scrollbar-track { - .rng-mixin-scrollbar-track; - } - &::-webkit-scrollbar-thumb { - .rng-mixin-scrollbar-thumb; - } - &::-webkit-scrollbar-thumb:window-inactive { - .rng-mixin-scrollbar-thumb-window-inactive; - } +.rng-module-nodeFamilyTree { + overflow-y: scroll; + max-height: 150px; + width:100%; + margin-top:10px; + + table { + width: 90%; + margin: 0; + + tr { + td:nth-child(1) { + width: 30%; + } + td:nth-child(2) { + width: 70%; + } + td ul { + list-style-type: none; + margin: 0; + } + + } + } + + &::-webkit-scrollbar { + .rng-mixin-scrollbar; + } + &::-webkit-scrollbar-track { + .rng-mixin-scrollbar-track; + } + &::-webkit-scrollbar-thumb { + .rng-mixin-scrollbar-thumb; + } + &::-webkit-scrollbar-thumb:window-inactive { + .rng-mixin-scrollbar-thumb-window-inactive; + } } \ No newline at end of file diff --git a/modules/nodeFamilyTree/template.html b/modules/nodeFamilyTree/template.html index 021709a..8a7df5c 100644 --- a/modules/nodeFamilyTree/template.html +++ b/modules/nodeFamilyTree/template.html @@ -1,19 +1,19 @@ -
- - - - - - - - - +
+
powyżej<% if(parent) { %><%= parent.repr %><% } else { %>-<% } %>
poniżej -
    - <% if(!children || children.length === 0) { %>-<% } else { %> - <% children.forEach(function(child) { %> -
  • <%= child.repr %>
    • - <% }); %> - <% } %> -
-
+ + + + + + + + \ No newline at end of file diff --git a/modules/nodePane/nodePane.js b/modules/nodePane/nodePane.js index cc71d35..57f5c17 100644 --- a/modules/nodePane/nodePane.js +++ b/modules/nodePane/nodePane.js @@ -1,35 +1,35 @@ -define([ -'libs/text!./template.html', -'libs/jquery-1.9.1.min', -'libs/underscore-min', - -], function(templateSrc, $, _) { - -'use strict'; - -return function(sandbox) { - - var view = $(_.template(templateSrc)()); - - view.on('change', 'select', function(e) { - var target = $(e.target); - var attr = target.attr('class').split('-')[3] === 'tagSelect' ? 'tag' : 'class'; - sandbox.publish('nodeChanged', attr, target.val()); - }); - - return { - start: function() { - sandbox.publish('ready'); - }, - getView: function() { - return view; - }, - setNode: function(canvasNode) { - view.find('.rng-module-nodePane-tagSelect').val(canvasNode.getTag()); - view.find('.rng-module-nodePane-classSelect').val(canvasNode.getClass()); - } - }; - -}; - +define([ +'libs/text!./template.html', +'libs/jquery-1.9.1.min', +'libs/underscore-min', + +], function(templateSrc, $, _) { + +'use strict'; + +return function(sandbox) { + + var view = $(_.template(templateSrc)()); + + view.on('change', 'select', function(e) { + var target = $(e.target); + var attr = target.attr('class').split('-')[3] === 'tagSelect' ? 'tag' : 'class'; + sandbox.publish('nodeChanged', attr, target.val()); + }); + + return { + start: function() { + sandbox.publish('ready'); + }, + getView: function() { + return view; + }, + setNode: function(canvasNode) { + view.find('.rng-module-nodePane-tagSelect').val(canvasNode.getTag()); + view.find('.rng-module-nodePane-classSelect').val(canvasNode.getClass()); + } + }; + +}; + }); \ No newline at end of file diff --git a/modules/nodePane/nodePane.less b/modules/nodePane/nodePane.less index 5dfd252..771fbd5 100644 --- a/modules/nodePane/nodePane.less +++ b/modules/nodePane/nodePane.less @@ -1,9 +1,9 @@ -.rng-module-nodePane { - label { - width: 50px; - display: inline-block; - } - select { - width: 100px; - } +.rng-module-nodePane { + label { + width: 50px; + display: inline-block; + } + select { + width: 100px; + } } \ No newline at end of file diff --git a/modules/nodePane/template.html b/modules/nodePane/template.html index c0733cd..d1e8ab2 100644 --- a/modules/nodePane/template.html +++ b/modules/nodePane/template.html @@ -1,23 +1,23 @@ -
-
- <%= gettext('Current node') %> -
- - -
-
- - -
-
+
+
+ <%= gettext('Current node') %> +
+ + +
+
+ + +
+
\ No newline at end of file diff --git a/modules/rng/diffLayout.html b/modules/rng/diffLayout.html index c07dd77..8b03929 100644 --- a/modules/rng/diffLayout.html +++ b/modules/rng/diffLayout.html @@ -1,4 +1,4 @@ -
-
-
+
+
+
\ No newline at end of file diff --git a/modules/rng/diffLayout.less b/modules/rng/diffLayout.less index cd03dcd..0f51948 100644 --- a/modules/rng/diffLayout.less +++ b/modules/rng/diffLayout.less @@ -1,20 +1,20 @@ -.rng-module-rng-diffLayout { - [fnpjs-place=left] { - width: 300px; - margin: 0 20px 0 0px; - left: 0; - } - [fnpjs-place=right] { - left: 320px; - right: 0; - } - - [fnpjs-place=left], [fnpjs-place=right] { - position: absolute; - top: 0; - bottom: 0; - - - } - +.rng-module-rng-diffLayout { + [fnpjs-place=left] { + width: 300px; + margin: 0 20px 0 0px; + left: 0; + } + [fnpjs-place=right] { + left: 320px; + right: 0; + } + + [fnpjs-place=left], [fnpjs-place=right] { + position: absolute; + top: 0; + bottom: 0; + + + } + } \ No newline at end of file diff --git a/modules/rng/editingLayout.html b/modules/rng/editingLayout.html index 752a973..54a29aa 100644 --- a/modules/rng/editingLayout.html +++ b/modules/rng/editingLayout.html @@ -1,7 +1,7 @@ -
-
-
-
-
-
+
+
+
+
+
+
\ No newline at end of file diff --git a/modules/rng/editingLayout.less b/modules/rng/editingLayout.less index dcaead2..19d165f 100644 --- a/modules/rng/editingLayout.less +++ b/modules/rng/editingLayout.less @@ -1,88 +1,88 @@ -.rng-module-rng2-left { - /*float: left; - width: 600px;*/ -} - -.rng-module-rng2-right { - /*float: right; - position: relative; - width: 258px; - margin-left: 50px;*/ - - border-width: 1px 1px 1px 1px; - border-style: solid; - border-color: #ddd; - padding: 5px 15px; - - p, td, label, input, select { - font-size: 11px; - line-height:13px; - } - - select { - -webkit-appearance: button; - -moz-appearance: button; - appearance: button; - height: auto; - line-height: 14px; - } - - legend { - font-size:11px; - height:30px; - } - - - .rng-view-tabs-tabBar { - position:absolute; - top:-1px; - right:-50px; - border-width: 1px 1px 1px 0px; - border-style: solid; - border-color: #ddd; - padding: 5px; - background: #ededed; - } - - label + select { - position:relative; - top: 5px; - } - -} - -.rng-module-rng2-statusBar { - margin: 10px 5px; - font-size:0.9em; -} - -.fnp-module-rng-editingLayout { - - [fnpjs-place="statusBar"] { - position: absolute; - bottom: 0; - left: 0; - right: 0; - height: 30px; - - } - - [fnpjs-place="leftColumn"], [fnpjs-place="rightColumn"] { - position: absolute; - top: 30px; // - bottom: 50px; // - } - - [fnpjs-place="leftColumn"] { - left:0; - right: 320px; - } - - [fnpjs-place="rightColumn"] { - right: 0px; - width: 250px; - - } - - +.rng-module-rng2-left { + /*float: left; + width: 600px;*/ +} + +.rng-module-rng2-right { + /*float: right; + position: relative; + width: 258px; + margin-left: 50px;*/ + + border-width: 1px 1px 1px 1px; + border-style: solid; + border-color: #ddd; + padding: 5px 15px; + + p, td, label, input, select { + font-size: 11px; + line-height:13px; + } + + select { + -webkit-appearance: button; + -moz-appearance: button; + appearance: button; + height: auto; + line-height: 14px; + } + + legend { + font-size:11px; + height:30px; + } + + + .rng-view-tabs-tabBar { + position:absolute; + top:-1px; + right:-50px; + border-width: 1px 1px 1px 0px; + border-style: solid; + border-color: #ddd; + padding: 5px; + background: #ededed; + } + + label + select { + position:relative; + top: 5px; + } + +} + +.rng-module-rng2-statusBar { + margin: 10px 5px; + font-size:0.9em; +} + +.fnp-module-rng-editingLayout { + + [fnpjs-place="statusBar"] { + position: absolute; + bottom: 0; + left: 0; + right: 0; + height: 30px; + + } + + [fnpjs-place="leftColumn"], [fnpjs-place="rightColumn"] { + position: absolute; + top: 30px; // + bottom: 50px; // + } + + [fnpjs-place="leftColumn"] { + left:0; + right: 320px; + } + + [fnpjs-place="rightColumn"] { + right: 0px; + width: 250px; + + } + + } \ No newline at end of file diff --git a/modules/rng/mainLayout.html b/modules/rng/mainLayout.html index 160fa13..0cccb9c 100644 --- a/modules/rng/mainLayout.html +++ b/modules/rng/mainLayout.html @@ -1,8 +1,8 @@ -
-
-
-
-
-
-
+
+
+
+
+
+
+
\ No newline at end of file diff --git a/modules/rng/mainLayout.less b/modules/rng/mainLayout.less index a2b553c..ac28f02 100644 --- a/modules/rng/mainLayout.less +++ b/modules/rng/mainLayout.less @@ -1,43 +1,43 @@ -#rng-module-rng-mainLayout { - position: fixed; - top: 5px; - bottom: 5px; - left: 80px; - right: 80px; - - [fnpjs-place="messages"] { - position: absolute; - top: 5px; - width:100%; - text-align:center; - } - - [fnpjs-place="topPanel"] { - float: right; - position: relative; - z-index: 2; - } - - [fnpjs-place="mainView"] { - position: absolute; - top: 0; - left:0; - right:0; - bottom:0; - z-index: 1; - - > .rng-view-tabs { - position: relative; - height: 100%; - - > .rng-view-tabs-content { - position: absolute; - top: 45px; - left: 0; - right: 0; - bottom: 0; - } - } - - } +#rng-module-rng-mainLayout { + position: fixed; + top: 5px; + bottom: 5px; + left: 80px; + right: 80px; + + [fnpjs-place="messages"] { + position: absolute; + top: 5px; + width:100%; + text-align:center; + } + + [fnpjs-place="topPanel"] { + float: right; + position: relative; + z-index: 2; + } + + [fnpjs-place="mainView"] { + position: absolute; + top: 0; + left:0; + right:0; + bottom:0; + z-index: 1; + + > .rng-view-tabs { + position: relative; + height: 100%; + + > .rng-view-tabs-content { + position: absolute; + top: 45px; + left: 0; + right: 0; + bottom: 0; + } + } + + } } \ No newline at end of file diff --git a/modules/rng/rng.js b/modules/rng/rng.js index 980e6ff..469a6fc 100644 --- a/modules/rng/rng.js +++ b/modules/rng/rng.js @@ -1,317 +1,317 @@ -define([ -'fnpjs/layout', -'fnpjs/vbox', -'views/tabs/tabs', -'libs/text!./mainLayout.html', -'libs/text!./editingLayout.html', -'libs/text!./diffLayout.html', -], function(layout, vbox, tabs, mainLayoutTemplate, visualEditingLayoutTemplate, diffLayoutTemplate) { - -'use strict'; - -return function(sandbox) { - - function addMainTab(title, slug, view) { - views.mainTabs.addTab(title, slug, view); - } - - var dirty = { - sourceEditor: false, - documentCanvas: false, - metadataEditor: false, - }; - - var synchronizeTab = function(slug) { - function tabIsDirty(slug) { - if(slug === 'editor' && (dirty.documentCanvas || dirty.metadataEditor)) - return true; - if(slug === 'sourceEditor' && dirty.sourceEditor) - return true; - return false; - } - - if(tabIsDirty(slug)) { - var reason, doc; - if(slug === 'sourceEditor') { - doc = sandbox.getModule('sourceEditor').getDocument(); - reason = 'source_edit'; - dirty.sourceEditor = false; - } - if(slug === 'editor') { - doc = dirty.documentCanvas ? sandbox.getModule('documentCanvas').getDocument() : sandbox.getModule('data').getDocument(); - if(dirty.metadataEditor) { - doc = sandbox.getModule('metadataEditor').attachMetadata(doc); - } - reason = 'edit'; - dirty.documentCanvas = dirty.metadataEditor = false; - } - sandbox.getModule('data').commitDocument(doc, reason); - } - }; - - var commands = { - highlightDocumentNode: function(canvasNode, origin) { - ['documentCanvas', 'nodeBreadCrumbs', 'nodeFamilyTree'].forEach(function(moduleName) { - if(!origin || moduleName != origin) - sandbox.getModule(moduleName).highlightNode(canvasNode); - }); - }, - dimDocumentNode: function(canvasNode, origin) { - ['documentCanvas', 'nodeBreadCrumbs', 'nodeFamilyTree'].forEach(function(moduleName) { - if(!origin || moduleName != origin) - sandbox.getModule(moduleName).dimNode(canvasNode); - }); - }, - selectNode: function(canvasNode, origin) { - sandbox.getModule('documentCanvas').selectNode(canvasNode); - sandbox.getModule('nodePane').setNode(canvasNode); - sandbox.getModule('nodeFamilyTree').setNode(canvasNode); - sandbox.getModule('nodeBreadCrumbs').setNode(canvasNode); - - }, - resetDocument: function(document, reason) { - var modules = []; - if(reason === 'source_edit') - modules = ['documentCanvas', 'metadataEditor']; - else if (reason === 'edit') - modules = ['sourceEditor']; - else if (reason === 'revert') - modules = ['documentCanvas', 'metadataEditor', 'sourceEditor']; - - modules.forEach(function(moduleName) { - sandbox.getModule(moduleName).setDocument(document); - }); - } - }; - - - var views = { - mainLayout: new layout.Layout(mainLayoutTemplate), - mainTabs: (new tabs.View()).render(), - visualEditing: new layout.Layout(visualEditingLayoutTemplate), - visualEditingSidebar: (new tabs.View({stacked: true})).render(), - currentNodePaneLayout: new vbox.VBox(), - diffLayout: new layout.Layout(diffLayoutTemplate) - }; - - views.visualEditing.setView('rightColumn', views.visualEditingSidebar.getAsView()); - addMainTab('Edytor', 'editor', views.visualEditing.getAsView()); - addMainTab(gettext('Source'), 'sourceEditor', ''); - addMainTab('Historia', 'history', views.diffLayout.getAsView()); - - sandbox.getDOM().append(views.mainLayout.getAsView()); - - views.visualEditingSidebar.addTab({icon: 'pencil'}, 'edit', views.currentNodePaneLayout.getAsView()); - - views.mainTabs.on('tabSelected', function(event) { - if(event.prevSlug) { - synchronizeTab(event.prevSlug); - } - }); - - /* Events handling */ - - var eventHandlers = {}; - - eventHandlers.sourceEditor = { - ready: function() { - addMainTab(gettext('Source'), 'sourceEditor', sandbox.getModule('sourceEditor').getView()); - sandbox.getModule('sourceEditor').setDocument(sandbox.getModule('data').getDocument()); - }, - xmlChanged: function() { - dirty.sourceEditor = true; - }, - documentSet: function() { - dirty.sourceEditor = false; - } - }; - - eventHandlers.data = { - ready: function() { - views.mainLayout.setView('mainView', views.mainTabs.getAsView()); - - _.each(['sourceEditor', 'documentCanvas', 'documentToolbar', 'nodePane', 'metadataEditor', 'nodeFamilyTree', 'nodeBreadCrumbs', 'mainBar', 'indicator', 'documentHistory', 'diffViewer'], function(moduleName) { - sandbox.getModule(moduleName).start(); - }); - }, - documentChanged: function(document, reason) { - commands.resetDocument(document, reason); - }, - savingStarted: function() { - sandbox.getModule('mainBar').setCommandEnabled('save', false); - sandbox.getModule('indicator').showMessage(gettext('Saving...')); - }, - savingEnded: function(status) { - sandbox.getModule('mainBar').setCommandEnabled('save', true); - sandbox.getModule('indicator').clearMessage({message:'Dokument zapisany'}); - }, - restoringStarted: function(event) { - sandbox.getModule('mainBar').setCommandEnabled('save', false); - sandbox.getModule('indicator').showMessage(gettext('Restoring version ') + event.version + '...'); - }, - historyItemAdded: function(item) { - sandbox.getModule('documentHistory').addHistory([item], {animate: true}); - }, - diffFetched: function(diff) { - sandbox.getModule('diffViewer').setDiff(diff); - }, - documentReverted: function(event) { - commands.resetDocument(event.document, 'revert'); - sandbox.getModule('mainBar').setCommandEnabled('save', true); - sandbox.getModule('indicator').clearMessage({message:'Wersja ' + event.reverted_version + ' przywrócona'}); - sandbox.getModule('mainBar').setVersion(event.current_version); - } - }; - - eventHandlers.mainBar = { - ready: function() { - sandbox.getModule('mainBar').setVersion(sandbox.getModule('data').getDocumentVersion()); - views.mainLayout.setView('topPanel', sandbox.getModule('mainBar').getView()); - }, - 'cmd.save': function() { - synchronizeTab(views.mainTabs.getCurrentSlug()); - sandbox.getModule('data').saveDocument(); - } - }; - - eventHandlers.indicator = { - ready: function() { - views.mainLayout.setView('messages', sandbox.getModule('indicator').getView()); - } - }; - - - - eventHandlers.documentCanvas = { - ready: function() { - sandbox.getModule('documentCanvas').setDocument(sandbox.getModule('data').getDocument()); - views.visualEditing.setView('leftColumn', sandbox.getModule('documentCanvas').getView()); - }, - documentSet: function() { - dirty.documentCanvas = false; - }, - - nodeSelected: function(canvasNode) { - commands.selectNode(canvasNode); - }, - - contentChanged: function() { - dirty.documentCanvas = true; - }, - - nodeHovered: function(canvasNode) { - commands.highlightDocumentNode(canvasNode); - }, - - nodeBlured: function(canvasNode) { - commands.dimDocumentNode(canvasNode); - } - }; - - eventHandlers.nodePane = { - ready: function() { - views.currentNodePaneLayout.appendView(sandbox.getModule('nodePane').getView()); - }, - - nodeChanged: function(attr, value) { - sandbox.getModule('documentCanvas').modifyCurrentNode(attr, value); - } - }; - - eventHandlers.metadataEditor = { - ready: function() { - sandbox.getModule('metadataEditor').setDocument(sandbox.getModule('data').getDocument()); - views.visualEditingSidebar.addTab({icon: 'info-sign'}, 'metadataEditor', sandbox.getModule('metadataEditor').getView()); - }, - metadataChanged: function(metadata) { - dirty.metadataEditor = true; - }, - metadataSet: function() { - dirty.metadataEditor = false; - }, - }; - - eventHandlers.nodeFamilyTree = { - ready: function() { - views.currentNodePaneLayout.appendView(sandbox.getModule('nodeFamilyTree').getView()); - }, - nodeEntered: function(canvasNode) { - commands.highlightDocumentNode(canvasNode, 'nodeFamilyTree'); - }, - nodeLeft: function(canvasNode) { - commands.dimDocumentNode(canvasNode, 'nodeFamilyTree'); - }, - nodeSelected: function(canvasNode) { - commands.selectNode(canvasNode); - } - }; - - eventHandlers.documentToolbar = { - ready: function() { - views.visualEditing.setView('toolbar', sandbox.getModule('documentToolbar').getView()); - }, - toggleGrid: function(toggle) { - sandbox.getModule('documentCanvas').toggleGrid(toggle); - }, - newNodeRequested: function(wlxmlTag, wlxmlClass) { - sandbox.getModule('documentCanvas').insertNewNode(wlxmlTag, wlxmlClass); - }, - command: function(cmd, meta) { - sandbox.getModule('documentCanvas').command(cmd, meta); - } - }; - - eventHandlers.nodeBreadCrumbs = { - ready: function() { - views.visualEditing.setView('statusBar', sandbox.getModule('nodeBreadCrumbs').getView()); - }, - nodeHighlighted: function(canvasNode) { - commands.highlightDocumentNode(canvasNode, 'nodeBreadCrumbs'); - }, - nodeDimmed: function(canvasNode) { - commands.dimDocumentNode(canvasNode, 'nodeBreadCrumbs'); - }, - nodeSelected: function(canvasNode) { - commands.selectNode(canvasNode); - } - }; - - eventHandlers.documentHistory = { - ready: function() { - sandbox.getModule('documentHistory').addHistory(sandbox.getModule('data').getHistory()); - views.diffLayout.setView('left', sandbox.getModule('documentHistory').getView()); - }, - compare: function(ver1, ver2) { - sandbox.getModule('data').fetchDiff(ver1, ver2); - }, - restoreVersion: function(event) { - sandbox.getModule('data').restoreVersion(event); - }, - displayVersion: function(event) { - window.open('/' + gettext('editor') + '/' + sandbox.getModule('data').getDocumentId() + '?version=' + event.version, _.uniqueId()); - } - }; - - eventHandlers.diffViewer = { - ready: function() { - views.diffLayout.setView('right', sandbox.getModule('diffViewer').getView()); - } - }; - - /* api */ - - return { - start: function() { - sandbox.getModule('data').start(); - }, - handleEvent: function(moduleName, eventName, args) { - if('') - wysiwigHandler.handleEvent(moduleName, eventName, args); - else if(eventHandlers[moduleName] && eventHandlers[moduleName][eventName]) { - eventHandlers[moduleName][eventName].apply(eventHandlers, args); - } - } - }; -}; - +define([ +'fnpjs/layout', +'fnpjs/vbox', +'views/tabs/tabs', +'libs/text!./mainLayout.html', +'libs/text!./editingLayout.html', +'libs/text!./diffLayout.html', +], function(layout, vbox, tabs, mainLayoutTemplate, visualEditingLayoutTemplate, diffLayoutTemplate) { + +'use strict'; + +return function(sandbox) { + + function addMainTab(title, slug, view) { + views.mainTabs.addTab(title, slug, view); + } + + var dirty = { + sourceEditor: false, + documentCanvas: false, + metadataEditor: false, + }; + + var synchronizeTab = function(slug) { + function tabIsDirty(slug) { + if(slug === 'editor' && (dirty.documentCanvas || dirty.metadataEditor)) + return true; + if(slug === 'sourceEditor' && dirty.sourceEditor) + return true; + return false; + } + + if(tabIsDirty(slug)) { + var reason, doc; + if(slug === 'sourceEditor') { + doc = sandbox.getModule('sourceEditor').getDocument(); + reason = 'source_edit'; + dirty.sourceEditor = false; + } + if(slug === 'editor') { + doc = dirty.documentCanvas ? sandbox.getModule('documentCanvas').getDocument() : sandbox.getModule('data').getDocument(); + if(dirty.metadataEditor) { + doc = sandbox.getModule('metadataEditor').attachMetadata(doc); + } + reason = 'edit'; + dirty.documentCanvas = dirty.metadataEditor = false; + } + sandbox.getModule('data').commitDocument(doc, reason); + } + }; + + var commands = { + highlightDocumentNode: function(canvasNode, origin) { + ['documentCanvas', 'nodeBreadCrumbs', 'nodeFamilyTree'].forEach(function(moduleName) { + if(!origin || moduleName != origin) + sandbox.getModule(moduleName).highlightNode(canvasNode); + }); + }, + dimDocumentNode: function(canvasNode, origin) { + ['documentCanvas', 'nodeBreadCrumbs', 'nodeFamilyTree'].forEach(function(moduleName) { + if(!origin || moduleName != origin) + sandbox.getModule(moduleName).dimNode(canvasNode); + }); + }, + selectNode: function(canvasNode, origin) { + sandbox.getModule('documentCanvas').selectNode(canvasNode); + sandbox.getModule('nodePane').setNode(canvasNode); + sandbox.getModule('nodeFamilyTree').setNode(canvasNode); + sandbox.getModule('nodeBreadCrumbs').setNode(canvasNode); + + }, + resetDocument: function(document, reason) { + var modules = []; + if(reason === 'source_edit') + modules = ['documentCanvas', 'metadataEditor']; + else if (reason === 'edit') + modules = ['sourceEditor']; + else if (reason === 'revert') + modules = ['documentCanvas', 'metadataEditor', 'sourceEditor']; + + modules.forEach(function(moduleName) { + sandbox.getModule(moduleName).setDocument(document); + }); + } + }; + + + var views = { + mainLayout: new layout.Layout(mainLayoutTemplate), + mainTabs: (new tabs.View()).render(), + visualEditing: new layout.Layout(visualEditingLayoutTemplate), + visualEditingSidebar: (new tabs.View({stacked: true})).render(), + currentNodePaneLayout: new vbox.VBox(), + diffLayout: new layout.Layout(diffLayoutTemplate) + }; + + views.visualEditing.setView('rightColumn', views.visualEditingSidebar.getAsView()); + addMainTab('Edytor', 'editor', views.visualEditing.getAsView()); + addMainTab(gettext('Source'), 'sourceEditor', ''); + addMainTab('Historia', 'history', views.diffLayout.getAsView()); + + sandbox.getDOM().append(views.mainLayout.getAsView()); + + views.visualEditingSidebar.addTab({icon: 'pencil'}, 'edit', views.currentNodePaneLayout.getAsView()); + + views.mainTabs.on('tabSelected', function(event) { + if(event.prevSlug) { + synchronizeTab(event.prevSlug); + } + }); + + /* Events handling */ + + var eventHandlers = {}; + + eventHandlers.sourceEditor = { + ready: function() { + addMainTab(gettext('Source'), 'sourceEditor', sandbox.getModule('sourceEditor').getView()); + sandbox.getModule('sourceEditor').setDocument(sandbox.getModule('data').getDocument()); + }, + xmlChanged: function() { + dirty.sourceEditor = true; + }, + documentSet: function() { + dirty.sourceEditor = false; + } + }; + + eventHandlers.data = { + ready: function() { + views.mainLayout.setView('mainView', views.mainTabs.getAsView()); + + _.each(['sourceEditor', 'documentCanvas', 'documentToolbar', 'nodePane', 'metadataEditor', 'nodeFamilyTree', 'nodeBreadCrumbs', 'mainBar', 'indicator', 'documentHistory', 'diffViewer'], function(moduleName) { + sandbox.getModule(moduleName).start(); + }); + }, + documentChanged: function(document, reason) { + commands.resetDocument(document, reason); + }, + savingStarted: function() { + sandbox.getModule('mainBar').setCommandEnabled('save', false); + sandbox.getModule('indicator').showMessage(gettext('Saving...')); + }, + savingEnded: function(status) { + sandbox.getModule('mainBar').setCommandEnabled('save', true); + sandbox.getModule('indicator').clearMessage({message:'Dokument zapisany'}); + }, + restoringStarted: function(event) { + sandbox.getModule('mainBar').setCommandEnabled('save', false); + sandbox.getModule('indicator').showMessage(gettext('Restoring version ') + event.version + '...'); + }, + historyItemAdded: function(item) { + sandbox.getModule('documentHistory').addHistory([item], {animate: true}); + }, + diffFetched: function(diff) { + sandbox.getModule('diffViewer').setDiff(diff); + }, + documentReverted: function(event) { + commands.resetDocument(event.document, 'revert'); + sandbox.getModule('mainBar').setCommandEnabled('save', true); + sandbox.getModule('indicator').clearMessage({message:'Wersja ' + event.reverted_version + ' przywrócona'}); + sandbox.getModule('mainBar').setVersion(event.current_version); + } + }; + + eventHandlers.mainBar = { + ready: function() { + sandbox.getModule('mainBar').setVersion(sandbox.getModule('data').getDocumentVersion()); + views.mainLayout.setView('topPanel', sandbox.getModule('mainBar').getView()); + }, + 'cmd.save': function() { + synchronizeTab(views.mainTabs.getCurrentSlug()); + sandbox.getModule('data').saveDocument(); + } + }; + + eventHandlers.indicator = { + ready: function() { + views.mainLayout.setView('messages', sandbox.getModule('indicator').getView()); + } + }; + + + + eventHandlers.documentCanvas = { + ready: function() { + sandbox.getModule('documentCanvas').setDocument(sandbox.getModule('data').getDocument()); + views.visualEditing.setView('leftColumn', sandbox.getModule('documentCanvas').getView()); + }, + documentSet: function() { + dirty.documentCanvas = false; + }, + + nodeSelected: function(canvasNode) { + commands.selectNode(canvasNode); + }, + + contentChanged: function() { + dirty.documentCanvas = true; + }, + + nodeHovered: function(canvasNode) { + commands.highlightDocumentNode(canvasNode); + }, + + nodeBlured: function(canvasNode) { + commands.dimDocumentNode(canvasNode); + } + }; + + eventHandlers.nodePane = { + ready: function() { + views.currentNodePaneLayout.appendView(sandbox.getModule('nodePane').getView()); + }, + + nodeChanged: function(attr, value) { + sandbox.getModule('documentCanvas').modifyCurrentNode(attr, value); + } + }; + + eventHandlers.metadataEditor = { + ready: function() { + sandbox.getModule('metadataEditor').setDocument(sandbox.getModule('data').getDocument()); + views.visualEditingSidebar.addTab({icon: 'info-sign'}, 'metadataEditor', sandbox.getModule('metadataEditor').getView()); + }, + metadataChanged: function(metadata) { + dirty.metadataEditor = true; + }, + metadataSet: function() { + dirty.metadataEditor = false; + }, + }; + + eventHandlers.nodeFamilyTree = { + ready: function() { + views.currentNodePaneLayout.appendView(sandbox.getModule('nodeFamilyTree').getView()); + }, + nodeEntered: function(canvasNode) { + commands.highlightDocumentNode(canvasNode, 'nodeFamilyTree'); + }, + nodeLeft: function(canvasNode) { + commands.dimDocumentNode(canvasNode, 'nodeFamilyTree'); + }, + nodeSelected: function(canvasNode) { + commands.selectNode(canvasNode); + } + }; + + eventHandlers.documentToolbar = { + ready: function() { + views.visualEditing.setView('toolbar', sandbox.getModule('documentToolbar').getView()); + }, + toggleGrid: function(toggle) { + sandbox.getModule('documentCanvas').toggleGrid(toggle); + }, + newNodeRequested: function(wlxmlTag, wlxmlClass) { + sandbox.getModule('documentCanvas').insertNewNode(wlxmlTag, wlxmlClass); + }, + command: function(cmd, meta) { + sandbox.getModule('documentCanvas').command(cmd, meta); + } + }; + + eventHandlers.nodeBreadCrumbs = { + ready: function() { + views.visualEditing.setView('statusBar', sandbox.getModule('nodeBreadCrumbs').getView()); + }, + nodeHighlighted: function(canvasNode) { + commands.highlightDocumentNode(canvasNode, 'nodeBreadCrumbs'); + }, + nodeDimmed: function(canvasNode) { + commands.dimDocumentNode(canvasNode, 'nodeBreadCrumbs'); + }, + nodeSelected: function(canvasNode) { + commands.selectNode(canvasNode); + } + }; + + eventHandlers.documentHistory = { + ready: function() { + sandbox.getModule('documentHistory').addHistory(sandbox.getModule('data').getHistory()); + views.diffLayout.setView('left', sandbox.getModule('documentHistory').getView()); + }, + compare: function(ver1, ver2) { + sandbox.getModule('data').fetchDiff(ver1, ver2); + }, + restoreVersion: function(event) { + sandbox.getModule('data').restoreVersion(event); + }, + displayVersion: function(event) { + window.open('/' + gettext('editor') + '/' + sandbox.getModule('data').getDocumentId() + '?version=' + event.version, _.uniqueId()); + } + }; + + eventHandlers.diffViewer = { + ready: function() { + views.diffLayout.setView('right', sandbox.getModule('diffViewer').getView()); + } + }; + + /* api */ + + return { + start: function() { + sandbox.getModule('data').start(); + }, + handleEvent: function(moduleName, eventName, args) { + if('') + wysiwigHandler.handleEvent(moduleName, eventName, args); + else if(eventHandlers[moduleName] && eventHandlers[moduleName][eventName]) { + eventHandlers[moduleName][eventName].apply(eventHandlers, args); + } + } + }; +}; + }); \ No newline at end of file diff --git a/modules/rng/rng.less b/modules/rng/rng.less index 79ae6a2..196be1f 100644 --- a/modules/rng/rng.less +++ b/modules/rng/rng.less @@ -1,3 +1,3 @@ -@import 'mainLayout.less'; -@import 'editingLayout.less'; +@import 'mainLayout.less'; +@import 'editingLayout.less'; @import 'diffLayout.less'; \ No newline at end of file diff --git a/modules/sourceEditor/sourceEditor.js b/modules/sourceEditor/sourceEditor.js index 1c18e75..2fca370 100644 --- a/modules/sourceEditor/sourceEditor.js +++ b/modules/sourceEditor/sourceEditor.js @@ -1,37 +1,37 @@ -define(function() { - -'use strict'; - -return function(sandbox) { - - var view = $(sandbox.getTemplate('main')()); - - var editor = ace.edit(view.find('#rng-sourceEditor-editor')[0]); - editor.setTheme("ace/theme/chrome"); - editor.getSession().setMode("ace/mode/xml"); - $('textarea', view).on('keyup', function() { - sandbox.publish('xmlChanged'); - }); - - editor.getSession().on('change', function() { - sandbox.publish('xmlChanged'); - }); - return { - start: function() { - sandbox.publish('ready'); - }, - getView: function() { - return view; - }, - setDocument: function(document) { - editor.setValue(document); - editor.gotoLine(0); - sandbox.publish('documentSet'); - }, - getDocument: function() { - return editor.getValue(); - } - }; -}; - +define(function() { + +'use strict'; + +return function(sandbox) { + + var view = $(sandbox.getTemplate('main')()); + + var editor = ace.edit(view.find('#rng-sourceEditor-editor')[0]); + editor.setTheme("ace/theme/chrome"); + editor.getSession().setMode("ace/mode/xml"); + $('textarea', view).on('keyup', function() { + sandbox.publish('xmlChanged'); + }); + + editor.getSession().on('change', function() { + sandbox.publish('xmlChanged'); + }); + return { + start: function() { + sandbox.publish('ready'); + }, + getView: function() { + return view; + }, + setDocument: function(document) { + editor.setValue(document); + editor.gotoLine(0); + sandbox.publish('documentSet'); + }, + getDocument: function() { + return editor.getValue(); + } + }; +}; + }); \ No newline at end of file diff --git a/modules/sourceEditor/sourceEditor.less b/modules/sourceEditor/sourceEditor.less index 47ebeec..003ee6e 100644 --- a/modules/sourceEditor/sourceEditor.less +++ b/modules/sourceEditor/sourceEditor.less @@ -1,7 +1,7 @@ -#rng-sourceEditor-editor { - position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; +#rng-sourceEditor-editor { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; } \ No newline at end of file diff --git a/styles/common.less b/styles/common.less index e7767a3..00e1525 100644 --- a/styles/common.less +++ b/styles/common.less @@ -1,10 +1,10 @@ -body { - padding-top: 5px; -} - -.rng-common-hoveredNode { - border-color: red !important; - border-style:solid; - border-width:1px; -} - +body { + padding-top: 5px; +} + +.rng-common-hoveredNode { + border-color: red !important; + border-style:solid; + border-width:1px; +} + diff --git a/styles/main.less b/styles/main.less index da38074..48fcda9 100644 --- a/styles/main.less +++ b/styles/main.less @@ -1,15 +1,15 @@ -@import 'mixins.less'; -@import 'common.less'; - -@import '../modules/data/data.less'; -@import '../modules/rng/rng.less'; -@import '../modules/documentCanvas/documentCanvas.less'; -@import '../modules/sourceEditor/sourceEditor.less'; -@import '../modules/mainBar/mainBar.less'; -@import '../modules/documentToolbar/documentToolbar.less'; -@import '../modules/documentHistory/documentHistory.less'; -@import '../modules/indicator/indicator.less'; -@import '../modules/nodePane/nodePane.less'; -@import '../modules/nodeFamilyTree/nodeFamilyTree.less'; -@import '../modules/metadataEditor/metadataEditor.less'; -@import '../modules/diffViewer/diffViewer.less'; +@import 'mixins.less'; +@import 'common.less'; + +@import '../modules/data/data.less'; +@import '../modules/rng/rng.less'; +@import '../modules/documentCanvas/documentCanvas.less'; +@import '../modules/sourceEditor/sourceEditor.less'; +@import '../modules/mainBar/mainBar.less'; +@import '../modules/documentToolbar/documentToolbar.less'; +@import '../modules/documentHistory/documentHistory.less'; +@import '../modules/indicator/indicator.less'; +@import '../modules/nodePane/nodePane.less'; +@import '../modules/nodeFamilyTree/nodeFamilyTree.less'; +@import '../modules/metadataEditor/metadataEditor.less'; +@import '../modules/diffViewer/diffViewer.less'; diff --git a/styles/mixins.less b/styles/mixins.less index d2c08f4..3a14f31 100644 --- a/styles/mixins.less +++ b/styles/mixins.less @@ -1,20 +1,20 @@ -.rng-mixin-scrollbar { - width: 9px; -} - -.rng-mixin-scrollbar-track { - -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); - -webkit-border-radius: 10px; - border-radius: 10px; -} - -.rng-mixin-scrollbar-thumb { - -webkit-border-radius: 10px; - border-radius: 10px; - background: rgba(73,175,205,0.8); - -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); -} - -.rng-mixin-scrollbar-thumb-window-inactive { - background: rgba(73,175,205,0.4); +.rng-mixin-scrollbar { + width: 9px; +} + +.rng-mixin-scrollbar-track { + -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); + -webkit-border-radius: 10px; + border-radius: 10px; +} + +.rng-mixin-scrollbar-thumb { + -webkit-border-radius: 10px; + border-radius: 10px; + background: rgba(73,175,205,0.8); + -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); +} + +.rng-mixin-scrollbar-thumb-window-inactive { + background: rgba(73,175,205,0.4); } \ No newline at end of file diff --git a/tests/main.js b/tests/main.js index 9614d72..8e17cdc 100644 --- a/tests/main.js +++ b/tests/main.js @@ -1,30 +1,30 @@ -(function() { - - mocha.setup('tdd'); - - var tests = Object.keys(window.__karma__.files).filter(function (file) { - return /\.test\.js$/.test(file); - }); - - require({ - baseUrl: '/base/', - deps: tests, - callback: window.__karma__.start, - shim: { - 'libs/jquery-1.9.1.min': { - exports: '$', - }, - 'libs/underscore-min': { - exports: '_' - }, - 'libs/bootstrap/js/bootstrap.min': { - deps: ['libs/jquery-1.9.1.min'] - }, - 'libs/backbone-min': { - exports: 'Backbone', - deps: ['libs/jquery-1.9.1.min', 'libs/underscore-min'] - } - } - }); - +(function() { + + mocha.setup('tdd'); + + var tests = Object.keys(window.__karma__.files).filter(function (file) { + return /\.test\.js$/.test(file); + }); + + require({ + baseUrl: '/base/', + deps: tests, + callback: window.__karma__.start, + shim: { + 'libs/jquery-1.9.1.min': { + exports: '$', + }, + 'libs/underscore-min': { + exports: '_' + }, + 'libs/bootstrap/js/bootstrap.min': { + deps: ['libs/jquery-1.9.1.min'] + }, + 'libs/backbone-min': { + exports: 'Backbone', + deps: ['libs/jquery-1.9.1.min', 'libs/underscore-min'] + } + } + }); + })(); \ No newline at end of file diff --git a/views/tabs/tabs.js b/views/tabs/tabs.js index 2a0bfb9..8c92b0f 100644 --- a/views/tabs/tabs.js +++ b/views/tabs/tabs.js @@ -1,109 +1,109 @@ -define([ -'libs/text!./templates/main.html', -'libs/text!./templates/handle.html', -'libs/underscore-min', -'libs/backbone-min', -], function(mainTemplate, handleTemplate, _, Backbone) { - 'use strict'; - - var View = Backbone.View.extend({ - className: 'rng-view-tabs', - - events: { - 'click ul a, i': '_onTabTitleClicked' - }, - - initialize: function(options) { - this.options = options || {}; - this.template = _.template(mainTemplate), - this.handleTemplate = _.template(handleTemplate); - this.contents = {}; - this.selectedTab = null; - }, - - render: function() { - this.$el.html(this.template()); - this.nodes = { - tabBar: this.$('.rng-view-tabs-tabBar'), - content: this.$('.rng-view-tabs-content') - }; - - if(this.options.stacked) { - this.nodes.tabBar.addClass('nav-stacked nav-pills').removeClass('nav-tabs'); - } - if(this.options.position === 'right') { - this.$el.addClass('tabs-right'); - this.nodes.content.addClass('tab-content'); - } - return this; - }, - - addTab: function(title, slug, content) { - if(this.contents[slug]) { - this.contents[slug].detach(); - } - this.contents[slug] = content; - - var text = (typeof title === 'string') ? title : (title.text || ''); - var icon = title.icon || null; - - if(!this.tabExists(slug)) - this.nodes.tabBar.append(this.handleTemplate({text: text, icon: icon, slug: slug})); - if(!this.selectedTab) - this.selectTab(slug); - }, - - selectTab: function(slug) { - if(slug !== this.selectedTab && this.contents[slug]) { - this.trigger('leaving', this.selectedTab); - - if(this.selectedTab) { - var toDetach = this.contents[this.selectedTab]; - if(toDetach.onHide) - toDetach.onHide(); - toDetach.detach(); - } - this.nodes.content.append(this.contents[slug]); - if(this.contents[slug].onShow) { - this.contents[slug].onShow(); - } - this.nodes.tabBar.find('.active').removeClass('active'); - this.nodes.tabBar.find('a[href="#'+slug+'"]').parent().addClass('active'); - - var prevSlug = this.selectedTab; - this.selectedTab = slug; - this.trigger('tabSelected', {slug: slug, prevSlug: prevSlug}); - } - }, - - getAsView: function() { - return this.$el; - }, - - getCurrentSlug: function() { - return this.selectedTab; - }, - - tabExists: function(slug) { - return this.nodes.tabBar.find('a[href="#'+ slug + '"]').length > 0; - }, - - /* Events */ - - _onTabTitleClicked: function(e) { - e.preventDefault(); - var target = $(e.target); - if(target.is('i')) - target = target.parent(); - var slug = target.attr('href').substr(1); - this.selectTab(slug); - } - }); - - - return { - View: View - }; - - +define([ +'libs/text!./templates/main.html', +'libs/text!./templates/handle.html', +'libs/underscore-min', +'libs/backbone-min', +], function(mainTemplate, handleTemplate, _, Backbone) { + 'use strict'; + + var View = Backbone.View.extend({ + className: 'rng-view-tabs', + + events: { + 'click ul a, i': '_onTabTitleClicked' + }, + + initialize: function(options) { + this.options = options || {}; + this.template = _.template(mainTemplate), + this.handleTemplate = _.template(handleTemplate); + this.contents = {}; + this.selectedTab = null; + }, + + render: function() { + this.$el.html(this.template()); + this.nodes = { + tabBar: this.$('.rng-view-tabs-tabBar'), + content: this.$('.rng-view-tabs-content') + }; + + if(this.options.stacked) { + this.nodes.tabBar.addClass('nav-stacked nav-pills').removeClass('nav-tabs'); + } + if(this.options.position === 'right') { + this.$el.addClass('tabs-right'); + this.nodes.content.addClass('tab-content'); + } + return this; + }, + + addTab: function(title, slug, content) { + if(this.contents[slug]) { + this.contents[slug].detach(); + } + this.contents[slug] = content; + + var text = (typeof title === 'string') ? title : (title.text || ''); + var icon = title.icon || null; + + if(!this.tabExists(slug)) + this.nodes.tabBar.append(this.handleTemplate({text: text, icon: icon, slug: slug})); + if(!this.selectedTab) + this.selectTab(slug); + }, + + selectTab: function(slug) { + if(slug !== this.selectedTab && this.contents[slug]) { + this.trigger('leaving', this.selectedTab); + + if(this.selectedTab) { + var toDetach = this.contents[this.selectedTab]; + if(toDetach.onHide) + toDetach.onHide(); + toDetach.detach(); + } + this.nodes.content.append(this.contents[slug]); + if(this.contents[slug].onShow) { + this.contents[slug].onShow(); + } + this.nodes.tabBar.find('.active').removeClass('active'); + this.nodes.tabBar.find('a[href="#'+slug+'"]').parent().addClass('active'); + + var prevSlug = this.selectedTab; + this.selectedTab = slug; + this.trigger('tabSelected', {slug: slug, prevSlug: prevSlug}); + } + }, + + getAsView: function() { + return this.$el; + }, + + getCurrentSlug: function() { + return this.selectedTab; + }, + + tabExists: function(slug) { + return this.nodes.tabBar.find('a[href="#'+ slug + '"]').length > 0; + }, + + /* Events */ + + _onTabTitleClicked: function(e) { + e.preventDefault(); + var target = $(e.target); + if(target.is('i')) + target = target.parent(); + var slug = target.attr('href').substr(1); + this.selectTab(slug); + } + }); + + + return { + View: View + }; + + }); \ No newline at end of file diff --git a/views/tabs/templates/main.html b/views/tabs/templates/main.html index a8f2aca..66efc99 100644 --- a/views/tabs/templates/main.html +++ b/views/tabs/templates/main.html @@ -1,4 +1,4 @@ -
    -
-
-
+
    +
+
+
powyżej<% if(parent) { %><%= parent.repr %><% } else { %>-<% } %>
poniżej +
    + <% if(!children || children.length === 0) { %>-<% } else { %> + <% children.forEach(function(child) { %> +
  • <%= child.repr %>
    • + <% }); %> + <% } %> +
+