nicEdit 中图片上传，和上传进度条的显示

1. /* NicEdit - Micro Inline WYSIWYG
2.  * Copyright 2007-2008 Brian Kirchoff
3.  *
4.  * NicEdit is distributed under the terms of the MIT license
5.  * For more information visit http://nicedit.com/
6.  * Do not remove this copyright message
7.  */
8. var bkExtend = function(){
9.     var args = arguments;
10.     if (args.length == 1) args = [this, args[0]];
11.     for (var prop in args[1]) args[0][prop] = args[1][prop];
12.     return args[0];
13. };
14. function bkClass() { };
15. bkClass.prototype.construct = function() {};
16. bkClass.extend = function(def) {
17.   var classDef = function() {
18.       if (arguments[0] !== bkClass) { return this.construct.apply(this, arguments); }
19.   };
20.   var proto = new this(bkClass);
21.   bkExtend(proto,def);
22.   classDef.prototype = proto;
23.   classDef.extend = this.extend;      
24.   return classDef;
25. };
27. var bkElement = bkClass.extend({
28.     construct : function(elm,d) {
29.         if(typeof(elm) == "string") {
30.             elm = (d || document).createElement(elm);
31.         }
32.         elm = $BK(elm);
33.         return elm;
34.     },
35.     
36.     appendTo : function(elm) {
37.         elm.appendChild(this);  
38.         return this;
39.     },
40.     
41.     appendBefore : function(elm) {
42.         elm.parentNode.insertBefore(this,elm);  
43.         return this;
44.     },
45.     
46.     addEvent : function(type, fn) {
47.         bkLib.addEvent(this,type,fn);
48.         return this;    
49.     },
50.     
51.     setContent : function(c) {
52.         this.innerHTML = c;
53.         return this;
54.     },
55.     
56.     pos : function() {
57.         var curleft = curtop = 0;
58.         var o = obj = this;
59.         if (obj.offsetParent) {
60.             do {
61.                 curleft += obj.offsetLeft;
62.                 curtop += obj.offsetTop;
63.             } while (obj = obj.offsetParent);
64.         }
65.         var b = (!window.opera) ? parseInt(this.getStyle('border-width') || this.style.border) || 0 : 0;
66.         return [curleft+b,curtop+b+this.offsetHeight];
67.     },
68.     
69.     noSelect : function() {
70.         bkLib.noSelect(this);
71.         return this;
72.     },
73.     
74.     parentTag : function(t) {
75.         var elm = this;
76.          do {
77.             if(elm && elm.nodeName && elm.nodeName.toUpperCase() == t) {
78.                 return elm;
79.             }
80.             elm = elm.parentNode;
81.         } while(elm);
82.         return false;
83.     },
84.     
85.     hasClass : function(cls) {
86.         return this.className.match(new RegExp('(//s|^)nicEdit-'+cls+'(//s|$)'));
87.     },
88.     
89.     addClass : function(cls) {
90.         if (!this.hasClass(cls)) { this.className += " nicEdit-"+cls };
91.         return this;
92.     },
93.     
94.     removeClass : function(cls) {
95.         if (this.hasClass(cls)) {
96.             this.className = this.className.replace(new RegExp('(//s|^)nicEdit-'+cls+'(//s|$)'),' ');
97.         }
98.         return this;
99.     },
101.     setStyle : function(st) {
102.         var elmStyle = this.style;
103.         for(var itm in st) {
104.             switch(itm) {
105.                 case 'float':
106.                     elmStyle['cssFloat'] = elmStyle['styleFloat'] = st[itm];
107.                     break;
108.                 case 'opacity':
109.                     elmStyle.opacity = st[itm];
110.                     elmStyle.filter = "alpha(opacity=" + Math.round(st[itm]*100) + ")"; 
111.                     break;
112.                 case 'className':
113.                     this.className = st[itm];
114.                     break;
115.                 default:
116.                     //if(document.compatMode || itm != "cursor") { // Nasty Workaround for IE 5.5
117.                         elmStyle[itm] = st[itm];
118.                     //}     
119.             }
120.         }
121.         return this;
122.     },
123.     
124.     getStyle : function( cssRule, d ) {
125.         var doc = (!d) ? document.defaultView : d; 
126.         if(this.nodeType == 1)
127.         return (doc && doc.getComputedStyle) ? doc.getComputedStyle( this, null ).getPropertyValue(cssRule) : this.currentStyle[ bkLib.camelize(cssRule) ];
128.     },
129.     
130.     remove : function() {
131.         this.parentNode.removeChild(this);
132.         return this;    
133.     },
134.     
135.     setAttributes : function(at) {
136.         for(var itm in at) {
137.             this[itm] = at[itm];
138.         }
139.         return this;
140.     }
141. });
143. var bkLib = {
144.     isMSIE : (navigator.appVersion.indexOf("MSIE") != -1),
145.     
146.     addEvent : function(obj, type, fn) {
147.         (obj.addEventListener) ? obj.addEventListener( type, fn, false ) : obj.attachEvent("on"+type, fn);  
148.     },
149.     
150.     toArray : function(iterable) {
151.         var length = iterable.length, results = new Array(length);
152.         while (length--) { results[length] = iterable[length] };
153.         return results; 
154.     },
155.     
156.     noSelect : function(element) {
157.         if(element.setAttribute && element.nodeName.toLowerCase() != 'input' && element.nodeName.toLowerCase() != 'textarea') {
158.             element.setAttribute('unselectable','on');
159.         }
160.         for(var i=0;i<element.childNodes.length;i++) {
161.             bkLib.noSelect(element.childNodes[i]);
162.         }
163.     },
164.     camelize : function(s) {
165.         return s.replace(//-(.)/g, function(m, l){return l.toUpperCase()});
166.     },
167.     inArray : function(arr,item) {
168.         return (bkLib.search(arr,item) != null);
169.     },
170.     search : function(arr,itm) {
171.         for(var i=0; i < arr.length; i++) {
172.             if(arr[i] == itm)
173.                 return i;
174.         }
175.         return null;    
176.     },
177.     cancelEvent : function(e) {
178.         e = e || window.event;
179.         if(e.preventDefault && e.stopPropagation) {
180.             e.preventDefault();
181.             e.stopPropagation();
182.         }
183.         return false;
184.     },
185.     domLoad : [],
186.     domLoaded : function() {
187.         if (arguments.callee.done) return;
188.         arguments.callee.done = true;
189.         for (i = 0;i < bkLib.domLoad.length;i++) bkLib.domLoad[i]();
190.     },
191.     onDomLoaded : function(fireThis) {
192.         this.domLoad.push(fireThis);
193.         if (document.addEventListener) {
194.             document.addEventListener("DOMContentLoaded", bkLib.domLoaded, null);
195.         } else if(bkLib.isMSIE) {
196.             document.write("<style>.nicEdit-main p { margin: 0; }</style><scr"+"ipt id=__ie_onload defer " + ((location.protocol == "https:") ? "src='javascript:void(0)'" : "src=//0") + "><//scr"+"ipt>");
197.             $BK("__ie_onload").onreadystatechange = function() {
198.                 if (this.readyState == "complete"){bkLib.domLoaded();}
199.             };
200.         }
201.         window.onload = bkLib.domLoaded;
202.     }
203. };
205. function $BK(elm) {
206.     if(typeof(elm) == "string") {
207.         elm = document.getElementById(elm);
208.     }
209.     return (elm && !elm.appendTo) ? bkExtend(elm,bkElement.prototype) : elm;
210. };
212. var bkEvent = {
213.     addEvent : function(evType, evFunc) {
214.         if(evFunc) {
215.             this.eventList = this.eventList || {};
216.             this.eventList[evType] = this.eventList[evType] || [];
217.             this.eventList[evType].push(evFunc);
218.         }
219.         return this;
220.     },
221.     fireEvent : function() {
222.         var args = bkLib.toArray(arguments), evType = args.shift();
223.         if(this.eventList && this.eventList[evType]) {
224.             for(var i=0;i<this.eventList[evType].length;i++) {
225.                 this.eventList[evType][i].apply(this,args);
226.             }
227.         }
228.     }   
229. };
231. function __(s) {
232.     return s;
233. };
235. Function.prototype.closure = function() {
236.   var __method = this, args = bkLib.toArray(arguments), obj = args.shift();
237.   return function() { if(typeof(bkLib) != 'undefined') { return __method.apply(obj,args.concat(bkLib.toArray(arguments))); } };
238. };
239.     
240. Function.prototype.closureListener = function() {
241.     var __method = this, args = bkLib.toArray(arguments), object = args.shift(); 
242.     return function(e) { 
243.     e = e || window.event;
244.     if(e.target) { var target = e.target; } else { var target =  e.srcElement };
245.         return __method.apply(object, [e,target].concat(args) ); 
246.     };
247. };      
250. /* START CONFIG */
252. var nicEditorConfig = bkClass.extend({
253.         buttons : {
254.         'bold' : {name : __('粗体'), command : 'Bold', tags : ['B','STRONG'], css : {'font-weight' : 'bold'}, key : 'b'},
255.         'italic' : {name : __('斜体'), command : 'Italic', tags : ['EM','I'], css : {'font-style' : 'italic'}, key : 'i'},
256.         'underline' : {name : __('下划线'), command : 'Underline', tags : ['U'], css : {'text-decoration' : 'underline'}, key : 'u'},
257.         'left' : {name : __('左对齐'), command : 'justifyleft', noActive : true},
258.         'center' : {name : __('居中对齐'), command : 'justifycenter', noActive : true},
259.         'right' : {name : __('右对齐'), command : 'justifyright', noActive : true},
260.         'justify' : {name : __('两端对齐'), command : 'justifyfull', noActive : true},
261.         'ol' : {name : __('有序列表'), command : 'insertorderedlist', tags : ['OL']},
262.         'ul' :  {name : __('无序列表'), command : 'insertunorderedlist', tags : ['UL']},
263.         'subscript' : {name : __('下标'), command : 'subscript', tags : ['SUB']},
264.         'superscript' : {name : __('上标'), command : 'superscript', tags : ['SUP']},
265.         'strikethrough' : {name : __('删除线'), command : 'strikeThrough', css : {'text-decoration' : 'line-through'}},
266.         'removeformat' : {name : __('取消'), command : 'removeformat', noActive : true},
267.         'indent' : {name : __('增加缩进'), command : 'indent', noActive : true},
268.         'outdent' : {name : __('减少缩进'), command : 'outdent', noActive : true},
269.         'hr' : {name : __('水平线'), command : 'insertHorizontalRule', noActive : true}
270.     },
271.     iconsPath : '../nicEditorIcons.gif',
272.     buttonList : ['save','bold','italic','underline','left','center','right','justify','ol','ul','fontSize','fontFamily','fontFormat','indent','outdent','image','upload','link','unlink','forecolor','bgcolor','smile'],
273.     iconList : {"xhtml":1,"bgcolor":2,"forecolor":3,"bold":4,"center":5,"hr":6,"indent":7,"italic":8,"justify":9,"left":10,"ol":11,"outdent":12,"removeformat":13,"right":14,"save":25,"strikethrough":16,"subscript":17,"superscript":18,"ul":19,"underline":20,"image":21,"link":22,"unlink":23,"close":24,"arrow":26,"upload":27,'smile':28}
274.     
275. });
276. /* END CONFIG */
279. var nicEditors = {
280.     nicPlugins : [],
281.     editors : [],
282.     
283.     registerPlugin : function(plugin,options) {
284.         this.nicPlugins.push({p : plugin, o : options});
285.     },
287.     allTextAreas : function(nicOptions) {
288.         var textareas = document.getElementsByTagName("textarea");
289.         for(var i=0;i<textareas.length;i++) {
290.             nicEditors.editors.push(new nicEditor(nicOptions).panelInstance(textareas[i]));
291.         }
292.         return nicEditors.editors;
293.     },
294.     
295.     findEditor : function(e) {
296.         var editors = nicEditors.editors;
297.         for(var i=0;i<editors.length;i++) {
298.             if(editors[i].instanceById(e)) {
299.                 return editors[i].instanceById(e);
300.             }
301.         }
302.     }
303. };
306. var nicEditor = bkClass.extend({
307.     construct : function(o) {
308.         this.options = new nicEditorConfig();
309.         bkExtend(this.options,o);
310.         this.nicInstances = new Array();
311.         this.loadedPlugins = new Array();
312.         
313.         var plugins = nicEditors.nicPlugins;
314.         for(var i=0;i<plugins.length;i++) {
315.             this.loadedPlugins.push(new plugins[i].p(this,plugins[i].o));
316.         }
317.         nicEditors.editors.push(this);
318.         bkLib.addEvent(document.body,'mousedown', this.selectCheck.closureListener(this) );
319.     },
320.     
321.     panelInstance : function(e,o) {
322.         e = this.checkReplace($BK(e));
323.         var panelElm = new bkElement('DIV').setStyle({width : (parseInt(e.getStyle('width')) || e.clientWidth)+'px'}).appendBefore(e);
324.         this.setPanel(panelElm);
325.         return this.addInstance(e,o);   
326.     },
328.     checkReplace : function(e) {
329.         var r = nicEditors.findEditor(e);
330.         if(r) {
331.             r.removeInstance(e);
332.             r.removePanel();
333.         }
334.         return e;
335.     },
337.     addInstance : function(e,o) {
338.         e = this.checkReplace($BK(e));
339.         if( (e.contentEditable || !!window.opera) && navigator.userAgent.indexOf('Firefox/3') == -1 ) {
340.             var newInstance = new nicEditorInstance(e,o,this);
341.         } else {
342.             var newInstance = new nicEditorIFrameInstance(e,o,this);
343.         }
344.         this.nicInstances.push(newInstance);
345.         return this;
346.     },
347.     
348.     removeInstance : function(e) {
349.         e = $BK(e);
350.         var instances = this.nicInstances;
351.         for(var i=0;i<instances.length;i++) {   
352.             if(instances[i].e == e) {
353.                 instances[i].remove();
354.                 this.nicInstances.splice(i,1);
355.             }
356.         }
357.     },
359.     removePanel : function(e) {
360.         if(this.nicPanel) {
361.             this.nicPanel.remove();
362.             this.nicPanel = null;
363.         }   
364.     },
366.     instanceById : function(e) {
367.         e = $BK(e);
368.         var instances = this.nicInstances;
369.         for(var i=0;i<instances.length;i++) {
370.             if(instances[i].e == e) {
371.                 return instances[i];
372.             }
373.         }   
374.     },
376.     setPanel : function(e) {
377.         this.nicPanel = new nicEditorPanel($BK(e),this.options,this);
378.         this.fireEvent('panel',this.nicPanel);
379.         return this;
380.     },
381.     
382.     nicCommand : function(cmd,args) {   
383.         if(this.selectedInstance) {
384.             this.selectedInstance.nicCommand(cmd,args);
385.         }
386.     },
387.     
388.     getIcon : function(iconName,options) {
389.         var icon = this.options.iconList[iconName];
390.         var file = (options.iconFiles) ? options.iconFiles[iconName] : '';
391.         return {backgroundImage : "url('"+((icon) ? this.options.iconsPath : file)+"')", backgroundPosition : ((icon) ? ((icon-1)*-18) : 0)+'px 0px'};  
392.     },
393.         
394.     selectCheck : function(e,t) {
395.         var found = false;
396.         do{
397.             if(t.className && t.className.indexOf('nicEdit') != -1) {
398.                 return false;
399.             }
400.         } while(t = t.parentNode);
401.         this.fireEvent('blur',this.selectedInstance,t);
402.         this.lastSelectedInstance = this.selectedInstance;
403.         this.selectedInstance = null;
404.         return false;
405.     }
406.     
407. });
408. nicEditor = nicEditor.extend(bkEvent);
410.  
411. var nicEditorInstance = bkClass.extend({
412.     isSelected : false,
413.     
414.     construct : function(e,options,nicEditor) {
415.         this.ne = nicEditor;
416.         this.elm = this.e = e;
417.         this.options = options || {};
418.         
419.         newX = parseInt(e.getStyle('width')) || e.clientWidth;
420.         newY = parseInt(e.getStyle('height')) || e.clientHeight;
421.         this.initialHeight = newY-8;
422.         
423.         var isTextarea = (e.nodeName.toLowerCase() == "textarea");
424.         if(isTextarea || this.options.hasPanel) {
425.             var ie7s = (bkLib.isMSIE && !((typeof document.body.style.maxHeight != "undefined") && document.compatMode == "CSS1Compat"));
426.             var s = {width: newX+'px', border : '1px solid #ccc', borderTop : 0, overflowY : 'auto', overflowX: 'hidden' };
427.             s[(ie7s) ? 'height' : 'maxHeight'] = (this.ne.options.maxHeight) ? this.ne.options.maxHeight+'px' : null;
428.             this.editorContain = new bkElement('DIV').setStyle(s).appendBefore(e);
429.             var editorElm = new bkElement('DIV').setStyle({width : (newX-8)+'px', margin: '4px', minHeight : newY+'px'}).addClass('main').appendTo(this.editorContain);
431.             e.setStyle({display : 'none'});
432.                 
433.             editorElm.innerHTML = e.innerHTML;      
434.             if(isTextarea) {
435.                 editorElm.setContent(e.value);
436.                 this.copyElm = e;
437.                 var f = e.parentTag('FORM');
438.                 if(f) { bkLib.addEvent( f, 'submit', this.saveContent.closure(this)); }
439.             }
440.             editorElm.setStyle((ie7s) ? {height : newY+'px'} : {overflow: 'hidden'});
441.             this.elm = editorElm;   
442.         }
443.         this.ne.addEvent('blur',this.blur.closure(this));
445.         this.init();
446.         this.blur();
447.     },
448.     
449.     init : function() {
450.         this.elm.setAttribute('contentEditable','true');    
451.         if(this.getContent() == "") {
452.             this.setContent('<br />');
453.         }
454.         this.instanceDoc = document.defaultView;
455.         this.elm.addEvent('mousedown',this.selected.closureListener(this)).addEvent('keypress',this.keyDown.closureListener(this)).addEvent('focus',this.selected.closure(this)).addEvent('blur',this.blur.closure(this)).addEvent('keyup',this.selected.closure(this));
456.         this.ne.fireEvent('add',this);
457.     },
458.     
459.     remove : function() {
460.         this.saveContent();
461.         if(this.copyElm || this.options.hasPanel) {
462.             this.editorContain.remove();
463.             this.e.setStyle({'display' : 'block'});
464.             this.ne.removePanel();
465.         }
466.         this.disable();
467.         this.ne.fireEvent('remove',this);
468.     },
469.     
470.     disable : function() {
471.         this.elm.setAttribute('contentEditable','false');
472.     },
473.     
474.     getSel : function() {
475.         return (window.getSelection) ? window.getSelection() : document.selection;  
476.     },
477.     
478.     getRng : function() {
479.         var s = this.getSel();
480.         if(!s) { return null; }
481.         return (s.rangeCount > 0) ? s.getRangeAt(0) : s.createRange();
482.     },
483.     
484.     selRng : function(rng,s) {
485.         if(window.getSelection) {
486.             s.removeAllRanges();
487.             s.addRange(rng);
488.         } else {
489.             rng.select();
490.         }
491.     },
492.     
493.     selElm : function() {
494.         var r = this.getRng();
495.         if(r.startContainer) {
496.             var contain = r.startContainer;
497.             if(r.cloneContents().childNodes.length == 1) {
498.                 for(var i=0;i<contain.childNodes.length;i++) {
499.                     var rng = contain.childNodes[i].ownerDocument.createRange();
500.                     rng.selectNode(contain.childNodes[i]);                  
501.                     if(r.compareBoundaryPoints(Range.START_TO_START,rng) != 1 && 
502.                         r.compareBoundaryPoints(Range.END_TO_END,rng) != -1) {
503.                         return $BK(contain.childNodes[i]);
504.                     }
505.                 }
506.             }
507.             return $BK(contain);
508.         } else {
509.             return $BK((this.getSel().type == "Control") ? r.item(0) : r.parentElement());
510.         }
511.     },
512.     
513.     saveRng : function() {
514.         this.savedRange = this.getRng();
515.         this.savedSel = this.getSel();
516.     },
517.     
518.     restoreRng : function() {
519.         if(this.savedRange) {
520.             this.selRng(this.savedRange,this.savedSel);
521.         }
522.     },
523.     
524.     keyDown : function(e,t) {
525.         if(e.ctrlKey) {
526.             this.ne.fireEvent('key',this,e);
527.         }
528.     },
529.     
530.     selected : function(e,t) {
531.         if(!t) {t = this.selElm()}
532.         if(!e.ctrlKey) {
533.             var selInstance = this.ne.selectedInstance;
534.             if(selInstance != this) {
535.                 if(selInstance) {
536.                     this.ne.fireEvent('blur',selInstance,t);
537.                 }
538.                 this.ne.selectedInstance = this;    
539.                 this.ne.fireEvent('focus',selInstance,t);
540.             }
541.             this.ne.fireEvent('selected',selInstance,t);
542.             this.isFocused = true;
543.             this.elm.addClass('selected');
544.         }
545.         return false;
546.     },
547.     
548.     blur : function() {
549.         this.isFocused = false;
550.         this.elm.removeClass('selected');
551.     },
552.     
553.     saveContent : function() {
554.         if(this.copyElm || this.options.hasPanel) {
555.             this.ne.fireEvent('save',this);
556.             (this.copyElm) ? this.copyElm.value = this.getContent() : this.e.innerHTML = this.getContent();
557.         }   
558.     },
559.     
560.     getElm : function() {
561.         return this.elm;
562.     },
563.     
564.     getContent : function() {
565.         this.content = this.getElm().innerHTML;
566.         this.ne.fireEvent('get',this);
567.         return this.content;
568.     },
569.     
570.     setContent : function(e) {
571.         this.content = e;
572.         this.ne.fireEvent('set',this);
573.         this.elm.innerHTML = this.content;  
574.     },
575.     
576.     nicCommand : function(cmd,args) {
577.         document.execCommand(cmd,false,args);
578.     }       
579. });
581. var nicEditorIFrameInstance = nicEditorInstance.extend({
582.     savedStyles : [],
583.     
584.     init : function() { 
585.         var c = this.elm.innerHTML.replace(/^/s+|/s+$/g, '');
586.         this.elm.innerHTML = '';
587.         (!c) ? c = "<br />" : c;
588.         this.initialContent = c;
589.         
590.         this.elmFrame = new bkElement('iframe').setAttributes({'src' : 'javascript:;', 'frameBorder' : 0, 'allowTransparency' : 'true', 'scrolling' : 'no'}).setStyle({height: '100px', width: '100%'}).addClass('frame').appendTo(this.elm);
592.         if(this.copyElm) { 
593.             this.elmFrame.setStyle({width : (this.elm.offsetWidth-4)+'px'}); 
594.         }
595.         
596.         var styleList = ['font-size','font-family','font-weight','color'];
597.         for(itm in styleList) {
598.             this.savedStyles[bkLib.camelize(itm)] = this.elm.getStyle(itm);
599.         }
600.         
601.         setTimeout(this.initFrame.closure(this),50);
602.     },
603.     
604.     disable : function() {
605.         this.elm.innerHTML = this.getContent();
606.     },
607.     
608.     initFrame : function() {
609.         var fd = $BK(this.elmFrame.contentWindow.document);
610.         fd.designMode = "on";       
611.         fd.open();
612.         var css = this.ne.options.externalCSS;
613.         fd.write('<html><head>'+((css) ? '<link href="'+css+'" rel="stylesheet" type="text/css" />' : '')+'</head><body id="nicEditContent" style="margin: 0 !important; background-color: transparent !important;">'+this.initialContent+'</body></html>');
614.         fd.close();
615.         this.frameDoc = fd;
617.         this.frameWin = $BK(this.elmFrame.contentWindow);
618.         this.frameContent = $BK(this.frameWin.document.body).setStyle(this.savedStyles);
619.         this.instanceDoc = this.frameWin.document.defaultView;
620.         
621.         this.heightUpdate();
622.         this.frameDoc.addEvent('mousedown', this.selected.closureListener(this)).addEvent('keyup',this.heightUpdate.closureListener(this)).addEvent('keydown',this.keyDown.closureListener(this)).addEvent('keyup',this.selected.closure(this));
623.         this.ne.fireEvent('add',this);
624.     },
625.     
626.     getElm : function() {
627.         return this.frameContent;
628.     },
629.     
630.     setContent : function(c) {
631.         this.content = c;
632.         this.ne.fireEvent('set',this);
633.         this.frameContent.innerHTML = this.content; 
634.         this.heightUpdate();
635.     },
636.     
637.     getSel : function() {
638.         return (this.frameWin) ? this.frameWin.getSelection() : this.frameDoc.selection;
639.     },
640.     
641.     heightUpdate : function() { 
642.         this.elmFrame.style.height = Math.max(this.frameContent.offsetHeight,this.initialHeight)+'px';
643.     },
644.     
645.     nicCommand : function(cmd,args) {
646.         this.frameDoc.execCommand(cmd,false,args);
647.         setTimeout(this.heightUpdate.closure(this),100);
648.     }
650.     
651. });
652. var nicEditorPanel = bkClass.extend({
653.     construct : function(e,options,nicEditor) {
654.         this.elm = e;
655.         this.options = options;
656.         this.ne = nicEditor;
657.         this.panelButtons = new Array();
658.         this.buttonList = bkExtend([],this.ne.options.buttonList);
659.         
660.         this.panelContain = new bkElement('DIV').setStyle({overflow : 'hidden', width : '100%', border : '1px solid #cccccc', backgroundColor : '#efefef'}).addClass('panelContain');
661.         this.panelElm = new bkElement('DIV').setStyle({margin : '2px', marginTop : '0px', zoom : 1, overflow : 'hidden'}).addClass('panel').appendTo(this.panelContain);
662.         this.panelContain.appendTo(e);
664.         var opt = this.ne.options;
665.         var buttons = opt.buttons;
666.         for(button in buttons) {
667.                 this.addButton(button,opt,true);
668.         }
669.         this.reorder();
670.         e.noSelect();
671.     },
672.     
673.     addButton : function(buttonName,options,noOrder) {
674.         var button = options.buttons[buttonName];
675.         var type = (button['type']) ? eval('(typeof('+button['type']+') == "undefined") ? null : '+button['type']+';') : nicEditorButton;
676.         var hasButton = bkLib.inArray(this.buttonList,buttonName);
677.         if(type && (hasButton || this.ne.options.fullPanel)) {
678.             this.panelButtons.push(new type(this.panelElm,buttonName,options,this.ne));
679.             if(!hasButton) {    
680.                 this.buttonList.push(buttonName);
681.             }
682.         }
683.     },
684.     
685.     findButton : function(itm) {
686.         for(var i=0;i<this.panelButtons.length;i++) {
687.             if(this.panelButtons[i].name == itm)
688.                 return this.panelButtons[i];
689.         }   
690.     },
691.     
692.     reorder : function() {
693.         var bl = this.buttonList;
694.         for(var i=0;i<bl.length;i++) {
695.             var button = this.findButton(bl[i]);
696.             if(button) {
697.                 this.panelElm.appendChild(button.margin);
698.             }
699.         }   
700.     },
701.     
702.     remove : function() {
703.         this.elm.remove();
704.     }
705. });
706. var nicEditorButton = bkClass.extend({
707.     
708.     construct : function(e,buttonName,options,nicEditor) {
709.         this.options = options.buttons[buttonName];
710.         this.name = buttonName;
711.         this.ne = nicEditor;
712.         this.elm = e;
714.         this.margin = new bkElement('DIV').setStyle({'float' : 'left', marginTop : '2px'}).appendTo(e);
715.         this.contain = new bkElement('DIV').setStyle({width : '20px', height : '20px'}).addClass('buttonContain').appendTo(this.margin);
716.         this.border = new bkElement('DIV').setStyle({backgroundColor : '#efefef', border : '1px solid #efefef'}).appendTo(this.contain);
717.         this.button = new bkElement('DIV').setStyle({width : '18px', height : '18px', overflow : 'hidden', zoom : 1, cursor : 'pointer'}).addClass('button').setStyle(this.ne.getIcon(buttonName,options)).appendTo(this.border);
718.         this.button.addEvent('mouseover', this.hoverOn.closure(this)).addEvent('mouseout',this.hoverOff.closure(this)).addEvent('mousedown',this.mouseClick.closure(this)).noSelect();
719.         
720.         if(!window.opera) {
721.             this.button.onmousedown = this.button.onclick = bkLib.cancelEvent;
722.         }
723.         
724.         nicEditor.addEvent('selected', this.enable.closure(this)).addEvent('blur', this.disable.closure(this)).addEvent('key',this.key.closure(this));
725.         
726.         this.disable();
727.         this.init();
728.     },
729.     
730.     init : function() {  },
731.     
732.     hide : function() {
733.         this.contain.setStyle({display : 'none'});
734.     },
735.     
736.     updateState : function() {
737.         if(this.isDisabled) { this.setBg(); }
738.         else if(this.isHover) { this.setBg('hover'); }
739.         else if(this.isActive) { this.setBg('active'); }
740.         else { this.setBg(); }
741.     },
742.     
743.     setBg : function(state) {
744.         switch(state) {
745.             case 'hover':
746.                 var stateStyle = {border : '1px solid #666', backgroundColor : '#ddd'};
747.                 break;
748.             case 'active':
749.                 var stateStyle = {border : '1px solid #666', backgroundColor : '#ccc'};
750.                 break;
751.             default:
752.                 var stateStyle = {border : '1px solid #efefef', backgroundColor : '#efefef'};   
753.         }
754.         this.border.setStyle(stateStyle).addClass('button-'+state);
755.     },
756.     
757.     checkNodes : function(e) {
758.         var elm = e;    
759.         do {
760.             if(this.options.tags && bkLib.inArray(this.options.tags,elm.nodeName)) {
761.                 this.activate();
762.                 return true;
763.             }
764.         } while(elm = elm.parentNode && elm.className != "nicEdit");
765.         elm = $BK(e);
766.         while(elm.nodeType == 3) {
767.             elm = $BK(elm.parentNode);
768.         }
769.         if(this.options.css) {
770.             for(itm in this.options.css) {
771.                 if(elm.getStyle(itm,this.ne.selectedInstance.instanceDoc) == this.options.css[itm]) {
772.                     this.activate();
773.                     return true;
774.                 }
775.             }
776.         }
777.         this.deactivate();
778.         return false;
779.     },
780.     
781.     activate : function() {
782.         if(!this.isDisabled) {
783.             this.isActive = true;
784.             this.updateState(); 
785.             this.ne.fireEvent('buttonActivate',this);
786.         }
787.     },
788.     
789.     deactivate : function() {
790.         this.isActive = false;
791.         this.updateState(); 
792.         if(!this.isDisabled) {
793.             this.ne.fireEvent('buttonDeactivate',this);
794.         }
795.     },
796.     
797.     enable : function(ins,t) {
798.         this.isDisabled = false;
799.         this.contain.setStyle({'opacity' : 1}).addClass('buttonEnabled');
800.         this.updateState();
801.         this.checkNodes(t);
802.     },
803.     
804.     disable : function(ins,t) {     
805.         this.isDisabled = true;
806.         this.contain.setStyle({'opacity' : 0.6}).removeClass('buttonEnabled');
807.         this.updateState(); 
808.     },
809.     
810.     toggleActive : function() {
811.         (this.isActive) ? this.deactivate() : this.activate();  
812.     },
813.     
814.     hoverOn : function() {
815.         if(!this.isDisabled) {
816.             this.isHover = true;
817.             this.updateState();
818.             this.ne.fireEvent("buttonOver",this);
819.         }
820.     }, 
821.     
822.     hoverOff : function() {
823.         this.isHover = false;
824.         this.updateState();
825.         this.ne.fireEvent("buttonOut",this);
826.     },
827.     
828.     mouseClick : function() {
829.         if(this.options.command) {
830.             this.ne.nicCommand(this.options.command,this.options.commandArgs);
831.             if(!this.options.noActive) {
832.                 this.toggleActive();
833.             }
834.         }
835.         this.ne.fireEvent("buttonClick",this);
836.     },
837.     
838.     key : function(nicInstance,e) {
839.         if(this.options.key && e.ctrlKey && String.fromCharCode(e.keyCode || e.charCode).toLowerCase() == this.options.key) {
840.             this.mouseClick();
841.             if(e.preventDefault) e.preventDefault();
842.         }
843.     }
844.     
845. });
847.  
848. var nicPlugin = bkClass.extend({
849.     
850.     construct : function(nicEditor,options) {
851.         this.options = options;
852.         this.ne = nicEditor;
853.         this.ne.addEvent('panel',this.loadPanel.closure(this));
854.         
855.         this.init();
856.     },
858.     loadPanel : function(np) {
859.         var buttons = this.options.buttons;
860.         for(var button in buttons) {
861.             np.addButton(button,this.options);
862.         }
863.         np.reorder();
864.     },
866.     init : function() {  }
867. });
871.  
872.  /* START CONFIG */
873. var nicPaneOptions = { };
874. /* END CONFIG */
876. var nicEditorPane = bkClass.extend({
877.     construct : function(elm,nicEditor,options,openButton) {
878.         this.ne = nicEditor;
879.         this.elm = elm;
880.         this.pos = elm.pos();
881.         
882.         this.contain = new bkElement('div').setStyle({zIndex : '99999', overflow : 'hidden', position : 'absolute', left : this.pos[0]+'px', top : this.pos[1]+'px'});
883.         this.pane = new bkElement('div').setStyle({fontSize : '12px', border : '1px solid #ccc', 'overflow': 'hidden', padding : '4px', textAlign: 'left', backgroundColor : '#ffffc9'}).addClass('pane').setStyle(options).appendTo(this.contain);
884.         
885.         if(openButton && !openButton.options.noClose) {
886.             this.close = new bkElement('div').setStyle({'float' : 'right', height: '16px', width : '16px', cursor : 'pointer'}).setStyle(this.ne.getIcon('close',nicPaneOptions)).addEvent('mousedown',openButton.removePane.closure(this)).appendTo(this.pane);
887.         }
888.         
889.         this.contain.noSelect().appendTo(document.body);
890.         
891.         this.position();
892.         this.init();    
893.     },
894.     
895.     init : function() { },
896.     
897.     position : function() {
898.         if(this.ne.nicPanel) {
899.             var panelElm = this.ne.nicPanel.elm;    
900.             var panelPos = panelElm.pos();
901.             var newLeft = panelPos[0]+parseInt(panelElm.getStyle('width'))-(parseInt(this.pane.getStyle('width'))+8);
902.             if(newLeft < this.pos[0]) {
903.                 this.contain.setStyle({left : newLeft+'px'});
904.             }
905.         }
906.     },
907.     
908.     toggle : function() {
909.         this.isVisible = !this.isVisible;
910.         this.contain.setStyle({display : ((this.isVisible) ? 'block' : 'none')});
911.     },
912.     
913.     remove : function() {
914.         if(this.contain) {
915.             this.contain.remove();
916.             this.contain = null;
917.         }
918.     },
919.     
920.     append : function(c) {
921.         c.appendTo(this.pane);
922.     },
923.     
924.     setContent : function(c) {
925.         this.pane.setContent(c);
926.     }
927.     
928. });
931.  
932. var nicEditorAdvancedButton = nicEditorButton.extend({
933.     
934.     init : function() {
935.         this.ne.addEvent('selected',this.removePane.closure(this)).addEvent('blur',this.removePane.closure(this));  
936.     },
937.     
938.     mouseClick : function() {
939.         if(!this.isDisabled) {
940.             if(this.pane && this.pane.pane) {
941.                 this.removePane();
942.             } else {
943.                 this.pane = new nicEditorPane(this.contain,this.ne,{width : (this.width || '270px'), backgroundColor : '#fff'},this);
944.                 this.addPane();
945.                 this.ne.selectedInstance.saveRng();
946.             }
947.         }
948.     },
949.     
950.     addForm : function(f,elm) {
951.         this.form = new bkElement('form').addEvent('submit',this.submit.closureListener(this));
952.         this.pane.append(this.form);
953.         this.inputs = {};
954.         
955.         for(itm in f) {
956.             var field = f[itm];
957.             var val = '';
958.             if(elm) {
959.                 val = elm.getAttribute(itm);
960.             }
961.             if(!val) {
962.                 val = field['value'] || '';
963.             }
964.             var type = f[itm].type;
965.             
966.             if(type == 'title') {
967.                     new bkElement('div').setContent(field.txt).setStyle({fontSize : '14px', fontWeight: 'bold', padding : '0px', margin : '2px 0'}).appendTo(this.form);
968.             } else {
969.                 var contain = new bkElement('div').setStyle({overflow : 'hidden', clear : 'both'}).appendTo(this.form);
970.                 if(field.txt) {
971.                     new bkElement('label').setAttributes({'for' : itm}).setContent(field.txt).setStyle({margin : '2px 4px', fontSize : '13px', width: '55px', lineHeight : '20px', textAlign : 'right', 'float' : 'left'}).appendTo(contain);
972.                 }
973.                 
974.                 switch(type) {
975.                     case 'text':
976.                         this.inputs[itm] = new bkElement('input').setAttributes({id : itm, 'value' : val, 'type' : 'text'}).setStyle({margin : '2px 0', fontSize : '13px', 'float' : 'left', height : '20px', border : '1px solid #ccc', overflow : 'hidden'}).setStyle(field.style).appendTo(contain);
977.                         break;
978.                     case 'select':
979.                         this.inputs[itm] = new bkElement('select').setAttributes({id : itm}).setStyle({border : '1px solid #ccc', 'float' : 'left', margin : '2px 0'}).appendTo(contain);
980.                         for(opt in field.options) {
981.                             var o = new bkElement('option').setAttributes({value : opt, selected : (opt == val) ? 'selected' : ''}).setContent(field.options[opt]).appendTo(this.inputs[itm]);
982.                         }
983.                         break;
984.                     case 'content':
985.                         this.inputs[itm] = new bkElement('textarea').setAttributes({id : itm}).setStyle({border : '1px solid #ccc', 'float' : 'left'}).setStyle(field.style).appendTo(contain);
986.                         this.inputs[itm].value = val;
987.                 }   
988.             }
989.         }
990.         new bkElement('input').setAttributes({'type' : 'submit'}).setAttributes({'value' : '确定'}).setStyle({backgroundColor : '#efefef',border : '1px solid #ccc', margin : '3px 0', 'float' : 'left', 'clear' : 'both'}).appendTo(this.form);
991.         this.form.onsubmit = bkLib.cancelEvent; 
992.     },
993.     
994.     submit : function() { },
995.     
996.     findElm : function(tag,attr,val) {
997.         var list = this.ne.selectedInstance.getElm().getElementsByTagName(tag);
998.         for(var i=0;i<list.length;i++) {
999.             if(list[i].getAttribute(attr) == val) {
1000.                 return $BK(list[i]);
1001.             }
1002.         }
1003.     },
1004.     
1005.     removePane : function() {
1006.         if(this.pane) {
1007.             this.pane.remove();
1008.             this.pane = null;
1009.             this.ne.selectedInstance.restoreRng();
1010.         }   
1011.     }   
1012. });
1015. var nicButtonTips = bkClass.extend({
1016.     construct : function(nicEditor) {
1017.         this.ne = nicEditor;
1018.         nicEditor.addEvent('buttonOver',this.show.closure(this)).addEvent('buttonOut',this.hide.closure(this));
1020.     },
1021.     
1022.     show : function(button) {
1023.         this.timer = setTimeout(this.create.closure(this,button),400);
1024.     },
1025.     
1026.     create : function(button) {
1027.         this.timer = null;
1028.         if(!this.pane) {
1029.             this.pane = new nicEditorPane(button.button,this.ne,{fontSize : '12px', marginTop : '5px'});
1030.             this.pane.setContent(button.options.name);
1031.         }       
1032.     },
1033.     
1034.     hide : function(button) {
1035.         if(this.timer) {
1036.             clearTimeout(this.timer);
1037.         }
1038.         if(this.pane) {
1039.             this.pane = this.pane.remove();
1040.         }
1041.     }
1042. });
1043. nicEditors.registerPlugin(nicButtonTips);
1046.  
1047.  /* START CONFIG */
1048. var nicSelectOptions = {
1049.     buttons : {
1050.         'fontSize' : {name : __('字体大小'), type : 'nicEditorFontSizeSelect', command : 'fontsize'},
1051.         'fontFamily' : {name : __('字体类型'), type : 'nicEditorFontFamilySelect', command : 'fontname'},
1052.         'fontFormat' : {name : __('字体格式'), type : 'nicEditorFontFormatSelect', command : 'formatBlock'}
1053.     }
1054. };
1055. /* END CONFIG */
1056. var nicEditorSelect = bkClass.extend({
1057.     
1058.     construct : function(e,buttonName,options,nicEditor) {
1059.         this.options = options.buttons[buttonName];
1060.         this.elm = e;
1061.         this.ne = nicEditor;
1062.         this.name = buttonName;
1063.         this.selOptions = new Array();
1064.         
1065.         this.margin = new bkElement('div').setStyle({'float' : 'left', margin : '2px 1px 0 1px'}).appendTo(this.elm);
1066.         this.contain = new bkElement('div').setStyle({width: '90px', height : '20px', cursor : 'pointer', overflow: 'hidden'}).addClass('selectContain').addEvent('click',this.toggle.closure(this)).appendTo(this.margin);
1067.         this.items = new bkElement('div').setStyle({overflow : 'hidden', zoom : 1, border: '1px solid #ccc', paddingLeft : '3px', backgroundColor : '#fff'}).appendTo(this.contain);
1068.         this.control = new bkElement('div').setStyle({overflow : 'hidden', 'float' : 'right', height: '18px', width : '16px'}).addClass('selectControl').setStyle(this.ne.getIcon('arrow',options)).appendTo(this.items);
1069.         this.txt = new bkElement('div').setStyle({overflow : 'hidden', 'float' : 'left', width : '66px', height : 'auto',fontFamily : 'sans-serif', textAlign : 'center', fontSize : '12px'}).addClass('selectTxt').appendTo(this.items);
1070.         
1071.         if(!window.opera) {
1072.             this.contain.onmousedown = this.control.onmousedown = this.txt.onmousedown = bkLib.cancelEvent;
1073.         }
1074.         
1075.         this.margin.noSelect();
1076.         
1077.         this.ne.addEvent('selected', this.enable.closure(this)).addEvent('blur', this.disable.closure(this));
1078.         
1079.         this.disable();
1080.         this.init();
1081.     },
1082.     
1083.     disable : function() {
1084.         this.isDisabled = true;
1085.         this.close();
1086.         this.contain.setStyle({opacity : 0.6});
1087.     },
1088.     
1089.     enable : function(t) {
1090.         this.isDisabled = false;
1091.         this.close();
1092.         this.contain.setStyle({opacity : 1});
1093.     },
1094.     
1095.     setDisplay : function(txt) {
1096.         this.txt.setContent(txt);
1097.     },
1098.     
1099.     toggle : function() {
1100.         if(!this.isDisabled) {
1101.             (this.pane) ? this.close() : this.open();
1102.         }
1103.     },
1104.     
1105.     open : function() {
1106.         this.pane = new nicEditorPane(this.items,this.ne,{width : '88px', padding: '0px', borderTop : 0, borderLeft : '1px solid #ccc', borderRight : '1px solid #ccc', borderBottom : '0px', backgroundColor : '#fff'});
1107.         
1108.         for(var i=0;i<this.selOptions.length;i++) {
1109.             var opt = this.selOptions[i];
1110.             var itmContain = new bkElement('div').setStyle({overflow : 'hidden', borderBottom : '1px solid #ccc', width: '88px', textAlign : 'left', overflow : 'hidden', cursor : 'pointer'});
1111.             var itm = new bkElement('div').setStyle({padding : '0px 4px'}).setContent(opt[1]).appendTo(itmContain).noSelect();
1112.             itm.addEvent('click',this.update.closure(this,opt[0])).addEvent('mouseover',this.over.closure(this,itm)).addEvent('mouseout',this.out.closure(this,itm)).setAttributes('id',opt[0]);
1113.             this.pane.append(itmContain);
1114.             if(!window.opera) {
1115.                 itm.onmousedown = bkLib.cancelEvent;
1116.             }
1117.         }
1118.     },
1119.     
1120.     close : function() {
1121.         if(this.pane) {
1122.             this.pane = this.pane.remove();
1123.         }   
1124.     },
1125.     
1126.     over : function(opt) {
1127.         opt.setStyle({backgroundColor : '#ccc'});           
1128.     },
1129.     
1130.     out : function(opt) {
1131.         opt.setStyle({backgroundColor : '#fff'});
1132.     },
1133.     
1134.     
1135.     add : function(k,v) {
1136.         this.selOptions.push(new Array(k,v));   
1137.     },
1138.     
1139.     update : function(elm) {
1140.         this.ne.nicCommand(this.options.command,elm);
1141.         this.close();   
1142.     }
1143. });
1145. var nicEditorFontSizeSelect = nicEditorSelect.extend({
1146.     sel : {1 : '1 (8pt)', 2 : '2 (10pt)', 3 : '3 (12pt)', 4 : '4 (14pt)', 5 : '5 (18pt)', 6 : '6 (24pt)'},
1147.     init : function() {
1148.         this.setDisplay('字体大小');
1149.         for(itm in this.sel) {
1150.             this.add(itm,'<font size="'+itm+'">'+this.sel[itm]+'</font>');
1151.         }       
1152.     }
1153. });
1155. var nicEditorFontFamilySelect = nicEditorSelect.extend({
1156.     sel : {'arial' : 'Arial','comic sans ms' : 'Comic Sans','courier new' : 'Courier New','georgia' : 'Georgia', 'helvetica' : 'Helvetica', 'impact' : 'Impact', 'times new roman' : 'Times', 'trebuchet ms' : 'Trebuchet', 'verdana' : 'Verdana'},
1157.     
1158.     init : function() {
1159.         this.setDisplay('字体类型');
1160.         for(itm in this.sel) {
1161.             this.add(itm,'<font face="'+itm+'">'+this.sel[itm]+'</font>');
1162.         }
1163.     }
1164. });
1166. var nicEditorFontFormatSelect = nicEditorSelect.extend({
1167.     sel:{p:"段落",pre:"原始文本",h6:"标题 6",h5:"标题 5",h4:"标题 4",h3:"标题 3",h2:"标题 2",h1:"标题 1"},  
1168.     init : function() {
1169.         this.setDisplay('字体格式');
1170.         for(itm in this.sel) {
1171.             var tag = itm.toUpperCase();
1172.             this.add('<'+tag+'>','<'+itm+' style="padding: 0px; margin: 0px;">'+this.sel[itm]+'</'+tag+'>');
1173.         }
1174.     }
1175. });
1177. nicEditors.registerPlugin(nicPlugin,nicSelectOptions);
1181. /* START CONFIG */
1182. var nicLinkOptions = {
1183.     buttons : {
1184.         'link' : {name : '添加链接', type : 'nicLinkButton', tags : ['A']},
1185.         'unlink' : {name : '移除链接',  command : 'unlink', noActive : true}
1186.     }
1187. };
1188. /* END CONFIG */
1190. var nicLinkButton = nicEditorAdvancedButton.extend({    
1191.     addPane : function() {
1192.         this.ln = this.ne.selectedInstance.selElm().parentTag('A');
1193.         this.addForm({
1194.             '' : {type : 'title', txt : '添加/编辑 链接'},
1195.             'href' : {type : 'text', txt : '链接地址', value : 'http://', style : {width: '150px'}},
1196.             'title' : {type : 'text', txt : '名称'},
1197.             'target' : {type : 'select', txt : '打开方式', options : {'' : '当前窗口', '_blank' : '新窗口'},style : {width : '100px'}}
1198.         },this.ln);
1199.     },
1200.     
1201.     submit : function(e) {
1202.         var url = this.inputs['href'].value;
1203.         if(url == "http://" || url == "") {
1204.             alert("请输入网址");
1205.             return false;
1206.         }
1207.         this.removePane();
1208.         
1209.         if(!this.ln) {
1210.             var tmp = 'javascript:nicTemp();';
1211.             this.ne.nicCommand("createlink",tmp);
1212.             this.ln = this.findElm('A','href',tmp);
1213.         }
1214.         if(this.ln) {
1215.             this.ln.setAttributes({
1216.                 href : this.inputs['href'].value,
1217.                 title : this.inputs['title'].value,
1218.                 target : this.inputs['target'].options[this.inputs['target'].selectedIndex].value
1219.             });
1220.         }
1221.     }
1222. });
1224. nicEditors.registerPlugin(nicPlugin,nicLinkOptions);
1228. /* START CONFIG */
1229. var nicColorOptions = {
1230.     buttons : {
1231.         'forecolor' : {name : __('字体颜色'), type : 'nicEditorColorButton', noClose : true},
1232.         'bgcolor' : {name : __('背景颜色'), type : 'nicEditorBgColorButton', noClose : true}
1233.     }
1234. };
1235. /* END CONFIG */
1237. var nicEditorColorButton = nicEditorAdvancedButton.extend({ 
1238.     addPane : function() {
1239.             var colorList = {0 : '00',1 : '33',2 : '66',3 :'99',4 : 'CC',5 : 'FF'};
1240.             var colorItems = new bkElement('DIV').setStyle({width: '270px'});
1241.             
1242.             for(var r in colorList) {
1243.                 for(var b in colorList) {
1244.                     for(var g in colorList) {
1245.                         var colorCode = '#'+colorList[r]+colorList[g]+colorList[b];
1246.                         
1247.                         var colorSquare = new bkElement('DIV').setStyle({'cursor' : 'pointer', 'height' : '15px', 'float' : 'left'}).appendTo(colorItems);
1248.                         var colorBorder = new bkElement('DIV').setStyle({border: '2px solid '+colorCode}).appendTo(colorSquare);
1249.                         var colorInner = new bkElement('DIV').setStyle({backgroundColor : colorCode, overflow : 'hidden', width : '11px', height : '11px'}).addEvent('click',this.colorSelect.closure(this,colorCode)).addEvent('mouseover',this.on.closure(this,colorBorder)).addEvent('mouseout',this.off.closure(this,colorBorder,colorCode)).appendTo(colorBorder);
1250.                         
1251.                         if(!window.opera) {
1252.                             colorSquare.onmousedown = colorInner.onmousedown = bkLib.cancelEvent;
1253.                         }
1255.                     }   
1256.                 }   
1257.             }
1258.             this.pane.append(colorItems.noSelect());    
1259.     },
1260.     
1261.     colorSelect : function(c) {
1262.         this.ne.nicCommand('foreColor',c);
1263.         this.removePane();
1264.     },
1265.     
1266.     on : function(colorBorder) {
1267.         colorBorder.setStyle({border : '2px solid #000'});
1268.     },
1269.     
1270.     off : function(colorBorder,colorCode) {
1271.         colorBorder.setStyle({border : '2px solid '+colorCode});        
1272.     }
1273. });
1275. var nicEditorBgColorButton = nicEditorColorButton.extend({
1276.     colorSelect : function(c) {
1277.         this.ne.nicCommand('hiliteColor',c);
1278.         this.removePane();
1279.     }   
1280. });
1282. nicEditors.registerPlugin(nicPlugin,nicColorOptions);
1286. /* START CONFIG */
1287. var nicImageOptions = {
1288.     buttons : {
1289.         'image' : {name : '添加图片', type : 'nicImageButton', tags : ['IMG']}
1290.     }
1291.     
1292. };
1293. /* END CONFIG */
1295. var nicImageButton = nicEditorAdvancedButton.extend({   
1296.     addPane : function() {
1297.         this.im = this.ne.selectedInstance.selElm().parentTag('IMG');
1298.         this.addForm({
1299.             '' : {type : 'title', txt : '添加/编辑 图片'},
1300.             'src' : {type : 'text', txt : '图片地址', 'value' : 'http://', style : {width: '150px'}},
1301.             'alt' : {type : 'text', txt : '说明文字', style : {width: '100px'}},
1302.             'align' : {type : 'select', txt : '对齐方式', options : {none : '默认','left' : '左对齐', 'right' : '右对齐'}}
1303.         },this.im);
1304.     },
1305.     
1306.     submit : function(e) {
1307.         var src = this.inputs['src'].value;
1308.         if(src == "" || src == "http://") {
1309.             alert("请添加图片");
1310.             return false;
1311.         }
1312.         this.removePane();
1314.         if(!this.im) {
1315.             var tmp = 'javascript:nicImTemp();';
1316.             this.ne.nicCommand("insertImage",tmp);
1317.             this.im = this.findElm('IMG','src',tmp);
1318.         }
1319.         if(this.im) {
1320.             this.im.setAttributes({
1321.                 src : this.inputs['src'].value,
1322.                 alt : this.inputs['alt'].value,
1323.                 align : this.inputs['align'].value
1324.             });
1325.         }
1326.     }
1327. });
1329. nicEditors.registerPlugin(nicPlugin,nicImageOptions);
1334. /* START CONFIG */
1335. var nicSaveOptions = {
1336.     buttons : {
1337.         'save' : {name : __('保存'), type : 'nicEditorSaveButton'}
1338.     }
1339. };
1340. /* END CONFIG */
1342. var nicEditorSaveButton = nicEditorButton.extend({
1343.     init : function() {
1344.         if(!this.ne.options.onSave) {
1345.             this.margin.setStyle({'display' : 'none'});
1346.         }
1347.     },
1348.     mouseClick : function() {
1349.         var onSave = this.ne.options.onSave;
1350.         var selectedInstance = this.ne.selectedInstance;
1351.         onSave(selectedInstance.getContent(), selectedInstance.elm.id, selectedInstance);
1352.     }
1353. });
1355. nicEditors.registerPlugin(nicPlugin,nicSaveOptions);
1359. /* START CONFIG */
1360. var nicUploadOptions = {
1361.     buttons : {
1362.         'upload' : {name : '上传图片', type : 'nicUploadButton'}
1363.     }
1364.     
1365. };
1366. /* END CONFIG */
1368. var nicUploadButton = nicEditorAdvancedButton.extend({  
1369.     serverURI : '/photo.php?action=addphoto&act=doupload',
1370.     formElm:{html:''},
1371.     loading:'/img/loading.gif',
1372.     addPane : function() {
1373.         this.im = this.ne.selectedInstance.selElm().parentTag('IMG');
1374.         this.myID = Math.round(Math.random()*Math.pow(10,15));
1375.         this.requestInterval = 1000;
1377.         this.myFrame = new bkElement('iframe').setAttributes({ width : '100%', height : '100px', frameBorder : 0, scrolling : 'no' }).setStyle({border : 0}).appendTo(this.pane.pane);
1378.         this.progressWrapper = new bkElement('div').setStyle({display: 'none', width: '100%', height: '20px', border : '1px solid #ccc'}).appendTo(this.pane.pane);
1379.         this.progress = new bkElement('div').setStyle({width: '0%', height: '20px', backgroundColor : '#ccc'}).setContent(' ').appendTo(this.progressWrapper);
1381.         setTimeout(this.addForm.closure(this),50);
1382.     },
1383.     addForm : function() {
1384.         var myDoc = this.myDoc = this.myFrame.contentWindow.document;
1385.         myDoc.open();
1386.         myDoc.write("<html><body>");
1387.         myDoc.write('<form method="post" action="'+this.serverURI+'&check='+this.myID+'" enctype="multipart/form-data">');
1388.         myDoc.write('<input type="hidden" name="APC_UPLOAD_PROGRESS" value="'+this.myID+'" />');
1389.         myDoc.write('<div style="font-size: 14px; font-weight: bold; padding-top: 5px;">上传图片</div>');
1390.         myDoc.write(this.formElm.html||'没有创建分类');
1391.         myDoc.write('<input name="photo_file" id="photo_file" type="file" style="margin-top: 10px;" />');
1392.         myDoc.write('</form>');
1393.         myDoc.write("</body></html>");
1394.         myDoc.close();
1396.         this.myBody = myDoc.body;
1398.         this.myForm = $BK(this.myBody.getElementsByTagName('form')[0]);
1399.         this.myInput = $BK(this.myBody.getElementsByTagName('input')[1]).addEvent('change', this.startUpload.closure(this));
1400.         this.myStatus = new bkElement('div',this.myDoc).setStyle({textAlign : 'center', fontSize : '14px'}).appendTo(this.myBody);
1401.   },
1403.     startUpload : function() {
1404.         this.myForm.setStyle({display : 'none'});
1405.         this.myStatus.setContent('<img src="'+this.loading+'" style="float: right; margin-right: 40px;" /><strong>上传中...</strong><br />请稍等');
1406.         this.setProgress(10);
1407.         this.myForm.submit();
1408.         setTimeout(this.makeRequest.closure(this),this.requestInterval);
1409.     },
1411.     makeRequest : function() {
1412.         if(this.pane && this.pane.pane) {
1413.             nicUploadButton.lastPlugin = this;
1414.             var s = new bkElement('script').setAttributes({ type : 'text/javascript', src : this.serverURI+'&check='+this.myID+'&rand='+Math.round(Math.random()*Math.pow(10,15))}).addEvent('load', function() {
1415.                 s.parentNode.removeChild(s);
1416.             }).appendTo(document.getElementsByTagName('head')[0]);
1417.             if(this.requestInterval) {
1418.                 setTimeout(this.makeRequest.closure(this), this.requestInterval);
1419.             }
1420.         }
1421.     },
1423.     setProgress : function(percent) {
1424.         this.progressWrapper.setStyle({display: 'block'});
1425.         this.progress.setStyle({width : percent+'%'});
1426.     },
1428.     update : function(o) {
1429.         if(!this.requestInterval) return;
1431.         if(o == false) {
1432.             this.progressWrapper.setStyle({display : 'none'});
1433.         } else if(o.url) {
1434.             this.setProgress(100);
1435.             this.requestInterval = false;
1437.             if(!this.im) {
1438.                 this.ne.selectedInstance.restoreRng();
1439.                 var tmp = 'javascript:nicImTemp();';
1440.                 this.ne.nicCommand("insertImage",tmp);
1441.                 this.im = this.findElm('IMG','src',tmp);
1442.             }
1443.             var w = parseInt(this.ne.selectedInstance.elm.getStyle('width'));
1444.             if(this.im) {
1445.                 this.im.setAttributes({
1446.                     src : o.url,
1447.                     width : (w && o.width) ? Math.min(w,o.width) : ''
1448.                 });
1449.             }
1450.             this.removePane();
1451.         } else if(o.error) {
1452.             this.requestInterval = false;
1453.             this.setProgress(100);
1454.             alert("上传失败 ("+o.error+").");
1455.             this.removePane();
1456.         } else {
1457.             this.setProgress( Math.round( (o.current/o.total) * 75) );
1458.             if(o.interval) {
1459.                 this.requestInterval = o.interval;
1460.             }
1461.         }
1462.     }
1464. });
1466. nicUploadButton.statusCb = function(o) {
1467.     nicUploadButton.lastPlugin.update(o);
1468. };
1470. nicEditors.registerPlugin(nicPlugin,nicUploadOptions);
1474. var nicXHTML = bkClass.extend({
1475.     stripAttributes : ['_moz_dirty','_moz_resizing','_extended'],
1476.     noShort : ['style','title','script','textarea','a'],
1477.     cssReplace : {'font-weight:bold;' : 'strong', 'font-style:italic;' : 'em'},
1478.     sizes : {1 : 'xx-small', 2 : 'x-small', 3 : 'small', 4 : 'medium', 5 : 'large', 6 : 'x-large'},
1479.     
1480.     construct : function(nicEditor) {
1481.         this.ne = nicEditor;
1482.         if(this.ne.options.xhtml) {
1483.             nicEditor.addEvent('get',this.cleanup.closure(this));
1484.         }
1485.     },
1486.     
1487.     cleanup : function(ni) {
1488.         var node = ni.getElm();
1489.         var xhtml = this.toXHTML(node);
1490.         ni.content = xhtml;
1491.     },
1492.     
1493.     toXHTML : function(n,r,d) {
1494.         var txt = '';
1495.         var attrTxt = '';
1496.         var cssTxt = '';
1497.         var nType = n.nodeType;
1498.         var nName = n.nodeName.toLowerCase();
1499.         var nChild = n.hasChildNodes && n.hasChildNodes();
1500.         var extraNodes = new Array();
1501.         
1502.         switch(nType) {
1503.             case 1:
1504.                 var nAttributes = n.attributes;
1505.                 
1506.                 switch(nName) {
1507.                     case 'b':
1508.                         nName = 'strong';
1509.                         break;
1510.                     case 'i':
1511.                         nName = 'em';
1512.                         break;
1513.                     case 'font':
1514.                         nName = 'span';
1515.                         break;
1516.                 }
1517.                 
1518.                 if(r) {
1519.                     for(var i=0;i<nAttributes.length;i++) {
1520.                         var attr = nAttributes[i];
1521.                         
1522.                         var attributeName = attr.nodeName.toLowerCase();
1523.                         var attributeValue = attr.nodeValue;
1524.                         
1525.                         if(!attr.specified || !attributeValue || bkLib.inArray(this.stripAttributes,attributeName) || typeof(attributeValue) == "function") {
1526.                             continue;
1527.                         }
1528.                         
1529.                         switch(attributeName) {
1530.                             case 'style':
1531.                                 var css = attributeValue.replace(/ /g,"");
1532.                                 for(itm in this.cssReplace) {
1533.                                     if(css.indexOf(itm) != -1) {
1534.                                         extraNodes.push(this.cssReplace[itm]);
1535.                                         css = css.replace(itm,'');
1536.                                     }
1537.                                 }
1538.                                 cssTxt += css;
1539.                                 attributeValue = "";
1540.                             break;
1541.                             case 'class':
1542.                                 attributeValue = attributeValue.replace("Apple-style-span","");
1543.                             break;
1544.                             case 'size':
1545.                                 cssTxt += "font-size:"+this.sizes[attributeValue]+';';
1546.                                 attributeValue = "";
1547.                             break;
1548.                         }
1549.                         
1550.                         if(attributeValue) {
1551.                             attrTxt += ' '+attributeName+'="'+attributeValue+'"';
1552.                         }
1553.                     }
1555.                     if(cssTxt) {
1556.                         attrTxt += ' style="'+cssTxt+'"';
1557.                     }
1559.                     for(var i=0;i<extraNodes.length;i++) {
1560.                         txt += '<'+extraNodes[i]+'>';
1561.                     }
1562.                 
1563.                     if(attrTxt == "" && nName == "span") {
1564.                         r = false;
1565.                     }
1566.                     if(r) {
1567.                         txt += '<'+nName;
1568.                         if(nName != 'br') {
1569.                             txt += attrTxt;
1570.                         }
1571.                     }
1572.                 }
1573.                 
1575.                 
1576.                 if(!nChild && !bkLib.inArray(this.noShort,attributeName)) {
1577.                     if(r) {
1578.                         txt += ' />';
1579.                     }
1580.                 } else {
1581.                     if(r) {
1582.                         txt += '>';
1583.                     }
1584.                     
1585.                     for(var i=0;i<n.childNodes.length;i++) {
1586.                         var results = this.toXHTML(n.childNodes[i],true,true);
1587.                         if(results) {
1588.                             txt += results;
1589.                         }
1590.                     }
1591.                 }
1592.                     
1593.                 if(r && nChild) {
1594.                     txt += '</'+nName+'>';
1595.                 }
1596.                 
1597.                 for(var i=0;i<extraNodes.length;i++) {
1598.                     txt += '</'+extraNodes[i]+'>';
1599.                 }
1601.                 break;
1602.             case 3:
1603.                 //if(n.nodeValue != '/n') {
1604.                     txt += n.nodeValue;
1605.                 //}
1606.                 break;
1607.         }
1608.         
1609.         return txt;
1610.     }
1611. });
1612. nicEditors.registerPlugin(nicXHTML);
1616. var nicBBCode = bkClass.extend({
1617.     construct : function(nicEditor) {
1618.         this.ne = nicEditor;
1619.         if(this.ne.options.bbCode) {
1620.             nicEditor.addEvent('get',this.bbGet.closure(this));
1621.             nicEditor.addEvent('set',this.bbSet.closure(this));
1622.             
1623.             var loadedPlugins = this.ne.loadedPlugins;
1624.             for(itm in loadedPlugins) {
1625.                 if(loadedPlugins[itm].toXHTML) {
1626.                     this.xhtml = loadedPlugins[itm];
1627.                 }
1628.             }
1629.         }
1630.     },
1631.     
1632.     bbGet : function(ni) {
1633.         var xhtml = this.xhtml.toXHTML(ni.getElm());
1634.         ni.content = this.toBBCode(xhtml);
1635.     },
1636.     
1637.     bbSet : function(ni) {
1638.         ni.content = this.fromBBCode(ni.content);
1639.     },
1640.     
1641.     toBBCode : function(xhtml) {
1642.         function rp(r,m) {
1643.             xhtml = xhtml.replace(r,m);
1644.         }
1645.         
1646.         rp(//n/gi,"");
1647.         rp(/<strong>(.*?)<//strong>/gi,"[b]$1[/b]");
1648.         rp(/<em>(.*?)<//em>/gi,"[i]$1[/i]");
1649.         rp(/<span.*?style="text-decoration:underline;">(.*?)<//span>/gi,"[u]$1[/u]");
1650.         rp(/<ul>(.*?)<//ul>/gi,"[list]$1[/list]");
1651.         rp(/<li>(.*?)<//li>/gi,"[*]$1[/*]");
1652.         rp(/<ol>(.*?)<//ol>/gi,"[list=1]$1[/list]");
1653.         rp(/<img.*?src="(.*?)".*?>/gi,"[img]$1[/img]");
1654.         rp(/<a.*?href="(.*?)".*?>(.*?)<//a>/gi,"[url=$1]$2[/url]");
1655.         rp(/<br.*?>/gi,"/n");
1656.         rp(/<.*?>.*?<//.*?>/gi,"");
1657.         
1658.         return xhtml;
1659.     },
1660.     
1661.     fromBBCode : function(bbCode) {
1662.         function rp(r,m) {
1663.             bbCode = bbCode.replace(r,m);
1664.         }       
1665.         
1666.         rp(//[b/](.*?)/[//b/]/gi,"<strong>$1</strong>");
1667.         rp(//[i/](.*?)/[//i/]/gi,"<em>$1</em>");
1668.         rp(//[u/](.*?)/[//u/]/gi,"<span style=/"text-decoration:underline;/">$1</span>");
1669.         rp(//[list/](.*?)/[//list/]/gi,"<ul>$1</ul>");
1670.         rp(//[list=1/](.*?)/[//list/]/gi,"<ol>$1</ol>");
1671.         rp(//[/*/](.*?)/[///*/]/gi,"<li>$1</li>");
1672.         rp(//[img/](.*?)/[//img/]/gi,"<img src=/"$1/" />");
1673.         rp(//[url=(.*?)/](.*?)/[//url/]/gi,"<a href=/"$1/">$2</a>");
1674.         rp(//n/gi,"<br />");
1675.         //rp(//[.*?/](.*?)/[//.*?/]/gi,"$1");
1676.         
1677.         return bbCode;
1678.     }
1680.     
1681. });
1682. nicEditors.registerPlugin(nicBBCode);
1686. /* START CONFIG */
1687. var nicCodeOptions = {
1688.     buttons : {
1689.         'xhtml' : {name : '源文件', type : 'nicCodeButton'}
1690.     }
1691.     
1692. };
1693. /* END CONFIG */
1695. var nicCodeButton = nicEditorAdvancedButton.extend({
1696.     width : '350px',
1697.         
1698.     addPane : function() {
1699.         this.addForm({
1700.             '' : {type : 'title', txt : '编辑 HTML'},
1701.             'code' : {type : 'content', 'value' : this.ne.selectedInstance.getContent(), style : {width: '340px', height : '200px'}}
1702.         });
1703.     },
1704.     
1705.     submit : function(e) {
1706.         var code = this.inputs['code'].value;
1707.         this.ne.selectedInstance.setContent(code);
1708.         this.removePane();
1709.     }
1710. });
1712. nicEditors.registerPlugin(nicPlugin,nicCodeOptions);
1714. /* START CONFIG */
1715. var smileOptions = {
1716.     buttons : {
1717.         'smile' : {name : '添加表情', type : 'nicEditorSmileButton', noClose : true,tags : ['Sm']}
1718.     }
1719. };
1720. /* END CONFIG */
1721. var nicEditorSmileButton = nicEditorAdvancedButton.extend({
1722.     addPane : function() {
1723.         var smileList = this.smileList;
1724.         var smileItems = new bkElement('DIV').setStyle({width: '270px'});
1725.         for(var g in smileList) {
1726.             var smileSrc = smileList[g];
1727.             var smileImg = '<img src='+smileSrc+' />';
1728.             var smileSquare = new bkElement('DIV').setStyle({'cursor':'pointer','height':'20px','width':'20px','float':'left'}).appendTo(smileItems);
1729.             var smileBorder = new bkElement('DIV').appendTo(smileSquare).setStyle({border : '1px solid #fff'});
1730.             var smileInner = new bkElement('DIV').setStyle({overflow : 'hidden', width : '18px', height : '18px'}).addEvent('click',this.smileSelect.closure(this,smileSrc)).addEvent('mouseover',this.on.closure(this,smileBorder)).addEvent('mouseout',this.off.closure(this,smileBorder)).appendTo(smileBorder);     
1731.             smileInner.innerHTML = smileImg;
1732.             if(!window.opera) {
1733.                 smileSquare.onmousedown = smileInner.onmousedown = bkLib.cancelEvent;
1734.             }
1735.         }
1736.         this.pane.append(smileItems.noSelect());
1737.     },
1738.     smileList:['/view/img/smile/1.gif','/view/img/smile/2.gif','/view/img/smile/3.gif','/view/img/smile/4.gif','/view/img/smile/5.gif','/view/img/smile/6.gif','/view/img/smile/7.gif','/view/img/smile/8.gif','/view/img/smile/9.gif','/view/img/smile/10.gif','/view/img/smile/11.gif','/view/img/smile/12.gif','/view/img/smile/13.gif','/view/img/smile/14.gif','/view/img/smile/15.gif','/view/img/smile/16.gif','/view/img/smile/17.gif','/view/img/smile/18.gif','/view/img/smile/19.gif','/view/img/smile/20.gif'],
1739.     smileSelect : function(smileSrc) {
1740.         this.ne.nicCommand('insertImage',smileSrc);
1741.         this.removePane();
1742.     },
1743.     on:function(smileBorder){
1744.         smileBorder.setStyle({border : '1px solid #000'});
1745.     },
1746.     off:function(smileBorder){
1747.         smileBorder.setStyle({border : '1px solid #fff'});
1748.     }
1749. });
1751. nicEditors.registerPlugin(nicPlugin,smileOptions);

图片上传的时候，php端返回：

1. //图片上传进度条 
2.     $rand  = $_GET['rand'];
3.     $check = $_GET['check'];
4.     $APC   = $_GET['APC'];
5.     if ($rand) {
6.         $status = apc_fetch('upload_' . $check);
7.         $interval = $status['current']/$status['total']*100;
8.         if(array_key_exists($check, $_SESSION['apc_upload'])) {
9.             $json = json_encode(array(
10.                 'current'  => $status['current'],
11.                 'total'    => $status['total'],
12.                 'interval' => $interval,
13.                 'width'    => 160,
14.                 'url'      => $status['file'],
15.             ));
16.             unset($_SESSION['apc_upload'][$check]);
17.         } else {
18.             $json = json_encode(array(
19.                  'current'  => $status['current'],
20.                  'total'    => $status['total'],
21.                  'interval' => $interval
22.             ));
23.         }
24.         echo "nicUploadButton.statusCb(".$json.")";
25.         exit;
26.     } elseif($APC && !isset($_SESSION['apc_upload'][$APC])) {
27.         $_SESSION['apc_upload'][$APC] = $id;
28.     }

要用到php_apc.dll;

php.ini 配置 : apc.rfc1867 = on

参考  http://www.ibm.com/developerworks/cn/opensource/os-php-v525/  php 图片上传进度条的实现