Chad 2009-11-19
之前不知在哪找到了一个fckeditor的“插入代码”插件,挺好使,一拿回来就已经可以直接插入XML/HTML/JavaScript/CSS/C#/C++/Java/PHP/Python/Ruby/SQL/ASP/Visual Basic等代码。
但不足的是不能插入ActionScript。
由于我觉得自己将要展示一些ActionScript,所以我给它加上了可以插入ActionScript代码的功能,具体步骤如下:
首先,打开fckeditor\editor\plugins\insertcode\fck_insertcode.html,找到html元素select,加入ActionScript这个option,然后保存关闭:
- <select id="icLan">
- <option value="xhtml">XML/HTML</option>
- <option value="as3">ActionScript 3.0</option>
- <option value="javascript">JavaScript</option>
- <option value="css">CSS</option>
- <option value="csharp">C#</option>
- <option value="cpp">C++</option>
- <option value="java">Java</option>
- <option value="php">PHP</option>
- <option value="python">Python</option>
- <option value="ruby">Ruby</option>
- <option value="sql">SQL</option>
- <option value="vb">ASP/Visual Basic</option>
- </select>
接着,打开fckeditor\editor\plugins\insertcode\fckplugin.js,在文件最后,给brush多加一个给ActionScript用的syntax highlighter,然后保存关闭:
- dp.sh.Brushes.ActionScript3 = function()
- {
- var keywords = 'addEventListener align ArgumentError arguments Array as AS3 Boolean break case catch class Class const continue data Date decodeURI decodeURIComponent default DefinitionError delete do dynamic each else encodeURI encodeURIComponent Error escape EvalError extends false finally flash_proxy for function get getLineOffset height if implements import in include index Infinity instanceof interface internal intrinsic is isFinite isNaN isXMLName label load namespace NaN native new null Null object_proxy override package parseFloat parseInt private protected public return set static super switch this throw trace true try typeof undefined unescape use var void while with Accessibility AccessibilityProperties ActionScriptVersion ActivityEvent AntiAliasType ApplicationDomain AsyncErrorEvent AVM1Movie BevelFilter Bitmap BitmapData BitmapDataChannel BitmapFilter BitmapFilterQuality BitmapFilterType BlendMode BlurFilter ByteArray Camera Capabilities CapsStyle ColorMatrixFilter ColorTransform ContextMenu ContextMenuBuiltInItems ContextMenuEvent ContextMenuItem ConvolutionFilter CSMSettings DataEvent Dictionary DisplacementMapFilter DisplacementMapFilterMode DisplayObject DisplayObjectContainer DropShadowFilter Endian EOFError ErrorEvent Event EventDispatcher EventPhase ExternalInterface FileFilter FileReference FileReferenceList FocusEvent Font FontStyle FontType FrameLabel Function GlowFilter GradientBevelFilter GradientGlowFilter GradientType Graphics GridFitType HTTPStatusEvent IBitmapDrawable ID3Info IDataInput IDataOutput IDynamicPropertyOutput IDynamicPropertyWriter IEventDispatcher IExternalizable IllegalOperationError IME IMEConversionMode IMEEvent int InteractiveObject InterpolationMethod InvalidSWFError IOError IOErrorEvent JointStyle Keyboard KeyboardEvent KeyLocation LineScaleMode Loader LoaderContext LoaderInfo LocalConnection Math Matrix MemoryError Microphone MorphShape Mouse MouseEvent MovieClip Namespace NetConnection NetStatusEvent NetStream Number Object ObjectEncoding PixelSnapping Point PrintJob PrintJobOptions PrintJobOrientation ProgressEvent Proxy QName RangeError Rectangle ReferenceError RegExp resize result Responder scaleMode Scene ScriptTimeoutError Security SecurityDomain SecurityError SecurityErrorEvent SecurityPanel setTextFormat Shape SharedObject SharedObjectFlushStatus SimpleButton Socket Sound SoundChannel SoundLoaderContext SoundMixer SoundTransform SpreadMethod Sprite StackOverflowError Stage stageHeight stageWidth StageAlign StageQuality StageScaleMode StaticText StatusEvent String StyleSheet SWFVersion SyncEvent SyntaxError System text TextColorType TextDisplayMode TextEvent TextField TextFieldAutoSize TextFieldType TextFormat TextFormatAlign TextLineMetrics TextRenderer TextSnapshot Timer TimerEvent Transform true TypeError uint URIError URLLoader URLLoaderDataFormat URLRequest URLRequestHeader URLRequestMethod URLStream URLVariables VerifyError Video width XML XMLDocument XMLList XMLNode XMLNodeType XMLSocket';
- this.regexList = [
- // There's a slight problem with matching single line comments and figuring out
- // a difference between // and ///. Using lookahead and lookbehind solves the
- // problem, unfortunately JavaScript doesn't support lookbehind. So I'm at a
- // loss how to translate that regular expression to JavaScript compatible one.
- // { regex: new RegExp('(?
- // { regex: new RegExp('(?
- { regex: dp.sh.RegexLib.SingleLineCComments, css: 'comment' }, // one line comments
- { regex: dp.sh.RegexLib.MultiLineCComments, css: 'comment' }, // multiline comments
- { regex: dp.sh.RegexLib.DoubleQuotedString, css: 'string' }, // strings
- { regex: dp.sh.RegexLib.SingleQuotedString, css: 'string' }, // strings
- //{ regex: new RegExp('^\\s*#.*', 'gm'), css: 'preprocessor' }, // preprocessor tags like #region and #endregion
- { regex: new RegExp(this.GetKeywords(keywords), 'gm'), css: 'keyword' } // as3 keyword
- ];
- this.CssClass = 'dp-as';
- }
- dp.sh.Brushes.ActionScript3.prototype = new dp.sh.Highlighter();
- dp.sh.Brushes.ActionScript3.Aliases = ['as3', 'actionscript3'];
这一步要注意的是,keywords变量里的关键字之间必须用一个(不能多,也不能少)空格间隔开,且头尾不能为空,否则将会出错。由于是基于别人的代码基础上做的扩展,所以我没有去改其核心以让其兼容多空格,这样以后有新版本也好升级。
最后,要做的是加上新的CSS。打开fckeditor\editor\css\fck_editorarea.css,在文件末端加上适当的CSS代码,保存关闭:
- .dp-as .comment {
- color: gray;
- }
- .dp-as .string {
- color: green;
- }
- .dp-as .preprocessor {
- color: gray;
- }
- .dp-as .keyword {
- color: blue;
- }
这样,就给这个fckeditor的“插入代码”插件加上了一种新的语言了。
整个完成后的插件可在这里下载。
注:ActionScript3的关键字列表收集自www.atlascs.co.uk/blog/2007/02/09/as3-syntax-highlighting-in-as3