1// FancyZoomHTML.js - v1.0 2// Used to draw necessary HTML elements for FancyZoom 3// 4// Copyright (c) 2008 Cabel Sasser / Panic Inc 5// All rights reserved. 6 7function insertZoomHTML() { 8 9 // All of this junk creates the three <div>'s used to hold the closebox, image, and zoom shadow. 10 11 var inBody = document.getElementsByTagName("body").item(0); 12 13 // WAIT SPINNER 14 15 var inSpinbox = document.createElement("div"); 16 inSpinbox.setAttribute('id', 'ZoomSpin'); 17 inSpinbox.style.position = 'absolute'; 18 inSpinbox.style.left = '10px'; 19 inSpinbox.style.top = '10px'; 20 inSpinbox.style.visibility = 'hidden'; 21 inSpinbox.style.zIndex = '525'; 22 inBody.insertBefore(inSpinbox, inBody.firstChild); 23 24 var inSpinImage = document.createElement("img"); 25 inSpinImage.setAttribute('id', 'SpinImage'); 26 inSpinImage.setAttribute('src', zoomImagesURI+'zoom-spin-1.png'); 27 inSpinbox.appendChild(inSpinImage); 28 29 // ZOOM IMAGE 30 // 31 // <div id="ZoomBox"> 32 // <a href="javascript:zoomOut();"><img src="/images/spacer.gif" id="ZoomImage" border="0"></a> <!-- THE IMAGE --> 33 // <div id="ZoomClose"> 34 // <a href="javascript:zoomOut();"><img src="/images/closebox.png" width="30" height="30" border="0"></a> 35 // </div> 36 // </div> 37 38 var inZoombox = document.createElement("div"); 39 inZoombox.setAttribute('id', 'ZoomBox'); 40 41 inZoombox.style.position = 'absolute'; 42 inZoombox.style.left = '10px'; 43 inZoombox.style.top = '10px'; 44 inZoombox.style.visibility = 'hidden'; 45 inZoombox.style.zIndex = '499'; 46 47 inBody.insertBefore(inZoombox, inSpinbox.nextSibling); 48 49 var inImage1 = document.createElement("img"); 50 inImage1.onclick = function (event) { zoomOut(this, event); return false; }; 51 inImage1.setAttribute('src',zoomImagesURI+'spacer.gif'); 52 inImage1.setAttribute('id','ZoomImage'); 53 inImage1.setAttribute('border', '0'); 54 // inImage1.setAttribute('onMouseOver', 'zoomMouseOver();') 55 // inImage1.setAttribute('onMouseOut', 'zoomMouseOut();') 56 57 // This must be set first, so we can later test it using webkitBoxShadow. 58 inImage1.setAttribute('style', '-webkit-box-shadow: '+shadowSettings+'0.0)'); 59 inImage1.style.display = 'block'; 60 inImage1.style.width = '10px'; 61 inImage1.style.height = '10px'; 62 inImage1.style.cursor = 'pointer'; // -webkit-zoom-out? 63 inZoombox.appendChild(inImage1); 64 65 var inClosebox = document.createElement("div"); 66 inClosebox.setAttribute('id', 'ZoomClose'); 67 inClosebox.style.position = 'absolute'; 68 69 // In MSIE, we need to put the close box inside the image. 70 // It's 2008 and I'm having to do a browser detect? Sigh. 71 if (browserIsIE) { 72 inClosebox.style.left = '-1px'; 73 inClosebox.style.top = '0px'; 74 } else { 75 inClosebox.style.left = '-15px'; 76 inClosebox.style.top = '-15px'; 77 } 78 79 inClosebox.style.visibility = 'hidden'; 80 inZoombox.appendChild(inClosebox); 81 82 var inImage2 = document.createElement("img"); 83 inImage2.onclick = function (event) { zoomOut(this, event); return false; }; 84 inImage2.setAttribute('src',zoomImagesURI+'closebox.png'); 85 inImage2.setAttribute('width','30'); 86 inImage2.setAttribute('height','30'); 87 inImage2.setAttribute('border','0'); 88 inImage2.style.cursor = 'pointer'; 89 inClosebox.appendChild(inImage2); 90 91 // SHADOW 92 // Only draw the table-based shadow if the programatic webkitBoxShadow fails! 93 // Also, don't draw it if we're IE -- it wouldn't look quite right anyway. 94 95 if (! document.getElementById('ZoomImage').style.webkitBoxShadow && ! browserIsIE) { 96 97 // SHADOW BASE 98 99 var inFixedBox = document.createElement("div"); 100 inFixedBox.setAttribute('id', 'ShadowBox'); 101 inFixedBox.style.position = 'absolute'; 102 inFixedBox.style.left = '50px'; 103 inFixedBox.style.top = '50px'; 104 inFixedBox.style.width = '100px'; 105 inFixedBox.style.height = '100px'; 106 inFixedBox.style.visibility = 'hidden'; 107 inFixedBox.style.zIndex = '498'; 108 inBody.insertBefore(inFixedBox, inZoombox.nextSibling); 109 110 // SHADOW 111 // Now, the shadow table. Skip if not compatible, or irrevelant with -box-shadow. 112 113 // <div id="ShadowBox"><table border="0" width="100%" height="100%" cellpadding="0" cellspacing="0"> X 114 // <tr height="25"> 115 // <td width="27"><img src="/images/zoom-shadow1.png" width="27" height="25"></td> 116 // <td background="/images/zoom-shadow2.png"> </td> 117 // <td width="27"><img src="/images/zoom-shadow3.png" width="27" height="25"></td> 118 // </tr> 119 120 var inShadowTable = document.createElement("table"); 121 inShadowTable.setAttribute('border', '0'); 122 inShadowTable.setAttribute('width', '100%'); 123 inShadowTable.setAttribute('height', '100%'); 124 inShadowTable.setAttribute('cellpadding', '0'); 125 inShadowTable.setAttribute('cellspacing', '0'); 126 inFixedBox.appendChild(inShadowTable); 127 128 var inShadowTbody = document.createElement("tbody"); // Needed for IE (for HTML4). 129 // ###SRG ADDED NEXT LINE (c.f. http://www.michaelvanallen.com/development/tweaking-fancyzoom-for-firefox-3-5/) 130 inShadowTbody.style.backgroundColor = 'transparent'; // Force transparency 131 inShadowTable.appendChild(inShadowTbody); 132 133 var inRow1 = document.createElement("tr"); 134 inRow1.style.height = '25px';
135 inShadowTbody.appendChild(inRow1); 136 137 var inCol1 = document.createElement("td"); 138 inCol1.style.width = '27px'; 139 inRow1.appendChild(inCol1); 140 var inShadowImg1 = document.createElement("img"); 141 inShadowImg1.setAttribute('src', zoomImagesURI+'zoom-shadow1.png'); 142 inShadowImg1.setAttribute('width', '27'); 143 inShadowImg1.setAttribute('height', '25'); 144 inShadowImg1.style.display = 'block'; 145 inCol1.appendChild(inShadowImg1); 146 147 var inCol2 = document.createElement("td"); 148 inCol2.style.background ='url('+zoomImagesURI+'zoom-shadow2.png) top repeat-x'; 149 inRow1.appendChild(inCol2); 150 // inCol2.innerHTML = '<img src='; 151 var inSpacer1 = document.createElement("img"); 152 inSpacer1.setAttribute('src',zoomImagesURI+'spacer.gif'); 153 inSpacer1.setAttribute('height', '1'); 154 inSpacer1.setAttribute('width', '1'); 155 inSpacer1.style.display = 'block'; 156 inCol2.appendChild(inSpacer1); 157 158 var inCol3 = document.createElement("td"); 159 inCol3.style.width = '27px'; 160 inRow1.appendChild(inCol3); 161 var inShadowImg3 = document.createElement("img"); 162 inShadowImg3.setAttribute('src', zoomImagesURI+'zoom-shadow3.png'); 163 inShadowImg3.setAttribute('width', '27'); 164 inShadowImg3.setAttribute('height', '25'); 165 inShadowImg3.style.display = 'block'; 166 inCol3.appendChild(inShadowImg3); 167 168 // <tr> 169 // <td background="/images/zoom-shadow4.png"> </td> 170 // <td bgcolor="#ffffff"> </td> 171 // <td background="/images/zoom-shadow5.png"> </td> 172 // </tr> 173 174 inRow2 = document.createElement("tr"); 175 inShadowTbody.appendChild(inRow2); 176 177 var inCol4 = document.createElement("td"); 178 inCol4.style.background ='url('+zoomImagesURI+'zoom-shadow4.png) left repeat-y'; 179 inRow2.appendChild(inCol4); 180 // inCol4.innerHTML = ' '; 181 var inSpacer2 = document.createElement("img"); 182 inSpacer2.setAttribute('src',zoomImagesURI+'spacer.gif'); 183 inSpacer2.setAttribute('height', '1'); 184 inSpacer2.setAttribute('width', '1'); 185 inSpacer2.style.display = 'block'; 186 inCol4.appendChild(inSpacer2); 187 188 var inCol5 = document.createElement("td"); 189 inCol5.setAttribute('bgcolor', '#ffffff'); 190 inRow2.appendChild(inCol5); 191 // inCol5.innerHTML = ' '; 192 var inSpacer3 = document.createElement("img"); 193 inSpacer3.setAttribute('src',zoomImagesURI+'spacer.gif'); 194 inSpacer3.setAttribute('height', '1'); 195 inSpacer3.setAttribute('width', '1'); 196 inSpacer3.style.display = 'block'; 197 inCol5.appendChild(inSpacer3); 198 199 var inCol6 = document.createElement("td"); 200 inCol6.style.background ='url('+zoomImagesURI+'zoom-shadow5.png) right repeat-y'; 201 inRow2.appendChild(inCol6); 202 // inCol6.innerHTML = ' '; 203 var inSpacer4 = document.createElement("img"); 204 inSpacer4.setAttribute('src',zoomImagesURI+'spacer.gif'); 205 inSpacer4.setAttribute('height', '1'); 206 inSpacer4.setAttribute('width', '1'); 207 inSpacer4.style.display = 'block'; 208 inCol6.appendChild(inSpacer4); 209 210 // <tr height="26"> 211 // <td width="27"><img src="/images/zoom-shadow6.png" width="27" height="26"</td> 212 // <td background="/images/zoom-shadow7.png"> </td> 213 // <td width="27"><img src="/images/zoom-shadow8.png" width="27" height="26"></td> 214 // </tr> 215 // </table> 216 217 var inRow3 = document.createElement("tr"); 218 inRow3.style.height = '26px'; 219 inShadowTbody.appendChild(inRow3); 220 221 var inCol7 = document.createElement("td"); 222 inCol7.style.width = '27px'; 223 inRow3.appendChild(inCol7); 224 var inShadowImg7 = document.createElement("img"); 225 inShadowImg7.setAttribute('src', zoomImagesURI+'zoom-shadow6.png'); 226 inShadowImg7.setAttribute('width', '27'); 227 inShadowImg7.setAttribute('height', '26'); 228 inShadowImg7.style.display = 'block'; 229 inCol7.appendChild(inShadowImg7); 230 231 var inCol8 = document.createElement("td"); 232 inCol8.style.background = 'url('+zoomImagesURI+'zoom-shadow7.png) bottom repeat-x'; 233 inRow3.appendChild(inCol8); 234 // inCol8.innerHTML = ' '; 235 var inSpacer5 = document.createElement("img"); 236 inSpacer5.setAttribute('src',zoomImagesURI+'spacer.gif'); 237 inSpacer5.setAttribute('height', '1'); 238 inSpacer5.setAttribute('width', '1'); 239 inSpacer5.style.display = 'block'; 240 inCol8.appendChild(inSpacer5); 241 242 var inCol9 = document.createElement("td"); 243 inCol9.style.width = '27px'; 244 inRow3.appendChild(inCol9); 245 var inShadowImg9 = document.createElement("img"); 246 inShadowImg9.setAttribute('src', zoomImagesURI+'zoom-shadow8.png'); 247 inShadowImg9.setAttribute('width', '27'); 248 inShadowImg9.setAttribute('height', '26'); 249 inShadowImg9.style.display = 'block'; 250 inCol9.appendChild(inShadowImg9); 251 } 252 253 if (includeCaption) { 254 255 // CAPTION 256 // 257 // <div id="ZoomCapDiv" style="margin-left: 13px; margin-right: 13px;"> 258 // <table border="1" cellpadding="0" cellspacing="0"> 259 // <tr height="26"> 260 // <td><img src="zoom-caption-l.png" width="13" height="26"></td> 261 // <td rowspan="3" background="zoom-caption-fill.png"><div id="ZoomCaption"></div></td> 262 // <td><img src="zoom-caption-r.png" width="13" height="26"></td> 263 // </tr> 264 // </table> 265 // </div> 266 267 var inCapDiv = document.createElement("div"); 268 inCapDiv.setAttribute('id', 'ZoomCapDiv'); 269 inCapDiv.style.position = 'absolute'; 270 inCapDiv.style.visibility = 'hidden'; 271 inCapDiv.style.marginLeft = 'auto'; 272 inCapDiv.style.marginRight = 'auto'; 273 inCapDiv.style.zIndex = '501'; 274 275 inBody.insertBefore(inCapDiv, inZoombox.nextSibling); 276 277 var inCapTable = document.createElement("table"); 278 inCapTable.setAttribute('border', '0'); 279 inCapTable.setAttribute('cellPadding', '0'); // Wow. These honestly need to 280 inCapTable.setAttribute('cellSpacing', '0'); // be intercapped to work in IE. WTF? 281 inCapDiv.appendChild(inCapTable); 282 283 var inTbody = document.createElement("tbody"); // Needed for IE (for HTML4). 284 inCapTable.appendChild(inTbody); 285 286 var inCapRow1 = document.createElement("tr");
287 inTbody.appendChild(inCapRow1); 288 289 var inCapCol1 = document.createElement("td"); 290 inCapCol1.setAttribute('align', 'right'); 291 inCapRow1.appendChild(inCapCol1); 292 var inCapImg1 = document.createElement("img"); 293 inCapImg1.setAttribute('src', zoomImagesURI+'zoom-caption-l.png'); 294 inCapImg1.setAttribute('width', '13'); 295 inCapImg1.setAttribute('height', '26'); 296 inCapImg1.style.display = 'block'; 297 inCapCol1.appendChild(inCapImg1); 298 299 var inCapCol2 = document.createElement("td"); 300 inCapCol2.setAttribute('background', zoomImagesURI+'zoom-caption-fill.png'); 301 inCapCol2.setAttribute('id', 'ZoomCaption'); 302 inCapCol2.setAttribute('valign', 'middle'); 303 inCapCol2.style.fontSize = '14px'; 304 inCapCol2.style.fontFamily = 'Helvetica'; 305 inCapCol2.style.fontWeight = 'bold'; 306 inCapCol2.style.color = '#ffffff'; 307 inCapCol2.style.textShadow = '0px 2px 4px #000000'; 308 inCapCol2.style.whiteSpace = 'nowrap'; 309 inCapRow1.appendChild(inCapCol2); 310 311 var inCapCol3 = document.createElement("td"); 312 inCapRow1.appendChild(inCapCol3); 313 var inCapImg2 = document.createElement("img"); 314 inCapImg2.setAttribute('src', zoomImagesURI+'zoom-caption-r.png'); 315 inCapImg2.setAttribute('width', '13'); 316 inCapImg2.setAttribute('height', '26'); 317 inCapImg2.style.display = 'block'; 318 inCapCol3.appendChild(inCapImg2); 319 } 320}
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.