function tab(mode, tab, file) {
    if (mode == tab) {
        return '<TD class="i1"><DIV><img src="point01s.gif"/>' + tab + '</DIV></TD>';
    } else {
        return '<TD class="i0"><A href="' + file +'"><img src="point01s.gif" />' + tab + '</A></TD>';
    }
}

function head(mode) {
    document.write
        ('<TABLE width="100%"><TR><TD>' +
         '<TABLE border="0" cellpadding="0" cellspacing="0" width="100%">' +
         '<TR><TD colspan="9" align="center" style="padding-bottom:20px">' +
         '<IMG class="pngt" src="logo01-3.png">' +
         '<DIV class="name">Akiko ISHIKAWA</DIV>' +
         '</TD>' +
         '<TD rowspan="2" valign="bottom"><A href="http://69616832.at.webry.info/"><img border="0" src="blog01l.gif"/></A></TD></TR>' +
         '<TR><TD width="4"><img border="0" src="tab4.gif"/></TD>' +
         tab(mode, 'Top', 'index.html') +
         tab(mode, 'Calligraphy', 'calligraphy.html') +
         tab(mode, 'Class', 'class.html') +
         tab(mode, 'Gallery', 'gallery.html') +
         tab(mode, 'Contact', 'contact.html') +
         tab(mode, 'Links', 'links.html') +
         '<TD width="4"><img border="0" src="tab5.gif"/></TD>' +
         '<TD width="100%"><img border="0" height="32" width="100%" src="tab6.gif"/></TD>' +
         '</TR></TABLE>' +
         '<TABLE border="0" cellpadding="0" cellspacing="0" width="100%">' +
         '<TR height="100%">' +
         '<TD width="4"><img border="0" height="100%" width="4" src="tab8.gif"/></TD>' +
         '<TD colspan="7" bgcolor="#ffffff">' +
         '<DIV class="pane"><TABLE cellpadding="0" cellspacing="0"><TR>' +
         '<TD width="80"><img src="dummy.png"></TD>' +
         '<TD width="120"><img src="dummy.png"></TD>' +
         '<TD><img src="dummy.png"></TD>' +
         '<TD width="120"><img src="dummy.png"></TD>' +
         '<TD width="80"><img src="dummy.png"></TD></TR>' +
         '<TR><TD colspan="2" align="left"><img src="corner01Lw.png"/></TD>' +
         '<TD colspan="1" class="exp"></TD>' +
         '<TD colspan="2" align="right"><img src="corner01Rw.png"/></TD></TR>' +
         '<TR><TD colspan="1" valign="top" width="80"><img src="corner02Lw.png"/></TD>' +
         '<TD colspan="3" width="100%">');
}
function tail() {
    document.write
        ('</TD>' +
         '<TD colspan="1" valign="top" width="80"><img src="corner02Rw.png"/></TD>' +
         '</TR></TABLE></DIV></TD>' +
         '<TD width="4"><img border="0" height="100%" width="4" src="tab9.gif"/></TD>' +
         '</TR></TABLE>' +
         '<TABLE border="0" cellpadding="0" cellspacing="0" width="100%"><TR>' +
         '<TD width="4"><img border="0" src="tab10.gif"/></TD>' +
         '<TD colspan="7"><img border="0" height="4" width="100%" src="tab11.gif"/></TD>' +
         '<TD width="4"><img border="0" src="tab12.gif"/></TD>' +
         '</TR></TABLE></TD></TR></TABLE>' +
         '<DIV class="contact">' +
         'Copyright 2009 ISHIKAWA Akiko. All Rights Reserved. お問い合わせは');
    ml('こちら');
    document.write('まで</DIV>');
}

function ml(text) {
    document.write("<a href='contact.html'>" + text + "</a>");
}

