pmd/scripts/iecanvas.js

   1 /* vim: set expandtab sw=4 ts=4 sts=4: */
   2 /**
   3  *
   4  * @version $Id$
   5  * @package phpMyAdmin-Designer
   6  */
   7
   8 /**
   9  *
  10  */
  11 if (!window.all)  // if IE
  12 {
  13   document.attachEvent("onreadystatechange", // document load
  14     function ()
  15     {
  16       if (document.readyState == "complete")
  17       {
  18         var el  =  document.getElementById("canvas");
  19         var outerHTML = el.outerHTML;
  20         var newEl = document.createElement(outerHTML);
  21         el.parentNode.replaceChild(newEl, el);
  22         el = newEl;
  23         el.getContext = function () {
  24           if (this.cont) return this.cont;
  25           return this.cont = new PMD_2D(this);
  26         };
  27
  28         el.style.width = el.attributes.width.nodeValue + "px";
  29         el.style.height = el.attributes.height.nodeValue + "px";
  30       }
  31     }
  32   );
  33
  34 //*****************************************************************************************************
  35
  36   function convert_style(str) {
  37     var m = Array();
  38     m = str.match(/.*\((\d*),(\d*),(\d*),(\d*)\)/);
  39     for(var i = 1; i<=3; i++ )
  40       m[i] = (m[i]*1).toString(16).length < 2 ? '0' + (m[i]*1).toString(16) : (m[i]*1).toString(16);
  41     return ['#' + m[1] + m[2] + m[3], 1];
  42   }
  43 //------------------------------------------------------------------------------
  44   function PMD_2D(th) {
  45     this.element_ = th;
  46     this.pmd_arr = Array();
  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 = Array();
 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 = Array();
 149     }
 150   };
 151 }