File:
[LON-CAPA] /
loncom /
html /
htmlarea /
popups /
Attic /
insert_image.html
Revision
1.2:
download - view:
text,
annotated -
select for diffs
Tue Jun 1 23:46:11 2004 UTC (20 years, 2 months ago) by
www
Branches:
MAIN
CVS tags:
version_2_5_X,
version_2_5_99_0,
version_2_5_2,
version_2_5_1,
version_2_5_0,
version_2_4_X,
version_2_4_99_0,
version_2_4_2,
version_2_4_1,
version_2_4_0,
version_2_3_X,
version_2_3_99_0,
version_2_3_2,
version_2_3_1,
version_2_3_0,
version_2_2_X,
version_2_2_99_1,
version_2_2_99_0,
version_2_2_2,
version_2_2_1,
version_2_2_0,
version_2_1_X,
version_2_1_99_3,
version_2_1_99_2,
version_2_1_99_1,
version_2_1_99_0,
version_2_1_3,
version_2_1_2,
version_2_1_1,
version_2_1_0,
version_2_0_X,
version_2_0_99_1,
version_2_0_2,
version_2_0_1,
version_2_0_0,
version_1_99_3,
version_1_99_2,
version_1_99_1_tmcc,
version_1_99_1,
version_1_99_0_tmcc,
version_1_99_0,
version_1_3_X,
version_1_3_3,
version_1_3_2,
version_1_3_1,
version_1_3_0,
version_1_2_X,
version_1_2_99_1,
version_1_2_99_0,
version_1_2_1,
version_1_2_0,
version_1_1_99_5,
version_1_1_99_4,
version_1_1_99_3,
version_1_1_99_2,
version_1_1_99_1,
version_1_1_99_0,
HEAD
Next version HTMLArea.
1: <html>
2:
3: <head>
4: <title>Insert Image</title>
5:
6: <script type="text/javascript" src="popup.js"></script>
7:
8: <script type="text/javascript">
9:
10: window.resizeTo(400, 100);
11:
12: function Init() {
13: __dlg_init();
14: var param = window.dialogArguments;
15: if (param) {
16: document.getElementById("f_url").value = param["f_url"];
17: document.getElementById("f_alt").value = param["f_alt"];
18: document.getElementById("f_border").value = param["f_border"];
19: document.getElementById("f_align").value = param["f_align"];
20: document.getElementById("f_vert").value = param["f_vert"];
21: document.getElementById("f_horiz").value = param["f_horiz"];
22: window.ipreview.location.replace(param.f_url);
23: }
24: document.getElementById("f_url").focus();
25: };
26:
27: function onOK() {
28: var required = {
29: "f_url": "You must enter the URL"
30: };
31: for (var i in required) {
32: var el = document.getElementById(i);
33: if (!el.value) {
34: alert(required[i]);
35: el.focus();
36: return false;
37: }
38: }
39: // pass data back to the calling window
40: var fields = ["f_url", "f_alt", "f_align", "f_border",
41: "f_horiz", "f_vert"];
42: var param = new Object();
43: for (var i in fields) {
44: var id = fields[i];
45: var el = document.getElementById(id);
46: param[id] = el.value;
47: }
48: __dlg_close(param);
49: return false;
50: };
51:
52: function onCancel() {
53: __dlg_close(null);
54: return false;
55: };
56:
57: function onPreview() {
58: var f_url = document.getElementById("f_url");
59: var url = f_url.value;
60: if (!url) {
61: alert("You have to enter an URL first");
62: f_url.focus();
63: return false;
64: }
65: window.ipreview.location.replace(url);
66: return false;
67: };
68: </script>
69:
70: <style type="text/css">
71: html, body {
72: background: ButtonFace;
73: color: ButtonText;
74: font: 11px Tahoma,Verdana,sans-serif;
75: margin: 0px;
76: padding: 0px;
77: }
78: body { padding: 5px; }
79: table {
80: font: 11px Tahoma,Verdana,sans-serif;
81: }
82: form p {
83: margin-top: 5px;
84: margin-bottom: 5px;
85: }
86: .fl { width: 9em; float: left; padding: 2px 5px; text-align: right; }
87: .fr { width: 6em; float: left; padding: 2px 5px; text-align: right; }
88: fieldset { padding: 0px 10px 5px 5px; }
89: select, input, button { font: 11px Tahoma,Verdana,sans-serif; }
90: button { width: 70px; }
91: .space { padding: 2px; }
92:
93: .title { background: #ddf; color: #000; font-weight: bold; font-size: 120%; padding: 3px 10px; margin-bottom: 10px;
94: border-bottom: 1px solid black; letter-spacing: 2px;
95: }
96: form { padding: 0px; margin: 0px; }
97: </style>
98:
99: </head>
100:
101: <body onload="Init()">
102:
103: <div class="title">Insert Image</div>
104: <!--- new stuff --->
105: <form action="" method="get">
106: <table border="0" width="100%" style="padding: 0px; margin: 0px">
107: <tbody>
108:
109: <tr>
110: <td style="width: 7em; text-align: right">Image URL:</td>
111: <td><input type="text" name="url" id="f_url" style="width:75%"
112: title="Enter the image URL here" />
113: <button name="preview" onclick="return onPreview();"
114: title="Preview the image in a new window">Preview</button>
115: </td>
116: </tr>
117: <tr>
118: <td style="width: 7em; text-align: right">Alternate text:</td>
119: <td><input type="text" name="alt" id="f_alt" style="width:100%"
120: title="For browsers that don't support images" /></td>
121: </tr>
122:
123: </tbody>
124: </table>
125:
126: <p />
127:
128: <fieldset style="float: left; margin-left: 5px;">
129: <legend>Layout</legend>
130:
131: <div class="space"></div>
132:
133: <div class="fl">Alignment:</div>
134: <select size="1" name="align" id="f_align"
135: title="Positioning of this image">
136: <option value="" >Not set</option>
137: <option value="left" >Left</option>
138: <option value="right" >Right</option>
139: <option value="texttop" >Texttop</option>
140: <option value="absmiddle" >Absmiddle</option>
141: <option value="baseline" selected="1" >Baseline</option>
142: <option value="absbottom" >Absbottom</option>
143: <option value="bottom" >Bottom</option>
144: <option value="middle" >Middle</option>
145: <option value="top" >Top</option>
146: </select>
147:
148: <p />
149:
150: <div class="fl">Border thickness:</div>
151: <input type="text" name="border" id="f_border" size="5"
152: title="Leave empty for no border" />
153:
154: <div class="space"></div>
155:
156: </fieldset>
157:
158: <fieldset style="float:right; margin-right: 5px;">
159: <legend>Spacing</legend>
160:
161: <div class="space"></div>
162:
163: <div class="fr">Horizontal:</div>
164: <input type="text" name="horiz" id="f_horiz" size="5"
165: title="Horizontal padding" />
166:
167: <p />
168:
169: <div class="fr">Vertical:</div>
170: <input type="text" name="vert" id="f_vert" size="5"
171: title="Vertical padding" />
172:
173: <div class="space"></div>
174:
175: </fieldset>
176: <br clear="all" />
177: <table width="100%" style="margin-bottom: 0.2em">
178: <tr>
179: <td valign="bottom">
180: Image Preview:<br />
181: <iframe name="ipreview" id="ipreview" frameborder="0" style="border : 1px solid gray;" height="200" width="300" src=""></iframe>
182: </td>
183: <td valign="bottom" style="text-align: right">
184: <button type="button" name="ok" onclick="return onOK();">OK</button><br>
185: <button type="button" name="cancel" onclick="return onCancel();">Cancel</button>
186: </td>
187: </tr>
188: </table>
189: </form>
190: </body>
191: </html>
FreeBSD-CVSweb <freebsd-cvsweb@FreeBSD.org>