var x=0;
var w=196;
var d=0;
var ds=0;
var imgs = new Array();
var works = new Array();
var monthly = new Array();
var captions = new Array();
var wcaptions = new Array();
var monthlyCap = new Array();
var monthlyUntil = new Array();
var imgt;
var imgp = '<DIV id="fl" class="flw" ';
function init2() {
    for (var img in imgs) (new Image()).src = imgs[img];

    imgt = '<TABLE cellpadding="0" cellspacing="0"><TR>';
    imgt += '<TD><img src="'+imgs[imgs.length - 1]+'"  width="196" height="146"/></TD>'
    for (i in imgs) {
        imgt +='<TD><img src="'+imgs[i]+'" width="196" height="146"/></TD>';
    }
    imgt += '<TD><img src="'+imgs[0]+'" width="196" height="146"/></TD>'
    imgt += '</TR></TABLE></DIV>';
    document.getElementById('fl').innerHTML=imgp + 'style="position:absolute;left:' + (62 - w) + 'px;">' + imgt;
    document.getElementById('caption').innerHTML=captions[-Math.round(x/w)];
    flow2();
}
function flow2() {
    if (d == -1) {
        x = (x - 28) % (w * imgs.length)
        if (ds == 0 && (x % w) == 0) d=0;
        document.getElementById('fl').innerHTML=imgp + 'style="position:absolute;left:' + (x+62 - w) + 'px;">' + imgt;
        document.getElementById('caption').innerHTML=captions[(-Math.round(x/w)) % captions.length];
    } else if (d == 1) {
        x = (x - (w * imgs.length) + 28) % (w * imgs.length)
        if (ds == 0 && (x % w) == 0) d=0;
        document.getElementById('fl').innerHTML=imgp + 'style="position:absolute;left:' + (x+62 - w) + 'px;">' + imgt;
        document.getElementById('caption').innerHTML=captions[(-Math.round(x/w)) % captions.length];
    }
    if (d==-1) {
        document.getElementById('al').setAttribute('src', 'flower01al2.gif');
    }
    if (d==1) {
        document.getElementById('ar').setAttribute('src', 'flower01ar2.gif');
    }
    // moveWorks();
    window.setTimeout("flow2()", 100);
}
function flowRight() {d = -1; ds=1;}
function flowLeft() {d = 1; ds=1;}
function flowOL() {
    document.getElementById('al').setAttribute('src', 'flower01bl2.gif');
}
function flowOR() {
    document.getElementById('ar').setAttribute('src', 'flower01br2.gif');
}
function flowUL() {
    document.getElementById('al').setAttribute('src', 'flower01al2.gif');
}
function flowUR() {
    document.getElementById('ar').setAttribute('src', 'flower01ar2.gif');
}
function stop() {ds=0;}

var worksFlow;
var monthlyFlow;

function moveWorksInit() {
    for (var img in works) (new Image()).src = works[img];
    for (var img in monthly) (new Image()).src = monthly[img];
    worksFlow = new Flow2(works, wcaptions, 'works', 'worksFlow');
    worksFlow.movePics();
    monthlyFlow = new Flow2(monthly, monthlyCap, 'monthly', 'monthlyFlow');
    var date = new Date();
    var m = date.getMonth() + 1;
    var d = date.getDate();
    var start = 0;
    for (var n in monthlyUntil) {
        var mu = monthlyUntil[n];
        if (mu.m > m || mu.m == m && mu.d >= d) {
            start = n;
            break;
        }
    }
    for (var i in monthlyFlow.pics) {
        monthlyFlow.state[i] = (i - 0 + monthlyFlow.pics.length - start) %
            monthlyFlow.pics.length * monthlyFlow.wstep;
    }
    monthlyFlow.movePics();
}

var gpx = 0;
var gpy = 0;
var gmoving = false;
var gnx;
var gny;
var gpn;
var gstep;

function ginit(x, y) {
    gpx = x;
    gpy = y;
    gshow(x * (320 + 24), y * (240 + 24));
}

