var areaWidth, areaHeight;

function StretchInit ( prefix )
{
  var currentFrame;
  var x, y, html = '';
  for ( y = 1; y <= 4; y++ )
  {
    for ( x =1 ; x <= 4; x++ )
    {
      html+= '<img id="img' + y + '_' + x + '" ' +
             'src="' + prefix + y + '-' + x + '.png" ' +
             'style="position:absolute;left:0;top:0;display:block" />';
    }
  }

  document.all.content.innerHTML = html;

  document.all.img1_1.style.zOrder = "Back";
  document.all.img1_2.style.zOrder = "Back";
  document.all.img1_3.style.zOrder = "Back";
  document.all.img1_4.style.zOrder = "Back";
  document.all.img2_1.style.zOrder = "Back";
  document.all.img2_2.style.zOrder = "Back";
  document.all.img2_3.style.zOrder = "Back";
  document.all.img2_4.style.zOrder = "Back";
  document.all.img3_1.style.zOrder = "Back";
  document.all.img3_2.style.zOrder = "Back";
  document.all.img3_3.style.zOrder = "Back";
  document.all.img3_4.style.zOrder = "Back";
  document.all.img4_1.style.zOrder = "Back";
  document.all.img4_2.style.zOrder = "Back";
  document.all.img4_3.style.zOrder = "Back";
  document.all.img4_4.style.zOrder = "Back";

  areaWidth = window.document.documentElement.offsetWidth - 19;
  areaHeight = window.document.documentElement.offsetHeight;
}


var Cosinus1 = new Array ( );
var Cosinus2 = new Array ( );
var Cosinus3 = new Array ( );
var Cosinus4 = new Array ( );
var Cosinus5 = new Array ( );
var Cosinus6 = new Array ( );
for ( c = 0; c <= 100; c++ )
{
  Cosinus1[c] = Math.round ( ( Math.cos ( c * 3.141592653589793238 / 100 ) * 15 ) + 16 );
  Cosinus2[c] = Math.round ( ( Math.sin ( c * 3.141592653589793238 / 50 ) * 15 ) + 16 );
  Cosinus3[c] = Math.round ( ( Math.cos ( c * 3.141592653589793238 / 25 ) * 15 ) + 16 );
  Cosinus4[c] = Math.round ( ( Math.cos ( c * 3.141592653589793238 / 100 ) * 15 ) + 16 );
  Cosinus5[c] = Math.round ( ( Math.cos ( c * 3.141592653589793238 / 50 ) * 15 ) + 16 );
  Cosinus6[c] = Math.round ( ( Math.cos ( c * 3.141592653589793238 / 100 ) * 15 ) + 16 );
}

function Stretch ( part, percentage )
{
  percentage = Math.round ( percentage + part * 100 ) / 20;

  var p = Math.round ( percentage );
  var s1 = Cosinus1[p];
  var s2 = Cosinus2[p];
  var s3 = Cosinus3[p];
  var t1 = Cosinus3[p];
  var t2 = Cosinus1[p];
  var t3 = Cosinus2[p];

  var w1 = areaWidth * s1 / 100;
  var w2 = areaWidth * s2 / 100;
  var w3 = areaWidth * s3 / 100;
  var w4 = areaWidth * (100 - s1 - s2 - s3) / 100;

  var h1 = areaHeight * t1 / 100;
  var h2 = areaHeight * t2 / 100;
  var h3 = areaHeight * t3 / 100;
  var h4 = areaHeight * (100 - t1 - t2 - t3) / 100;

  var x1 = 0, x2 = w1, x3 = w1 + w2, x4 = w1 + w2 + w3;
  var y1 = 0, y2 = h1, y3 = h1 + h2, y4 = h1 + h2 + h3;

    var current;

    current = document.all.img1_1.style;
    current.left = x1;
    current.top = y1;
    current.width = w1;
    current.height = h1;

    current = document.all.img1_2.style;
    current.left = x2;
    current.top = y1;
    current.width = w2;
    current.height = h1;

    current = document.all.img1_3.style;
    current.left = x3;
    current.top = y1;
    current.width = w3;
    current.height = h1;

    current = document.all.img1_4.style;
    current.left = x4;
    current.top = y1;
    current.width = w4;
    current.height = h1;



    current = document.all.img2_1.style;
    current.left = x1;
    current.top = y2;
    current.width = w1;
    current.height = h2;

    current = document.all.img2_2.style;
    current.left = x2;
    current.top = y2;
    current.width = w2;
    current.height = h2;

    current = document.all.img2_3.style;
    current.left = x3;
    current.top = y2;
    current.width = w3;
    current.height = h2;

    current = document.all.img2_4.style;
    current.left = x4;
    current.top = y2;
    current.width = w4;
    current.height = h2;



    current = document.all.img3_1.style;
    current.left = x1;
    current.top = y3;
    current.width = w1;
    current.height = h3;

    current = document.all.img3_2.style;
    current.left = x2;
    current.top = y3;
    current.width = w2;
    current.height = h3;

    current = document.all.img3_3.style;
    current.left = x3;
    current.top = y3;
    current.width = w3;
    current.height = h3;

    current = document.all.img3_4.style;
    current.left = x4;
    current.top = y3;
    current.width = w4;
    current.height = h3;



    current = document.all.img4_1.style;
    current.left = x1;
    current.top = y4;
    current.width = w1;
    current.height = h4;

    current = document.all.img4_2.style;
    current.left = x2;
    current.top = y4;
    current.width = w2;
    current.height = h4;

    current = document.all.img4_3.style;
    current.left = x3;
    current.top = y4;
    current.width = w3;
    current.height = h4;

    current = document.all.img4_4.style;
    current.left = x4;
    current.top = y4;
    current.width = w4;
    current.height = h4;

}

