// Start a logger
//var logReader = new YAHOO.widget.LogReader("logger");

var logReader;

var libraryXML;
var libraryLoaded = 0;

// Make the versions global so we can replace them on the quilt
var versions;
var totalQuiltItems;

var centralImageDisplayed = 0;


pageLoader = function () {
        // Create a event to fire when the Library 'div' is available
        var e = YAHOO.util.Event;
        return {
                init: function() {
                        // We actually wait for the 'logger' div to be available so we can log
                        e.onContentReady("logger", this.loadLibrary);

                },

                loadLibrary: function() {
                        // Load the library.xml
                        logReader = new YAHOO.widget.LogReader("logger");
                        logReader.hide();
//                        alert ('going to load library');
                        YAHOO.log('ready to load library', 'info');
//                      var transaction = YAHOO.util.Connect.asyncRequest('GET', 'library.xml', libraryLoader, null);

                        libraryManager.get();
                }
        }
}(); 

var libraryManager = {

        handleSuccess:function(o) {

                YAHOO.log('loaded library.xml'+o.responseText,'info');
                libraryLoaded = 1;
                libraryXML = o.responseXML;
                versions = libraryXML.getElementsByTagName("version");
                var versionCount = versions.length
                YAHOO.log('found '+versionCount+' versions','info');
                var quiltHTML = this.buildQuilt(versions);
                YAHOO.log(quiltHTML);
                var quiltDiv = document.getElementById('quilt');
                quiltDiv.innerHTML=quiltHTML;

                // Init some quilt Turners
                this.quiltTurner(-1);
                this.quiltTurner(-1);
                this.quiltTurner(-1);

                // Now attach the library manager to the library div

                YAHOO.util.Event.on('quiltTable', 'click', this.onClick);
                

        },
        handleFailure:function(o) {
                
                YAHOO.log('failed to load library.xml','warn');
                var libraryDiv = document.getElementById('library');
                libraryDiv.innerHTML = "<p>Sorry, could not load the library info<br />Press 'refresh' in your browser to try again.</p>";

        },

        get:function() {
                YAHOO.log('loading library.xml', 'info');
                YAHOO.util.Connect.asyncRequest('GET', 'library.xml', libraryCallback, null);
        },

        buildQuilt:function(versions) {

                // We determine the quiltSize from the page dimensions

                var dimensions = getViewportSize();
                var pageWidth = dimensions[0];
                var pageHeight = dimensions[1];

                // Trim used space from pageHeight;

                pageHeight = pageHeight - 36;

                var cellSize = 54; // Maximum height or width of single cell
                var imageSize = 600; // Maximum height or width of central image

                YAHOO.log ('page width ' + pageWidth );

                var imageColumns = Math.ceil(imageSize / cellSize); // The number of columns used by the central image
                var totalColumns = Math.floor(pageWidth / cellSize) - 1; // The total number of columns

                var imageRows = Math.ceil(imageSize / cellSize); // The number of rows used by the central imgae
                var totalRows = Math.floor(pageHeight / cellSize); // The total number of rows

                if (imageColumns > totalColumns) { imageColumns = totalColumns } // Always save enough space to display the central image
                if (imageRows > totalRows) { imageRows = totalRows } // Always save enough space to display the central image

                var spareColumns = totalColumns - imageColumns; // Available columns for thumbnails
                var spareRows = totalRows - imageRows; // Available rows for thumbnails

                var quiltColumnsLeft = 0;
                var quiltColumnsRight = 0;

                var quiltRowsTop = 0;
                var quiltRowsBottom = 0;

                if (spareColumns%2 == 0) {
                        quiltColumnsLeft = quiltColumnsRight = spareColumns/2;
                } else {
                        quiltColumnsLeft = quiltColumnsRight = Math.floor(spareColumns/2);
                        quiltColumnsLeft++;
                }

                if (spareRows%2 == 0) {
                        quiltRowsTop = quiltRowsBottom = spareRows/2;
                } else {
                        quiltRowsTop = quiltRowsBottom = Math.floor(spareRows/2);
                        quiltRowsTop++;
                }
                        

                var quiltWidth = totalColumns;
                
                var quiltColumnPosition = 0;
                var quiltRowPosition = 0;

                var quiltViewerWidth = quiltWidth-quiltColumnsLeft-quiltColumnsRight;
                var quiltViewerHeight = 11;

                var quiltRowBottom = quiltRowsTop + quiltViewerHeight;

//                var quiltTotalRows = quiltRowsTop + quiltRowsBottom + quiltViewerHeight;
                var quiltTotalRows = totalRows

                var quiltCell = 0;

                var quiltViewerPlaced = 0;

                var quiltId = 0; // ID for quilt cell

                YAHOO.log ('colLeft ' + quiltColumnsLeft + ' colRight ' + quiltColumnsRight);

                var html = "<table id='quiltTable'>\n";

                        // TODO change this to the total required grid size, rather than this over estimation

                var versionCount = versions.length;
                var maxCells = totalRows * totalColumns;
                for (var i = 0; i < maxCells; i++) {

                        if (quiltColumnPosition == 0) {
                                html += '<tr>\n';
                        }

                        if ( (quiltColumnPosition == quiltColumnsLeft)  && (quiltRowPosition == quiltRowsTop) && (!quiltViewerPlaced) ) {
                                // We have the central image viewer
                                html += '<td id="centralViewerCell" colspan="' + quiltViewerWidth + '" rowspan="' + quiltViewerHeight + '"><div id="centralViewer"></div></td>\n';
                                // Chop one off quiltColumnPosition as we're not actually placing an image; // add one to rowPosition (so it doesn't load this again
                                quiltColumnPosition--;
                                quiltViewerPlaced = 1;
                        } else {
                                // pick a random version
                                var randomId = Math.floor ( Math.random() * (versionCount - 1) );
                                var versionId = versions[randomId].getAttribute('id');
                                var filename = versions[randomId].getAttribute('id');
                                html += '<td class="quiltCell" id="quiltCell-' + quiltCell + '">\n';
                                html += '<div id="quilt-' + quiltId + '" versionId="' + versionId + '" filename="images/sd/' + filename + '"><img src="images/thumbnails/' + filename + '.square.jpg" width="50" height="50"></img></div></td>';
                                quiltId++;
                        }
                        if (quiltColumnPosition == quiltWidth - 1) {
                                html += '</td>\n';
                                quiltColumnPosition = 0;
                                quiltRowPosition++;
                        } else if (quiltColumnPosition == quiltColumnsLeft + quiltColumnsRight -1 && quiltRowPosition >= quiltRowsTop && quiltRowPosition <= quiltRowBottom - 1) {
                                html += '</td>\n';
                                quiltColumnPosition = 0;
                                quiltRowPosition++;
                        } else {
                                quiltColumnPosition++;
                        }
                        if (quiltRowPosition  >= quiltTotalRows) {
                                break;
                        }
                                
                }

                totalQuiltItems = quiltId;
                return html;

        },

        onClick:function(e) {
                // Something was clicked in the library div, if it's an album or folder title then show/hide its children
                var clickTarget = YAHOO.util.Event.getTarget(e);
                // Walk up the DOM tree until we find the most specific item
                var sanity = 0;
                while (clickTarget.id != 'quiltTable') {
                        YAHOO.log (clickTarget.id);
                        if (clickTarget.nodeName.toUpperCase() == "DIV") {
                                // display the image with id in the centre pane
                                if (clickTarget.id.indexOf('quilt-') > -1) {
                                        var quiltId = clickTarget.id.substr(6);
                                        var versionId = clickTarget.getAttribute('versionId');
					var filename = clickTarget.getAttribute('filename');
                                        libraryManager.displayImage(filename);
                                        libraryManager.fadeQuilt(quiltId);
                                        break;
                                }
                        } else {
                                clickTarget = clickTarget.parentNode;
                        }
                        sanity++;
                        if (sanity > 5) {
                                YAHOO.log("sanity exceeded");
                                break;
                        }
                }

        },

        displayImage:function (filename) {

                YAHOO.log ('displaying '+filename);

                //var centralViewer = document.getElementById('centralViewer');

                //centralViewer.innerHTML = '<img src="images/' + versionId + '.jpg"></img>';

                centralImageDisplayed = 1; //TODO None fade of first image not working right
                if (centralImageDisplayed) {
                        // Fade out the current one
                        new YAHOO.widget.Effects.Fade('centralViewer');
                        setTimeout('libraryManager.replaceImage("'+filename+'")', 800);
                } else { 
                        // Just load the new one
                        libraryManager.replaceImage(filename);
                }

        },

        replaceImage:function(filename) {
                //  Replace the image and fade back in
                YAHOO.log ('replace central image with '+filename);
                var centralViewer = document.getElementById('centralViewer');
                centralViewer.innerHTML = '<img src="' + filename + '"></img>';
                YAHOO.log ('replaced with '+centralViewer.innerHTML);
                setTimeout('YAHOO.widget.Effects.Appear("centralViewer")', 1500);
                centralImageDisplayed = 1;

        },

        fadeQuilt:function (quiltId) {

                var quiltImage = document.getElementById('quilt-' + quiltId);
                                setTimeout('libraryManager.replaceQuilt('+quiltId+')', 2500);
                new YAHOO.widget.Effects.Fade('quilt-'+quiltId);
                //setTimeout('libraryManager.replaceQuilt('+versionId+'), 2500);');
        },

        replaceQuilt:function (quiltId) {
        
                //YAHOO.log('replaceQuilt fired for ' +quiltId );
                versionCount = versions.length;
                var randomId = Math.floor ( Math.random() * (versionCount - 1) );
                var versionId = versions[randomId].getAttribute('id');
                var filename = versions[randomId].getAttribute('id');
                var quiltImage = document.getElementById('quilt-' + quiltId);
                quiltImage.setAttribute('versionId', versionId);
                quiltImage.setAttribute('filename', 'images/sd/' + filename);
                quiltImage.innerHTML = '<img src="images/thumbnails/' + filename + '.square.jpg" width="50" height="50"></img>'
                new YAHOO.widget.Effects.Appear('quilt-'+quiltId);
        },

        quiltTurner:function (quiltId) {

                //YAHOO.log('quiltTurner called for '+quiltId);

                if (quiltId == -1) {
                        // Just initialise
                } else {
                        // Replace the specfied image, then fire for any random image
                        libraryManager.fadeQuilt(quiltId);
                }
                var randomQuiltId = Math.floor ( Math.random() * (totalQuiltItems -1) );
                var randomTimeout = Math.floor ( Math.random() * 2500 ) + 2500;
                //YAHOO.log ('setting turner for id '+randomQuiltId);
                setTimeout('libraryManager.quiltTurner('+randomQuiltId+')', randomTimeout);
        },


        displayVersion:function(id) {

                var viewerDiv = document.getElementById('viewer');

                viewerDiv.innerHTML = '<img src="images/sd/' + id + '.jpg"></img>';

        }
};

var libraryCallback = {
        success:libraryManager.handleSuccess,
        failure:libraryManager.handleFailure,
        scope:libraryManager
};

function getViewportSize() {
        var size = [0,0];
        if (typeof window.innerWidth != 'undefined') {
                size = [
                        window.innerWidth,
                        window.innerHeight
                ];
        }
        else if (typeof document.documentElement != 'undefined'
                && typeof document.documentElement.clientWidth != 'undefined'
                && document.documentElement.clientWidth != 0) {
                size = [
                        document.documentElement.clientWidth,
                        document.documentElement.clientHeight
                ];
        } else {
                size = [
                        document.getElementsByTagName('body')[0].clientWidth,
                        document.getElementsByTagName('body')[0].clientHeight
                ];
        }
        return size;
}

// Prime the page (and library) loader
pageLoader.init();