View source for Flags inspired by Bridget Riley

<pre id='shellbody' data-qtp='canvas'></pre>
==Movement in Squares==

<div class='qu' data-width="240" data-height="240">
For each of the first 16 columns the width is 90% of the previous. This pattern is reversed for the remainder. There are 31 columns.
<pre class='usr'>
function drawFlag(ctx)
{
  ctx.fillStyle = 'white';
  ctx.fillRect(0,0,240,240);
  ctx.fillStyle = 'black';
  for(let y=0;y<12;y++){
    for(let x=0;x<31;x++){
       if ((x+y)%2==1){
         ctx.fillRect(240*x/24,240*y/12,240/24,240/12);
       }
    }
  }
}  
</pre>
<pre class='ans'>
function drawFlag(ctx)
{
  ctx.fillStyle = 'white';
  ctx.fillRect(0,0,240,240);
  ctx.fillStyle = 'black';
  let a = 0;
  let w = 240/12;
  for(let x=0;x<31;x++){
    for(let y=0;y<12;y++){
       if ((x+y)%2==1){
         ctx.fillRect(a,240*y/12,w,240/12);
       }
    }
    a += w;
    if (x<16){
      w *= 0.9;
    }else{
      w *= 1/0.9;
    }
  }
}
</pre>
</div>