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