From fb97e7a8ba5457eabfa912a26544767a6968d48c Mon Sep 17 00:00:00 2001 From: Philip Schatz Date: Thu, 30 May 2013 15:54:38 -0400 Subject: [PATCH 01/12] Moved placeholder logic out of Javascript and the DOM and into CSS --- src/plugins/oer/note/lib/note-plugin.coffee | 26 +++++++---------- src/plugins/oer/note/lib/note-plugin.js | 27 ++++++++--------- .../css/semanticblock-plugin.css | 29 ++++++++++++++----- .../lib/semanticblock-plugin.coffee | 26 +++++++++++------ .../semanticblock/lib/semanticblock-plugin.js | 27 +++++++---------- 5 files changed, 73 insertions(+), 62 deletions(-) diff --git a/src/plugins/oer/note/lib/note-plugin.coffee b/src/plugins/oer/note/lib/note-plugin.coffee index 55242600ba..7d27ddfe09 100644 --- a/src/plugins/oer/note/lib/note-plugin.coffee +++ b/src/plugins/oer/note/lib/note-plugin.coffee @@ -132,26 +132,22 @@ define [ .appendTo(element) .aloha() ) - semanticBlock.deactivateHandler(selector, (element) -> - bodyElement = element.children('.body') - body = bodyElement.children() + semanticBlock.deactivateHandler(selector, ($element) -> + $body = $element.children('.body') + $body = $body.children() - if body == bodyElement.attr('placeholder') - body = '' - - element.children('.body').remove() + $element.children('.body').remove() if hasTitle - titleElement = element.children('.type-container').children('.title') - title = titleElement.text() - - if title == titleElement.attr('placeholder') - title = '' + $typeContainer = $element.children('.type-container') + $title = $typeContainer.children('.title') + if not $title[0] + $title = jQuery("<#{titleTagName}>") + $title.addClass 'title' - element.children('.type-container').remove() - jQuery("
").addClass('title').text(title).prependTo(element) + $title.prependTo(typeContainer) - element.append(body) + $element.append($body) ) # Add a listener UI.adopt "insert-#{className}#{typeName}", Button, diff --git a/src/plugins/oer/note/lib/note-plugin.js b/src/plugins/oer/note/lib/note-plugin.js index 3d6313ecfc..103a7c7e45 100644 --- a/src/plugins/oer/note/lib/note-plugin.js +++ b/src/plugins/oer/note/lib/note-plugin.js @@ -93,24 +93,21 @@ } return $('
').addClass('body').attr('placeholder', "Type the text of your " + className + " here.").append(body).appendTo(element).aloha(); }); - semanticBlock.deactivateHandler(selector, function(element) { - var body, bodyElement, title, titleElement; - bodyElement = element.children('.body'); - body = bodyElement.children(); - if (body === bodyElement.attr('placeholder')) { - body = ''; - } - element.children('.body').remove(); + semanticBlock.deactivateHandler(selector, function($element) { + var $body, $title, $typeContainer; + $body = $element.children('.body'); + $body = $body.children(); + $element.children('.body').remove(); if (hasTitle) { - titleElement = element.children('.type-container').children('.title'); - title = titleElement.text(); - if (title === titleElement.attr('placeholder')) { - title = ''; + $typeContainer = $element.children('.type-container'); + $title = $typeContainer.children('.title'); + if (!$title[0]) { + $title = jQuery("<" + titleTagName + ">"); + $title.addClass('title'); + $title.prependTo(typeContainer); } - element.children('.type-container').remove(); - jQuery("
").addClass('title').text(title).prependTo(element); } - return element.append(body); + return $element.append($body); }); UI.adopt("insert-" + className + typeName, Button, { click: function() { diff --git a/src/plugins/oer/semanticblock/css/semanticblock-plugin.css b/src/plugins/oer/semanticblock/css/semanticblock-plugin.css index a88413cd94..efd41914d1 100644 --- a/src/plugins/oer/semanticblock/css/semanticblock-plugin.css +++ b/src/plugins/oer/semanticblock/css/semanticblock-plugin.css @@ -1,6 +1,21 @@ - -.placeholder { +/* Logic for displaying placeholder text. + There are 2 cases when placeholder text should become visible: + 1. If the user is hovering over a semantic element + 2. If the user is editing a semantic element + + Then, the placeholder text should appear on an element when all of the following occur: + - has a `placeholder` attribute + - does not contain text in the children (`.aloha-empty` is set on init/blur) + - is not currently being edited (no cursor inside) + + The placeholder text is added to the DOM using `:before { content: '...'; }`. + This way, the browser does most of the heavy lifting AND the actual text + is never part of the DOM for serializing. + */ +.aloha-oer-block:hover *[placeholder].aloha-empty:not(:focus):before, +.aloha-block-active *[placeholder].aloha-empty:not(:focus):before { color: #AAA; + content: attr(placeholder); } .semantic-drag-helper { @@ -22,8 +37,8 @@ } .semantic-container .aloha-block-handle { - background-image: - linear-gradient(45deg, #C0C0C0 25%, transparent 25%, transparent 75%, #C0C0C0 75%), + background-image: + linear-gradient(45deg, #C0C0C0 25%, transparent 25%, transparent 75%, #C0C0C0 75%), linear-gradient(45deg, #C0C0C0 25%, transparent 25%, transparent 75%, #C0C0C0 75%); background-position: 0 0, 2px 2px; background-color: #FAFAFA; @@ -50,13 +65,13 @@ .semantic-container .semantic-controls { border-left: 1px solid #ccc; background: #F5F5F5; - padding-left: 1px; + padding-left: 1px; position: absolute; top: 0; right: 0; width: 15px; height: 100%; - display: none; + display: none; } .semantic-container.focused > .semantic-controls { display: block; @@ -106,7 +121,7 @@ } .aloha-oer-block .type-container li { - list-style-type: none !important; + list-style-type: none !important; } .aloha-oer-block .title { diff --git a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee index 8f0cf3fc45..dd8ba14e89 100644 --- a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee +++ b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee @@ -53,6 +53,15 @@ define ['aloha', 'block/blockmanager', 'aloha/plugin', 'aloha/pluginmanager', 'j e.preventDefault() jQuery(this).parents('.type-container').first().children('.type').text jQuery(this).text() jQuery(this).parents('.aloha-oer-block').first().attr 'data-type', jQuery(this).text().toLowerCase() + , + # Toggle a class on elements so if they are empty and have placeholder text + # the text shows up. + # See the CSS file more info. + name: 'blur' + selector: '[placeholder]' + callback: -> + $el = jQuery @ + $el.toggleClass 'aloha-empty', $el.is(':empty') ] insertElement = (element) -> @@ -99,19 +108,18 @@ define ['aloha', 'block/blockmanager', 'aloha/plugin', 'aloha/pluginmanager', 'j deactivate jQuery(this) init: -> + # On activation add a `aloha-empty` class on all elements that: + # - have a `placeholder` attribute + # - and do not have any children + # + # See CSS for placeholder logic. This class is updated on blur. Aloha.bind 'aloha-editable-activated', (e, params) => - element = jQuery(params.editable.obj) - if element.attr('placeholder') - element.removeClass 'placeholder' - element.text '' if element.attr('placeholder') is element.text() - Aloha.bind 'aloha-editable-deactivated', (e, params) => - element = jQuery(params.editable.obj) - if element.attr('placeholder') and element.text() == '' - element.text element.attr('placeholder') - element.addClass 'placeholder' + $root = jQuery(params.editable.obj) + $root.find('[placeholder]:empty').addClass('aloha-empty') Aloha.bind 'aloha-editable-created', (e, params) => $root = params.obj + # Add a `.aloha-oer-block` to all registered classes classes = [] classes.push selector for selector of activateHandlers diff --git a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js index a1c5a4f7ee..515fff2a62 100644 --- a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js +++ b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js @@ -71,6 +71,14 @@ jQuery(this).parents('.type-container').first().children('.type').text(jQuery(this).text()); return jQuery(this).parents('.aloha-oer-block').first().attr('data-type', jQuery(this).text().toLowerCase()); } + }, { + name: 'blur', + selector: '[placeholder]', + callback: function() { + var $el; + $el = jQuery(this); + return $el.toggleClass('aloha-empty', $el.is(':empty')); + } } ]; insertElement = function(element) {}; @@ -140,22 +148,9 @@ init: function() { var _this = this; Aloha.bind('aloha-editable-activated', function(e, params) { - var element; - element = jQuery(params.editable.obj); - if (element.attr('placeholder')) { - element.removeClass('placeholder'); - if (element.attr('placeholder') === element.text()) { - return element.text(''); - } - } - }); - Aloha.bind('aloha-editable-deactivated', function(e, params) { - var element; - element = jQuery(params.editable.obj); - if (element.attr('placeholder') && element.text() === '') { - element.text(element.attr('placeholder')); - return element.addClass('placeholder'); - } + var $root; + $root = jQuery(params.editable.obj); + return $root.find('[placeholder]:empty').addClass('aloha-empty'); }); return Aloha.bind('aloha-editable-created', function(e, params) { var $root, classes, selector; From 6f32dbb8a4403dbd7a97d13941b34057d15146ed Mon Sep 17 00:00:00 2001 From: Philip Schatz Date: Thu, 30 May 2013 17:02:54 -0400 Subject: [PATCH 02/12] Removed cnxmlplus handler --- cnx/aloha-config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/cnx/aloha-config.js b/cnx/aloha-config.js index 4e2f583720..aad0a722ee 100644 --- a/cnx/aloha-config.js +++ b/cnx/aloha-config.js @@ -18,7 +18,7 @@ }, errorhandling: true, plugins: { - load: ['common/ui', 'oer/toolbar', 'oer/popover', 'oer/format', 'common/contenthandler', 'common/paste', 'common/block', 'common/list', 'oer/table', 'oer/popover', 'oer/math', 'extra/draganddropfiles', 'common/image', 'oer/assorted', 'oer/title', 'common/undo', 'oer/undobutton', 'oer/genericbutton', 'oer/semanticblock', 'oer/exercise', 'oer/note', 'oer/cnxmlplus-handler'], + load: ['common/ui', 'oer/toolbar', 'oer/popover', 'oer/format', 'common/contenthandler', 'common/paste', 'common/block', 'common/list', 'oer/table', 'oer/popover', 'oer/math', 'extra/draganddropfiles', 'common/image', 'oer/assorted', 'oer/title', 'common/undo', 'oer/undobutton', 'oer/genericbutton', 'oer/semanticblock', 'oer/exercise', 'oer/note'], note: [ { label: 'Note', From ef532aca7507082ad20b43692b09f8e1d3e756cb Mon Sep 17 00:00:00 2001 From: Philip Schatz Date: Thu, 30 May 2013 17:03:46 -0400 Subject: [PATCH 03/12] Moved title out of the type-container element --- src/plugins/oer/note/lib/note-plugin.coffee | 118 ++++++++---------- src/plugins/oer/note/lib/note-plugin.js | 96 +++++++------- .../css/semanticblock-plugin.css | 3 + .../lib/semanticblock-plugin.coffee | 4 + .../semanticblock/lib/semanticblock-plugin.js | 3 + 5 files changed, 105 insertions(+), 119 deletions(-) diff --git a/src/plugins/oer/note/lib/note-plugin.coffee b/src/plugins/oer/note/lib/note-plugin.coffee index 7d27ddfe09..5b6982ebfb 100644 --- a/src/plugins/oer/note/lib/note-plugin.coffee +++ b/src/plugins/oer/note/lib/note-plugin.coffee @@ -8,14 +8,13 @@ define [ 'semanticblock/semanticblock-plugin' 'css!note/css/note-plugin.css'], (Aloha, Plugin, jQuery, Ephemera, UI, Button, semanticBlock) -> - TITLE_CONTAINER = jQuery(''' -
- - -
    -
-
- ''') + TYPE_CONTAINER = jQuery ''' + + +
    +
+ + ''' # Find all classes that could mean something is "notish" # so they can be removed when the type is changed from the dropdown. @@ -72,64 +71,54 @@ define [ if hasTitle newTemplate.append("<#{titleTagName} class='title'> - if hasTitle - titleElement = element.children('.title') - - if titleElement.length - title = titleElement.html() - titleElement.remove() - else - title = '' - - type = element.attr('data-type') or className - - body = element.children() - element.children().remove() - - if hasTitle - titleContainer = TITLE_CONTAINER.clone() - # Add dropdown elements for each possible type - jQuery.each @settings, (i, foo) => - $option = jQuery('
    • ') - $option.appendTo(titleContainer.find('.dropdown-menu')) - $option = $option.children('a') - $option.text(foo.label) - $option.on 'click', => - # Remove the title if this type does not have one - # The title was moved into `.type-container` for some reason - if foo.hasTitle - # If there is no `.title` element then add one in and enable it as an Aloha block - if not element.find('> .type-container > .title')[0] - $newTitle = jQuery("<#{foo.titleTagName or 'span'} class='title'> .type-container > .title').remove() - - # Remove the `data-type` if this type does not have one - if foo.type - element.attr('data-type', foo.type) - else - element.removeAttr('data-type') - - # Remove all notish class names and then add this one in - for key of notishClasses - element.removeClass key - element.addClass(foo.cls) - - - titleContainer.find('.title').text(title) - titleContainer.find('.type').text(label) - titleContainer.prependTo(element) - titleContainer.children('.title').aloha() + semanticBlock.activateHandler(selector, ($element) => + type = $element.attr('data-type') or className + + $title = $element.children('.title') + $title.attr('placeholder', 'Add a title (optional)') + $title.aloha() + + $body = $element.contents().not($title) + + typeContainer = TYPE_CONTAINER.clone() + # Add dropdown elements for each possible type + jQuery.each @settings, (i, foo) => + $option = jQuery('
    • ') + $option.appendTo(typeContainer.find('.dropdown-menu')) + $option = $option.children('a') + $option.text(foo.label) + $option.on 'click', => + # Remove the title if this type does not have one + if foo.hasTitle + # If there is no `.title` element then add one in and enable it as an Aloha block + if not $element.children('.title')[0] + $newTitle = jQuery("<#{foo.titleTagName or 'span'} class='title'>').addClass('body') .attr('placeholder', "Type the text of your #{className} here.") - .append(body) - .appendTo(element) + .append($body) + .appendTo($element) .aloha() ) semanticBlock.deactivateHandler(selector, ($element) -> @@ -139,13 +128,12 @@ define [ $element.children('.body').remove() if hasTitle - $typeContainer = $element.children('.type-container') - $title = $typeContainer.children('.title') + $title = $element.children('.title') if not $title[0] $title = jQuery("<#{titleTagName}>") $title.addClass 'title' - $title.prependTo(typeContainer) + $title.prependTo($element) $element.append($body) ) diff --git a/src/plugins/oer/note/lib/note-plugin.js b/src/plugins/oer/note/lib/note-plugin.js index 103a7c7e45..1956ca7abe 100644 --- a/src/plugins/oer/note/lib/note-plugin.js +++ b/src/plugins/oer/note/lib/note-plugin.js @@ -2,8 +2,8 @@ (function() { define(['aloha', 'aloha/plugin', 'jquery', 'aloha/ephemera', 'ui/ui', 'ui/button', 'semanticblock/semanticblock-plugin', 'css!note/css/note-plugin.css'], function(Aloha, Plugin, jQuery, Ephemera, UI, Button, semanticBlock) { - var TITLE_CONTAINER, notishClasses; - TITLE_CONTAINER = jQuery('
    \n \n \n
      \n
    \n
    '); + var TYPE_CONTAINER, notishClasses; + TYPE_CONTAINER = jQuery('\n \n
      \n
    \n    '); notishClasses = {}; return Plugin.create('note', { defaults: [ @@ -42,69 +42,57 @@ if (hasTitle) { newTemplate.append("<" + titleTagName + " class='title'>'); - $option.appendTo(titleContainer.find('.dropdown-menu')); - $option = $option.children('a'); - $option.text(foo.label); - return $option.on('click', function() { - var $newTitle, key; - if (foo.hasTitle) { - if (!element.find('> .type-container > .title')[0]) { - $newTitle = jQuery("<" + (foo.titleTagName || 'span') + " class='title'> .type-container > .title').remove(); + semanticBlock.activateHandler(selector, function($element) { + var $body, $title, typeContainer; + type = $element.attr('data-type') || className; + $title = $element.children('.title'); + $title.attr('placeholder', 'Add a title (optional)'); + $title.aloha(); + $body = $element.contents().not($title); + typeContainer = TYPE_CONTAINER.clone(); + jQuery.each(_this.settings, function(i, foo) { + var $option; + $option = jQuery('
    • '); + $option.appendTo(typeContainer.find('.dropdown-menu')); + $option = $option.children('a'); + $option.text(foo.label); + return $option.on('click', function() { + var $newTitle, key; + if (foo.hasTitle) { + if (!$element.children('.title')[0]) { + $newTitle = jQuery("<" + (foo.titleTagName || 'span') + " class='title'>').addClass('body').attr('placeholder', "Type the text of your " + className + " here.").append(body).appendTo(element).aloha(); + }); + typeContainer.find('.type').text(label); + typeContainer.prependTo($element); + return $('
    ').addClass('body').attr('placeholder', "Type the text of your " + className + " here.").append($body).appendTo($element).aloha(); }); semanticBlock.deactivateHandler(selector, function($element) { - var $body, $title, $typeContainer; + var $body, $title; $body = $element.children('.body'); $body = $body.children(); $element.children('.body').remove(); if (hasTitle) { - $typeContainer = $element.children('.type-container'); - $title = $typeContainer.children('.title'); + $title = $element.children('.title'); if (!$title[0]) { $title = jQuery("<" + titleTagName + ">"); $title.addClass('title'); - $title.prependTo(typeContainer); + $title.prependTo($element); } } return $element.append($body); diff --git a/src/plugins/oer/semanticblock/css/semanticblock-plugin.css b/src/plugins/oer/semanticblock/css/semanticblock-plugin.css index efd41914d1..2cc41f8ef4 100644 --- a/src/plugins/oer/semanticblock/css/semanticblock-plugin.css +++ b/src/plugins/oer/semanticblock/css/semanticblock-plugin.css @@ -18,6 +18,9 @@ content: attr(placeholder); } +/* Make titles inline so they show up next to the type dropdown if there is one */ +.aloha-oer-block > .title { display: inline; } + .semantic-drag-helper { display: block; height: auto !important; diff --git a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee index dd8ba14e89..d4b5d16811 100644 --- a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee +++ b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee @@ -61,6 +61,10 @@ define ['aloha', 'block/blockmanager', 'aloha/plugin', 'aloha/pluginmanager', 'j selector: '[placeholder]' callback: -> $el = jQuery @ + # If the element does not contain any text (just empty paragraphs) + # Clear the contents so `:empty` is true + $el.empty() if not $el.text().trim() + $el.toggleClass 'aloha-empty', $el.is(':empty') ] insertElement = (element) -> diff --git a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js index 515fff2a62..cbe238f26b 100644 --- a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js +++ b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js @@ -77,6 +77,9 @@ callback: function() { var $el; $el = jQuery(this); + if (!$el.text().trim()) { + $el.empty(); + } return $el.toggleClass('aloha-empty', $el.is(':empty')); } } From c1d283aeac8dbd7794ec5673627e5a023dd64639 Mon Sep 17 00:00:00 2001 From: Philip Schatz Date: Thu, 30 May 2013 17:07:01 -0400 Subject: [PATCH 04/12] type-container is removed from the serialized DOM --- src/plugins/oer/note/lib/note-plugin.coffee | 2 +- src/plugins/oer/note/lib/note-plugin.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/plugins/oer/note/lib/note-plugin.coffee b/src/plugins/oer/note/lib/note-plugin.coffee index 5b6982ebfb..54420574ef 100644 --- a/src/plugins/oer/note/lib/note-plugin.coffee +++ b/src/plugins/oer/note/lib/note-plugin.coffee @@ -9,7 +9,7 @@ define [ 'css!note/css/note-plugin.css'], (Aloha, Plugin, jQuery, Ephemera, UI, Button, semanticBlock) -> TYPE_CONTAINER = jQuery ''' - +
    diff --git a/src/plugins/oer/note/lib/note-plugin.js b/src/plugins/oer/note/lib/note-plugin.js index 1956ca7abe..0860a48a85 100644 --- a/src/plugins/oer/note/lib/note-plugin.js +++ b/src/plugins/oer/note/lib/note-plugin.js @@ -3,7 +3,7 @@ define(['aloha', 'aloha/plugin', 'jquery', 'aloha/ephemera', 'ui/ui', 'ui/button', 'semanticblock/semanticblock-plugin', 'css!note/css/note-plugin.css'], function(Aloha, Plugin, jQuery, Ephemera, UI, Button, semanticBlock) { var TYPE_CONTAINER, notishClasses; - TYPE_CONTAINER = jQuery('\n \n
      \n
    \n    '); + TYPE_CONTAINER = jQuery('\n \n
      \n
    \n    '); notishClasses = {}; return Plugin.create('note', { defaults: [ From e2ae39e1b94496b849d7492d5d26dc9d54760cf2 Mon Sep 17 00:00:00 2001 From: Philip Schatz Date: Sat, 8 Jun 2013 07:22:05 -0400 Subject: [PATCH 05/12] Renamed variable --- src/plugins/oer/note/lib/note-plugin.coffee | 2 +- src/plugins/oer/note/lib/note-plugin.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/plugins/oer/note/lib/note-plugin.coffee b/src/plugins/oer/note/lib/note-plugin.coffee index ca19dd3f52..6a754ef617 100644 --- a/src/plugins/oer/note/lib/note-plugin.coffee +++ b/src/plugins/oer/note/lib/note-plugin.coffee @@ -127,7 +127,7 @@ define [ # If so, we need to wrap them in a `p` element hasTextChildren = $body.children().length != $body.contents().length $body = $body.contents() - $body = $body.wrap('

    ') if hasChildren + $body = $body.wrap('

    ') if hasTextChildren $element.children('.body').remove() diff --git a/src/plugins/oer/note/lib/note-plugin.js b/src/plugins/oer/note/lib/note-plugin.js index 19f9add07f..a5134f419a 100644 --- a/src/plugins/oer/note/lib/note-plugin.js +++ b/src/plugins/oer/note/lib/note-plugin.js @@ -87,7 +87,7 @@ $body = $element.children('.body'); hasTextChildren = $body.children().length !== $body.contents().length; $body = $body.contents(); - if (hasChildren) { + if (hasTextChildren) { $body = $body.wrap('

    '); } $element.children('.body').remove(); From a93604a9bfb7386e67c4b910e0d5f80e495e1af3 Mon Sep 17 00:00:00 2001 From: Philip Schatz Date: Sat, 8 Jun 2013 09:21:39 -0400 Subject: [PATCH 06/12] Notes with textnode children will get a para --- cnx/index.html | 3 +-- src/plugins/oer/note/lib/note-plugin.coffee | 2 +- src/plugins/oer/note/lib/note-plugin.js | 2 +- 3 files changed, 3 insertions(+), 4 deletions(-) diff --git a/cnx/index.html b/cnx/index.html index 912b014c9d..ebbe0171f7 100644 --- a/cnx/index.html +++ b/cnx/index.html @@ -47,8 +47,7 @@

    Blockish Examples (note)

    Historical Context
    -

    Some body text

    -

    Some more body text

    + Some body text
    diff --git a/src/plugins/oer/note/lib/note-plugin.coffee b/src/plugins/oer/note/lib/note-plugin.coffee index 6a754ef617..b1ef6813f8 100644 --- a/src/plugins/oer/note/lib/note-plugin.coffee +++ b/src/plugins/oer/note/lib/note-plugin.coffee @@ -127,7 +127,7 @@ define [ # If so, we need to wrap them in a `p` element hasTextChildren = $body.children().length != $body.contents().length $body = $body.contents() - $body = $body.wrap('

    ') if hasTextChildren + $body = $body.wrap('

    ').parent() if hasTextChildren $element.children('.body').remove() diff --git a/src/plugins/oer/note/lib/note-plugin.js b/src/plugins/oer/note/lib/note-plugin.js index a5134f419a..0fd3f0725f 100644 --- a/src/plugins/oer/note/lib/note-plugin.js +++ b/src/plugins/oer/note/lib/note-plugin.js @@ -88,7 +88,7 @@ hasTextChildren = $body.children().length !== $body.contents().length; $body = $body.contents(); if (hasTextChildren) { - $body = $body.wrap('

    '); + $body = $body.wrap('

    ').parent(); } $element.children('.body').remove(); if (hasTitle) { From c7710e52e3de318b0c80ce9f5905187f2d3e95c2 Mon Sep 17 00:00:00 2001 From: Tom Date: Sat, 8 Jun 2013 09:39:25 -0400 Subject: [PATCH 07/12] fix typo in semanticBlock makeClean --- src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee | 2 +- src/plugins/oer/semanticblock/lib/semanticblock-plugin.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee index d1787bc92d..6153d3b285 100644 --- a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee +++ b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.coffee @@ -120,7 +120,7 @@ define ['aloha', 'block/blockmanager', 'aloha/plugin', 'aloha/pluginmanager', 'j makeClean: (content) -> for selector of deactivateHandlers - content.find(".aloha-oer-block#{selector}").each -> + content.find(".aloha-oer-block.#{selector}").each -> deactivate jQuery(this) cleanIds(content) diff --git a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js index 9de69751f8..c19fce82ef 100644 --- a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js +++ b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js @@ -1,4 +1,4 @@ -// Generated by CoffeeScript 1.3.3 +// Generated by CoffeeScript 1.5.0 (function() { define(['aloha', 'block/blockmanager', 'aloha/plugin', 'aloha/pluginmanager', 'jquery', 'aloha/ephemera', 'ui/ui', 'ui/button', 'css!semanticblock/css/semanticblock-plugin.css'], function(Aloha, BlockManager, Plugin, pluginManager, jQuery, Ephemera, UI, Button) { @@ -157,7 +157,7 @@ makeClean: function(content) { var selector; for (selector in deactivateHandlers) { - content.find(".aloha-oer-block" + selector).each(function() { + content.find(".aloha-oer-block." + selector).each(function() { return deactivate(jQuery(this)); }); } From b558eeac2cbddd96054fee6ec7c031af11830eb8 Mon Sep 17 00:00:00 2001 From: Tom Date: Sat, 8 Jun 2013 10:25:41 -0400 Subject: [PATCH 08/12] fix images and exercises --- src/plugins/oer/assorted/lib/image.coffee | 4 ++-- src/plugins/oer/assorted/lib/image.js | 8 ++------ src/plugins/oer/exercise/lib/exercise-plugin.coffee | 8 ++++---- src/plugins/oer/exercise/lib/exercise-plugin.js | 8 ++++---- 4 files changed, 12 insertions(+), 16 deletions(-) diff --git a/src/plugins/oer/assorted/lib/image.coffee b/src/plugins/oer/assorted/lib/image.coffee index f3c40d5b2e..0b26bd97b1 100644 --- a/src/plugins/oer/assorted/lib/image.coffee +++ b/src/plugins/oer/assorted/lib/image.coffee @@ -253,8 +253,8 @@ define ['aloha', 'jquery', 'aloha/plugin', 'image/image-plugin', 'ui/ui', 'seman # Return config AlohaPlugin.create('oer-image', { init: () -> - semanticBlock.activateHandler('media', activate) - semanticBlock.deactivateHandler('media', deactivate) + semanticBlock.activateHandler('.media', activate) + semanticBlock.deactivateHandler('.media', deactivate) semanticBlock.registerEvent 'click', '.aloha-oer-block .image-edit', -> img = $(this).siblings('img') promise = showModalDialog(img) diff --git a/src/plugins/oer/assorted/lib/image.js b/src/plugins/oer/assorted/lib/image.js index adc9011485..32c9e4d1e2 100644 --- a/src/plugins/oer/assorted/lib/image.js +++ b/src/plugins/oer/assorted/lib/image.js @@ -96,11 +96,9 @@ altAdded = (!$el.attr('alt')) && dialog.find('[name=alt]').val(); $el.attr('src', imageSource); $el.attr('alt', dialog.find('[name=alt]').val()); - console.log('submit'); if (altAdded) { setThankYou($el.parent()); } else { - console.log('here'); setEditText($el.parent()); } deferred.resolve({ @@ -204,7 +202,6 @@ }; setEditText = function(wrapper) { var alt, editDiv; - console.log('asdf'); alt = wrapper.children('img').attr('alt'); editDiv = wrapper.children('.image-edit').css('opacity', 1); if (alt) { @@ -215,7 +212,6 @@ }; activate = function(element) { var edit, img, wrapper; - console.log('activate'); wrapper = $('
    ').css('width', element.css('width')); edit = $('
    '); img = element.find('img'); @@ -236,8 +232,8 @@ }; return AlohaPlugin.create('oer-image', { init: function() { - semanticBlock.activateHandler('media', activate); - semanticBlock.deactivateHandler('media', deactivate); + semanticBlock.activateHandler('.media', activate); + semanticBlock.deactivateHandler('.media', deactivate); return semanticBlock.registerEvent('click', '.aloha-oer-block .image-edit', function() { var img, promise; img = $(this).siblings('img'); diff --git a/src/plugins/oer/exercise/lib/exercise-plugin.coffee b/src/plugins/oer/exercise/lib/exercise-plugin.coffee index cc24c61b6e..35197ed553 100644 --- a/src/plugins/oer/exercise/lib/exercise-plugin.coffee +++ b/src/plugins/oer/exercise/lib/exercise-plugin.coffee @@ -41,7 +41,7 @@ define [ Plugin.create('exercise', { init: () -> - semanticBlock.activateHandler('exercise', (element) -> + semanticBlock.activateHandler('.exercise', (element) -> type = element.attr('data-type') or 'exercise' @@ -73,7 +73,7 @@ define [ if not solutions.length element.children('.solution-controls').children('.solution-toggle').hide() ) - semanticBlock.deactivateHandler('exercise', (element) -> + semanticBlock.deactivateHandler('.exercise', (element) -> problem = element.children('.problem') solutions = element.children('.solutions').children() @@ -88,7 +88,7 @@ define [ element.append(solutions) ) - semanticBlock.activateHandler('solution', (element) -> + semanticBlock.activateHandler('.solution', (element) -> type = element.attr('data-type') or 'solution' body = element.children() @@ -104,7 +104,7 @@ define [ .appendTo(element) .aloha() ) - semanticBlock.deactivateHandler('solution', (element) -> + semanticBlock.deactivateHandler('.solution', (element) -> content = element.children('.body').html() element.children().remove() diff --git a/src/plugins/oer/exercise/lib/exercise-plugin.js b/src/plugins/oer/exercise/lib/exercise-plugin.js index 725b5d1bba..b5b44fef33 100644 --- a/src/plugins/oer/exercise/lib/exercise-plugin.js +++ b/src/plugins/oer/exercise/lib/exercise-plugin.js @@ -9,7 +9,7 @@ SOLUTION_TYPE_CONTAINER = '
    \n \n \n
    '; return Plugin.create('exercise', { init: function() { - semanticBlock.activateHandler('exercise', function(element) { + semanticBlock.activateHandler('.exercise', function(element) { var problem, solutions, type, typeContainer; type = element.attr('data-type') || 'exercise'; problem = element.children('.problem'); @@ -25,7 +25,7 @@ return element.children('.solution-controls').children('.solution-toggle').hide(); } }); - semanticBlock.deactivateHandler('exercise', function(element) { + semanticBlock.deactivateHandler('.exercise', function(element) { var problem, solutions; problem = element.children('.problem'); solutions = element.children('.solutions').children(); @@ -36,7 +36,7 @@ jQuery("
    ").addClass('problem').html(jQuery('

    ').append(problem.html())).appendTo(element); return element.append(solutions); }); - semanticBlock.activateHandler('solution', function(element) { + semanticBlock.activateHandler('.solution', function(element) { var body, type, typeContainer; type = element.attr('data-type') || 'solution'; body = element.children(); @@ -46,7 +46,7 @@ typeContainer.prependTo(element); return jQuery('

    ').addClass('body').append(body).appendTo(element).aloha(); }); - semanticBlock.deactivateHandler('solution', function(element) { + semanticBlock.deactivateHandler('.solution', function(element) { var content; content = element.children('.body').html(); element.children().remove(); From 55d6725978ac873cfe27142a0e108ceb0c222a00 Mon Sep 17 00:00:00 2001 From: Tom Date: Sat, 8 Jun 2013 10:50:21 -0400 Subject: [PATCH 09/12] add note type if it doesn't exist --- src/plugins/oer/note/lib/note-plugin.coffee | 6 +++++- src/plugins/oer/note/lib/note-plugin.js | 6 +++++- 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/src/plugins/oer/note/lib/note-plugin.coffee b/src/plugins/oer/note/lib/note-plugin.coffee index b1ef6813f8..9c7168aa00 100644 --- a/src/plugins/oer/note/lib/note-plugin.coffee +++ b/src/plugins/oer/note/lib/note-plugin.coffee @@ -72,7 +72,11 @@ define [ newTemplate.append("<#{titleTagName} class='title'> - type = $element.attr('data-type') or className + + if not $element.attr('data-type') + $element.attr('data-type', className) + + type = $element.attr('data-type') $title = $element.children('.title') $title.attr('placeholder', 'Add a title (optional)') diff --git a/src/plugins/oer/note/lib/note-plugin.js b/src/plugins/oer/note/lib/note-plugin.js index 0fd3f0725f..2f41993b4a 100644 --- a/src/plugins/oer/note/lib/note-plugin.js +++ b/src/plugins/oer/note/lib/note-plugin.js @@ -1,4 +1,4 @@ -// Generated by CoffeeScript 1.3.3 +// Generated by CoffeeScript 1.5.0 (function() { define(['aloha', 'aloha/plugin', 'jquery', 'aloha/ephemera', 'ui/ui', 'ui/button', 'semanticblock/semanticblock-plugin', 'css!note/css/note-plugin.css'], function(Aloha, Plugin, jQuery, Ephemera, UI, Button, semanticBlock) { @@ -45,6 +45,10 @@ semanticBlock.activateHandler(selector, function($element) { var $body, $title, typeContainer; type = $element.attr('data-type') || className; + if (!$element.attr('data-type')) { + $element.attr('data-type', className); + } + type = $element.attr('data-type'); $title = $element.children('.title'); $title.attr('placeholder', 'Add a title (optional)'); $title.aloha(); From 02171e18bdef5757618797e97f88bb8a4fd00166 Mon Sep 17 00:00:00 2001 From: Tom Date: Thu, 20 Jun 2013 15:03:35 -0400 Subject: [PATCH 10/12] fix bug in note title handling --- src/plugins/oer/note/lib/note-plugin.coffee | 12 +++++++----- src/plugins/oer/note/lib/note-plugin.js | 14 +++++++------- 2 files changed, 14 insertions(+), 12 deletions(-) diff --git a/src/plugins/oer/note/lib/note-plugin.coffee b/src/plugins/oer/note/lib/note-plugin.coffee index 9c7168aa00..7db697fa9f 100644 --- a/src/plugins/oer/note/lib/note-plugin.coffee +++ b/src/plugins/oer/note/lib/note-plugin.coffee @@ -136,12 +136,14 @@ define [ $element.children('.body').remove() if hasTitle - $title = $element.children('.title') - if not $title[0] - $title = jQuery("<#{titleTagName}>") - $title.addClass 'title' + $titleElement = $element.children('.title') + $title = jQuery("<#{titleTagName} class=\"title\">") - $title.prependTo($element) + if $titleElement.length + $title.append($titleElement.contents()) + $titleElement.remove() + + $title.prependTo($element) $element.append($body) ) diff --git a/src/plugins/oer/note/lib/note-plugin.js b/src/plugins/oer/note/lib/note-plugin.js index 2f41993b4a..0bb414121e 100644 --- a/src/plugins/oer/note/lib/note-plugin.js +++ b/src/plugins/oer/note/lib/note-plugin.js @@ -44,7 +44,6 @@ } semanticBlock.activateHandler(selector, function($element) { var $body, $title, typeContainer; - type = $element.attr('data-type') || className; if (!$element.attr('data-type')) { $element.attr('data-type', className); } @@ -87,7 +86,7 @@ return $('
    ').addClass('body').attr('placeholder', "Type the text of your " + className + " here.").append($body).appendTo($element).aloha(); }); semanticBlock.deactivateHandler(selector, function($element) { - var $body, $title, hasTextChildren; + var $body, $title, $titleElement, hasTextChildren; $body = $element.children('.body'); hasTextChildren = $body.children().length !== $body.contents().length; $body = $body.contents(); @@ -96,12 +95,13 @@ } $element.children('.body').remove(); if (hasTitle) { - $title = $element.children('.title'); - if (!$title[0]) { - $title = jQuery("<" + titleTagName + ">"); - $title.addClass('title'); - $title.prependTo($element); + $titleElement = $element.children('.title'); + $title = jQuery("<" + titleTagName + " class=\"title\">"); + if ($titleElement.length) { + $title.append($titleElement.contents()); + $titleElement.remove(); } + $title.prependTo($element); } return $element.append($body); }); From 79abd2546279bae8f9cd802f3f71e641fb6e31bf Mon Sep 17 00:00:00 2001 From: Tom Date: Thu, 20 Jun 2013 16:00:03 -0400 Subject: [PATCH 11/12] fix type selection for notes --- .../oer/exercise/lib/exercise-plugin.coffee | 6 ++++- .../oer/exercise/lib/exercise-plugin.js | 7 +++++- src/plugins/oer/note/lib/note-plugin.coffee | 22 +++++++++---------- src/plugins/oer/note/lib/note-plugin.js | 22 +++++++++---------- .../lib/semanticblock-plugin.coffee | 7 ------ .../semanticblock/lib/semanticblock-plugin.js | 8 ------- 6 files changed, 31 insertions(+), 41 deletions(-) diff --git a/src/plugins/oer/exercise/lib/exercise-plugin.coffee b/src/plugins/oer/exercise/lib/exercise-plugin.coffee index 35197ed553..236eb7569d 100644 --- a/src/plugins/oer/exercise/lib/exercise-plugin.coffee +++ b/src/plugins/oer/exercise/lib/exercise-plugin.coffee @@ -43,7 +43,6 @@ define [ init: () -> semanticBlock.activateHandler('.exercise', (element) -> - type = element.attr('data-type') or 'exercise' problem = element.children('.problem') @@ -141,4 +140,9 @@ define [ controls.children('.add-solution').show() controls.children('.solution-toggle').hide() if exercise.children('.solutions').children().length == 1 ) + semanticBlock.registerEvent('click', '.aloha-oer-block.exercise,.aloha-oer-block.solution .type-container li a', (e) -> + e.preventDefault() + jQuery(this).parents('.type-container').first().children('.type').text jQuery(this).text() + jQuery(this).parents('.aloha-oer-block').first().attr 'data-type', jQuery(this).text().toLowerCase() + ) }) diff --git a/src/plugins/oer/exercise/lib/exercise-plugin.js b/src/plugins/oer/exercise/lib/exercise-plugin.js index b5b44fef33..d7c4569e79 100644 --- a/src/plugins/oer/exercise/lib/exercise-plugin.js +++ b/src/plugins/oer/exercise/lib/exercise-plugin.js @@ -77,7 +77,7 @@ } }); }); - return semanticBlock.registerEvent('click', '.exercise .semantic-delete', function() { + semanticBlock.registerEvent('click', '.exercise .semantic-delete', function() { var controls, exercise; exercise = $(this).parents('.exercise').first(); controls = exercise.children('.solution-controls'); @@ -86,6 +86,11 @@ return controls.children('.solution-toggle').hide(); } }); + return semanticBlock.registerEvent('click', '.aloha-oer-block.exercise,.aloha-oer-block.solution .type-container li a', function(e) { + e.preventDefault(); + jQuery(this).parents('.type-container').first().children('.type').text(jQuery(this).text()); + return jQuery(this).parents('.aloha-oer-block').first().attr('data-type', jQuery(this).text().toLowerCase()); + }); } }); }); diff --git a/src/plugins/oer/note/lib/note-plugin.coffee b/src/plugins/oer/note/lib/note-plugin.coffee index 7db697fa9f..a7ebd1e587 100644 --- a/src/plugins/oer/note/lib/note-plugin.coffee +++ b/src/plugins/oer/note/lib/note-plugin.coffee @@ -72,11 +72,8 @@ define [ newTemplate.append("<#{titleTagName} class='title'> - - if not $element.attr('data-type') - $element.attr('data-type', className) - type = $element.attr('data-type') + type = $element.attr('data-type') || className $title = $element.children('.title') $title.attr('placeholder', 'Add a title (optional)') @@ -86,17 +83,18 @@ define [ typeContainer = TYPE_CONTAINER.clone() # Add dropdown elements for each possible type - jQuery.each @settings, (i, foo) => + jQuery.each @settings, (i, dropType) => $option = jQuery('
    • ') $option.appendTo(typeContainer.find('.dropdown-menu')) $option = $option.children('a') - $option.text(foo.label) - $option.on 'click', => + $option.text(dropType.label) + $option.on 'click', (e) => + e.preventDefault() # Remove the title if this type does not have one - if foo.hasTitle + if dropType.hasTitle # If there is no `.title` element then add one in and enable it as an Aloha block if not $element.children('.title')[0] - $newTitle = jQuery("<#{foo.titleTagName or 'span'} class='title'>'); $option.appendTo(typeContainer.find('.dropdown-menu')); $option = $option.children('a'); - $option.text(foo.label); - return $option.on('click', function() { + $option.text(dropType.label); + return $option.on('click', function(e) { var $newTitle, key; - if (foo.hasTitle) { + e.preventDefault(); + if (dropType.hasTitle) { if (!$element.children('.title')[0]) { - $newTitle = jQuery("<" + (foo.titleTagName || 'span') + " class='title'> jQuery(this).removeClass('focused') - , - name: 'click' - selector: '.aloha-oer-block .type-container li a' - callback: (e) -> - e.preventDefault() - jQuery(this).parents('.type-container').first().children('.type').text jQuery(this).text() - jQuery(this).parents('.aloha-oer-block').first().attr 'data-type', jQuery(this).text().toLowerCase() , # Toggle a class on elements so if they are empty and have placeholder text # the text shows up. diff --git a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js index c19fce82ef..15de256e19 100644 --- a/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js +++ b/src/plugins/oer/semanticblock/lib/semanticblock-plugin.js @@ -63,14 +63,6 @@ callback: function() { return jQuery(this).removeClass('focused'); } - }, { - name: 'click', - selector: '.aloha-oer-block .type-container li a', - callback: function(e) { - e.preventDefault(); - jQuery(this).parents('.type-container').first().children('.type').text(jQuery(this).text()); - return jQuery(this).parents('.aloha-oer-block').first().attr('data-type', jQuery(this).text().toLowerCase()); - } }, { name: 'blur', selector: '[placeholder]', From a81f1ce43d78d7f41e17c2aa5b075fe29784567d Mon Sep 17 00:00:00 2001 From: Tom Date: Fri, 21 Jun 2013 12:44:41 -0400 Subject: [PATCH 12/12] remove unused variable in note plugin --- src/plugins/oer/note/lib/note-plugin.coffee | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/plugins/oer/note/lib/note-plugin.coffee b/src/plugins/oer/note/lib/note-plugin.coffee index a7ebd1e587..4194b8d96f 100644 --- a/src/plugins/oer/note/lib/note-plugin.coffee +++ b/src/plugins/oer/note/lib/note-plugin.coffee @@ -72,8 +72,6 @@ define [ newTemplate.append("<#{titleTagName} class='title'> - - type = $element.attr('data-type') || className $title = $element.children('.title') $title.attr('placeholder', 'Add a title (optional)')