From ec450681e63f13fbf021f73ad744b1bb7d8aca42 Mon Sep 17 00:00:00 2001 From: Jeffery Grajkowski Date: Mon, 4 Nov 2013 14:25:14 -0800 Subject: [PATCH] jQuery CLEditor plugin --- README.md | 4 +- jquery.cleditor/jquery.cleditor-tests.ts | 42 ++++++++++ jquery.cleditor/jquery.cleditor.d.ts | 98 ++++++++++++++++++++++++ 3 files changed, 142 insertions(+), 2 deletions(-) create mode 100644 jquery.cleditor/jquery.cleditor-tests.ts create mode 100644 jquery.cleditor/jquery.cleditor.d.ts diff --git a/README.md b/README.md index 5ebc5db2ee..820fb0d60a 100755 --- a/README.md +++ b/README.md @@ -94,7 +94,6 @@ List of Definitions * [i18next](http://i18next.com/) (by [Maarten Docter](https://github.com/mdocter)) * [iCheck](http://damirfoy.com/iCheck/) (by [Dániel Tar](https://github.com/qcz)) * [Impress.js](https://github.com/bartaz/impress.js) (by [Boris Yankov](https://github.com/borisyankov)) -* [Intl](http://www.ecma-international.org/ecma-402/1.0/) (by [Jeffery Grajkowski](http://github.com/pushplay)) * [iScroll](http://cubiq.org/iscroll-4) (by [Boris Yankov](https://github.com/borisyankov) and [Christiaan Rakowski](https://github.com/csrakowski)) * [jake](https://github.com/mde/jake) (by [Kon](http://phyzkit.net/)) * [Jasmine](http://pivotal.github.com/jasmine/) (by [Boris Yankov](https://github.com/borisyankov)) @@ -108,9 +107,10 @@ List of Definitions * [jQuery.areYouSure](https://github.com/codedance/jquery.AreYouSure) (by [Jon Egerton](https://github.com/jonegerton)) * [jQuery.autosize](http://www.jacklmoore.com/autosize/) (by [Jack Moore](http://www.jacklmoore.com/)) * [jQuery.BBQ](http://benalman.com/projects/jquery-bbq-plugin/) (by [Adam R. Smith](https://github.com/sunetos)) -* [jQuery.contextMenu](http://medialize.github.com/jQuery-contextMenu/) (by [Natan Vivo](https://github.com/nvivo/)) +* [jQuery.CLEditor](http://premiumsoftware.net/CLEditor) (by [Jeffery Grajkowski](https://github.com/pushplay)) * [jQuery.clientSideLogging](https://github.com/remybach/jQuery.clientSideLogging/) (by [Diullei Gomes](https://github.com/diullei/)) * [jQuery.Colorbox](http://www.jacklmoore.com/colorbox/) (by [Gidon Junge](https://github.com/gjunge)) +* [jQuery.contextMenu](http://medialize.github.com/jQuery-contextMenu/) (by [Natan Vivo](https://github.com/nvivo/)) * [jQuery.Cookie](https://github.com/carhartl/jquery-cookie) (by [Roy Goode](https://github.com/RoyGoode)) * [jQuery.Cycle](http://jquery.malsup.com/cycle/) (by [François Guillot](http://fguillot.developpez.com/)) * [jQuery.dataTables](http://www.datatables.net) (by [Armin Sander](https://github.com/pragmatrix)) diff --git a/jquery.cleditor/jquery.cleditor-tests.ts b/jquery.cleditor/jquery.cleditor-tests.ts new file mode 100644 index 0000000000..b298851500 --- /dev/null +++ b/jquery.cleditor/jquery.cleditor-tests.ts @@ -0,0 +1,42 @@ +/// +/// + +// cribbed from http://premiumsoftware.net/CLEditor/GettingStarted + +$(document).ready(function () { $("#input").cleditor(); }); + +$(document).ready(function() { + $("#input").cleditor({ + width: 500, // width not including margins, borders or padding + height: 250, // height not including margins, borders or padding + controls: // controls to add to the toolbar + "bold italic underline strikethrough subscript superscript | font size " + + "style | color highlight removeformat | bullets numbering | outdent " + + "indent | alignleft center alignright justify | undo redo | " + + "rule image link unlink | cut copy paste pastetext | print source", + colors: // colors in the color popup + "FFF FCC FC9 FF9 FFC 9F9 9FF CFF CCF FCF " + + "CCC F66 F96 FF6 FF3 6F9 3FF 6FF 99F F9F " + + "BBB F00 F90 FC6 FF0 3F3 6CC 3CF 66C C6C " + + "999 C00 F60 FC3 FC0 3C0 0CC 36F 63F C3C " + + "666 900 C60 C93 990 090 399 33F 60C 939 " + + "333 600 930 963 660 060 366 009 339 636 " + + "000 300 630 633 330 030 033 006 309 303", + fonts: // font names in the font popup + "Arial,Arial Black,Comic Sans MS,Courier New,Narrow,Garamond," + + "Georgia,Impact,Sans Serif,Serif,Tahoma,Trebuchet MS,Verdana", + sizes: // sizes in the font size popup + "1,2,3,4,5,6,7", + styles: // styles in the style popup + [["Paragraph", "

"], ["Header 1", "

"], ["Header 2", "

"], + ["Header 3", "

"], ["Header 4","

"], ["Header 5","

"], + ["Header 6","
"]], + useCSS: false, // use CSS to style HTML when possible (not supported in ie) + docType: // Document type contained within the editor + '', + docCSSFile: // CSS file used to style the document contained within the editor + "", + bodyStyle: // style to assign to document body contained within the editor + "margin:4px; font:10pt Arial,Verdana; cursor:text" + }); + }); \ No newline at end of file diff --git a/jquery.cleditor/jquery.cleditor.d.ts b/jquery.cleditor/jquery.cleditor.d.ts new file mode 100644 index 0000000000..c273f32274 --- /dev/null +++ b/jquery.cleditor/jquery.cleditor.d.ts @@ -0,0 +1,98 @@ +// Type definitions for jQuery CLEditor Plugin 1.4.3 +// Project: http://premiumsoftware.net/CLEditor +// Definitions by: Jeffery Grajkowski +// Definitions: https://github.com/borisyankov/DefinitelyTyped + +/// + +/** + * An editor is composed of a main div element used to hold a toolbar, + * a text area and an iframe. The toolbar can hold multiple groups + * which in turn hold multiple buttons. + */ +interface CLEditor { + $area: JQuery; + $frame: JQuery; + $main: JQuery; + $toolbar: JQuery; + disabled: boolean; + doc: Document; + options: JQueryCLEditorOptions; + change(handler: Function): CLEditor; + clear(): CLEditor; + disable(disabled: boolean): CLEditor; + execCommand(commands: string, value: any, useCSS?: boolean, button?: any): CLEditor; + focus(): CLEditor; + hidePopups(): CLEditor; + refresh(): CLEditor; + select(): CLEditor; + selectedHTML(): string; + selectedText(): string; + showMessage(message: string, button?: any): CLEditor; + sourceMode(): boolean; + updateFrame(): CLEditor; + updateTextArea(): CLEditor; +} + +interface JQueryCLEditorOptions { + width?: number; + height?: number; + controls?: string; + colors?: string; + fonts?: string; + sizes?: string; + styles?: string[][]; + useCSS?: boolean; + docType?: string; + docCSSFile?: string; + bodyStyle?: string; +} + +interface JQueryCLEditorButtonDefinition { + name: string; + title: string; + css?: any; + image?: string; + stripIndex?: number; + command?: string; + popupName?: string; + popupContent?: string; + getEnabled?: (data: JQueryCLEditorButtonDefinitionEventData) => boolean; + getPressed?: (data: JQueryCLEditorButtonDefinitionEventData) => boolean; + buttonClick?: (event: Event, data: JQueryCLEditorButtonDefinitionEventData) => boolean; + popupClick?: (event: Event, data: JQueryCLEditorButtonDefinitionEventData) => boolean; +} + +interface JQueryCLEditorButtonDefinitionEventData { + editor: CLEditor; + button: HTMLElement; + buttonName: string; + popup: HTMLElement; + popupName: string; + command: string; + value: any; + useCSS: boolean; +} + +/** + * This object contains global properties and methods used to create + * custom plugins and override built in functionality. + */ +interface JQueryCLEditorStatic { + defaultOptions: JQueryCLEditorOptions; + buttons: JQueryCLEditorButtonDefinition[]; + imagesPath: () => string; +} + +interface JQueryStatic { + cleditor: JQueryCLEditorStatic; +} + +interface JQuery { + /** + * If the cleditor object does not exist for a matched textarea element, + * it will be created using the default options combined with the supplied options. + * This is the core method for creating and selecting cleditor objects. + */ + cleditor(options?: JQueryCLEditorOptions): CLEditor; +}