[24917] | 1 | //javascript:
|
---|
| 2 | var expSyntaxArray = [];
|
---|
| 3 |
|
---|
[26726] | 4 | var font_family;
|
---|
| 5 | var font_size;
|
---|
| 6 | var font_color;
|
---|
[26728] | 7 | var font_weight;
|
---|
[26729] | 8 | var font_style;
|
---|
[26726] | 9 |
|
---|
[26731] | 10 | var compute_font = false;
|
---|
| 11 | var compute_width = false;
|
---|
| 12 |
|
---|
[24917] | 13 | Element.prototype.getElementWidth = function() {
|
---|
| 14 | if (typeof this.clip !== "undefined") {
|
---|
| 15 | return this.clip.width;
|
---|
| 16 | } else {
|
---|
| 17 | if (this.style.pixelWidth) {
|
---|
| 18 | return this.style.pixelWidth;
|
---|
| 19 | } else {
|
---|
| 20 | return this.offsetWidth;
|
---|
| 21 | }
|
---|
| 22 | }
|
---|
| 23 | };
|
---|
| 24 |
|
---|
| 25 | Element.prototype.getElementHeight = function() {
|
---|
| 26 | if (typeof this.clip !== "undefined") {
|
---|
| 27 | return this.clip.height;
|
---|
| 28 | } else {
|
---|
| 29 | if (this.style.pixelHeight) {
|
---|
| 30 | return this.style.pixelHeight;
|
---|
| 31 | } else {
|
---|
| 32 | return this.offsetHeight;
|
---|
| 33 | }
|
---|
| 34 | }
|
---|
| 35 | };
|
---|
| 36 |
|
---|
| 37 | function getElementWidth(elem)
|
---|
| 38 | {
|
---|
| 39 | if (typeof elem.clip !== "undefined") {
|
---|
| 40 | return elem.clip.width;
|
---|
| 41 | } else {
|
---|
[24934] | 42 | if (elem.style && elem.style.pixelWidth) {
|
---|
[24917] | 43 | return elem.style.pixelWidth;
|
---|
| 44 | } else {
|
---|
| 45 | return elem.offsetWidth;
|
---|
| 46 | }
|
---|
| 47 | }
|
---|
| 48 | }
|
---|
| 49 |
|
---|
| 50 | function getElementHeight(elem)
|
---|
| 51 | {
|
---|
| 52 | if (typeof elem.clip !== "undefined") {
|
---|
| 53 | return elem.clip.height;
|
---|
| 54 | } else {
|
---|
[24934] | 55 | if (elem.style && elem.style.pixelHeight) {
|
---|
[24917] | 56 | return elem.style.pixelHeight;
|
---|
| 57 | } else {
|
---|
| 58 | return elem.offsetHeight;
|
---|
| 59 | }
|
---|
| 60 | }
|
---|
| 61 | }
|
---|
| 62 |
|
---|
[24941] | 63 | function hyphenToInitialCapReplacer(str, p1, offset, s)
|
---|
| 64 | {
|
---|
| 65 | return p1.toUpperCase();
|
---|
| 66 | }
|
---|
| 67 |
|
---|
| 68 | function getStyle(node,style_prop)
|
---|
[24917] | 69 | {
|
---|
[24941] | 70 | var prop_val;
|
---|
[24939] | 71 | if (node.currentStyle) {
|
---|
[24941] | 72 | /* IE */
|
---|
| 73 | style_prop = strCssRule.replace(/\-(\w)/g, hyphenToInitialCapReplacer);
|
---|
| 74 | prop_val = node.currentStyle[style_prop];
|
---|
[24917] | 75 | }
|
---|
| 76 | else if (window.getComputedStyle) {
|
---|
[24941] | 77 | /* Firefox */
|
---|
| 78 | var computed_style = document.defaultView.getComputedStyle(node,null)
|
---|
| 79 | prop_val = computed_style.getPropertyValue(style_prop);
|
---|
[24917] | 80 | }
|
---|
[24941] | 81 | else {
|
---|
| 82 | /* try for inline value */
|
---|
| 83 | prop_val = el.style[style_prop];
|
---|
| 84 | }
|
---|
[26726] | 85 |
|
---|
[24941] | 86 | return prop_val;
|
---|
| 87 |
|
---|
[24917] | 88 | }
|
---|
| 89 |
|
---|
| 90 | function getElementPosition(elem)
|
---|
| 91 | {
|
---|
| 92 | var origElem = elem;
|
---|
| 93 |
|
---|
| 94 | var xl_ = 0;
|
---|
| 95 | var yt_ = 0;
|
---|
| 96 |
|
---|
| 97 | while(elem && !isNaN(elem.offsetLeft) && !isNaN(elem.offsetTop)) {
|
---|
| 98 | xl_ += elem.offsetLeft - elem.scrollLeft;
|
---|
| 99 | yt_ += elem.offsetTop - elem.scrollTop;
|
---|
| 100 | elem = elem.offsetParent;
|
---|
| 101 | }
|
---|
| 102 |
|
---|
| 103 | var xr_ = xl_ + getElementWidth(origElem);
|
---|
| 104 | var yb_ = yt_ + getElementHeight(origElem);
|
---|
| 105 |
|
---|
| 106 | return { xl: xl_, yt: yt_, xr: xr_, yb: yb_ };
|
---|
| 107 | }
|
---|
| 108 |
|
---|
| 109 |
|
---|
[26731] | 110 | function htmlToExpeditee(node,compFont,compWidth)
|
---|
[24934] | 111 | {
|
---|
[26731] | 112 | compute_font = compFont;
|
---|
| 113 | compute_width = compWidth;
|
---|
| 114 |
|
---|
[26726] | 115 | var nodePos = getElementPosition(node);
|
---|
| 116 | var parentStyle = node.getAttribute('style');
|
---|
| 117 |
|
---|
| 118 | //Use these as default values if font info can't be found for text items.
|
---|
[26731] | 119 | //and only if the user wants the font computed (otherwise use Expeditee defaults).
|
---|
| 120 | if(compute_font){
|
---|
| 121 | font_family = getStyle(node,'font-family');
|
---|
| 122 | font_size = getStyle(node,'font-size');
|
---|
| 123 | font_color = getStyle(node,'color');
|
---|
| 124 | }
|
---|
[26726] | 125 |
|
---|
[24934] | 126 | var pxl = nodePos.xl;
|
---|
| 127 | var pyt = nodePos.yt;
|
---|
| 128 | var pxr = nodePos.xr;
|
---|
| 129 | var pyb = nodePos.yb;
|
---|
[24917] | 130 |
|
---|
[24934] | 131 | return htmlToExpediteeRec(node, pxl,pyt, pxl,pyt,pxr,pyb, 0);
|
---|
| 132 | }
|
---|
| 133 |
|
---|
| 134 |
|
---|
| 135 | function htmlToExpediteeRec(node,baseX,baseY, pxl,pyt,pxr,pyb, depth)
|
---|
[24917] | 136 | {
|
---|
| 137 | depth = (depth) ? depth : 0;
|
---|
| 138 |
|
---|
[24934] | 139 | var jsonNode = null;
|
---|
[26726] | 140 |
|
---|
[26767] | 141 |
|
---|
[24917] | 142 | if (node.nodeType == 3) { /* text node */
|
---|
[26767] | 143 |
|
---|
[24917] | 144 | var text = node.nodeValue;
|
---|
| 145 |
|
---|
| 146 | if (text.match(/\S/)) {
|
---|
[24934] | 147 | jsonNode = {};
|
---|
| 148 |
|
---|
[24925] | 149 | jsonNode.type = "text";
|
---|
| 150 | jsonNode.text = node.nodeValue;
|
---|
[24934] | 151 |
|
---|
[24941] | 152 | jsonNode.xl = pxl;
|
---|
| 153 | jsonNode.yt = pyt;
|
---|
| 154 | jsonNode.xr = pxr;
|
---|
| 155 | jsonNode.yb = pyb;
|
---|
[26749] | 156 |
|
---|
[25057] | 157 | var parent = node.parentNode;
|
---|
[26726] | 158 |
|
---|
[25057] | 159 | if (parent != null) {
|
---|
[26726] | 160 |
|
---|
[26767] | 161 | //set a frame link attribute
|
---|
| 162 | var link = parent.attributes["link"];
|
---|
| 163 |
|
---|
| 164 | if(link !== null && link !== undefined){
|
---|
| 165 | console.log(link.value);
|
---|
| 166 | jsonNode.link = link.value;
|
---|
| 167 | }
|
---|
| 168 |
|
---|
[26731] | 169 | if(compute_font){
|
---|
| 170 | //obtain font info for text nodes from their parent nodes.
|
---|
| 171 | var new_font_family = getStyle(parent,"font-family");
|
---|
| 172 | var new_font_size = getStyle(parent,"font-size");
|
---|
| 173 | var new_font_color = getStyle(parent,"color");
|
---|
[26726] | 174 |
|
---|
[26731] | 175 | var new_font_weight = getStyle(parent,"font-weight");
|
---|
| 176 | var new_font_style = getStyle(parent,"font-style");
|
---|
| 177 |
|
---|
| 178 | if(new_font_family !== undefined && new_font_family !== null)
|
---|
| 179 | font_family = new_font_family;
|
---|
[26728] | 180 |
|
---|
[26731] | 181 | if(new_font_size !== undefined && new_font_size !== null)
|
---|
| 182 | font_size = new_font_size;
|
---|
[26726] | 183 |
|
---|
[26731] | 184 | if(new_font_color !== undefined && new_font_color !== null)
|
---|
| 185 | font_color = new_font_color;
|
---|
[26728] | 186 |
|
---|
[26731] | 187 | //TODO: if parent node is a <b> element, then set style["font-weight"] to be "bold".
|
---|
| 188 | if(new_font_weight !== undefined && new_font_weight !== null)
|
---|
| 189 | font_weight = new_font_weight;
|
---|
[26729] | 190 |
|
---|
[26767] | 191 | //TODO: if parent node is an <i> element, then set style["font-style"] to be "italic".
|
---|
[26731] | 192 | if(new_font_style !== undefined && new_font_style !== null)
|
---|
| 193 | font_style = new_font_style;
|
---|
[26726] | 194 |
|
---|
[26731] | 195 | var style = {};
|
---|
| 196 | style["font-family"] = font_family;
|
---|
| 197 | style["font-size"] = font_size;
|
---|
| 198 | style["color"] = font_color;
|
---|
| 199 | style["font-weight"] = font_weight;
|
---|
| 200 | style["font-style"] = font_style;
|
---|
| 201 |
|
---|
| 202 | jsonNode.style = style;
|
---|
| 203 | }
|
---|
| 204 |
|
---|
| 205 | if(compute_width){
|
---|
| 206 | var parentPos = getElementPosition(parent);
|
---|
| 207 | var parentWidth = parentPos.xr - parentPos.xl;
|
---|
[26749] | 208 |
|
---|
[26731] | 209 | jsonNode.width = parentWidth;
|
---|
| 210 | }
|
---|
| 211 |
|
---|
| 212 | var data = parent.attributes["data"];
|
---|
| 213 |
|
---|
| 214 | if (data != null) {
|
---|
[26726] | 215 | jsonNode.data = data.value;
|
---|
[26731] | 216 | }
|
---|
[26728] | 217 |
|
---|
| 218 |
|
---|
| 219 | }
|
---|
| 220 | }
|
---|
[26726] | 221 |
|
---|
[26728] | 222 |
|
---|
| 223 |
|
---|
[24917] | 224 | }
|
---|
| 225 | else if (node.nodeType == 1) { /* element */
|
---|
| 226 |
|
---|
| 227 | /* need to handle: img, a, li */
|
---|
| 228 | /* need to dig out: text size, l/r/justified, font-face, type, colour */
|
---|
| 229 |
|
---|
[24941] | 230 | if (getStyle(node,"visibility").match("hidden")
|
---|
| 231 | || getStyle(node,"display").match("none")) {
|
---|
| 232 |
|
---|
| 233 | return null;
|
---|
| 234 | }
|
---|
| 235 |
|
---|
[26767] | 236 | var elemName = node.nodeName.toLowerCase();
|
---|
[24917] | 237 |
|
---|
[24934] | 238 | if (!elemName.match(/script/)) {
|
---|
| 239 |
|
---|
[24917] | 240 | var nodePos = getElementPosition(node);
|
---|
| 241 | var xl = nodePos.xl;
|
---|
| 242 | var xr = nodePos.xr;
|
---|
| 243 | var yt = nodePos.yt;
|
---|
| 244 | var yb = nodePos.yb;
|
---|
| 245 |
|
---|
[26726] | 246 | jsonNode = {};
|
---|
[24925] | 247 | jsonNode.type = "rect";
|
---|
[26726] | 248 | jsonNode.elem = node.nodeName;
|
---|
| 249 |
|
---|
| 250 | if(node.getAttribute("rect") !== undefined){
|
---|
| 251 |
|
---|
| 252 | /**This is to ensure rectangles aren't drawn around "non-rectangular" items such
|
---|
| 253 | as text and empty elements such as <br/>**/
|
---|
| 254 | if(node.getAttribute("rect") === "norect"){
|
---|
| 255 | jsonNode.type = "norect";
|
---|
| 256 | }
|
---|
| 257 | }
|
---|
[24934] | 258 |
|
---|
| 259 | var rect = { "xl":xl, "yt":yt, "xr":xr, "yb":yb };
|
---|
[24925] | 260 | jsonNode.rect = rect;
|
---|
| 261 |
|
---|
[26767] | 262 | //TODO: Set link attribute for images.
|
---|
[24941] | 263 | if (elemName.match("img")) {
|
---|
[26767] | 264 |
|
---|
| 265 | var getLink = node.getAttribute("link");
|
---|
| 266 | if(getLink !== null && getLink !== undefined){
|
---|
| 267 | jsonNode.link = getLink;
|
---|
| 268 | }
|
---|
| 269 |
|
---|
[26726] | 270 | jsonNode.img = node.src;
|
---|
[26767] | 271 |
|
---|
| 272 |
|
---|
[24941] | 273 | }
|
---|
[24939] | 274 |
|
---|
[26726] | 275 | var style = {};
|
---|
[26767] | 276 |
|
---|
[24939] | 277 | style["background-color"] = getStyle(node,"background-color");
|
---|
[26726] | 278 |
|
---|
| 279 | jsonNode.style = style;
|
---|
[24939] | 280 |
|
---|
[25060] | 281 | var attr = node.attributes["attr"];
|
---|
[26767] | 282 |
|
---|
| 283 | if (attr != null) {
|
---|
| 284 | jsonNode.attr = attr.value;
|
---|
[25060] | 285 | }
|
---|
[26767] | 286 |
|
---|
| 287 | var jsonChildNodes = [];
|
---|
[25060] | 288 |
|
---|
[24917] | 289 | var cnode = node.firstChild;
|
---|
| 290 | while (cnode != null) {
|
---|
[24925] | 291 |
|
---|
[24934] | 292 | var jsonChildNode
|
---|
| 293 | = htmlToExpediteeRec(cnode,baseX,baseY,xl,yt,xr,yb,depth+1);
|
---|
| 294 |
|
---|
| 295 | if (jsonChildNode != null) {
|
---|
| 296 | jsonChildNodes.push(jsonChildNode);
|
---|
| 297 | }
|
---|
[24917] | 298 |
|
---|
[24925] | 299 | cnode = cnode.nextSibling;
|
---|
[24917] | 300 | }
|
---|
| 301 |
|
---|
[24925] | 302 | jsonNode.childNodes = jsonChildNodes;
|
---|
[24917] | 303 | }
|
---|
| 304 |
|
---|
| 305 | }
|
---|
| 306 | /* currently do nothing for the other node types */
|
---|
| 307 |
|
---|
[24925] | 308 | return jsonNode;
|
---|
[24917] | 309 | }
|
---|
| 310 |
|
---|
| 311 |
|
---|
| 312 | //var body = document.body;
|
---|
| 313 | //alert(traverseDOM(body)); |
---|