Skip to content

X
xblock-drag-and-drop-v2
Commit d40f0e55 by Filippo Valsorda
Options

Remove dependency on underscore for logic and refactor

parent dae644a9
Showing with 22 additions and 32 deletions
drag_and_drop_v2/public/js/drag_and_drop.js
...@@ -3,8 +3,6 @@ function DragAndDropBlock(runtime, element) { ...@@ -3,8 +3,6 @@ function DragAndDropBlock(runtime, element) {
var _fn = { var _fn = {
// DOM Elements // DOM Elements
$block: $('.xblock--drag-and-drop', element),
$app: $('.xblock--drag-and-drop .drag-container', element),
$ul: $('.xblock--drag-and-drop .items', element), $ul: $('.xblock--drag-and-drop .items', element),
$target: $('.xblock--drag-and-drop .target-img', element), $target: $('.xblock--drag-and-drop .target-img', element),
$feedback: $('.xblock--drag-and-drop .feedback .message', element), $feedback: $('.xblock--drag-and-drop .feedback .message', element),
...@@ -196,7 +194,7 @@ function DragAndDropBlock(runtime, element) { ...@@ -196,7 +194,7 @@ function DragAndDropBlock(runtime, element) {
tpl = _fn.tpl.item(), tpl = _fn.tpl.item(),
img_tpl = _fn.tpl.image_item(); img_tpl = _fn.tpl.image_item();
_.each(items, function(item) { items.forEach(function(item) {
if (item.backgroundImage.length > 0) { if (item.backgroundImage.length > 0) {
list.push(_.template(img_tpl, item)); list.push(_.template(img_tpl, item));
} else { } else {
...@@ -232,10 +230,6 @@ function DragAndDropBlock(runtime, element) { ...@@ -232,10 +230,6 @@ function DragAndDropBlock(runtime, element) {
} }
}, },
test: {
completed: 0
},
feedback: { feedback: {
// Update DOM with feedback // Update DOM with feedback
set: function(str) { set: function(str) {
...@@ -246,16 +240,16 @@ function DragAndDropBlock(runtime, element) { ...@@ -246,16 +240,16 @@ function DragAndDropBlock(runtime, element) {
popup: function(str, boo) { popup: function(str, boo) {
if (str === undefined || str === '') return; if (str === undefined || str === '') return;
return $("<div>").attr('title', boo ? 'Correct' : 'Incorrect') return $("<div>").attr('title', boo ? 'Correct' : 'Incorrect')
.text(str) .text(str)
.dialog({ .dialog({
dialogClass: "no-close", dialogClass: "no-close",
modal: true, modal: true,
buttons: { buttons: {
Ok: function() { Ok: function() {
$(this).dialog("close"); $(this).dialog("close");
} }
} }
}); });
} }
}, },
......
drag_and_drop_v2/public/js/drag_and_drop_edit.js
...@@ -158,6 +158,12 @@ function DragAndDropEditBlock(runtime, element) { ...@@ -158,6 +158,12 @@ function DragAndDropEditBlock(runtime, element) {
dropdown: '', dropdown: '',
list: [], list: [],
obj: [], obj: [],
getObjByIndex: function(num) {
for (var i = 0; i < _fn.build.form.zone.obj.length; i++) {
if (_fn.build.form.zone.obj[i].index == num)
return _fn.build.form.zone.obj[i];
}
},
add: function(e) { add: function(e) {
var inputTemplate = _fn.tpl.zoneInput(), var inputTemplate = _fn.tpl.zoneInput(),
zoneTemplate = _fn.tpl.zoneElement(), zoneTemplate = _fn.tpl.zoneElement(),
...@@ -252,9 +258,7 @@ function DragAndDropEditBlock(runtime, element) { ...@@ -252,9 +258,7 @@ function DragAndDropEditBlock(runtime, element) {
// Listen to form changes and update zone div position // Listen to form changes and update zone div position
$form.on('keyup', '.title', function(e) { $form.on('keyup', '.title', function(e) {
var text = $(e.currentTarget).val(), var text = $(e.currentTarget).val(),
record = _.findWhere(_fn.build.form.zone.obj, { record = _fn.build.form.zone.getObjByIndex(num);
index: num
});
$div.find('p').html(text); $div.find('p').html(text);
record.title = text; record.title = text;
...@@ -264,33 +268,25 @@ function DragAndDropEditBlock(runtime, element) { ...@@ -264,33 +268,25 @@ function DragAndDropEditBlock(runtime, element) {
} }
}).on('keyup', '.width', function(e) { }).on('keyup', '.width', function(e) {
var width = $(e.currentTarget).val(), var width = $(e.currentTarget).val(),
record = _.findWhere(_fn.build.form.zone.obj, { record = _fn.build.form.zone.getObjByIndex(num);
index: num
});
$div.css('width', width + 'px'); $div.css('width', width + 'px');
record.width = width; record.width = width;
}).on('keyup', '.height', function(e) { }).on('keyup', '.height', function(e) {
var height = $(e.currentTarget).val(), var height = $(e.currentTarget).val(),
record = _.findWhere(_fn.build.form.zone.obj, { record = _fn.build.form.zone.getObjByIndex(num);
index: num
});
$div.css('height', height + 'px'); $div.css('height', height + 'px');
record.height = height; record.height = height;
}).on('keyup', '.x', function(e) { }).on('keyup', '.x', function(e) {
var x = $(e.currentTarget).val(), var x = $(e.currentTarget).val(),
record = _.findWhere(_fn.build.form.zone.obj, { record = _fn.build.form.zone.getObjByIndex(num);
index: num
});
$div.css('left', x + 'px'); $div.css('left', x + 'px');
record.x = x; record.x = x;
}).on('keyup', '.y', function(e) { }).on('keyup', '.y', function(e) {
var y = $(e.currentTarget).val(), var y = $(e.currentTarget).val(),
record = _.findWhere(_fn.build.form.zone.obj, { record = _fn.build.form.zone.getObjByIndex(num);
index: num
});
$div.css('top', y + 'px'); $div.css('top', y + 'px');
record.y = y; record.y = y;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment