Nugroho's blog.: December 2012

Saturday, December 8, 2012

Mountain Lion's Spotlight didn't Spot Application

Maybe it's just me, after upgrading from leopard to snowleopard to lion and finally mountain lion (always upgrade, no fresh install), this big cat suddenly refuse to index my Application. Whenever I type application name in Spotlight, it just show document, picture but not Application. Typing "macvim" bring me to macvim installation folder, macvim on the web but not Macvim apps. Spotlight setting clearly didn't ban Application folder, so maybe this is another Mountain Lion problem

Still looking for solution...

Mountain Lion's Fullscreen Apps on Extended Display

It seems that weakness of this big cat isn't resolved yet. I used Pages in my Desktop while the big one browsing trough web using safari for refence. When I switch (automatically, bad behaviour I think) to fullscreen on Pages, suddenly the other display become blank (not actually blank, just linen-like wall, or maybe canvas).

Monday, December 3, 2012

Playing with Opacity on HTML5's canvas

What I do here is wrap whole canvas on this program with a rectangle with opacity 0.1. So the code (under script tag) become like this:

var context;
var x=100;
var y=200;
var dx=5;
var dy=5;
var n=10;
var bBola=new Array();
function init(){
 canvas=myCanvas;
 context= myCanvas.getContext('2d');
 for (i=0;i &lt n;i++){
  dx = Math.random()*10-5;
  dy = Math.random()*10-5;
  bBola.push(new bola('#007700', 11,dx,dy));
 } 
 setInterval(draw,10);

}

function draw(){
   for (i=0;i &lt n;i++){
   if (bBola[i].x &gt = (canvas.width - bBola[i].r) || bBola[i].x &lt = bBola[i].r) bBola[i].dx *= -1;
  if (bBola[i].y &gt = (canvas.height - bBola[i].r) || bBola[i].y &lt = bBola[i].r) bBola[i].dy *= -1;

  //buat
  bBola[i].context.beginPath();
      bBola[i].context.fillStyle = bBola[i].color;
      bBola[i].context.arc(bBola[i].x,bBola[i].y,bBola[i].r,0,Math.PI*2,false);
  bBola[i].context.fill();
   
  //gerak
      bBola[i].x+=bBola[i].dx;
  bBola[i].y+=bBola[i].dy;
 }
 
 context.fillStyle='rgba(255,255,255,.1)';
 context.fillRect(0,0,canvas.width,canvas.height);
}

function bola(color, r,dx,dy){
     this.canvas  = canvas;
     this.context = canvas.getContext('2d');
     this.r  = r;
     this.x =Math.random()*400+30;
     this.y  = Math.random()*250+30;
     this.dx  = dx;
     this.dy  = dy;
     this.color   = color;
}

window.onload = function(){
        init()
}

Here the complete html page code

<head>
<script>
var context;
var x=100;
var y=200;
var dx=5;
var dy=5;
var n=10;
var bBola=new Array();
function init(){
canvas=myCanvas;
context= myCanvas.getContext('2d');
for (i=0;i<n;i++){
dx = Math.random()*10-5;
dy = Math.random()*10-5;
bBola.push(new bola('#007700', 11,dx,dy));
}
setInterval(draw,10);

}

function draw(){
for (i=0;i<n;i++){
//pantul
if (bBola[i].x >= (canvas.width - bBola[i].r) || bBola[i].x <= bBola[i].r) bBola[i].dx *= -1;
if (bBola[i].y >= (canvas.height - bBola[i].r) || bBola[i].y <= bBola[i].r) bBola[i].dy *= -1;

//buat
bBola[i].context.beginPath();
bBola[i].context.fillStyle = bBola[i].color;
bBola[i].context.arc(bBola[i].x,bBola[i].y,bBola[i].r,0,Math.PI*2,false);
bBola[i].context.fill();

//gerak
bBola[i].x+=bBola[i].dx;
bBola[i].y+=bBola[i].dy;
}

context.fillStyle='rgba(255,255,255,.1)';
context.fillRect(0,0,canvas.width,canvas.height);
}

function bola(color, r,dx,dy){
this.canvas = canvas;
this.context = canvas.getContext('2d');
this.r = r;
this.x =Math.random()*400+30;
this.y = Math.random()*250+30;
this.dx = dx;
this.dy = dy;
this.color = color;
}

window.onload = function(){
init()
}
</script>
</head>
<body>
<canvas height="300" id="myCanvas" width="500">
</canvas>
</body>