mirror of
https://github.com/Alfresco/alfresco-community-repo.git
synced 2025-08-14 17:58:59 +00:00
New build scripts
git-svn-id: https://svn.alfresco.com/repos/alfresco-enterprise/alfresco/HEAD/root@5282 c4b6b30b-aa2e-2d43-bbcb-ca4b014f7261
This commit is contained in:
Gavin Cornwell
250
source/web/scripts/ajax/dojo/src/widget/InlineEditBox.js
Normal file
250
source/web/scripts/ajax/dojo/src/widget/InlineEditBox.js
Normal file
@@ -0,0 +1,250 @@
|
||||
/*
|
||||
Copyright (c) 2004-2006, The Dojo Foundation
|
||||
All Rights Reserved.
|
||||
|
||||
Licensed under the Academic Free License version 2.1 or above OR the
|
||||
modified BSD license. For more information on Dojo licensing, see:
|
||||
|
||||
http://dojotoolkit.org/community/licensing.shtml
|
||||
*/
|
||||
|
||||
dojo.provide("dojo.widget.InlineEditBox");
|
||||
|
||||
dojo.require("dojo.widget.*");
|
||||
dojo.require("dojo.event.*");
|
||||
dojo.require("dojo.lfx.*");
|
||||
dojo.require("dojo.gfx.color");
|
||||
dojo.require("dojo.string");
|
||||
dojo.require("dojo.html.*");
|
||||
dojo.require("dojo.html.layout");
|
||||
|
||||
dojo.widget.defineWidget(
|
||||
"dojo.widget.InlineEditBox",
|
||||
dojo.widget.HtmlWidget,
|
||||
function(){
|
||||
// summary
|
||||
// Given node is displayed as-is (for example, an <h1 dojoType="InlineEditBox">
|
||||
// is displayed as an <h1>, but when you click on it, it turns into an
|
||||
// <input> or <textarea>, and the user can edit the value.
|
||||
|
||||
// mutable objects need to be in constructor to give each instance its own copy
|
||||
this.history = [];
|
||||
},
|
||||
{
|
||||
templatePath: dojo.uri.dojoUri("src/widget/templates/InlineEditBox.html"),
|
||||
templateCssPath: dojo.uri.dojoUri("src/widget/templates/InlineEditBox.css"),
|
||||
|
||||
// mode: String
|
||||
// "text" is the default, and means that the node will convert it into a (single-line) <input>
|
||||
// when you click on it;
|
||||
// "textarea" means that the node will be converted into a multi-line <textarea> for editing.
|
||||
mode: "text",
|
||||
|
||||
// name: String
|
||||
// This is passed as the third argument to onSave().
|
||||
name: "",
|
||||
|
||||
// minWidth: Integer
|
||||
// Pixel minimum width of edit box
|
||||
minWidth: 100,
|
||||
|
||||
// minHeight: Integer
|
||||
// Pixel minimum height of edit box, if it's a <textarea>
|
||||
minHeight: 200,
|
||||
|
||||
// editing: Boolean
|
||||
// Is the node currently in edit mode?
|
||||
editing: false,
|
||||
|
||||
// value: String
|
||||
// The text string displayed or edited.
|
||||
// Initial value can also be specified inline, like
|
||||
// <h1 dojoType="InlineEditBox">Hello world</h1>
|
||||
value: "",
|
||||
|
||||
// deprecated
|
||||
textValue: "",
|
||||
defaultText: "",
|
||||
|
||||
postMixInProperties: function(){
|
||||
if(this.textValue){
|
||||
dojo.deprecated("InlineEditBox: Use value parameter instead of textValue; will be removed in 0.5");
|
||||
this.value=this.textValue;
|
||||
}
|
||||
if(this.defaultText){
|
||||
dojo.deprecated("InlineEditBox: Use value parameter instead of defaultText; will be removed in 0.5");
|
||||
this.value=this.defaultText;
|
||||
}
|
||||
},
|
||||
|
||||
onSave: function(newValue, oldValue, name){
|
||||
// summary: Callback for when value is changed.
|
||||
},
|
||||
onUndo: function(value){
|
||||
// summary: Callback for when editing is aborted (value reverts to pre-edit value).
|
||||
},
|
||||
|
||||
postCreate: function(args, frag){
|
||||
// put original node back in the document, and attach handlers
|
||||
// which hide it and display the editor
|
||||
// TODO: this has a number of issues including breaking programatic creation
|
||||
this.editable = this.getFragNodeRef(frag);
|
||||
dojo.html.insertAfter(this.editable, this.form);
|
||||
dojo.event.connect(this.editable, "onmouseover", this, "onMouseOver");
|
||||
dojo.event.connect(this.editable, "onmouseout", this, "onMouseOut");
|
||||
dojo.event.connect(this.editable, "onclick", this, "_beginEdit");
|
||||
|
||||
// get value and display it
|
||||
if(this.value){
|
||||
this.editable.innerHTML = this.value;
|
||||
return;
|
||||
} else {
|
||||
this.value = dojo.string.trim(this.editable.innerHTML);
|
||||
this.editable.innerHTML = this.value;
|
||||
}
|
||||
},
|
||||
|
||||
onMouseOver: function(){
|
||||
if(!this.editing){
|
||||
if (this.disabled){
|
||||
dojo.html.addClass(this.editable, "editableRegionDisabled");
|
||||
} else {
|
||||
dojo.html.addClass(this.editable, "editableRegion");
|
||||
if(this.mode == "textarea"){
|
||||
dojo.html.addClass(this.editable, "editableTextareaRegion");
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
onMouseOut: function(){
|
||||
if(!this.editing){
|
||||
dojo.html.removeClass(this.editable, "editableRegion");
|
||||
dojo.html.removeClass(this.editable, "editableTextareaRegion");
|
||||
dojo.html.removeClass(this.editable, "editableRegionDisabled");
|
||||
}
|
||||
},
|
||||
|
||||
_beginEdit: function(e){
|
||||
// summary
|
||||
// When user clicks the text, then start editing.
|
||||
// Hide the text and display the form instead.
|
||||
|
||||
if(this.editing || this.disabled){ return; }
|
||||
this.onMouseOut();
|
||||
this.editing = true;
|
||||
|
||||
// setup the form's <input> or <textarea> field, as specified by mode
|
||||
var ee = this[this.mode.toLowerCase()];
|
||||
ee.value = dojo.string.trim(this.value);
|
||||
ee.style.fontSize = dojo.html.getStyle(this.editable, "font-size");
|
||||
ee.style.fontWeight = dojo.html.getStyle(this.editable, "font-weight");
|
||||
ee.style.fontStyle = dojo.html.getStyle(this.editable, "font-style");
|
||||
var bb = dojo.html.getBorderBox(this.editable);
|
||||
ee.style.width = Math.max(bb.width, this.minWidth) + "px";
|
||||
if(this.mode.toLowerCase()=="textarea"){
|
||||
ee.style.display = "block";
|
||||
ee.style.height = Math.max(bb.height, this.minHeight) + "px";
|
||||
} else {
|
||||
ee.style.display = "";
|
||||
}
|
||||
|
||||
// show the edit form and hide the read only version of the text
|
||||
this.form.style.display = "";
|
||||
this.editable.style.display = "none";
|
||||
|
||||
ee.focus();
|
||||
ee.select();
|
||||
this.submitButton.disabled = true;
|
||||
},
|
||||
|
||||
saveEdit: function(e){
|
||||
// summary: Callback when user presses "Save" button
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
var ee = this[this.mode.toLowerCase()];
|
||||
if((this.value != ee.value)&&
|
||||
(dojo.string.trim(ee.value) != "")){
|
||||
this.doFade = true;
|
||||
this.history.push(this.value);
|
||||
this.onSave(ee.value, this.value, this.name);
|
||||
this.value = ee.value;
|
||||
this.editable.innerHTML = "";
|
||||
var textNode = document.createTextNode( this.value );
|
||||
this.editable.appendChild( textNode );
|
||||
}else{
|
||||
this.doFade = false;
|
||||
}
|
||||
this._finishEdit(e);
|
||||
},
|
||||
|
||||
cancelEdit: function(e){
|
||||
// summary: Callback when user presses "Cancel" button
|
||||
if(!this.editing){ return false; }
|
||||
this.editing = false;
|
||||
this.form.style.display="none";
|
||||
this.editable.style.display = "";
|
||||
return true;
|
||||
},
|
||||
|
||||
_finishEdit: function(e){
|
||||
if(!this.cancelEdit(e)){ return; }
|
||||
if(this.doFade) {
|
||||
dojo.lfx.highlight(this.editable, dojo.gfx.color.hex2rgb("#ffc"), 700).play(300);
|
||||
}
|
||||
this.doFade = false;
|
||||
},
|
||||
|
||||
setText: function(txt){
|
||||
dojo.deprecated("setText() is deprecated, call setValue() instead, will be removed in 0.5");
|
||||
this.setValue(txt);
|
||||
},
|
||||
|
||||
setValue: function(/*String*/ txt){
|
||||
// sets the text without informing the server
|
||||
txt = "" + txt;
|
||||
var tt = dojo.string.trim(txt);
|
||||
this.value = tt
|
||||
this.editable.innerHTML = tt;
|
||||
},
|
||||
|
||||
undo: function(){
|
||||
// summary: Revert to previous value in history list.
|
||||
if(this.history.length > 0){
|
||||
var curValue = this.value;
|
||||
var value = this.history.pop();
|
||||
this.editable.innerHTML = value;
|
||||
this.value = value;
|
||||
this.onUndo(value);
|
||||
this.onSave(value, curValue, this.name);
|
||||
}
|
||||
},
|
||||
|
||||
checkForValueChange: function(){
|
||||
// summary
|
||||
// Callback when user changes input value.
|
||||
// Enable save button if the text value is different than the original value.
|
||||
var ee = this[this.mode.toLowerCase()];
|
||||
if((this.value != ee.value)&&
|
||||
(dojo.string.trim(ee.value) != "")){
|
||||
this.submitButton.disabled = false;
|
||||
}
|
||||
},
|
||||
|
||||
disable: function(){
|
||||
this.submitButton.disabled = true;
|
||||
this.cancelButton.disabled = true;
|
||||
var ee = this[this.mode.toLowerCase()];
|
||||
ee.disabled = true;
|
||||
dojo.widget.InlineEditBox.superclass.disable.apply(this, arguments);
|
||||
},
|
||||
|
||||
enable: function(){
|
||||
this.checkForValueChange();
|
||||
this.cancelButton.disabled = false;
|
||||
var ee = this[this.mode.toLowerCase()];
|
||||
ee.disabled = false;
|
||||
|
||||
dojo.widget.InlineEditBox.superclass.enable.apply(this, arguments);
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user