Subversion Repositories Applications.papyrus

Rev

Rev 1318 | Only display areas with differences | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 1318 Rev 1422
1 
/*
 1 
/*
2 
	Copyright (c) 2004-2006, The Dojo Foundation
 2 
	Copyright (c) 2004-2006, The Dojo Foundation
3 
	All Rights Reserved.
 3 
	All Rights Reserved.
4 
 
 4 
 
5 
	Licensed under the Academic Free License version 2.1 or above OR the
 5 
	Licensed under the Academic Free License version 2.1 or above OR the
6 
	modified BSD license. For more information on Dojo licensing, see:
 6 
	modified BSD license. For more information on Dojo licensing, see:
7 
 
 7 
 
8 
		http://dojotoolkit.org/community/licensing.shtml
 8 
		http://dojotoolkit.org/community/licensing.shtml
9 
*/
 9 
*/
- 
 
 10 
 
- 
 
 11 
 
10 
 
 12 
 
11 
dojo.provide("dojo.widget.InlineEditBox");
 13 
dojo.provide("dojo.widget.InlineEditBox");
12 
dojo.require("dojo.widget.*");
 14 
dojo.require("dojo.widget.*");
13 
dojo.require("dojo.event.*");
 15 
dojo.require("dojo.event.*");
14 
dojo.require("dojo.lfx.*");
 16 
dojo.require("dojo.lfx.*");
15 
dojo.require("dojo.gfx.color");
 17 
dojo.require("dojo.gfx.color");
16 
dojo.require("dojo.string");
 18 
dojo.require("dojo.string");
17 
dojo.require("dojo.html.*");
 19 
dojo.require("dojo.html.*");
18 
dojo.require("dojo.html.layout");
 20 
