src/shape.js

   1 goog.provide('FlappShape');
   2
   3 goog.scope(function() {
   4
   5 /**
   6  * @constructor
   7  */
   8 FlappShape = function(movieClip, matrix, colorTransform) {
   9     this.OBJECT_TYPE = 1; // 1:Shape, 2:MovieClip
  10     this.movieClip = movieClip;
  11     this.name = null;
  12     this.matrix = matrix;
  13     this.setMatrix(matrix);
  14     if (movieClip && matrix ) {
  15         console.log(movieClip.absoluteMatrix);
  16         console.log(matrix);
  17         console.log(this.absoluteMatrix);
  18     }
  19     this.colorTransform = colorTransform;
  20     //    this.canvas = document.createElement('canvas');
  21     //    this.canvas.width = 240; // XXX
  22     //    this.canvas.height = 240; // XXX
  23     this.renderCode = ""; // new Function("ctx,dict", "ctx.line...")
  24 };
  25
  26 FlappShape.prototype = {
  27     setMatrix: function(matrix) {
  28         this.matrix = matrix;
  29         this.absoluteMatrix = this.movieClip?FlappSWFMatrix.multiply(this.movieClip.absoluteMatrix, matrix):matrix;
  30     },
  31     loadShapeTag: function(shape, dict) {
  32         var rca = []; // rca
  33         var fillStyles = shape.fillStyles;
  34         var lineStyles = shape.lineStyles;
  35         var fillEdges = shape.edges.fillEdges;
  36         var lineEdges = shape.edges.lineEdges;
  37         rca.push("var ctx = canvas.ctx;");
  38         for (var fillStyle in fillEdges) {
  39             // style
  40             var style = fillStyles[fillStyle - 1];
  41             //      console.log('style');
  42             //      console.log(style);
  43             //      console.log(fillStyle);
  44             //      console.log(fillStyles);
  45             var styleCode = null;
  46             var factor = FlappSWFMatrix.maxAbsScaleSkew(this.absoluteMatrix);
  47             var edgeInfoList = fillEdges[fillStyle];
  48             var minX = edgeInfoList.minX;
  49             var maxX = edgeInfoList.maxX;
  50             var minY = edgeInfoList.minY;
  51             var maxY = edgeInfoList.maxY;
  52             switch (style.type) {
  53             case 00:
  54                 styleCode = '"'+FlappSWFRGBA.toCSS(style.color)+'"';
  55                 break;
  56             case 0x40:
  57             case 0x41:
  58             case 0x42:
  59             case 0x43:
  60                 if (style.bitmapId === 65535) {
  61                     // nothing to do
  62                 } else {
  63                     var bitmap = dict.get(style.bitmapId);
  64                     var image = bitmap.image;
  65                     rca.push("var bitmap = dict.get("+style.bitmapId+");");
  66                     rca.push("var image = bitmap.image;");
  67                     rca.push("var canvas_im = document.createElement('canvas');");
  68                     var m_factor = [factor, 0, 0, factor, 0, 0];
  69                     var m = FlappSWFMatrix.multiply(style.matrix, m_factor);
  70                     m[4] = m[5] = 0;
  71                     var xy = FlappSWFMatrix.multiplyVector(m, image.width, image.height);
  72                     rca.push("canvas_im.size = " + xy[0] + ";");
  73                     rca.push("canvas_im.height = " + xy[1] + ";");
  74                     rca.push("var ctx_im = canvas_im.getContext('2d');");
  75                     rca.push("ctx_im.setTransform("+m[0]+","+m[1]+","+m[2]+","+m[3]+","+m[4]+","+m[5]+");");
  76                     rca.push("ctx_im.drawImage(image, 0, 0, image.width, image.height);");
  77                     if ((style.type === 0x40) || (style.type ===  0x42)) {
  78                         rca.push("var pattern = ctx.createPattern(canvas_im, 'repeat');");
  79                     } else {
  80                         rca.push("var pattern = ctx.createPattern(canvas_im, 'no-repeat');");
  81                     }
  82                     styleCode = "pattern";
  83                 }
  84                 break;
  85             }
  86             if (styleCode !== null) {
  87                 rca.push("ctx.fillStyle = "+styleCode+";");
  88                 //              rca.push("ctx.fillStyle = \"rgb(0, 255, 0)\";");
  89             }
  90             if (factor !== 1) {
  91                 rca.push("ctx.save();");
  92                 rca.push("ctx.transform("+1/factor+",0, 0, "+1/factor+", 0, 0);");
  93             }
  94             rca.push("ctx.translate("+minX*factor+","+minY*factor+");");
  95             var edgesUsed = new Uint8Array(edgeInfoList.length); // 0 initialized
  96             for (var i1 = 0, l1 = edgeInfoList.length ; i1 < l1 ; i1++) {
  97                 var edgeInfo = edgeInfoList[i1];
  98                 var edges = edgeInfo.edges;
  99                 if (edgeInfo.prev === null || edgeInfo.next === null) {
 100                     console.warn("edgeInfo.prev === null || edgeInfo.next === null");
 101                     continue;
 102                 }
 103                 if (edgesUsed[i1]) {
 104                     continue; // skip
 105                 }
 106                 var currIndex = i1;
 107                 console.log(edgeInfo);
 108                 rca.push("ctx.beginPath("+(edges[0]-minX)*factor+","+(edges[1]-minY)*factor+");");
 109                 do {
 110                     if (edgesUsed[currIndex]) {
 111                         console.error("duplicate link edge");
 112                         break;
 113                     }
 114                     edgeInfo = edgeInfoList[currIndex];
 115                     edges = edgeInfo.edges;
 116                     var types = edgeInfo.types;
 117                     edgesUsed[currIndex] = 1; // used
 118                     for (var i2 = 2, l2 = edges.length ; i2 < l2; ) {
 119                         if (types[i2 / 2 - 1] === 'C') {
 120                             rca.push("ctx.quadraticCurveTo("+(edges[i2++]-minX)*factor+","+(edges[i2++]-minY)*factor+","+(edges[i2++]-minX)*factor+","+(edges[i2++]-minY)*factor+");");
 121                         } else {
 122                             rca.push("ctx.lineTo("+(edges[i2++]-minX)*factor+","+(edges[i2++]-minY)*factor+");");
 123                         }
 124                     }
 125                     if (currIndex === edgeInfo.next) {
 126                         break; // self loop
 127                     }
 128                 } while ((currIndex = edgeInfo.next) !== null);
 129                 rca.push("ctx.closePath();");
 130             }
 131             rca.push("ctx.fill();");
 132             if (factor !== 1) {
 133                 rca.push("ctx.restore();");
 134             }
 135         }
 136         this.renderCode = rca.join("\n");
 137         console.debug(this.renderCode);
 138     },
 139     render: function(canvas, dict) {
 140         //      debugger;
 141         console.debug("FlappShape::render");
 142         canvas.setTransform(this.absoluteMatrix);
 143         var f = new Function("canvas,dict", this.renderCode);
 144         var ret = f(canvas, dict);
 145     },
 146     destroy: function(canvas) {
 147     }
 148 };
 149
 150
 151 FlappShape.shapetoRenderCode = function(shapeTag) {
 152     ;
 153 };
 154
 155 });