function Stretch2 ( part, percentage )
{
  percentage = Math.round ( percentage + part * 100 ) / 20;

  var p = Math.round ( percentage );
  var s1 = Cosinus4[p];
  var s2 = Cosinus5[p];
  var s3 = Cosinus6[p];
  var t1 = Cosinus6[p];
  var t2 = Cosinus4[p];
  var t3 = Cosinus5[p];

  var w1 = areaWidth * s1 / 100;
  var w2 = areaWidth * s2 / 100;
  var w3 = areaWidth * s3 / 100;
  var w4 = areaWidth * (100 - s1 - s2 - s3) / 100;

  var h1 = areaHeight * t1 / 100;
  var h2 = areaHeight * t2 / 100;
  var h3 = areaHeight * t3 / 100;
  var h4 = areaHeight * (100 - t1 - t2 - t3) / 100;

  var x1 = 0, x2 = w1, x3 = w1 + w2, x4 = w1 + w2 + w3;
  var y1 = 0, y2 = h1, y3 = h1 + h2, y4 = h1 + h2 + h3;

    var current;

    current = document.all.img1_1.style;
    current.left = x1;
    current.top = y1;
    current.width = w1;
    current.height = h1;

    current = document.all.img1_2.style;
    current.left = x2;
    current.top = y1;
    current.width = w2;
    current.height = h1;

    current = document.all.img1_3.style;
    current.left = x3;
    current.top = y1;
    current.width = w3;
    current.height = h1;

    current = document.all.img1_4.style;
    current.left = x4;
    current.top = y1;
    current.width = w4;
    current.height = h1;



    current = document.all.img2_1.style;
    current.left = x1;
    current.top = y2;
    current.width = w1;
    current.height = h2;

    current = document.all.img2_2.style;
    current.left = x2;
    current.top = y2;
    current.width = w2;
    current.height = h2;

    current = document.all.img2_3.style;
    current.left = x3;
    current.top = y2;
    current.width = w3;
    current.height = h2;

    current = document.all.img2_4.style;
    current.left = x4;
    current.top = y2;
    current.width = w4;
    current.height = h2;



    current = document.all.img3_1.style;
    current.left = x1;
    current.top = y3;
    current.width = w1;
    current.height = h3;

    current = document.all.img3_2.style;
    current.left = x2;
    current.top = y3;
    current.width = w2;
    current.height = h3;

    current = document.all.img3_3.style;
    current.left = x3;
    current.top = y3;
    current.width = w3;
    current.height = h3;

    current = document.all.img3_4.style;
    current.left = x4;
    current.top = y3;
    current.width = w4;
    current.height = h3;



    current = document.all.img4_1.style;
    current.left = x1;
    current.top = y4;
    current.width = w1;
    current.height = h4;

    current = document.all.img4_2.style;
    current.left = x2;
    current.top = y4;
    current.width = w2;
    current.height = h4;

    current = document.all.img4_3.style;
    current.left = x3;
    current.top = y4;
    current.width = w3;
    current.height = h4;

    current = document.all.img4_4.style;
    current.left = x4;
    current.top = y4;
    current.width = w4;
    current.height = h4;

}

function StretchClose ( )
{

}