6b007dda29ad63db9fb7663762adf12d4e874071
[Packages/TYPO3.CMS.git] / typo3 / sysext / rtehtmlarea / Resources / Public / JavaScript / Plugins / TYPO3Image.js
1 /*
2 * This file is part of the TYPO3 CMS project.
3 *
4 * It is free software; you can redistribute it and/or modify it under
5 * the terms of the GNU General Public License, either version 2
6 * of the License, or any later version.
7 *
8 * For the full copyright and license information, please read the
9 * LICENSE.txt file that was distributed with this source code.
10 *
11 * The TYPO3 project - inspiring people to share!
12 */
13
14 /**
15 * TYPO3Image plugin for htmlArea RTE
16 */
17 define('TYPO3/CMS/Rtehtmlarea/Plugins/TYPO3Image',
18 ['TYPO3/CMS/Rtehtmlarea/HTMLArea/Plugin/Plugin',
19 'TYPO3/CMS/Rtehtmlarea/HTMLArea/UserAgent/UserAgent',
20 'TYPO3/CMS/Rtehtmlarea/HTMLArea/Event/Event',
21 'TYPO3/CMS/Rtehtmlarea/HTMLArea/Util/Util'],
22 function (Plugin, UserAgent, Event, Util) {
23
24 var TYPO3Image = function (editor, pluginName) {
25 this.constructor.super.call(this, editor, pluginName);
26 };
27 Util.inherit(TYPO3Image, Plugin);
28 Util.apply(TYPO3Image.prototype, {
29
30 /**
31 * This function gets called by the class constructor
32 */
33 configurePlugin: function (editor) {
34 this.pageTSConfiguration = this.editorConfiguration.buttons.image;
35 this.imageModulePath = this.pageTSConfiguration.pathImageModule;
36
37 /**
38 * Registering plugin "About" information
39 */
40 var pluginInformation = {
41 version : '2.3',
42 developer : 'Stanislas Rolland',
43 developerUrl : 'http://www.sjbr.ca/',
44 copyrightOwner : 'Stanislas Rolland',
45 sponsor : 'SJBR',
46 sponsorUrl : 'http://www.sjbr.ca/',
47 license : 'GPL'
48 };
49 this.registerPluginInformation(pluginInformation);
50
51 /**
52 * Registering the button
53 */
54 var buttonId = 'InsertImage';
55 var buttonConfiguration = {
56 id : buttonId,
57 tooltip : this.localize(buttonId + '-Tooltip'),
58 iconCls : 'htmlarea-action-image-edit',
59 action : 'onButtonPress',
60 hotKey : (this.pageTSConfiguration ? this.pageTSConfiguration.hotKey : null),
61 dialog : true
62 };
63 this.registerButton(buttonConfiguration);
64 return true;
65 },
66
67 /**
68 * This function gets called when the button was pressed
69 *
70 * @param object editor: the editor instance
71 * @param string id: the button id or the key
72 *
73 * @return boolean false if action is completed
74 */
75 onButtonPress: function (editor, id) {
76 // Could be a button or its hotkey
77 var buttonId = this.translateHotKey(id);
78 buttonId = buttonId ? buttonId : id;
79 var additionalParameter;
80 this.image = this.editor.getSelection().getParentElement();
81 if (this.image && !/^img$/i.test(this.image.nodeName)) {
82 this.image = null;
83 }
84 if (this.image) {
85 additionalParameter = '&act=image';
86 }
87 this.openContainerWindow(
88 buttonId,
89 this.getButton(buttonId).tooltip,
90 this.getWindowDimensions(
91 {
92 width: top.TYPO3.configuration.RTEPopupWindow.width,
93 height: top.TYPO3.configuration.RTEPopupWindow.height
94 },
95 buttonId
96 ),
97 this.makeUrlFromModulePath(this.imageModulePath, additionalParameter)
98 );
99 var self = this;
100 Event.one(UserAgent.isIE ? this.editor.document.body : this.editor.document.documentElement, 'drop.TYPO3Image', function (event) { return self.onDrop(event); });
101 return false;
102 },
103
104 /**
105 * Insert the image
106 * This function is called from the TYPO3 image script
107 */
108 insertImage: function(image) {
109 this.restoreSelection();
110 this.editor.getSelection().insertHtml(image);
111 this.close();
112 },
113
114 /**
115 * Handlers for drag and drop operations
116 */
117 onDrop: function (event) {
118 if (UserAgent.isWebKit) {
119 this.editor.iframe.onDrop(event);
120 }
121 this.close();
122 return true;
123 },
124
125 /**
126 * Remove the event listeners
127 */
128 removeListeners: function () {
129 Event.off(UserAgent.isIE ? this.editor.document.body : this.editor.document.documentElement, '.TYPO3Image');
130 },
131
132 /**
133 * This function gets called when the toolbar is updated
134 */
135 onUpdateToolbar: function (button, mode, selectionEmpty, ancestors) {
136 button.setInactive(true);
137 if (mode === 'wysiwyg' && this.editor.isEditable() && button.itemId === 'InsertImage' && !button.disabled) {
138 var image = this.editor.getSelection().getParentElement();
139 if (image && !/^img$/i.test(image.nodeName)) {
140 image = null;
141 }
142 if (image) {
143 button.setTooltip(this.localize('Modify image'));
144 button.setInactive(false);
145 } else {
146 button.setTooltip(this.localize('Insert image'));
147 }
148 }
149 }
150 });
151
152 return TYPO3Image;
153
154 });