function gmove(n) {
    var gx = n % 3;
    var gy = Math.floor(n / 3);
    if (gmoving || gx == gpx && gy == gpy) return;
    // gmoving = true;
    gnx = gx;
    gny = gy;
    gstep = 1;
    gpn = n;
    gmove00();
}

function gmove00() {
    var gx = Math.floor((gpx + (gnx - gpx) * gstep / 10) * (320 + 24));
    var gy = Math.floor((gpy + (gny - gpy) * gstep / 10) * (240 + 24));
    gshow(gx, gy);
    if (gstep == 10) {
        gpx = gnx;
        gpy = gny;
        gmoving = false;
        gcap(gpn);
        return;
    }
    gstep++;
    window.setTimeout("gmove00()", 20);
}

function gshow(gx, gy) {
    var gv = '';
    for (i in gimgs) {
        var x = (i % 3) * (320 + 24) - gx;
        var y = Math.floor(i / 3) * (240 + 24) - gy;
        gv += '<img src="' + gimgs[i] +
            '" style="position:absolute;left:' + x + 'px;top:' + y +
            'px;width:320px;height:240px;"/>';
    }
    document.getElementById('gview').innerHTML = gv;
}

function gcap(n) {
    document.getElementById('gat').innerHTML = gcaps[n];
}

function Flow2(pics, caps, tag, name) {
    this.wpw = 196;
    this.wph = 146;
    this.wwidth = 200;
    this.wheight = 150;
    this.wcw = 190;
    this.wrw = this.wwidth * 0.9;
    this.wrh = this.wheight / 2;
    this.xoff = this.wwidth * 3 / 4 + (this.wwidth - this.wpw) / 2;
    this.yoff = (this.wheight - this.wph) / 2;
    this.wstep = 10;
    this.state = new Array();
    this.wd = 0;
    this.wds = 0;
    this.bl = 1;
    this.bi = 0.02;
    this.pics = pics;
    this.caps = caps;
    this.tag = tag;
    this.name = name;
    this.wstep15 = this.wstep * 1.5;
    this.wstep2 = this.wstep * 2;
    for (i in pics) this.state[i] = i * this.wstep;
}

