[tt-rss.git] / lib / dijit / _editor / plugins / AlwaysShowToolbar.js.uncompressed.js

define("dijit/_editor/plugins/AlwaysShowToolbar", [
	"dojo/_base/declare", // declare
	"dojo/dom-class", // domClass.add domClass.remove
	"dojo/dom-construct", // domConstruct.place
	"dojo/dom-geometry",
	"dojo/_base/lang", // lang.hitch
	"dojo/_base/sniff", // has("ie") has("opera")
	"dojo/_base/window", // win.body
	"../_Plugin"
], function(declare, domClass, domConstruct, domGeometry, lang, has, win, _Plugin){

/*=====
	var _Plugin = dijit._editor._Plugin;
=====*/

// module:
//		dijit/_editor/plugins/AlwaysShowToolbar
// summary:
//		This plugin is required for Editors in auto-expand mode.
//		It handles the auto-expansion as the user adds/deletes text,
//		and keeps the editor's toolbar visible even when the top of the editor
//		has scrolled off the top of the viewport (usually when editing a long
//		document).


return declare("dijit._editor.plugins.AlwaysShowToolbar", _Plugin, {
	// summary:
	//		This plugin is required for Editors in auto-expand mode.
	//		It handles the auto-expansion as the user adds/deletes text,
	//		and keeps the editor's toolbar visible even when the top of the editor
	//		has scrolled off the top of the viewport (usually when editing a long
	//		document).
	// description:
	//		Specify this in extraPlugins (or plugins) parameter and also set
	//		height to "".
	// example:
	//	|	<div data-dojo-type="dijit.Editor" height=""
	//	|	data-dojo-props="extraPlugins: [dijit._editor.plugins.AlwaysShowToolbar]">

	// _handleScroll: Boolean
	//		Enables/disables the handler for scroll events
	_handleScroll: true,

	setEditor: function(e){
		// Overrides _Plugin.setEditor().
		if(!e.iframe){
			console.log('Port AlwaysShowToolbar plugin to work with Editor without iframe');
			return;
		}

		this.editor = e;

		e.onLoadDeferred.addCallback(lang.hitch(this, this.enable));
	},

	enable: function(d){
		// summary:
		//		Enable plugin.  Called when Editor has finished initializing.
		// tags:
		//		private

		this._updateHeight();
		this.connect(window, 'onscroll', "globalOnScrollHandler");
		this.connect(this.editor, 'onNormalizedDisplayChanged', "_updateHeight");
		return d;
	},

	_updateHeight: function(){
		// summary:
		//		Updates the height of the editor area to fit the contents.
		var e = this.editor;
		if(!e.isLoaded){ return; }
		if(e.height){ return; }

		var height = domGeometry.getMarginSize(e.editNode).h;
		if(has("opera")){
			height = e.editNode.scrollHeight;
		}
		// console.debug('height',height);
		// alert(this.editNode);

		//height maybe zero in some cases even though the content is not empty,
		//we try the height of body instead
		if(!height){
			height = domGeometry.getMarginSize(e.document.body).h;
		}

		if(height == 0){
			console.debug("Can not figure out the height of the editing area!");
			return; //prevent setting height to 0
		}
		if(has("ie") <= 7 && this.editor.minHeight){
			var min = parseInt(this.editor.minHeight);
			if(height < min){ height = min; }
		}
		if(height != this._lastHeight){
			this._lastHeight = height;
			// this.editorObject.style.height = this._lastHeight + "px";
			domGeometry.setMarginBox(e.iframe, { h: this._lastHeight });
		}
	},

	// _lastHeight: Integer
	//		Height in px of the editor at the last time we did sizing
	_lastHeight: 0,

	globalOnScrollHandler: function(){
		// summary:
		//		Handler for scroll events that bubbled up to <html>
		// tags:
		//		private

		var isIE6 = has("ie") < 7;
		if(!this._handleScroll){ return; }
		var tdn = this.editor.header;
		if(!this._scrollSetUp){
			this._scrollSetUp = true;
			this._scrollThreshold = domGeometry.position(tdn, true).y;
//			var db = win.body;
//			console.log("threshold:", this._scrollThreshold);
			//what's this for?? comment out for now
//			if((isIE6)&&(db)&&(domStyle.set or get TODO(db, "backgroundIimage")=="none")){
//				db.style.backgroundImage = "url(" + dojo.uri.moduleUri("dijit", "templates/blank.gif") + ")";
//				db.style.backgroundAttachment = "fixed";
//			}
		}

		var scrollPos = domGeometry.docScroll().y;
		var s = tdn.style;

		if(scrollPos > this._scrollThreshold && scrollPos < this._scrollThreshold+this._lastHeight){
			// dojo.debug(scrollPos);
			if(!this._fixEnabled){
				var tdnbox = domGeometry.getMarginSize(tdn);
				this.editor.iframe.style.marginTop = tdnbox.h+"px";

				if(isIE6){
					s.left = domGeometry.position(tdn).x;
					if(tdn.previousSibling){
						this._IEOriginalPos = ['after',tdn.previousSibling];
					}else if(tdn.nextSibling){
						this._IEOriginalPos = ['before',tdn.nextSibling];
					}else{
						this._IEOriginalPos = ['last',tdn.parentNode];
					}
					win.body().appendChild(tdn);
					domClass.add(tdn,'dijitIEFixedToolbar');
				}else{
					s.position = "fixed";
					s.top = "0px";
				}

				domGeometry.setMarginBox(tdn, { w: tdnbox.w });
				s.zIndex = 2000;
				this._fixEnabled = true;
			}
			// if we're showing the floating toolbar, make sure that if
			// we've scrolled past the bottom of the editor that we hide
			// the toolbar for this instance of the editor.

			// TODO: when we get multiple editor toolbar support working
			// correctly, ensure that we check this against the scroll
			// position of the bottom-most editor instance.
			var eHeight = (this.height) ? parseInt(this.editor.height) : this.editor._lastHeight;
			s.display = (scrollPos > this._scrollThreshold+eHeight) ? "none" : "";
		}else if(this._fixEnabled){
			this.editor.iframe.style.marginTop = '';
			s.position = "";
			s.top = "";
			s.zIndex = "";
			s.display = "";
			if(isIE6){
				s.left = "";
				domClass.remove(tdn,'dijitIEFixedToolbar');
				if(this._IEOriginalPos){
					domConstruct.place(tdn, this._IEOriginalPos[1], this._IEOriginalPos[0]);
					this._IEOriginalPos = null;
				}else{
					domConstruct.place(tdn, this.editor.iframe, 'before');
				}
			}
			s.width = "";
			this._fixEnabled = false;
		}
	},

	destroy: function(){
		// Overrides _Plugin.destroy().   TODO: call this.inherited() rather than repeating code.
		this._IEOriginalPos = null;
		this._handleScroll = false;
		this.inherited(arguments);

		if(has("ie") < 7){
			domClass.remove(this.editor.header, 'dijitIEFixedToolbar');
		}
	}
});

});
Commit	Line	Data
1354d172 AD	1	define("dijit/_editor/plugins/AlwaysShowToolbar", [
	2	"dojo/_base/declare", // declare
	3	"dojo/dom-class", // domClass.add domClass.remove
	4	"dojo/dom-construct", // domConstruct.place
	5	"dojo/dom-geometry",
	6	"dojo/_base/lang", // lang.hitch
	7	"dojo/_base/sniff", // has("ie") has("opera")
	8	"dojo/_base/window", // win.body
	9	"../_Plugin"
	10	], function(declare, domClass, domConstruct, domGeometry, lang, has, win, _Plugin){
	11
	12	/*=====
	13	var _Plugin = dijit._editor._Plugin;
	14	=====*/
	15
	16	// module:
	17	// dijit/_editor/plugins/AlwaysShowToolbar
	18	// summary:
	19	// This plugin is required for Editors in auto-expand mode.
	20	// It handles the auto-expansion as the user adds/deletes text,
	21	// and keeps the editor's toolbar visible even when the top of the editor
	22	// has scrolled off the top of the viewport (usually when editing a long
	23	// document).
	24
	25
	26	return declare("dijit._editor.plugins.AlwaysShowToolbar", _Plugin, {
	27	// summary:
	28	// This plugin is required for Editors in auto-expand mode.
	29	// It handles the auto-expansion as the user adds/deletes text,
	30	// and keeps the editor's toolbar visible even when the top of the editor
	31	// has scrolled off the top of the viewport (usually when editing a long
	32	// document).
	33	// description:
	34	// Specify this in extraPlugins (or plugins) parameter and also set
	35	// height to "".
	36	// example:
	37	// \| <div data-dojo-type="dijit.Editor" height=""
	38	// \| data-dojo-props="extraPlugins: [dijit._editor.plugins.AlwaysShowToolbar]">
	39
	40	// _handleScroll: Boolean
	41	// Enables/disables the handler for scroll events
	42	_handleScroll: true,
	43
	44	setEditor: function(e){
	45	// Overrides _Plugin.setEditor().
	46	if(!e.iframe){
	47	console.log('Port AlwaysShowToolbar plugin to work with Editor without iframe');
	48	return;
	49	}
	50
	51	this.editor = e;
	52
	53	e.onLoadDeferred.addCallback(lang.hitch(this, this.enable));
	54	},
	55
	56	enable: function(d){
	57	// summary:
	58	// Enable plugin. Called when Editor has finished initializing.
	59	// tags:
	60	// private
	61
	62	this._updateHeight();
	63	this.connect(window, 'onscroll', "globalOnScrollHandler");
	64	this.connect(this.editor, 'onNormalizedDisplayChanged', "_updateHeight");
65	return d;
66	},
67
68	_updateHeight: function(){
69	// summary:
70	// Updates the height of the editor area to fit the contents.
71	var e = this.editor;
72	if(!e.isLoaded){ return; }
73	if(e.height){ return; }
74
75	var height = domGeometry.getMarginSize(e.editNode).h;
76	if(has("opera")){
77	height = e.editNode.scrollHeight;
78	}
79	// console.debug('height',height);
80	// alert(this.editNode);
81
82	//height maybe zero in some cases even though the content is not empty,
83	//we try the height of body instead
84	if(!height){
85	height = domGeometry.getMarginSize(e.document.body).h;
86	}
87
88	if(height == 0){
89	console.debug("Can not figure out the height of the editing area!");
90	return; //prevent setting height to 0
91	}
92	if(has("ie") <= 7 && this.editor.minHeight){
93	var min = parseInt(this.editor.minHeight);
94	if(height < min){ height = min; }
95	}
96	if(height != this._lastHeight){
97	this._lastHeight = height;
98	// this.editorObject.style.height = this._lastHeight + "px";
99	domGeometry.setMarginBox(e.iframe, { h: this._lastHeight });
100	}
101	},
102
103	// _lastHeight: Integer
104	// Height in px of the editor at the last time we did sizing
105	_lastHeight: 0,
106
107	globalOnScrollHandler: function(){
108	// summary:
109	// Handler for scroll events that bubbled up to <html>
110	// tags:
111	// private
112
113	var isIE6 = has("ie") < 7;
114	if(!this._handleScroll){ return; }
115	var tdn = this.editor.header;
116	if(!this._scrollSetUp){
117	this._scrollSetUp = true;
118	this._scrollThreshold = domGeometry.position(tdn, true).y;
119	// var db = win.body;
120	// console.log("threshold:", this._scrollThreshold);
121	//what's this for?? comment out for now
122	// if((isIE6)&&(db)&&(domStyle.set or get TODO(db, "backgroundIimage")=="none")){
123	// db.style.backgroundImage = "url(" + dojo.uri.moduleUri("dijit", "templates/blank.gif") + ")";
124	// db.style.backgroundAttachment = "fixed";
125	// }
126	}
127
128	var scrollPos = domGeometry.docScroll().y;
129	var s = tdn.style;
130
131	if(scrollPos > this._scrollThreshold && scrollPos < this._scrollThreshold+this._lastHeight){
132	// dojo.debug(scrollPos);
133	if(!this._fixEnabled){
134	var tdnbox = domGeometry.getMarginSize(tdn);
135	this.editor.iframe.style.marginTop = tdnbox.h+"px";
136
137	if(isIE6){
138	s.left = domGeometry.position(tdn).x;
139	if(tdn.previousSibling){
140	this._IEOriginalPos = ['after',tdn.previousSibling];
141	}else if(tdn.nextSibling){
142	this._IEOriginalPos = ['before',tdn.nextSibling];
143	}else{
144	this._IEOriginalPos = ['last',tdn.parentNode];
145	}
146	win.body().appendChild(tdn);
147	domClass.add(tdn,'dijitIEFixedToolbar');
148	}else{
149	s.position = "fixed";
150	s.top = "0px";
151	}
152
153	domGeometry.setMarginBox(tdn, { w: tdnbox.w });
154	s.zIndex = 2000;
155	this._fixEnabled = true;
156	}
157	// if we're showing the floating toolbar, make sure that if
158	// we've scrolled past the bottom of the editor that we hide
159	// the toolbar for this instance of the editor.
160
161	// TODO: when we get multiple editor toolbar support working
162	// correctly, ensure that we check this against the scroll
163	// position of the bottom-most editor instance.
164	var eHeight = (this.height) ? parseInt(this.editor.height) : this.editor._lastHeight;
165	s.display = (scrollPos > this._scrollThreshold+eHeight) ? "none" : "";
166	}else if(this._fixEnabled){
167	this.editor.iframe.style.marginTop = '';
168	s.position = "";
169	s.top = "";
170	s.zIndex = "";
171	s.display = "";
172	if(isIE6){
173	s.left = "";
174	domClass.remove(tdn,'dijitIEFixedToolbar');
175	if(this._IEOriginalPos){
176	domConstruct.place(tdn, this._IEOriginalPos[1], this._IEOriginalPos[0]);
177	this._IEOriginalPos = null;
178	}else{
179	domConstruct.place(tdn, this.editor.iframe, 'before');
180	}
181	}
182	s.width = "";
183	this._fixEnabled = false;
184	}
185	},
186
187	destroy: function(){
188	// Overrides _Plugin.destroy(). TODO: call this.inherited() rather than repeating code.
189	this._IEOriginalPos = null;
190	this._handleScroll = false;
191	this.inherited(arguments);
192
193	if(has("ie") < 7){
194	domClass.remove(this.editor.header, 'dijitIEFixedToolbar');
195	}
196	}
197	});
198
199	});