update note editor

This commit is contained in:
Mariela Michalek 2014-04-01 07:24:58 -03:00
parent a11d50909d
commit 07143af04d

View File

@ -17,10 +17,11 @@
*/ */
mindplot.widget.NoteEditor = new Class({ mindplot.widget.NoteEditor = new Class({
// Extends:MooDialog, Extends:BootstrapDialog,
initialize:function (model) { initialize:function (model) {
console.log("Re-impl required ...."); console.log("Re-impl required ....");
$assert(model, "model can not be null"); $assert(model, "model can not be null");
this.parent();
var panel = this._buildPanel(model); var panel = this._buildPanel(model);
// this.parent({ // this.parent({
// closeButton:true, // closeButton:true,
@ -61,79 +62,114 @@ mindplot.widget.NoteEditor = new Class({
// } // }
// }); // });
// this.setContent(panel); // this.setContent(panel);
this.appendToContent(panel);
}, },
_buildPanel:function (model) { _buildPanel:function (model) {
var result = new Element('div'); var result = $('<div></div>').css("padding-top", "5px");
var form = new Element('form', {'action':'none', 'id':'noteFormId'}); var form = $('<form></form>').attr('action','none').attr('id','noteFormId');
// Add textarea ... // Add textarea
var textArea = new Element('textarea',
{placeholder:$msg('WRITE_YOUR_TEXT_HERE'), var textArea = $('<textarea></textarea>').attr(
required:true, 'placeholder',$msg('WRITE_YOUR_TEXT_HERE')).attr(
autofocus:'autofocus' 'required','true').attr(
}); 'autofocus','autofocus');
if (model.getValue() != null) textArea.css( 'width','100%').css('height',80).css('resize','none');
form.append(textArea);
// var textArea = new Element('textarea',
// {placeholder:$msg('WRITE_YOUR_TEXT_HERE'),
// required:true,
// autofocus:'autofocus'
// });
// textArea.setStyles({
// 'width':'100%',
// 'height':80, resize:'none'
// });
if (model.getValue() != null){
textArea.value = model.getValue(); textArea.value = model.getValue();
}
textArea.setStyles({ // Register submit event
'width':'100%',
'height':80, resize:'none'
});
textArea.inject(form);
// Register submit event ... form.submit(function (event) {
form.addEvent('submit', function (event) {
event.preventDefault(); event.preventDefault();
event.stopPropagation(); event.stopPropagation();
if (textArea.value) { if (textArea.value) {
model.setValue(textArea.value); model.setValue(textArea.value);
} }
this.close(); this.close();
}.bind(this)); }.bind(this));
// form.addEvent('submit', function (event) {
// event.preventDefault();
// event.stopPropagation();
// if (textArea.value) {
// model.setValue(textArea.value);
// }
// this.close();
// }.bind(this));
// Add buttons ... // Add buttons ...
var buttonContainer = new Element('div').setStyles({paddingTop:5, textAlign:'right'}); var buttonContainer = $('<div></div>');
buttonContainer.css('paddingTop','5').css('textAlign','center');
// var buttonContainer = new Element('div').setStyles({paddingTop:5, textAlign:'right'});
// Create accept button ... // Create accept button ...
var okButton = new Element('input', {type:'submit', value:$msg('ACCEPT'), 'class':'btn-primary'}); var okButton = $('<input>');
okButton.addClass('button'); okButton.attr('type','submit').attr(
okButton.inject(buttonContainer); 'value',$msg('ACCEPT')).attr(
'class','btn-primary');
buttonContainer.append(okButton);
// var okButton = new Element('input', {type:'submit', value:$msg('ACCEPT'), 'class':'btn-primary'});
// okButton.addClass('button');
// okButton.inject(buttonContainer);
// Create remove button ... // Create remove button ...
if ($defined(model.getValue())) { // if ($defined(model.getValue())) {
var rmButton = new Element('input', {type:'button', value:$msg('REMOVE'), 'class':'btn-primary'}); // var rmButton = new Element('input', {type:'button', value:$msg('REMOVE'), 'class':'btn-primary'});
rmButton.setStyle('margin', '5px'); // rmButton.setStyle('margin', '5px');
rmButton.addClass('button'); // rmButton.addClass('button');
rmButton.inject(buttonContainer); // rmButton.inject(buttonContainer);
rmButton.addEvent('click', function () { // rmButton.addEvent('click', function () {
model.setValue(null); // model.setValue(null);
this.close(); // this.close();
}.bind(this)); // }.bind(this));
buttonContainer.inject(form); // buttonContainer.inject(form);
} // }
// Create cancel button ... // Create cancel button ...
var cButton = new Element('input', {type:'button', value:$msg('CANCEL'), 'class':'btn-secondary'}); var cancelButton = $('<input>');
cButton.setStyle('margin', '5px'); cancelButton.attr('id','cancel').attr('type','button').attr(
cButton.addClass('button'); 'value',$msg('CANCEL')).attr(
cButton.inject(buttonContainer); 'class','btn-secondary');
cButton.addEvent('click', function () { cancelButton.css('margin','5px');
this.close(); cancelButton.click(function () {this.close();});
}.bind(this)); buttonContainer.append(cancelButton);
buttonContainer.inject(form);
result.addEvent('keydown', function (event) { form.append(buttonContainer);
event.stopPropagation();
});
form.inject(result); // var cButton = new Element('input', {type:'button', value:$msg('CANCEL'), 'class':'btn-secondary'});
// cButton.setStyle('margin', '5px');
// cButton.addClass('button');
// cButton.inject(buttonContainer);
// cButton.addEvent('click', function () {
// this.close();
// }.bind(this));
// buttonContainer.inject(form);
// result.addEvent('keydown', function (event) {
// event.stopPropagation();
// });
result.append(form);
return result; return result;
}, },
show:function () { show:function () {
this.open(); this.parent("Note");
} }
}); });