From b677623848ccd30c937b3dec01cce10f66251279 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Aleksander=20=C5=81ukasz?= Date: Tue, 1 Jul 2014 09:48:01 +0200 Subject: [PATCH] editor: core plugin - edumed - first take on gaps exercise --- .../documentCanvas/canvas/genericElement.js | 2 +- src/editor/modules/documentCanvas/nodes.less | 18 ---- src/editor/plugins/core/edumed/edumed.js | 8 +- src/editor/plugins/core/edumed/edumed.less | 1 + .../plugins/core/edumed/gaps/actions.js | 92 +++++++++++++++++++ .../plugins/core/edumed/gaps/element.js | 52 +++++++++++ src/editor/plugins/core/edumed/gaps/gaps.less | 19 ++++ src/editor/plugins/core/edumed/gaps/view.html | 4 + 8 files changed, 174 insertions(+), 22 deletions(-) create mode 100644 src/editor/plugins/core/edumed/gaps/actions.js create mode 100644 src/editor/plugins/core/edumed/gaps/element.js create mode 100644 src/editor/plugins/core/edumed/gaps/gaps.less create mode 100644 src/editor/plugins/core/edumed/gaps/view.html diff --git a/src/editor/modules/documentCanvas/canvas/genericElement.js b/src/editor/modules/documentCanvas/canvas/genericElement.js index 8ed08bf..fd0dfc4 100644 --- a/src/editor/modules/documentCanvas/canvas/genericElement.js +++ b/src/editor/modules/documentCanvas/canvas/genericElement.js @@ -37,7 +37,7 @@ $.extend(generic, { }, refresh: function() { - if(this.wlxmlNode.getTagName() === 'span') { + if(this.wlxmlNode.getTagName() === 'span' || this.wlxmlNode.getTagName() === 'aside') { if(this.containsBlock()) { this.displayAsBlock(); } else { diff --git a/src/editor/modules/documentCanvas/nodes.less b/src/editor/modules/documentCanvas/nodes.less index 7938911..35ac7a8 100644 --- a/src/editor/modules/documentCanvas/nodes.less +++ b/src/editor/modules/documentCanvas/nodes.less @@ -142,22 +142,4 @@ [wlxml-tag="aside"] { margin-top: 10px; margin-bottom: 10px; - - [wlxml-class='gap'] { - display: inline; - } } - -[wlxml-class="gap"] { - &:before, &:after { - color: darken(@blue, 10%); - font-weight: bold; - //vertical-align: super; - } - &:before { - content: "("; - } - &:after { - content: ")"; - } -} \ No newline at end of file diff --git a/src/editor/plugins/core/edumed/edumed.js b/src/editor/plugins/core/edumed/edumed.js index bb64da0..25f31c9 100644 --- a/src/editor/plugins/core/edumed/edumed.js +++ b/src/editor/plugins/core/edumed/edumed.js @@ -3,11 +3,13 @@ define(function(require) { 'use strict'; var actions = require('./actions'), - orderExerciseElement = require('./order/element'); + gapsActions = require('./gaps/actions'), + orderExerciseElement = require('./order/element'), + gapsExerciseElement = require('./gaps/element'); return { - actions: actions, - canvasElements: [orderExerciseElement] + actions: actions.concat(gapsActions), + canvasElements: [orderExerciseElement, gapsExerciseElement] }; }); \ No newline at end of file diff --git a/src/editor/plugins/core/edumed/edumed.less b/src/editor/plugins/core/edumed/edumed.less index 31a3f5b..248bedb 100644 --- a/src/editor/plugins/core/edumed/edumed.less +++ b/src/editor/plugins/core/edumed/edumed.less @@ -1,4 +1,5 @@ @import 'order/order.less'; +@import 'gaps/gaps.less'; .edumed-exercise { diff --git a/src/editor/plugins/core/edumed/gaps/actions.js b/src/editor/plugins/core/edumed/gaps/actions.js new file mode 100644 index 0000000..e91faa4 --- /dev/null +++ b/src/editor/plugins/core/edumed/gaps/actions.js @@ -0,0 +1,92 @@ +define(function(require) { + +'use strict'; + +/* globals gettext */ + +var _ = require('libs/underscore'); + + +var createGap = { + name: 'createGap', + params: { + fragment: {type: 'context', name: 'fragment'} + }, + stateDefaults: { + icon: null, + label: gettext('Create a gap'), + execute: function(callback, params) { + var doc = params.fragment.document; + + doc.transaction(function() { + var wrapper = params.fragment.startNode.parent().wrapText({ + _with: {tagName: 'aside', attrs: {'class': 'gap'}}, + offsetStart: params.fragment.startOffset, + offsetEnd: params.fragment.endOffset, + textNodeIdx: [params.fragment.startNode.getIndex(), params.fragment.endNode.getIndex()] + }), + last = _.last(wrapper.contents()); + + return doc.createFragment(doc.CaretFragment, {node: last, offset: last.getText().length}); + }, { + metadata: { + description: gettext('Create a gap') + }, + success: callback + }); + } + }, + getState: function(params) { + return { + allowed: params.fragment && + params.fragment.isValid() && + params.fragment instanceof params.fragment.TextRangeFragment && + params.fragment.hasSiblingBoundries() && + params.fragment.startNode.isInside('exercise.gap') && + !params.fragment.startNode.isInside({tagName: 'aside', klass: 'gap'}), + + description: gettext('Turn selection into a gap') + }; + } +}; + +var removeGap = { + name: 'removeGap', + params: { + fragment: {type: 'context', name: 'fragment'} + }, + stateDefaults: { + icon: null, + label: gettext('Remove a gap'), + execute: function(callback, params) { + var doc = params.fragment.document; + + doc.transaction(function() { + var ret = params.fragment.node.getParent('gap').unwrapContent(); + + return doc.createFragment(doc.CaretFragment, {node:ret.element2, offset: ret.element2.getText().length}); + }, { + metadata: { + description: gettext('Remove a gap') + }, + success: callback + }); + } + }, + getState: function(params) { + return { + allowed: params.fragment && + params.fragment.isValid() && + params.fragment instanceof params.fragment.NodeFragment && + params.fragment.node.isInside('exercise.gap') && + params.fragment.node.isInside('gap'), + + description: gettext('Remove a gap') + }; + } +}; + + +return [createGap, removeGap]; + +}); \ No newline at end of file diff --git a/src/editor/plugins/core/edumed/gaps/element.js b/src/editor/plugins/core/edumed/gaps/element.js new file mode 100644 index 0000000..f068de9 --- /dev/null +++ b/src/editor/plugins/core/edumed/gaps/element.js @@ -0,0 +1,52 @@ +define(function(require) { + +'use strict'; + + +var $ = require('libs/jquery'), + _ = require('libs/underscore'), + documentElement = require('modules/documentCanvas/canvas/documentElement'), + viewTemplate = require('libs/text!./view.html'); + +var OrderExerciceElement = Object.create(documentElement.DocumentNodeElement.prototype); +_.extend(OrderExerciceElement, { + init: function() { + documentElement.DocumentNodeElement.prototype.init.call(this); + var view = $(_.template(viewTemplate)()); + this._container().append(view); + + this.createContainer(this.wlxmlNode.contents(), { + manages: function() { + return true; + }, + dom: view.find('.content') + }); + + this.addToContextMenu('core.createGap'); + this.contextMenuActions[0].on('actionExecuted', function(ret) { + if(ret instanceof this.wlxmlNode.document.Fragment && ret.isValid()) { + this.canvas.select(ret); + } + }.bind(this)); + this.addToContextMenu('core.removeGap'); + }, + getVerticallyFirstTextElement: function() { + // doesnt container handle this? + var toret; + this.containers.some(function(container) { + toret = container.getVerticallyFirstTextElement(); + return !!toret; + }); + return toret; + } +}); + +return {tag: 'div', klass: 'exercise.gap', prototype: OrderExerciceElement}; + +}); + + + + + + diff --git a/src/editor/plugins/core/edumed/gaps/gaps.less b/src/editor/plugins/core/edumed/gaps/gaps.less new file mode 100644 index 0000000..812b0e1 --- /dev/null +++ b/src/editor/plugins/core/edumed/gaps/gaps.less @@ -0,0 +1,19 @@ +[wlxml-tag="aside"] { + [wlxml-class='gap'] { + display: inline; + } +} + +[wlxml-class="gap"] { + &:before, &:after { + color: darken(@blue, 10%); + font-weight: bold; + //vertical-align: super; + } + &:before { + content: "("; + } + &:after { + content: ")"; + } +} \ No newline at end of file diff --git a/src/editor/plugins/core/edumed/gaps/view.html b/src/editor/plugins/core/edumed/gaps/view.html new file mode 100644 index 0000000..bd1552e --- /dev/null +++ b/src/editor/plugins/core/edumed/gaps/view.html @@ -0,0 +1,4 @@ +
+
<%= gettext('Exercise') %>
+
+
\ No newline at end of file -- 2.20.1