source: gs3-extensions/html-to-expeditee/trunk/src/src/js/html-to-expeditee.js@ 24934

Last change on this file since 24934 was 24934, checked in by davidb, 12 years ago

Introduction of new Perl module to handle taking the JSON version of the traversed HTML tree and output it as an expeditee frame

  • Property svn:executable set to *
File size: 4.0 KB
Line 
1//javascript:
2var expSyntaxArray = [];
3
4Element.prototype.getElementWidth = function() {
5 if (typeof this.clip !== "undefined") {
6 return this.clip.width;
7 } else {
8 if (this.style.pixelWidth) {
9 return this.style.pixelWidth;
10 } else {
11 return this.offsetWidth;
12 }
13 }
14};
15
16Element.prototype.getElementHeight = function() {
17 if (typeof this.clip !== "undefined") {
18 return this.clip.height;
19 } else {
20 if (this.style.pixelHeight) {
21 return this.style.pixelHeight;
22 } else {
23 return this.offsetHeight;
24 }
25 }
26};
27
28function getElementWidth(elem)
29{
30 if (typeof elem.clip !== "undefined") {
31 return elem.clip.width;
32 } else {
33 if (elem.style && elem.style.pixelWidth) {
34 return elem.style.pixelWidth;
35 } else {
36 return elem.offsetWidth;
37 }
38 }
39}
40
41function getElementHeight(elem)
42{
43 if (typeof elem.clip !== "undefined") {
44 return elem.clip.height;
45 } else {
46 if (elem.style && elem.style.pixelHeight) {
47 return elem.style.pixelHeight;
48 } else {
49 return elem.offsetHeight;
50 }
51 }
52}
53
54function getStyle(el,styleProp)
55{
56 var x = document.getElementById(el);
57 if (x.currentStyle) {
58 var y = x.currentStyle[styleProp];
59 }
60 else if (window.getComputedStyle) {
61 var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp);
62 }
63 return y;
64}
65
66function getElementPosition(elem)
67{
68 var origElem = elem;
69
70 var xl_ = 0;
71 var yt_ = 0;
72
73 while(elem && !isNaN(elem.offsetLeft) && !isNaN(elem.offsetTop)) {
74 xl_ += elem.offsetLeft - elem.scrollLeft;
75 yt_ += elem.offsetTop - elem.scrollTop;
76 elem = elem.offsetParent;
77 }
78
79 var xr_ = xl_ + getElementWidth(origElem);
80 var yb_ = yt_ + getElementHeight(origElem);
81
82 return { xl: xl_, yt: yt_, xr: xr_, yb: yb_ };
83}
84
85
86function htmlToExpeditee(node)
87{
88 var nodePos = getElementPosition(node);
89 var pxl = nodePos.xl;
90 var pyt = nodePos.yt;
91 var pxr = nodePos.xr;
92 var pyb = nodePos.yb;
93
94 return htmlToExpediteeRec(node, pxl,pyt, pxl,pyt,pxr,pyb, 0);
95}
96
97
98function htmlToExpediteeRec(node,baseX,baseY, pxl,pyt,pxr,pyb, depth)
99{
100 depth = (depth) ? depth : 0;
101
102 //var expSyntax = "";
103 var jsonNode = null;
104
105 if (node.nodeType == 3) { /* text node */
106 var text = node.nodeValue;
107
108 if (text.match(/\S/)) {
109 //for (var i=0; i<depth; i++) { expSyntax += " "; }
110 //expSyntax += "Text item: " + node.nodeValue + "\n";
111
112 jsonNode = {};
113
114 jsonNode.type = "text";
115 jsonNode.text = node.nodeValue;
116
117 jsonNode.x = pxl;
118 jsonNode.y = pyt;
119
120 }
121 }
122 else if (node.nodeType == 1) { /* element */
123
124 /* need to handle: img, a, li */
125 /* need to dig out: text size, l/r/justified, font-face, type, colour */
126
127 var elemName = node.nodeName.toLowerCase();
128
129 if (!elemName.match(/script/)) {
130
131 var nodePos = getElementPosition(node);
132 var xl = nodePos.xl;
133 var xr = nodePos.xr;
134 var yt = nodePos.yt;
135 var yb = nodePos.yb;
136
137/*
138 var rectSyntax = "";
139
140 for (var i=0; i<depth; i++) { rectSyntax += " "; }
141
142 rectSyntax += "Rect item " + node.nodeName + ": ";
143 rectSyntax += xl + " " + yt + " " + xr + " " + yb + "\n";
144
145 expSyntax += rectSyntax;
146*/
147
148 jsonNode = {};
149 jsonNode.type = "rect";
150 jsonNode.elem = node.nodeName;
151
152 var rect = { "xl":xl, "yt":yt, "xr":xr, "yb":yb };
153 jsonNode.rect = rect;
154
155 var jsonChildNodes = [];
156
157 var cnode = node.firstChild;
158 while (cnode != null) {
159
160 var jsonChildNode
161 = htmlToExpediteeRec(cnode,baseX,baseY,xl,yt,xr,yb,depth+1);
162
163 if (jsonChildNode != null) {
164 jsonChildNodes.push(jsonChildNode);
165 }
166
167 cnode = cnode.nextSibling;
168 }
169
170 jsonNode.childNodes = jsonChildNodes;
171 }
172
173 }
174 /* currently do nothing for the other node types */
175
176 return jsonNode;
177 //return expSyntax;
178}
179
180
181//var body = document.body;
182//alert(traverseDOM(body));
Note: See TracBrowser for help on using the repository browser.