The Big Box

The 500x500 banner was always the one I dreaded the most. My first plans for it were lending towards a dress up droll style game. However during the time I spent creating the other two banners I came to realise that I didn't think it was a worthy exploration. So instead I turned my attention towards a mini version of the Marvel digital comics comic viewer. A mini flash application that lets you read a sample comics. Roughly about 5 pages long each page is 100k and loaded as and when the user requests the page. I can't show you how it works here so you'll have to make do with some screen shots. It's unfortunate but I just don't have the web space that is required in order to uploaded the various different files that this banner uses.

This was a good project, even if it didn't entirely succeed, which can be read about in my evaluation (to follow sometime shortly).

The reason I'll label this as a decent attempt is simply that it taught me some incredibly useful techniques that I just hadn't grasped before, in particular setting off functions in a different manner and the use of XML within Flash.

 

Code:

//xml
function loadXML(loaded) {
    if (loaded) {
        xmlNode = this.firstChild;
        image = [];
        description = [];
        total = xmlNode.childNodes.length;
        for (i=0; i<total; i++) {
            image[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
            description[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
        }
        firstImage();
    } else {
        desc_txt.text = "unable to find file!"
        content = "file not loaded!";
    }
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("images.xml");
//variables
//listeners
listen = new Object();
listen.onKeyDown = function() {
    if (Key.getCode() == Key.LEFT) {
        prevImage();
    } else if (Key.getCode() == Key.RIGHT) {
        nextImage();
    }
};
Key.addListener(listen);
//buttons
reAlign_btn.onRelease = function(){
    reAlign();
}
previous_btn.onRelease = function() {
    prevImage();
};
next_btn.onRelease = function() {
    nextImage();
};
sizeInc_btn.onRelease = function() {
    sizeInc();
};
sizeDec_btn.onRelease = function() {
    sizeDec();
};
panRight_mc.onRelease = function(){
    picture._x += 20;
}
panLeft_mc.onRelease = function(){
    picture._x -= 20;
}
panDown_mc.onRelease = function(){
    picture._y += 20;
}
panUp_mc.onRelease = function(){
    picture._y -= 20;
}
//object functions
p = 0;
this.onEnterFrame = function() {
    filesize = picture.getBytesTotal();
    loaded = picture.getBytesLoaded();
    preloader._visible = true;
    if (loaded != filesize) {
        preloader.preload_bar._xscale = 100*loaded/filesize;
    } else {
        preloader._visible = false;
        if (picture._alpha<100) {
            picture._x = (Stage.width / 2) - (picture._width / 2);
            picture._alpha += 10;
        }
    }
};
//functions
function beginDrag() {
    picture.startDrag(true);
}
function endDrag() {
    picture.stopDrag();
}
function nextImage() {
    if (p<(total-1)) {
        p++;
        if (loaded == filesize) {
            picture._alpha = 0;
            picture.loadMovie(image[p],1);
            desc_txt.text = description[p];
            picture_num();
        }
    }
}
function prevImage() {
    if (p>0) {
        p--;
        picture._alpha = 0;
        picture.loadMovie(image[p],1);
        desc_txt.text = description[p];
        picture_num();
    }
}
function firstImage() {
    if (loaded == filesize) {
        trace('done');
        picture._alpha = 0;
        picture.loadMovie(image[0],1);
        desc_txt.text = description[0];
        picture_num();
    }
}
function picture_num() {
    current_pos = p+1;
    pos_txt.text = current_pos+" / "+total;
}
function sizeDec() {
    picture._xscale -= 15;
    picture._yscale -= 15;
}
function sizeInc() {
    picture._xscale += 15;
    picture._yscale += 15;
}
function reAlign() {
    picture._xscale = 100;
    picture._yscale = 100;
    picture._x = (Stage.width / 2) - (picture._width / 2);
}