class.js

   1 TTweet = enchant.Class.create(enchant.Sprite, {
   2         initialize : function(yukkuri, w, h) {
   3                 this.x = 0;
   4                 this.y = 0;
   5                 this.yukkuri = yukkuri;
   6                 this.lifetime = 0;
   7                 enchant.Sprite.call(this, w, h + TTweet.TAIL);
   8                 this.image = new Surface(w, h + TTweet.TAIL);
   9                 var t = TTweet.TAIL;
  10                 var s = TTweet.SIZE;
  11                 var c = TTweet.CURVE;
  12                 this.outCurve = {
  13                         lt : {x:  0, y:  t},
  14                         rt : {x:  w, y:  t},
  15                         rd : {x:  w, y:h+t},
  16                         ld : {x:  0, y:h+t}
  17                 };
  18                 this.inCurve = {
  19                         lt : {x:  0+s, y:  t+s},
  20                         rt : {x:  w-s, y:  t+s},
  21                         rd : {x:  w-s, y:h+t-s},
  22                         ld : {x:  0+s, y:h+t-s}
  23                 };
  24                 this.image.context.font = "12px 'Times New Roman'";
  25                 var self = this;
  26                 this.addEventListener('enterframe', function(){
  27                         if((this.age % 15) == 0){
  28                                 this.lifetime--;
  29                         }
  30                         if(this.lifetime <= 0){
  31                                 this.lifetime = 0;
  32                                 this.opacity = 0;
  33                         }
  34                         this.x = self.yukkuri.getX() - self.width/4 - self.yukkuri.getWidth() / 2;
  35                         this.y = self.yukkuri.getY() - self.height - self.yukkuri.getHeight() / 2;
  36                         // this._tweet.text(text, this.getX() - this._tweet.width/4, this.getY() - this._tweet.height);
  37                 });
  38         },
  39         reDraw : function() {
  40                 var c = TTweet.CURVE;
  41                 var o = this.outCurve;
  42                 with(this.image.context) {
  43                         fillStyle = 'black';
  44                         strokeStyle = 'black';
  45                         beginPath();
  46                         moveTo(o.lt.x, o.lt.y+c);
  47                         quadraticCurveTo(o.lt.x, o.lt.y, o.lt.x+c, o.lt.y);
  48                         lineTo(o.rt.x-c, o.rt.y);
  49                         quadraticCurveTo(o.rt.x, o.rt.y, o.rt.x, o.rt.y+c);
  50                         lineTo(o.rd.x, o.rd.y-c);
  51                         quadraticCurveTo(o.rd.x, o.rd.y, o.rd.x-c, o.rd.y);
  52                         lineTo(o.ld.x+c, o.ld.y);
  53                         quadraticCurveTo(o.ld.x, o.ld.y, o.ld.x, o.ld.y-c);
  54                         // しっぽ
  55                         // var _height = 100;
  56                         // lineTo(this.width/2-4,_height + TTweet.TAIL);
  57                         // lineTo(this.width/2,_height + 0);
  58                         // lineTo(this.width/2+4,_height + TTweet.TAIL);
  59                         closePath();
  60                         fill();
  61                         stroke();
  62                 };
  63                 this.clear();
  64         },
  65         clear : function() {
  66                 var c = TTweet.CURVE;
  67                 var o = this.outCurve;
  68                 var i = this.inCurve;
  69                 with(this.image.context) {
  70                         // 抜く
  71                         fillStyle = 'white';
  72                         beginPath();
  73                         moveTo(i.lt.x, o.lt.y+c);
  74                         quadraticCurveTo(i.lt.x, i.lt.y, o.lt.x+c, i.lt.y);
  75                         lineTo(o.rt.x-c, i.rt.y);
  76                         quadraticCurveTo(i.rt.x, i.rt.y, i.rt.x, o.rt.y+c);
  77                         lineTo(i.rd.x, o.rd.y-c);
  78                         quadraticCurveTo(i.rd.x, i.rd.y, o.rd.x-c, i.rd.y);
  79                         lineTo(o.ld.x+c, i.ld.y);
  80                         quadraticCurveTo(i.ld.x, i.ld.y, i.ld.x, o.ld.y-c);
  81                         closePath();
  82                         fill();
  83                 };
  84         },
  85         text : function(text, x, y) {
  86                 this.x = this.yukkuri.getX() - this.width/4 - this.yukkuri.getWidth() / 2;
  87                 this.y = this.yukkuri.getY() - this.height - this.yukkuri.getHeight() / 2;
  88                 x = this.x;
  89                 y = this.y;
  90                 this.clear();
  91                 this.opacity = 0.8;
  92
  93                 this.reDraw();
  94                 with(this.image.context) {
  95                         fillStyle = 'black';
  96                         textAlign = 'center';
  97                         textBaseline = 'middle';
  98                         this.x = x;
  99                         this.y = y;
 100                         var textList = text.split("\n");
 101                         var len = textList.length / 2;
 102                         var height = (this.height/(1 + len));
 103                         this.fillTextLine(text,this.width/2, height);
 104                 }
 105                 this.lifetime = 7;
 106
 107         },
 108         fillTextLine : function(text, x, y) {
 109                 var textList = text.split("\n");
 110                 var lineHeight = this.image.context.measureText("あ").width + 2;
 111                 var self = this;
 112                 textList.forEach(function(text, i) {
 113                         self.image.context.fillText(text, x, y + lineHeight * i);
 114                 });
 115         },
 116
 117
 118 });
 119 TTweet.TAIL  =  8;
 120 TTweet.SIZE  =  2;
 121 TTweet.CURVE = 16;
 122
 123
 124 var Box = enchant.Class.create(enchant.Sprite, {
 125         initialize : function(ctl, node, x, y,  w, h) {
 126                 enchant.Sprite.call(this, w, h + TTweet.TAIL);
 127                 this.node = node;
 128                 this.x = x;
 129                 this.y = y;
 130                 //even ObjSprite
 131                 this.id = guid();
 132
 133
 134                 this.ctl = ctl;
 135                 ctl.addObj(this);
 136                 ctl.game.rootScene.addEventListener('touchstart', this.touchstart(this));
 137                 ctl.backgroundMap.addChild(this);
 138
 139
 140                 this.lifetime = 999;
 141                 this.image = new Surface(w, h + TTweet.TAIL);
 142                 var t = TTweet.TAIL;
 143                 var s = TTweet.SIZE;
 144                 var c = TTweet.CURVE;
 145                 this.outCurve = {
 146                         lt : {x:  0, y:  t},
 147                         rt : {x:  w, y:  t},
 148                         rd : {x:  w, y:h+t},
 149                         ld : {x:  0, y:h+t}
 150                 };
 151                 this.inCurve = {
 152                         lt : {x:  0+s, y:  t+s},
 153                         rt : {x:  w-s, y:  t+s},
 154                         rd : {x:  w-s, y:h+t-s},
 155                         ld : {x:  0+s, y:h+t-s}
 156                 };
 157                 this.image.context.font = "12px 'Times New Roman'";
 158                 var self = this;
 159                 this.addEventListener('enterframe', function(){
 160                         if((this.age % BASE_FPS) == 0){
 161                                 this.lifetime--;
 162                                 this.drawBox();
 163                         }
 164                         if(this.lifetime <= 0){
 165                                 this.lifetime = 0;
 166                                 this.opacity = 0;
 167                                 this.removeEventListener('enterframe', arguments.callee);
 168                                 self.release();
 169                         }
 170                 });
 171         },
 172         reDraw : function() {
 173                 var c = TTweet.CURVE;
 174                 var o = this.outCurve;
 175                 with(this.image.context) {
 176                         fillStyle = 'black';
 177
 178                         strokeStyle = 'black';
 179                         beginPath();
 180                         moveTo(o.lt.x, o.lt.y+c);
 181                         quadraticCurveTo(o.lt.x, o.lt.y, o.lt.x+c, o.lt.y);
 182                         lineTo(o.rt.x-c, o.rt.y);
 183                         quadraticCurveTo(o.rt.x, o.rt.y, o.rt.x, o.rt.y+c);
 184                         lineTo(o.rd.x, o.rd.y-c);
 185                         quadraticCurveTo(o.rd.x, o.rd.y, o.rd.x-c, o.rd.y);
 186                         lineTo(o.ld.x+c, o.ld.y);
 187                         quadraticCurveTo(o.ld.x, o.ld.y, o.ld.x, o.ld.y-c);
 188                         closePath();
 189                         fill();
 190                         stroke();
 191                 };
 192                 this.clear();
 193         },
 194         clear : function() {
 195                 var c = TTweet.CURVE;
 196                 var o = this.outCurve;
 197                 var i = this.inCurve;
 198                 with(this.image.context) {
 199                         // 抜く
 200                         fillStyle = 'white';
 201                         beginPath();
 202                         moveTo(i.lt.x, o.lt.y+c);
 203                         quadraticCurveTo(i.lt.x, i.lt.y, o.lt.x+c, i.lt.y);
 204                         lineTo(o.rt.x-c, i.rt.y);
 205                         quadraticCurveTo(i.rt.x, i.rt.y, i.rt.x, o.rt.y+c);
 206                         lineTo(i.rd.x, o.rd.y-c);
 207                         quadraticCurveTo(i.rd.x, i.rd.y, o.rd.x-c, i.rd.y);
 208                         lineTo(o.ld.x+c, i.ld.y);
 209                         quadraticCurveTo(i.ld.x, i.ld.y, i.ld.x, o.ld.y-c);
 210                         closePath();
 211                         fill();
 212                 };
 213         },
 214         drawBox : function() {
 215                 this.clear();
 216                 this.opacity = 0.7;
 217                 text = this.node.getStatusForDisplay();
 218                 this.reDraw();
 219                 with(this.image.context) {
 220                         fillStyle = 'black';
 221                         textAlign = 'center';
 222                         textBaseline = 'middle';
 223                         var textList = text.split("\n");
 224                         var len = textList.length / 2;
 225                         var height = (this.height/(1 + len));
 226                         this.fillTextLine(text,this.width/2, height);
 227                 }
 228         },
 229         fillTextLine : function(text, x, y) {
 230                 var textList = text.split("\n");
 231                 var lineHeight = this.image.context.measureText("あ").width + 2;
 232                 var self = this;
 233                 textList.forEach(function(text, i) {
 234                         self.image.context.fillText(text, x, y + lineHeight * i);
 235                 });
 236         },
 237         getX : function(){
 238                 return this.x;
 239         },
 240         getY : function(){
 241                 return this.y;
 242         },
 243         getWidth: function(){
 244                 return this.width;
 245         },
 246         getHeight: function(){
 247                 return this.height;
 248         },
 249         touchstart:function(self){
 250                 return function(e){
 251                         if(typeof e === "undefined")return;
 252                         // this.removeEventListener('touchstart', arguments.callee);
 253                         // self.release();
 254                         // if(self.x <= e.x && self.x + self.width >= e.x
 255                         //      && self.y <= e.y && self.y + self.height >= e.y
 256                         //      ){
 257                         if(ctl.isCollision(e, self)){
 258                                 this.removeEventListener('touchstart', arguments.callee);
 259                                 self.release();
 260                         }
 261
 262                 };
 263         },
 264         release: function(){
 265                 this.parentNode.removeChild(this);
 266                 ctl.backgroundMap.removeChild(this);
 267                 ctl.removeObj(this);
 268                 this.lifetime = null;
 269                 this.ctl = null;
 270         }
 271
 272 });
 273
 274
 275 GPopup = enchant.Class.create(enchant.Sprite, {
 276         initialize : function(scene, x, y, w, h) {
 277                 enchant.Sprite.call(this, w, h);
 278                 this.image = new Surface(w, h);
 279                 this.x = x;
 280                 this.y = y;
 281                 scene.addChild(this);
 282                 this.scene = scene;
 283                 this.text = "";
 284         },
 285         clear : function() {
 286                 this.image.context.fillStyle = '#000099';
 287                 this.image.context.fillRect(0, 0, this.getWidth(), this.getHeight());
 288         },
 289         setText : function(text) {
 290                 this.image.context.fillStyle = 'black';
 291                 this.image.context.textAlign = 'left';
 292                 this.image.context.textBaseline = 'top';
 293                 this.image.context.font = "13px 'Times New Roman'";
 294
 295                 var textWidth = Math.floor(this.image.context.measureText(text).width);
 296                 var lineHeight = this.image.context.measureText("あ").width;
 297                 var _textList = text.split("\n");
 298                 this.renew(this.scene, this.x, this.y, textWidth, (lineHeight) * _textList.length + 6);
 299                 this.text = text;
 300         },
 301         drawText : function (){
 302                 this.clear();
 303                 var x = 0;
 304                 var y = 0;
 305                 // var lineHeight = this.image.context.measureText("あ").width;
 306                 this.image.context.fillStyle = '#ffffff';
 307                 this.image.context.textAlign = 'left';
 308                 this.image.context.textBaseline = 'alphabetic';
 309                 this.image.context.font = "12px 'Times New Roman'";
 310                 this.fillTextLine(this.text ,x, y);
 311         },
 312         getWidth : function(){
 313                 return this.image.width;
 314         },
 315         getHeight : function(){
 316                 return this.image.height;
 317         },
 318         fillTextLine : function(text, x, y) {
 319                 var textList = text.split("\n");
 320                 var lineHeight = this.image.context.measureText("あ").width + 2;
 321                 var self = this;
 322                 textList.forEach(function(text, i) {
 323                         self.image.context.fillText(text, x, y + lineHeight * (i+1));
 324                 });
 325         },
 326         renew : function(scene, x, y, w, h){
 327                 scene.removeChild(this);
 328                 enchant.Sprite.call(this, w, h);
 329                 this.image = new Surface(w, h);
 330                 this.x = x;
 331                 this.y = y;
 332                 scene.addChild(this);
 333         }
 334 });
 335
 336
 337 GWindow = enchant.Class.create(enchant.Sprite, {
 338         initialize : function(scene, x, y, w, h) {
 339                 enchant.Sprite.call(this, w, h);
 340                 this.image = new Surface(w, h);
 341                 this.x = x;
 342                 this.y = y;
 343                 scene.addChild(this);
 344         },
 345         clear : function() {
 346                 this.image.context.fillStyle = '#ffff00';
 347                 this.image.context.fillRect(0, 0, this.getWidth(), this.getHeight());
 348         },
 349         text : function(text, x, y) {
 350                 this.clear();
 351                 this.image.context.fillStyle = 'black';
 352                 this.image.context.textAlign = 'left';
 353                 this.image.context.textBaseline = 'middle';
 354                 this.image.context.font = "12px 'Times New Roman'";
 355                 var textWidth = Math.floor(this.image.context.measureText(text).width);
 356
 357                 var lineHeight = this.image.context.measureText("あ").width;
 358                 this.image.context.fillText(text + ":" + textWidth,x, y + lineHeight);
 359         },
 360         getWidth : function(){
 361                 return this.image.width;
 362         },
 363         getHeight : function(){
 364                 return this.image.height;
 365         },
 366
 367         renew : function(scene, x, y, w, h){
 368                 scene.removeChild(this);
 369                 enchant.Sprite.call(this, w, h);
 370                 this.image = new Surface(w, h);
 371                 this.x = x;
 372                 this.y = y;
 373                 scene.addChild(this);
 374         }
 375 });
 376 App.YUtil = enchant.Class.create(enchant.Sprite,{
 377         randomLooks : function(){
 378                 return rand(_.size(ELooks));
 379         }
 380 });
 381
 382
 383 //how to use
 384 //var tweet = new TTweet(128, 64);
 385 //tweet.text("ABCDEFG");