PageRenderTime 104ms CodeModel.GetById 91ms app.highlight 10ms RepoModel.GetById 1ms app.codeStats 0ms

/static/scripts/tiny_mce/themes/advanced/js/image.js

http://n23.googlecode.com/
JavaScript | 245 lines | 187 code | 51 blank | 7 comment | 52 complexity | 1f4e125261b06f33d0cb33e6ab4b2565 MD5 | raw file
  1var ImageDialog = {
  2	preInit : function() {
  3		var url;
  4
  5		tinyMCEPopup.requireLangPack();
  6
  7		if (url = tinyMCEPopup.getParam("external_image_list_url"))
  8			document.write('<script language="javascript" type="text/javascript" src="' + tinyMCEPopup.editor.documentBaseURI.toAbsolute(url) + '"></script>');
  9	},
 10
 11	init : function() {
 12		var f = document.forms[0], ed = tinyMCEPopup.editor;
 13
 14		// Setup browse button
 15		document.getElementById('srcbrowsercontainer').innerHTML = getBrowserHTML('srcbrowser','src','image','theme_advanced_image');
 16		if (isVisible('srcbrowser'))
 17			document.getElementById('src').style.width = '180px';
 18
 19		e = ed.selection.getNode();
 20
 21		this.fillFileList('image_list', 'tinyMCEImageList');
 22
 23		if (e.nodeName == 'IMG') {
 24			f.src.value = ed.dom.getAttrib(e, 'src');
 25			f.alt.value = ed.dom.getAttrib(e, 'alt');
 26			f.border.value = this.getAttrib(e, 'border');
 27			f.vspace.value = this.getAttrib(e, 'vspace');
 28			f.hspace.value = this.getAttrib(e, 'hspace');
 29			f.width.value = ed.dom.getAttrib(e, 'width');
 30			f.height.value = ed.dom.getAttrib(e, 'height');
 31			f.insert.value = ed.getLang('update');
 32			this.styleVal = ed.dom.getAttrib(e, 'style');
 33			selectByValue(f, 'image_list', f.src.value);
 34			selectByValue(f, 'align', this.getAttrib(e, 'align'));
 35			this.updateStyle();
 36		}
 37	},
 38
 39	fillFileList : function(id, l) {
 40		var dom = tinyMCEPopup.dom, lst = dom.get(id), v, cl;
 41
 42		l = window[l];
 43
 44		if (l && l.length > 0) {
 45			lst.options[lst.options.length] = new Option('', '');
 46
 47			tinymce.each(l, function(o) {
 48				lst.options[lst.options.length] = new Option(o[0], o[1]);
 49			});
 50		} else
 51			dom.remove(dom.getParent(id, 'tr'));
 52	},
 53
 54	update : function() {
 55		var f = document.forms[0], nl = f.elements, ed = tinyMCEPopup.editor, args = {}, el;
 56
 57		tinyMCEPopup.restoreSelection();
 58
 59		if (f.src.value === '') {
 60			if (ed.selection.getNode().nodeName == 'IMG') {
 61				ed.dom.remove(ed.selection.getNode());
 62				ed.execCommand('mceRepaint');
 63			}
 64
 65			tinyMCEPopup.close();
 66			return;
 67		}
 68
 69		if (!ed.settings.inline_styles) {
 70			args = tinymce.extend(args, {
 71				vspace : nl.vspace.value,
 72				hspace : nl.hspace.value,
 73				border : nl.border.value,
 74				align : getSelectValue(f, 'align')
 75			});
 76		} else
 77			args.style = this.styleVal;
 78
 79		tinymce.extend(args, {
 80			src : f.src.value,
 81			alt : f.alt.value,
 82			width : f.width.value,
 83			height : f.height.value
 84		});
 85
 86		el = ed.selection.getNode();
 87
 88		if (el && el.nodeName == 'IMG') {
 89			ed.dom.setAttribs(el, args);
 90		} else {
 91			ed.execCommand('mceInsertContent', false, '<img id="__mce_tmp" />', {skip_undo : 1});
 92			ed.dom.setAttribs('__mce_tmp', args);
 93			ed.dom.setAttrib('__mce_tmp', 'id', '');
 94			ed.undoManager.add();
 95		}
 96
 97		tinyMCEPopup.close();
 98	},
 99
100	updateStyle : function() {
101		var dom = tinyMCEPopup.dom, st, v, f = document.forms[0];
102
103		if (tinyMCEPopup.editor.settings.inline_styles) {
104			st = tinyMCEPopup.dom.parseStyle(this.styleVal);
105
106			// Handle align
107			v = getSelectValue(f, 'align');
108			if (v) {
109				if (v == 'left' || v == 'right') {
110					st['float'] = v;
111					delete st['vertical-align'];
112				} else {
113					st['vertical-align'] = v;
114					delete st['float'];
115				}
116			} else {
117				delete st['float'];
118				delete st['vertical-align'];
119			}
120
121			// Handle border
122			v = f.border.value;
123			if (v || v == '0') {
124				if (v == '0')
125					st['border'] = '0';
126				else
127					st['border'] = v + 'px solid black';
128			} else
129				delete st['border'];
130
131			// Handle hspace
132			v = f.hspace.value;
133			if (v) {
134				delete st['margin'];
135				st['margin-left'] = v + 'px';
136				st['margin-right'] = v + 'px';
137			} else {
138				delete st['margin-left'];
139				delete st['margin-right'];
140			}
141
142			// Handle vspace
143			v = f.vspace.value;
144			if (v) {
145				delete st['margin'];
146				st['margin-top'] = v + 'px';
147				st['margin-bottom'] = v + 'px';
148			} else {
149				delete st['margin-top'];
150				delete st['margin-bottom'];
151			}
152
153			// Merge
154			st = tinyMCEPopup.dom.parseStyle(dom.serializeStyle(st));
155			this.styleVal = dom.serializeStyle(st);
156		}
157	},
158
159	getAttrib : function(e, at) {
160		var ed = tinyMCEPopup.editor, dom = ed.dom, v, v2;
161
162		if (ed.settings.inline_styles) {
163			switch (at) {
164				case 'align':
165					if (v = dom.getStyle(e, 'float'))
166						return v;
167
168					if (v = dom.getStyle(e, 'vertical-align'))
169						return v;
170
171					break;
172
173				case 'hspace':
174					v = dom.getStyle(e, 'margin-left')
175					v2 = dom.getStyle(e, 'margin-right');
176					if (v && v == v2)
177						return parseInt(v.replace(/[^0-9]/g, ''));
178
179					break;
180
181				case 'vspace':
182					v = dom.getStyle(e, 'margin-top')
183					v2 = dom.getStyle(e, 'margin-bottom');
184					if (v && v == v2)
185						return parseInt(v.replace(/[^0-9]/g, ''));
186
187					break;
188
189				case 'border':
190					v = 0;
191
192					tinymce.each(['top', 'right', 'bottom', 'left'], function(sv) {
193						sv = dom.getStyle(e, 'border-' + sv + '-width');
194
195						// False or not the same as prev
196						if (!sv || (sv != v && v !== 0)) {
197							v = 0;
198							return false;
199						}
200
201						if (sv)
202							v = sv;
203					});
204
205					if (v)
206						return parseInt(v.replace(/[^0-9]/g, ''));
207
208					break;
209			}
210		}
211
212		if (v = dom.getAttrib(e, at))
213			return v;
214
215		return '';
216	},
217
218	resetImageData : function() {
219		var f = document.forms[0];
220
221		f.width.value = f.height.value = "";	
222	},
223
224	updateImageData : function() {
225		var f = document.forms[0], t = ImageDialog;
226
227		if (f.width.value == "")
228			f.width.value = t.preloadImg.width;
229
230		if (f.height.value == "")
231			f.height.value = t.preloadImg.height;
232	},
233
234	getImageData : function() {
235		var f = document.forms[0];
236
237		this.preloadImg = new Image();
238		this.preloadImg.onload = this.updateImageData;
239		this.preloadImg.onerror = this.resetImageData;
240		this.preloadImg.src = tinyMCEPopup.editor.documentBaseURI.toAbsolute(f.src.value);
241	}
242};
243
244ImageDialog.preInit();
245tinyMCEPopup.onInit.add(ImageDialog.init, ImageDialog);