js/pmd/iecanvas.js

   1 /* vim: set expandtab sw=4 ts=4 sts=4: */
   2 /**
   3  *
   4  * @package PhpMyAdmin-Designer
   5  */
   6
   7 /**
   8  *
   9  */
  10 if (!window.all) { // if IE
  11     document.attachEvent(
  12         "onreadystatechange", // document load
  13         function () {
  14             if (document.readyState == "complete") {
  15                 var el  =  document.getElementById("canvas");
  16                 var outerHTML = el.outerHTML;
  17                 var newEl = document.createElement(outerHTML);
  18                 el.parentNode.replaceChild(newEl, el);
  19                 el = newEl;
  20                 el.getContext = function () {
  21                     if (this.cont) {
  22                         return this.cont;
  23                     }
  24                     return this.cont = new PMD_2D(this);
  25                 };
  26
  27                 el.style.width = el.attributes.width.nodeValue + "px";
  28                 el.style.height = el.attributes.height.nodeValue + "px";
  29             }
  30         }
  31     );
  32
  33     //*****************************************************************************************************
  34
  35     function convert_style(str) {
  36         var m = [];
  37         m = str.match(/.*\((\d*),(\d*),(\d*),(\d*)\)/);
  38         for (var i = 1; i <= 3; i++) {
  39             m[i] = (m[i] * 1).toString(16).length < 2 ? '0' + (m[i] * 1).toString(16) : (m[i] * 1).toString(16);
  40         }
  41         return ['#' + m[1] + m[2] + m[3], 1];
  42     }
  43     //------------------------------------------------------------------------------
  44     function PMD_2D(th) {
  45         this.element_ = th;
  46         this.pmd_arr = [];
  47         this.strokeStyle;
  48         this.fillStyle;
  49         this.lineWidth;
  50
  51         this.closePath = function () {
  52             this.pmd_arr.push({type: "close"});
  53         };
  54
  55         this.clearRect = function () {
  56             this.element_.innerHTML = "";
  57             this.pmd_arr = [];
  58         };
  59
  60         this.beginPath = function () {
  61             this.pmd_arr = [];
  62         };
  63
  64         this.moveTo = function (aX, aY) {
  65             this.pmd_arr.push({type: "moveTo", x: aX, y: aY});
  66         };
  67
  68         this.lineTo = function (aX, aY) {
  69             this.pmd_arr.push({type: "lineTo", x: aX, y: aY});
  70         };
  71
  72         this.arc = function (aX, aY, aRadius, aStartAngle, aEndAngle, aClockwise) {
  73             if (!aClockwise) {
  74                 var t = aStartAngle;
  75                 aStartAngle = aEndAngle;
  76                 aEndAngle = t;
  77             }
  78
  79             var xStart = aX + (Math.cos(aStartAngle) * aRadius);
  80             var yStart = aY + (Math.sin(aStartAngle) * aRadius);
  81
  82             var xEnd = aX + (Math.cos(aEndAngle) * aRadius);
  83             var yEnd = aY + (Math.sin(aEndAngle) * aRadius);
  84
  85             this.pmd_arr.push({type: "arc", x: aX, y: aY,
  86                  radius: aRadius, xStart: xStart, yStart: yStart, xEnd: xEnd, yEnd: yEnd});
  87         };
  88
  89         this.rect = function (aX, aY, aW, aH) {
  90             this.moveTo(aX, aY);
  91             this.lineTo(aX + aW, aY);
  92             this.lineTo(aX + aW, aY + aH);
  93             this.lineTo(aX, aY + aH);
  94             this.closePath();
  95         };
  96
  97         this.fillRect = function (aX, aY, aW, aH) {
  98             this.beginPath();
  99             this.moveTo(aX, aY);
 100             this.lineTo(aX + aW, aY);
 101             this.lineTo(aX + aW, aY + aH);
 102             this.lineTo(aX, aY + aH);
 103             this.closePath();
 104             this.stroke(true);
 105         };
 106
 107         this.stroke = function (aFill) {
 108             var Str = [];
 109             var a = convert_style(aFill ? this.fillStyle : this.strokeStyle);
 110             var color = a[0];
 111
 112             Str.push('<v:shape',
 113             ' fillcolor="', color, '"',
 114             ' filled="', Boolean(aFill), '"',
 115             ' style="position:absolute;width:10;height:10;"',
 116             ' coordorigin="0 0" coordsize="10 10"',
 117             ' stroked="', !aFill, '"',
 118             ' strokeweight="', this.lineWidth, '"',
 119             ' strokecolor="', color, '"',
 120             ' path="');
 121
 122             for (var i = 0; i < this.pmd_arr.length; i++) {
 123                 var p = this.pmd_arr[i];
 124
 125                 if (p.type == "moveTo") {
 126                     Str.push(" m ");
 127                     Str.push(Math.floor(p.x), ",", Math.floor(p.y));
 128                 } else if (p.type == "lineTo") {
 129                     Str.push(" l ");
 130                     Str.push(Math.floor(p.x), ",", Math.floor(p.y));
 131                 } else if (p.type == "close") {
 132                     Str.push(" x ");
 133                 } else if (p.type == "arc") {
 134                     Str.push(" ar ");
 135                     Str.push(Math.floor(p.x - p.radius), ",",
 136                     Math.floor(p.y - p.radius), " ",
 137                     Math.floor(p.x + p.radius), ",",
 138                     Math.floor(p.y + p.radius), " ",
 139                     Math.floor(p.xStart), ",", Math.floor(p.yStart), " ",
 140                     Math.floor(p.xEnd), ",", Math.floor(p.yEnd));
 141                 }
 142             }
 143
 144             Str.push(' ">');
 145             Str.push("</v:shape>");
 146
 147             this.element_.insertAdjacentHTML("beforeEnd", Str.join(""));
 148             this.pmd_arr = [];
 149         };
 150     }
 151 }