Flow2.prototype.showPics = function() {
    var wstr = "";
    for (var i in this.pics) {
        var p = this.state[i] - this.pics.length * this.wstep;
        if (this.state[i] >= 0 && this.state[i] <= this.wstep2) {
            var wx = Math.floor(this.wwidth * this.state[i] / this.wstep +
                                this.xoff);
            var wy = Math.floor(this.yoff);
            var wcx = Math.floor(wx + (this.wwidth - this.wcw) / 2);
            var wcy = wy + this.wheight;
            wstr +=
                '<img src="'+this.pics[i]+'" width="' + this.wpw +
                '" height="' + this.wph + '" style="position:absolute;left:' +
                wx + 'px;top:' + wy + 'px;"/>';
            wstr += '<div style="width:' + this.wcw +
                'px;text-align:center;position:absolute;left:' + wcx +
                'px;top:' + wcy + 'px;">' + this.caps[i] + '</div>';
        }
        if (this.state[i] > this.wstep2 && this.state[i] <= 3 * this.wstep) {
            var t = Math.PI * (this.state[i] - this.wstep2) / this.wstep / 2;
            var rate =
                (this.wstep15 - this.state[i] + this.wstep2) / this.wstep15;
            var ww = this.wpw * rate * this.bl;
            var wh = this.wph * rate * this.bl;
            var wx = Math.floor(this.wwidth * this.state[i] / this.wstep +
                                this.xoff);
            var wy = Math.floor(this.wheight + this.yoff -
                                Math.cos(t) * this.wrh - wh / 2);
            wstr +=
                '<img src="'+this.pics[i]+'" width="' + ww + '" height="' +
                wh + '" style="position:absolute;left:' + wx + 'px;top:' + wy
                + 'px;" onMouseOver="' + this.name + '.wRight();"/>';
        }
        if (this.state[i] > 3 * this.wstep &&
            this.state[i] <= 3.5 * this.wstep) {
            var t = Math.PI * (this.state[i] - this.wstep2) / this.wstep / 2;
            var rate =
                (this.wstep15 - this.state[i] + this.wstep2) / this.wstep15;
            var ww = this.wpw * rate;
            var wh = this.wph * rate;
            var wx = Math.floor(this.wwidth * 3 -
                                (this.state[i] - 3 * this.wstep) /
                                this.wstep + this.xoff);
            var wy = Math.floor(this.wheight + this.yoff -
                                Math.cos(t) * this.wrh - wh / 2);
            wstr +=
                '<img src="'+this.pics[i]+'" width="' + ww + '" height="' +
                wh + '" style="position:absolute;left:' + wx + 'px;top:' + wy
                + 'px;" onMouseOver="' + this.name + '.wRight();"/>';
        }
        if (this.state[i] >= (this.pics.length - 1) * this.wstep) {
            var t = Math.PI * p / this.wstep / 2;
            var rate = (this.wstep15 + p) / (this.wstep15);
            var ww = this.wpw * rate * this.bl;
            var wh = this.wph * rate * this.bl;
            var wx = Math.floor(this.wwidth *
                                ((this.state[i] + this.wstep) % this.wstep) /
                                this.wstep + this.xoff -
                                (this.wwidth - this.wpw) - ww);
            var wy = Math.floor(this.wheight + this.yoff -
                                Math.cos(t) * this.wrh - wh / 2);
            wstr +=
                '<img src="'+this.pics[i]+'" width="' + ww + '" height="' +
                wh + '" style="position:absolute;left:' + wx + 'px;top:' + wy
                + 'px;" onMouseOver="' + this.name + '.wLeft();"/>';
        }
        if (this.state[i] >= (this.pics.length - 1.5) * this.wstep &&
            this.state[i] < (this.pics.length - 1) * this.wstep) {
            var t = Math.PI * p / this.wstep / 2;
            var ww = this.wpw * (this.wstep15 + p) / (this.wstep15);
            var wh = this.wph * (this.wstep15 + p) / (this.wstep15);
            var wx = Math.floor(this.xoff - (this.wwidth - this.wpw) - ww +
                                this.state[i] - (this.pics.length - 1) *
                                this.wstep);
            var wy = Math.floor(this.wheight + this.yoff - Math.cos(t) *
                                this.wrh - wh / 2);
            wstr +=
                '<img src="'+this.pics[i]+'" width="' + ww + '" height="' +
                wh + '" style="position:absolute;left:' + wx + 'px;top:' + wy
                + 'px;" onMouseOver="' + this.name + '.wLeft();"/>';
        }
    }
    document.getElementById(this.tag).innerHTML=wstr;
}

Flow2.prototype.movePics = function() {
    if (this.wd != 0) {
        for (i in works) {
            this.state[i] = (this.state[i] + this.pics.length * this.wstep +
                             this.wd) % (this.pics.length * this.wstep);
        }
        if (this.state[0] % this.wstep == 0) this.wd = 0;
    } else {
        this.bl += this.bi;
        if (this.bl >= 1.1) this.bi = -0.02;
        else if (this.bl <= 0.9) this.bi = 0.02;
    }
    this.showPics();
    window.setTimeout(this.name + ".movePics()", 100);
}

Flow2.prototype.wRight = function() {this.wd = -1; this.wds=1;}
Flow2.prototype.wLeft = function() {this.wd = 1; this.wds=1;}

var coverpics = new Array();

function selCover() {
    var date = new Date();
    var m = date.getMonth() + 1;
    var d = date.getDate();
    for (var n in coverpics) {
        var cp = coverpics[n];
        if (cp.m > m || cp.m == m && cp.d >= d) {
            document.getElementById('cover').setAttribute('src', cp.pic);
            break;
        }
    }
}