Annotation of loncom/html/htmlarea/popups/insert_image.html, revision 1.2
1.2 ! www 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>
![[BACK]](/icons/back.gif){kind=icon}
Return to insert_image.html CVS log ![[TXT]](/icons/text.gif){kind=icon}
![[DIR]](/icons/dir.gif){kind=icon}
Up to [LON-CAPA] / loncom / html / htmlarea / popups