dojo.require("dojo.html.layout");
19 
dojo.widget.defineWidget("dojo.widget.InlineEditBox", dojo.widget.HtmlWidget, function () {
 21 
dojo.widget.defineWidget("dojo.widget.InlineEditBox", dojo.widget.HtmlWidget, function () {
20 
	this.history = [];
 22 
	this.history = [];
21 
}, {templateString:"<form class=\"inlineEditBox\" style=\"display: none\" dojoAttachPoint=\"form\" dojoAttachEvent=\"onSubmit:saveEdit; onReset:cancelEdit; onKeyUp: checkForValueChange;\">\n\t<input type=\"text\" dojoAttachPoint=\"text\" style=\"display: none;\" />\n\t<textarea dojoAttachPoint=\"textarea\" style=\"display: none;\"></textarea>\n\t<input type=\"submit\" value=\"Save\" dojoAttachPoint=\"submitButton\" />\n\t<input type=\"reset\" value=\"Cancel\" dojoAttachPoint=\"cancelButton\" />\n</form>\n", templateCssString:".editLabel {\n\tfont-size : small;\n\tpadding : 0 5px;\n\tdisplay : none;\n}\n\n.editableRegionDisabled {\n\tcursor : pointer;\n\t_cursor : hand;\n}\n\n.editableRegion {\n\tbackground-color : #ffc !important;\n\tcursor : pointer;\n\t_cursor : hand;\n}\n\n.editableRegion .editLabel {\n\tdisplay : inline;\n}\n\n.editableTextareaRegion .editLabel {\n\tdisplay : block;\n}\n\n.inlineEditBox {\n\t/*background-color : #ffc;*/\n\tdisplay : inline;\n}\n", templateCssPath:dojo.uri.moduleUri("dojo.widget", "templates/InlineEditBox.css"), mode:"text", name:"", minWidth:100, minHeight:200, editing:false, value:"", textValue:"", defaultText:"", postMixInProperties:function () {
 23 
}, {templateString:"<form class=\"inlineEditBox\" style=\"display: none\" dojoAttachPoint=\"form\" dojoAttachEvent=\"onSubmit:saveEdit; onReset:cancelEdit; onKeyUp: checkForValueChange;\">\n\t<input type=\"text\" dojoAttachPoint=\"text\" style=\"display: none;\" />\n\t<textarea dojoAttachPoint=\"textarea\" style=\"display: none;\"></textarea>\n\t<input type=\"submit\" value=\"Save\" dojoAttachPoint=\"submitButton\" />\n\t<input type=\"reset\" value=\"Cancel\" dojoAttachPoint=\"cancelButton\" />\n</form>\n", templateCssString:".editLabel {\n\tfont-size : small;\n\tpadding : 0 5px;\n\tdisplay : none;\n}\n\n.editableRegionDisabled {\n\tcursor : pointer;\n\t_cursor : hand;\n}\n\n.editableRegion {\n\tbackground-color : #ffc !important;\n\tcursor : pointer;\n\t_cursor : hand;\n}\n\n.editableRegion .editLabel {\n\tdisplay : inline;\n}\n\n.editableTextareaRegion .editLabel {\n\tdisplay : block;\n}\n\n.inlineEditBox {\n\t/*background-color : #ffc;*/\n\tdisplay : inline;\n}\n", templateCssPath:dojo.uri.moduleUri("dojo.widget", "templates/InlineEditBox.css"), mode:"text", name:"", minWidth:100, minHeight:200, editing:false, value:"", textValue:"", defaultText:"", postMixInProperties:function () {
22 
	if (this.textValue) {
 24 
	if (this.textValue) {
23 
		dojo.deprecated("InlineEditBox: Use value parameter instead of textValue; will be removed in 0.5");
 25 
		dojo.deprecated("InlineEditBox: Use value parameter instead of textValue; will be removed in 0.5");
24 
		this.value = this.textValue;
 26 
		this.value = this.textValue;
25 
	}
 27 
	}
26 
	if (this.defaultText) {
 28 
	if (this.defaultText) {
27 
		dojo.deprecated("InlineEditBox: Use value parameter instead of defaultText; will be removed in 0.5");
 29 
		dojo.deprecated("InlineEditBox: Use value parameter instead of defaultText; will be removed in 0.5");
28 
		this.value = this.defaultText;
 30 
		this.value = this.defaultText;
29 
	}
 31 
	}
30 
}, postCreate:function (args, frag) {
 32 
}, postCreate:function (args, frag) {
31 
	this.editable = this.getFragNodeRef(frag);
 33 
	this.editable = this.getFragNodeRef(frag);
32 
	dojo.html.insertAfter(this.editable, this.form);
 34 
	dojo.html.insertAfter(this.editable, this.form);
33 
	dojo.event.connect(this.editable, "onmouseover", this, "onMouseOver");
 35 
	dojo.event.connect(this.editable, "onmouseover", this, "onMouseOver");
34 
	dojo.event.connect(this.editable, "onmouseout", this, "onMouseOut");
 36 
	dojo.event.connect(this.editable, "onmouseout", this, "onMouseOut");
35 
	dojo.event.connect(this.editable, "onclick", this, "_beginEdit");
 37 
	dojo.event.connect(this.editable, "onclick", this, "_beginEdit");
36 
	if (this.value) {
 38 
	if (this.value) {
37 
		this.editable.innerHTML = this.value;
 39 
		this.editable.innerHTML = this.value;
38 
		return;
 40 
		return;
39 
	} else {
 41 
	} else {
40 
		this.value = dojo.string.trim(this.editable.innerHTML);
 42 
		this.value = dojo.string.trim(this.editable.innerHTML);
41 
		this.editable.innerHTML = this.value;
 43 
		this.editable.innerHTML = this.value;
42 
	}
 44 
	}
43 
}, onMouseOver:function () {
 45 
}, onMouseOver:function () {
44 
	if (!this.editing) {
 46 
	if (!this.editing) {
45 
		if (this.disabled) {
 47 
		if (this.disabled) {
46 
			dojo.html.addClass(this.editable, "editableRegionDisabled");
 48 
			dojo.html.addClass(this.editable, "editableRegionDisabled");
47 
		} else {
 49 
		} else {
48 
			dojo.html.addClass(this.editable, "editableRegion");
 50 
			dojo.html.addClass(this.editable, "editableRegion");
49 
			if (this.mode == "textarea") {
 51 
			if (this.mode == "textarea") {
50 
				dojo.html.addClass(this.editable, "editableTextareaRegion");
 52 
				dojo.html.addClass(this.editable, "editableTextareaRegion");
51 
			}
 53 
			}
52 
		}
 54 
		}
53 
	}
 55 
	}
54 
}, onMouseOut:function () {
 56 
}, onMouseOut:function () {
55 
	if (!this.editing) {
 57 
	if (!this.editing) {
56 
		dojo.html.removeClass(this.editable, "editableRegion");
 58 
		dojo.html.removeClass(this.editable, "editableRegion");
57 
		dojo.html.removeClass(this.editable, "editableTextareaRegion");
 59 
		dojo.html.removeClass(this.editable, "editableTextareaRegion");
58 
		dojo.html.removeClass(this.editable, "editableRegionDisabled");
 60 
		dojo.html.removeClass(this.editable, "editableRegionDisabled");
59 
	}
 61 
	}
60 
}, _beginEdit:function (e) {
 62 
}, _beginEdit:function (e) {
61 
	if (this.editing || this.disabled) {
 63 
	if (this.editing || this.disabled) {
62 
		return;
 64 
		return;
63 
	}
 65 
	}
64 
	this.onMouseOut();
 66 
	this.onMouseOut();
65 
	this.editing = true;
 67 
	this.editing = true;
66 
	var ee = this[this.mode.toLowerCase()];
 68 
	var ee = this[this.mode.toLowerCase()];
67 
	ee.value = dojo.string.trim(this.value);
 69 
	ee.value = dojo.string.trim(this.value);
68 
	ee.style.fontSize = dojo.html.getStyle(this.editable, "font-size");
 70 
	ee.style.fontSize = dojo.html.getStyle(this.editable, "font-size");
69 
	ee.style.fontWeight = dojo.html.getStyle(this.editable, "font-weight");
 71 
	ee.style.fontWeight = dojo.html.getStyle(this.editable, "font-weight");
70 
	ee.style.fontStyle = dojo.html.getStyle(this.editable, "font-style");
 72 
	ee.style.fontStyle = dojo.html.getStyle(this.editable, "font-style");
71 
	var bb = dojo.html.getBorderBox(this.editable);
 73 
	var bb = dojo.html.getBorderBox(this.editable);
72 
	ee.style.width = Math.max(bb.width, this.minWidth) + "px";
 74 
	ee.style.width = Math.max(bb.width, this.minWidth) + "px";
73 
	if (this.mode.toLowerCase() == "textarea") {
 75 
	if (this.mode.toLowerCase() == "textarea") {
74 
		ee.style.display = "block";
 76 
		ee.style.display = "block";
75 
		ee.style.height = Math.max(bb.height, this.minHeight) + "px";
 77 
		ee.style.height = Math.max(bb.height, this.minHeight) + "px";
76 
	} else {
 78 
	} else {
77 
		ee.style.display = "";
 79 
		ee.style.display = "";
78 
	}
 80 
	}
79 
	this.form.style.display = "";
 81 
	this.form.style.display = "";
80 
	this.editable.style.display = "none";
 82 
	this.editable.style.display = "none";
81 
	ee.focus();
 83 
	ee.focus();
82 
	ee.select();
 84 
	ee.select();
83 
	this.submitButton.disabled = true;
 85 
	this.submitButton.disabled = true;
84 
}, saveEdit:function (e) {
 86 
}, saveEdit:function (e) {
85 
	e.preventDefault();
 87 
	e.preventDefault();
86 
	e.stopPropagation();
 88 
	e.stopPropagation();
87 
	var ee = this[this.mode.toLowerCase()];
 89 
	var ee = this[this.mode.toLowerCase()];
88 
	if ((this.value != ee.value) && (dojo.string.trim(ee.value) != "")) {
 90 
	if ((this.value != ee.value) && (dojo.string.trim(ee.value) != "")) {
89 
		this.doFade = true;
 91 
		this.doFade = true;
90 
		this.history.push(this.value);
 92 
		this.history.push(this.value);
91 
		this.onSave(ee.value, this.value, this.name);
 93 
		this.onSave(ee.value, this.value, this.name);
92 
		this.value = ee.value;
 94 
		this.value = ee.value;
93 
		this.editable.innerHTML = "";
 95 
		this.editable.innerHTML = "";
94 
		var textNode = document.createTextNode(this.value);
 96 
		var textNode = document.createTextNode(this.value);
95 
		this.editable.appendChild(textNode);
 97 
		this.editable.appendChild(textNode);
96 
	} else {
 98 
	} else {
97 
		this.doFade = false;
 99 
		this.doFade = false;
98 
	}
 100 
	}
99 
	this._finishEdit(e);
 101 
	this._finishEdit(e);
100 
}, _stopEditing:function () {
 102 
}, _stopEditing:function () {
101 
	this.editing = false;
 103 
	this.editing = false;
102 
	this.form.style.display = "none";
 104 
	this.form.style.display = "none";
103 
	this.editable.style.display = "";
 105 
	this.editable.style.display = "";
104 
	return true;
 106 
	return true;
105 
}, cancelEdit:function (e) {
 107 
}, cancelEdit:function (e) {
106 
	this._stopEditing();
 108 
	this._stopEditing();
107 
	this.onCancel();
 109 
	this.onCancel();
108 
	return true;
 110 
	return true;
109 
}, _finishEdit:function (e) {
 111 
}, _finishEdit:function (e) {
110 
	this._stopEditing();
 112 
	this._stopEditing();
111 
	if (this.doFade) {
 113 
	if (this.doFade) {
112 
		dojo.lfx.highlight(this.editable, dojo.gfx.color.hex2rgb("#ffc"), 700).play(300);
 114 
		dojo.lfx.highlight(this.editable, dojo.gfx.color.hex2rgb("#ffc"), 700).play(300);
113 
	}
 115 
	}
114 
	this.doFade = false;
 116 
	this.doFade = false;
115 
}, setText:function (txt) {
 117 
}, setText:function (txt) {
116 
	dojo.deprecated("setText() is deprecated, call setValue() instead, will be removed in 0.5");
 118 
	dojo.deprecated("setText() is deprecated, call setValue() instead, will be removed in 0.5");
117 
	this.setValue(txt);
 119 
	this.setValue(txt);
118 
}, setValue:function (txt) {
 120 
}, setValue:function (txt) {
119 
	txt = "" + txt;
 121 
	txt = "" + txt;
120 
	var tt = dojo.string.trim(txt);
 122 
	var tt = dojo.string.trim(txt);
121 
	this.value = tt;
 123 
	this.value = tt;
122 
	this.editable.innerHTML = tt;
 124 
	this.editable.innerHTML = tt;
123 
}, undo:function () {
 125 
}, undo:function () {
124 
	if (this.history.length > 0) {
 126 
	if (this.history.length > 0) {
125 
		var curValue = this.value;
 127 
		var curValue = this.value;
126 
		var value = this.history.pop();
 128 
		var value = this.history.pop();
127 
		this.editable.innerHTML = value;
 129 
		this.editable.innerHTML = value;
128 
		this.value = value;
 130 
		this.value = value;
129 
		this.onUndo(value);
 131 
		this.onUndo(value);
130 
		this.onSave(value, curValue, this.name);
 132 
		this.onSave(value, curValue, this.name);
131 
	}
 133 
	}
132 
}, onChange:function (newValue, oldValue) {
 134 
}, onChange:function (newValue, oldValue) {
133 
}, onSave:function (newValue, oldValue, name) {
 135 
}, onSave:function (newValue, oldValue, name) {
134 
}, onCancel:function () {
 136 
}, onCancel:function () {
135 
}, checkForValueChange:function () {
 137 
}, checkForValueChange:function () {
136 
	var ee = this[this.mode.toLowerCase()];
 138 
	var ee = this[this.mode.toLowerCase()];
137 
	if ((this.value != ee.value) && (dojo.string.trim(ee.value) != "")) {
 139 
	if ((this.value != ee.value) && (dojo.string.trim(ee.value) != "")) {
138 
		this.submitButton.disabled = false;
 140 
		this.submitButton.disabled = false;
139 
	}
 141 
	}
140 
	this.onChange(this.value, ee.value);
 142 
	this.onChange(this.value, ee.value);
141 
}, disable:function () {
 143 
}, disable:function () {
142 
	this.submitButton.disabled = true;
 144 
	this.submitButton.disabled = true;
143 
	this.cancelButton.disabled = true;
 145 
	this.cancelButton.disabled = true;
144 
	var ee = this[this.mode.toLowerCase()];
 146 
	var ee = this[this.mode.toLowerCase()];
145 
	ee.disabled = true;
 147 
	ee.disabled = true;
146 
	dojo.widget.InlineEditBox.superclass.disable.apply(this, arguments);
 148 
	dojo.widget.InlineEditBox.superclass.disable.apply(this, arguments);
147 
}, enable:function () {
 149 
}, enable:function () {
148 
	this.checkForValueChange();
 150 
	this.checkForValueChange();
149 
	this.cancelButton.disabled = false;
 151 
	this.cancelButton.disabled = false;
150 
	var ee = this[this.mode.toLowerCase()];
 152 
	var ee = this[this.mode.toLowerCase()];
151 
	ee.disabled = false;
 153 
	ee.disabled = false;
152 
	dojo.widget.InlineEditBox.superclass.enable.apply(this, arguments);
 154 
	dojo.widget.InlineEditBox.superclass.enable.apply(this, arguments);
153 
}});
 155 
}});
154 
 
 156