Fixed issue #9424: htmlArea RTE: Cleanup dialogue windows
[Packages/TYPO3.CMS.git] / typo3 / sysext / rtehtmlarea / htmlarea / plugins / DefaultImage / popups / insert_image.html
1 <!DOCTYPE html
2 PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4 <!--
5 /***************************************************************
6 * Copyright notice
7 *
8 * (c) 2002-2004, interactivetools.com, inc.
9 * (c) 2003-2004 dynarch.com
10 * (c) 2004-2008 Stanislas Rolland <typo3(arobas)sjbr.ca>
11 * All rights reserved
12 *
13 * This script is part of the TYPO3 project. The TYPO3 project is
14 * free software; you can redistribute it and/or modify
15 * it under the terms of the GNU General Public License as published by
16 * the Free Software Foundation; either version 2 of the License, or
17 * (at your option) any later version.
18 *
19 * The GNU General Public License can be found at
20 * http://www.gnu.org/copyleft/gpl.html.
21 * A copy is found in the textfile GPL.txt and important notices to the license
22 * from the author is found in LICENSE.txt distributed with these scripts.
23 *
24 *
25 * This script is distributed in the hope that it will be useful,
26 * but WITHOUT ANY WARRANTY; without even the implied warranty of
27 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
28 * GNU General Public License for more details.
29 *
30 * This script is a modified version of a script published under the htmlArea License.
31 * A copy of the htmlArea License may be found in the textfile HTMLAREA_LICENSE.txt.
32 *
33 * This copyright notice MUST APPEAR in all copies of the script!
34 ***************************************************************/
35 /*
36 * Insert Image window for TYPO3 htmlArea RTE
37 *
38 * TYPO3 SVN ID: $Id$
39 */
40 -->
41 <html>
42 <head>
43 <title>Insert Image</title>
44 <meta http-equiv="Content-Style-Type" content="text/css" />
45 <script type="text/javascript">
46 /*<![CDATA[*/
47 <!--
48 var dialog = window.opener.HTMLArea.Dialog["DefaultImage"];
49 function Init() {
50 dialog.initialize(false, true);
51 if (dialog.plugin.removeItems) {
52 var items = dialog.plugin.removeItems;
53 for (var i = 0, length = items.length; i < length; ++i) {
54 if (document.getElementById(items[i])) document.getElementById(items[i]).style.display = "none";
55 }
56 }
57 var param = dialog.arguments;
58 if (param) {
59 document.getElementById("f_url").value = param["f_url"];
60 document.getElementById("f_alt").value = param["f_alt"];
61 document.getElementById("f_border").value = param["f_border"];
62 var select = document.getElementById("f_align");
63 for (var i = select.options.length; --i >= 0;) {
64 if (param["f_align"] == select.options[i].value) {
65 select.selectedIndex = i;
66 break;
67 }
68 }
69 document.getElementById("f_top").value = param["f_top"];
70 document.getElementById("f_right").value = param["f_right"];
71 document.getElementById("f_bottom").value = param["f_bottom"];
72 document.getElementById("f_left").value = param["f_left"];
73 var select = document.getElementById("f_float");
74 for (var i = select.options.length; --i >= 0;) {
75 if (param["f_float"] == select.options[i].value) {
76 select.selectedIndex = i;
77 break;
78 }
79 }
80 window.ipreview.location.replace(param.f_url);
81 }
82 dialog.resize();
83 document.getElementById("f_url").focus();
84 return false;
85 };
86
87 function onOK() {
88 var required = { "f_url": "image_url_required" };
89 for (var i in required) {
90 var el = document.getElementById(i);
91 if (!el.value) {
92 alert(dialog.plugin.localize(required[i]));
93 el.focus();
94 return false;
95 }
96 }
97 // pass data back to the calling window
98 var fields = ["f_url", "f_alt", "f_align", "f_border", "f_top", "f_right", "f_bottom", "f_left", "f_float"];
99 var param = new Object();
100 for (var i in fields) {
101 var id = fields[i];
102 var el = document.getElementById(id);
103 param[id] = el.value;
104 }
105 dialog.performAction(param);
106 return false;
107 };
108
109 function onCancel() {
110 dialog.close();
111 return false;
112 };
113
114 function onPreview() {
115 var f_url = document.getElementById("f_url");
116 var url = f_url.value;
117 if (!url) {
118 alert(dialog.plugin.localize("image_url_first"));
119 f_url.focus();
120 return false;
121 }
122 window.ipreview.location.replace(url);
123 return false;
124 };
125 // -->
126 /*]]>*/
127 </script>
128 </head>
129 <body class="popupwin htmlarea-default-image" onload="Init();">
130 <div id="content">
131 <div class="title">Insert Image</div>
132 <form action="" method="get">
133 <div id="image">
134 <label for="f_url" class="field">Image URL:</label>
135 <input type="text" id="f_url" name="url" size="45" title="Enter the image URL here" />
136 <button class="preview" name="preview" onclick="return onPreview();" title="Preview the image in a new window">Preview</button>
137 </div>
138 <div class="space"></div>
139 <div id="alt">
140 <label for="f_alt" class="field">Alternate text:</label>
141 <input type="text" name="alt" id="f_alt" size="55" title="For browsers that dont support images" />
142 </div>
143 <div class="space"></div>
144 <fieldset id="layout">
145 <legend>Layout</legend>
146 <ul>
147 <li id="align">
148 <label for="f_align" class="fl">Image alignment:</label>
149 <select class="alignment" size="1" name="align" id="f_align" title="Positioning of this image">
150 <option value="bottom">Bottom</option>
151 <option value="middle" selected="selected">Middle</option>
152 <option value="top">Top</option>
153 </select>
154 </li>
155 <li id="border">
156 <label for="f_border" class="fl">Border thickness:</label>
157 <input type="text" name="border" id="f_border" size="5" title="Leave empty for no border" />
158 </li>
159 <li id="float">
160 <label for="f_float" class="fl">Float:</label>
161 <select class="float" size="1" name="style" id="f_float" title="Where the image should float">
162 <option value="none">Non-floating</option>
163 <option value="left">Left</option>
164 <option value="right">Right</option>
165 </select>
166 </li>
167 </ul>
168 </fieldset>
169 <fieldset id="padding">
170 <legend>Spacing and padding</legend>
171 <ul>
172 <li id="paddingTop">
173 <label for="f_top" class="fl">Top:</label>
174 <input type="text" name="f_top" id="f_top" size="5" title="Top padding" />
175 </li>
176 <li id="paddingRight">
177 <label for="f_right" class="fl">Right:</label>
178 <input type="text" name="f_right" id="f_right" size="5" title="Right padding" />
179 </li>
180 <li id="paddingBottom">
181 <label for="f_bottom" class="fl">Bottom:</label>
182 <input type="text" name="f_bottom" id="f_bottom" size="5" title="Bottom padding" />
183 </li>
184 <li id="paddingLeft">
185 <label for="f_left" class="fl">Left:</label>
186 <input type="text" name="f_left" id="f_left" size="5" title="Left padding" />
187 </li>
188 </ul>
189 </fieldset>
190 <div class="space"></div>
191 <fieldset>
192 <legend>Image Preview</legend>
193 <div class="imagepreview">
194 <iframe name="ipreview" id="ipreview" frameborder="0" src="";></iframe>
195 </div>
196 </fieldset>
197 <div class="buttons">
198 <button type="button" name="ok" onclick="return onOK();">OK</button>
199 <button type="button" name="cancel" onclick="return onCancel();">Cancel</button>
200 </div>
201 <div class="space"></div>
202 </form>
203 </div>
204 </body>
205 </html>