Ticket #6363: performance_purevml.html

File performance_purevml.html, 3.1 kB (added by guest, 9 months ago)
Line 
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
2<html>
3<HEAD>
4<TITLE></TITLE>
5
6<script>
7var start = null;
8var who = null;
9
10function onMouseDown(id) {
11    who = id;
12    ;
13    start = {
14        x: window.event.clientX,
15        y: window.event.clientY
16    }
17    if (window.event.stopPropagation) {
18        window.event.stopPropagation();
19    }
20}
21function updateLine(who, dx, dy) {
22    var g, gx, gy;
23    var start = document.getElementById("startPoint");
24    var end = document.getElementById("endPoint");
25    var sx = getStyleValue(start.style, "left") + 5;
26    var sy = getStyleValue(start.style, "top") + 5;
27    var ex = getStyleValue(end.style, "left") + 5;
28    var ey = getStyleValue(end.style, "top") + 5;
29    if (who == "startPoint") {
30        sx += dx;
31        sy += dy;
32        g = start;
33        gx = sx - 5;
34        gy = sy - 5;
35    }
36    else {
37        g = end;
38        ex += dx;
39        ey += dy;
40        gx = ex - 5;
41        gy = ey - 5;
42    }
43
44    var line = document.getElementById("line");
45    line.from = sx + "," + sy;
46    line.to = ex + "," + ey;
47
48
49    g.style.left = gx + "px";
50    g.style.top = gy + "px";
51
52}
53function onMouseMove() {
54    if (start) {
55        var p = {
56            x: window.event.clientX,
57            y: window.event.clientY
58        }
59        var g = who;//document.getElementById("group");
60        var dx = p.x - start.x;
61        var dy = p.y - start.y;
62
63        start = p;
64        updateLine(who, dx, dy);
65        if (window.event.stopPropagation) {
66            window.event.stopPropagation();
67        }
68    }
69}
70function getStyleValue(style, name) {
71    var v = style[name];
72    v.substring(0, v.indexOf("px"));
73    return parseInt(v);
74}
75function style(style, name, delta) {
76    var str = style[name];
77    var num = getStyleValue(style, name);
78    style[name] = (num + delta) + "px";
79}
80function onMouseUp() {
81    start = null;
82    if (window.event.stopPropagation) {
83        window.event.stopPropagation();
84    }
85}
86
87function test() {
88    var time = new Date().getTime();
89    for (var i = 0; i < 1000; i++) {
90        updateLine("startPoint", -i, i)
91    }
92    alert(new Date().getTime() - time);
93}
94
95</script>
96
97
98</HEAD>
99
100
101<STYLE>
102
103    v\:* {
104        behavior: url( #VMLRender );
105        position: absolute
106    }
107
108</STYLE>
109
110<BODY onmousemove="onMouseMove()" onmouseup="onMouseUp()" onload="test()">
111
112<P><xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v"/>
113
114    <object id="VMLRender" codebase="vgx.dll" classid="CLSID:10072CEC-8CC1-11D1-986E-00A0C955B42E"></object>
115
116    <v:group id="group" style="width: 200px; height: 200px; left:250px; top:15px" coordorigin="0,0" coordsize="200,200">
117        <v:line id="line" from="5,5" to="105,105"/>
118        <v:oval id="startPoint" style="width: 10px; height: 10px; left:0px; top:0px" fillcolor="yellow"
119                onMouseDown="onMouseDown('startPoint')"/>
120        <v:oval id="endPoint" style="width: 10px; height: 10px; left:100px; top: 100px" fillcolor="yellow"
121                onMouseDown="onMouseDown('endPoint')"/>
122    </v:group>
123</BODY>
124
125
126</HTML>