webcpu/api.js

   1 function BitmapCanvas(){
   2         this.canvasDOMObject = null;
   3         this.canvasContext = null;
   4         this.bufferImageData = null;
   5         this.bmp = null;
   6         this.width = undefined;
   7         this.height = undefined;
   8 }
   9 BitmapCanvas.prototype = {
  10         setCanvas: function(canvasDOMObject){
  11                 this.canvasDOMObject = canvasDOMObject;
  12                 if(canvasDOMObject){
  13                         this.canvasContext = this.canvasDOMObject.getContext("2d");
  14                         this.width = this.canvasDOMObject.width;
  15                         this.height = this.canvasDOMObject.height;
  16                         this.bufferImageData = this.canvasContext.getImageData(0, 0, this.width, this.height);
  17                         this.bmp = this.bufferImageData.data;
  18                         console.log(this.bufferImageData);
  19                         //
  20                         /*
  21                         for(var i = 0; i < 100; i += 2){
  22                                 this.drawLine(0, i, 100, i, 0xffffff, 0);
  23                         }
  24                         var x0 = 10;
  25                         var y0 = 10;
  26                         var x1 = 60;
  27                         var y1 = 11;
  28                         this.drawLine(x0, y0, x1, y1, 0xff0000, 0);
  29                         this.drawLine(x1, y1, x0, y0, 0x00ff00, 1);
  30                         */
  31                         this.flush();
  32                 } else{
  33                         this.bmp = null;
  34                         this.canvasContext = null;
  35                         this.bufferImageData = null;
  36                         this.width = undefined;
  37                         this.height = undefined;
  38                 }
  39         },
  40         drawPoint: function(x, y, color, mode){
  41                 if(this.bmp){
  42                         if(mode === undefined){
  43                                 mode = 0;
  44                         } else{
  45                                 mode &= 0x03;
  46                         }
  47                         x += 0.5;
  48                         x |= 0;
  49                         y += 0.5;
  50                         y |= 0;
  51                         //RGBARGBA...
  52                         if(mode == 0){
  53                                 //PSET
  54                                 this.bmp[4 * (y * this.width + x) + 0] = (color >> 16) & 0xFF;
  55                                 this.bmp[4 * (y * this.width + x) + 1] = (color >> 8) & 0xFF;
  56                                 this.bmp[4 * (y * this.width + x) + 2] = color & 0xFF;
  57                         } else if(mode == 1){
  58                                 //OR
  59                                 this.bmp[4 * (y * this.width + x) + 0] |= (color >> 16) & 0xFF;
  60                                 this.bmp[4 * (y * this.width + x) + 1] |= (color >> 8) & 0xFF;
  61                                 this.bmp[4 * (y * this.width + x) + 2] |= color & 0xFF;
  62                         } else if(mode == 2){
  63                                 //XOR
  64                                 this.bmp[4 * (y * this.width + x) + 0] ^= (color >> 16) & 0xFF;
  65                                 this.bmp[4 * (y * this.width + x) + 1] ^= (color >> 8) & 0xFF;
  66                                 this.bmp[4 * (y * this.width + x) + 2] ^= color & 0xFF;
  67                         } else if(mode == 3){
  68                                 //AND
  69                                 this.bmp[4 * (y * this.width + x) + 0] &= (color >> 16) & 0xFF;
  70                                 this.bmp[4 * (y * this.width + x) + 1] &= (color >> 8) & 0xFF;
  71                                 this.bmp[4 * (y * this.width + x) + 2] &= color & 0xFF;
  72                         }
  73                 }
  74         },
  75         drawLine: function(x0, y0, x1, y1, color, mode){
  76                 //整数座標のみ対応。
  77                 x0 |= 0;
  78                 y0 |= 0;
  79                 x1 |= 0;
  80                 y1 |= 0;
  81                 var dx = x1 - x0;
  82                 var dy = y1 - y0;
  83                 var dxa = dx;
  84                 var dya = dy;
  85                 var l;
  86
  87                 if(dxa < 0){
  88                         dxa = -dxa;
  89                 }
  90                 if(dya < 0){
  91                         dya = -dya;
  92                 }
  93
  94                 if(dxa > dya){
  95                         //x軸基準
  96                         l = dxa + 1;
  97                         if(x0 > x1){
  98                                 dx = -1;
  99                         } else{
 100                                 dx = 1;
 101                         }
 102                         dy /= l;
 103                 } else{
 104                         //y軸基準
 105                         l = dya + 1;
 106                         if(y0 > y1){
 107                                 dy = -1;
 108                         } else{
 109                                 dy = 1;
 110                         }
 111                         dx /= l;
 112                 }
 113
 114                 for(var i = 0; i < l; i++){
 115                         this.drawPoint(x0 + dx * i, y0 + dy * i, color, mode);
 116                 }
 117         },
 118         fillRect: function(xSize, ySize, x0, y0, col, mode){
 119
 120         },
 121         fillOval: function(xSize, ySize, x0, y0, col, mode){
 122
 123         },
 124         flush: function(){
 125                 if(this.bufferImageData){
 126                         this.canvasContext.putImageData(this.bufferImageData, 0, 0);
 127                 }
 128         },
 129 }
 130
 131 function WebCPU_API(){
 132         this.mainWindowCanvas = null;
 133         this.mainWindowContext = null;
 134         //this.mainWindowBufferCanvas = document.createElement('canvas');
 135         //this.mainWindowBufferContext = this.mainWindowBufferCanvas.getContext("2d");
 136         //
 137         this.bitmapCanvas = new BitmapCanvas();
 138         //
 139         //this.mainWindowBufferCanvas.width = 640;
 140         //this.mainWindowBufferCanvas.height = 480;
 141         //this.initCanvas(this.mainWindowBufferCanvas);
 142 }
 143 WebCPU_API.prototype = {
 144         executeAPI: function(env){
 145                 var r = env.registers.Integer;
 146                 var APIID = r[0x30];
 147                 switch(APIID){
 148                         case 0xff40:
 149                                 //openWin
 150                                 this.API_openWin(env, r[0x31], r[0x32])
 151                                 break;
 152                         case 0xff41:
 153                                 //openWin
 154                                 this.API_flushWin(env, r[0x31], r[0x32], r[0x33], r[0x34])
 155                                 break;
 156                         case 0xff44:
 157                                 //drawPoint
 158                                 this.API_drawPoint(env, r[0x31], r[0x32], r[0x33], r[0x34]);
 159                                 break;
 160                         case 0xff45:
 161                                 //drawLine
 162                                 this.API_drawLine(env, r[0x31], r[0x32], r[0x33], r[0x34], r[0x35], r[0x36]);
 163                                 break;
 164                         case 0xff46:
 165                                 //fillRect
 166                                 this.API_fillRect(env, r[0x31], r[0x32], r[0x33], r[0x34], r[0x35], r[0x36]);
 167                                 break;
 168                         case 0xff47:
 169                                 //fillOval
 170                                 this.API_fillOval(env, r[0x31], r[0x32], r[0x33], r[0x34], r[0x35], r[0x36]);
 171                                 break;
 172                         default:
 173                                 throw new WebCPU_Exception(0, ["Unknown API Number " + APIID.toString(16)]);
 174                 }
 175                 env.goToPointerRegister(0x30);
 176         },
 177         colorTable:[
 178                 0x000000,
 179                 0xff0000,
 180                 0x00ff00,
 181                 0xffff00,
 182                 0x0000ff,
 183                 0xff00ff,
 184                 0x00ffff,
 185                 0xffffff
 186         ],
 187         setMainWindowCanvasDOMObject: function(obj){
 188                 this.mainWindowCanvas = obj;
 189                 if(this.mainWindowCanvas){
 190                         this.mainWindowContext = this.mainWindowCanvas.getContext('2d')
 191                         this.initCanvas(this.mainWindowCanvas);
 192                         //
 193                         this.bitmapCanvas.setCanvas(this.mainWindowCanvas);
 194                 } else{
 195                         this.mainWindowContext = null;
 196                 }
 197         },
 198         initCanvas: function(c){
 199                 var d = c.getContext('2d');
 200                 d.fillStyle = "rgba(0,0,0,1)";
 201                 d.strokeStyle = "rgba(255, 255, 255, 1)";
 202                 d.lineWidth = 1;
 203                 //描画域は必ず黒で初期化されます。
 204                 d.fillRect(0, 0, c.width, c.height);
 205         },
 206         //
 207         API_openWin: function(env, xSize, ySize){
 208                 env.message("junkApi_openWin();\n", 20);
 209                 this.mainWindowCanvas.width = xSize;
 210                 this.mainWindowCanvas.height = ySize;
 211                 //this.mainWindowBufferCanvas.width = xSize;
 212                 //this.mainWindowBufferCanvas.height = ySize;
 213                 this.initCanvas(this.mainWindowCanvas);
 214                 this.bitmapCanvas.setCanvas(this.mainWindowCanvas);
 215         },
 216         API_flushWin: function(env, xSize, ySize, x0, y0){
 217                 env.message("junkApi_flushWin();\n", 20);
 218                 //this.mainWindowContext.drawImage(this.mainWindowBufferCanvas, x0, y0, xSize, ySize, 0, 0, xSize, ySize);
 219                 this.bitmapCanvas.flush();
 220         },
 221         API_drawPoint: function(env, mode, x, y, col){
 222                 env.message("junkApi_drawPoint();\n", 20);
 223                 if((mode & 0x04) != 0){
 224                         col = this.colorTable[col];
 225                 }
 226                 //this.mainWindowBufferContext.fillStyle = "#" + ("000000" + col.toString(16)).slice(-6).toUpperCase();
 227                 //this.mainWindowBufferContext.fillRect(x, y, 1, 1);
 228                 this.bitmapCanvas.drawPoint(x, y, col, mode);
 229         },
 230         API_drawLine: function(env, mode, x0, y0, x1, y1, col){
 231                 env.message("junkApi_drawLine();\n", 20);
 232
 233                 if((mode & 0x04) != 0){
 234                         col = this.colorTable[col];
 235                 }
 236                 /*
 237                 this.mainWindowBufferContext.strokeStyle = "#" + ("000000" + col.toString(16)).slice(-6).toUpperCase();
 238                 this.mainWindowBufferContext.beginPath();
 239                 this.mainWindowBufferContext.moveTo(x0, y0);
 240                 this.mainWindowBufferContext.lineTo(x1, y1);
 241                 this.mainWindowBufferContext.closePath();
 242                 this.mainWindowBufferContext.stroke();
 243                 */
 244                 this.bitmapCanvas.drawLine(x0, y0, x1, y1, col, mode);
 245         },
 246         API_fillRect: function(env, mode, xSize, ySize, x0, y0, col){
 247                 env.message("junkApi_fillRect();\n", 20);
 248
 249                 if((mode & 0x04) != 0){
 250                         col = this.colorTable[col];
 251                 }
 252                 /*
 253                 this.mainWindowBufferContext.fillStyle = "#" + ("000000" + col.toString(16)).slice(-6).toUpperCase();
 254                 this.mainWindowBufferContext.fillRect(x0, y0, xSize, ySize);
 255                 */
 256         },
 257         API_fillOval: function(env, mode, xSize, ySize, x0, y0, col){
 258                 env.message("junkApi_fillRect();\n", 20);
 259
 260                 if((mode & 0x04) != 0){
 261                         col = this.colorTable[col];
 262                 }
 263                 /*
 264                 this.mainWindowBufferContext.fillStyle = "#" + ("000000" + col.toString(16)).slice(-6).toUpperCase();
 265                 this.mainWindowBufferContext.fillEllipse(x0, y0, xSize, ySize);
 266                 */
 267         },
 268 }