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

var logReader;

var libraryXML;
var libraryLoaded = 0;

var infoDisplayed = 0;

var images;

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;
                var folders = libraryXML.getElementsByTagName("folder");
                var folderCount = folders.length;
                YAHOO.log('found '+folderCount+' folders','info');
                var folderHTML = this.buildFolders(folders,1,0);
                YAHOO.log(folderHTML);
                var libraryDiv = document.getElementById('library');
                libraryDiv.innerHTML=folderHTML;

                // Now attach the library manager to the library div

                YAHOO.util.Event.on('library', '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);
        },

        buildFolders:function(folders,id,parentId) {
                var html;
                YAHOO.log ('building for folder '+id,'info');
                // find the folder with the requested id, this isn't going to scale very well unfortunately
                for (var i = 0; i < folders.length; i++ ) {
                        var myid = folders[i].getAttribute('id');
                        if (myid == id) {
                                // This IS the folder we're looking for
                                if (id == 1) {
                                        html = "<div id='folder-" + id + "' class='libraryFolder' currentState='visible'>\n";
                                } else if (parentId == 1) {
                                        html = "<div id='folder-" + id + "' class='projectFolder indent' currentState='visible'>\n";
                                } else {
                                        html = "<div id='folder-" + id + "' class='subFolder indent' currentState='hidden'>\n";
                                }

        //                      YAHOO.log ('folder '+myid, 'info');
                                html += "<p id='folderTitle-" + id + "' class='folderName'>" + folders[i].getAttribute('name') + "</p>\n";

                                // Recurse for each child folder

                                if (folders[i].hasChildNodes) {
        //                              YAHOO.log('has children');
                                 //       for (var j = 0; j < folders[i].childNodes.length; j++) {
                                        var children = folders[i].getElementsByTagName('child');
                                        for (var j=0; j < children.length; j++) {
        //                                      YAHOO.log('checking child '+j);
                                                // For gecko we getElementByName here
                                                        if ( children[j].getAttribute('type') == 'folder' ) {
                //                                              YAHOO.log('found child folder');
                                                                // We have a child folder
                                                                // Get its ID
                                                                var childId = children[j].getAttribute('id');
                                                                html += this.buildFolders(folders,childId, id);
                                                        } else if ( children[j].getAttribute('type') == 'album' ) {
                                                                // We have an child ablum
                                                                var albumId = children[j].getAttribute('id');
                                                                var albumName = children[j].getAttribute('name');
                                                                // Put albums in the subFolder class for display purposes
                                                                html += "<div id='album-" + albumId + "' displayed='0' class='subFolder indent' currentState='hidden'>\n";
                                                                html += "<p id='albumTitle-" + albumId +"'>" + albumName + "</p>\n";
                                                                html += "</div>\n";
                                                        }
                                        }
                                }

                                html += "</div>\n";
                        }
                }

                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
                while (clickTarget.id != 'library') {
                        //YAHOO.log (clickTarget.id, 'info');
                        if (clickTarget.id.indexOf('version') > -1) {
                                // Got an image to display
                                YAHOO.log ('version clicked');
                                var filename = clickTarget.getAttribute('filename')
                                var versionId = clickTarget.id.substr(8);
                                libraryManager.displayVersion(versionId, filename);
                                break;
                        } else if (clickTarget.nodeName.toUpperCase() == "TABLE") {
                                YAHOO.log ('table clicked - ignoring');
                                // Ignore clicks on the background table
                                break;
                        // Looking at the 'Title' paragraphs here rather than the whole div
                        } else if (clickTarget.nodeName.toUpperCase() == "P") {
                                if (clickTarget.id.indexOf('albumTitle') > -1) {
                                        YAHOO.log ('album clicked', 'warn');
                                        var albumId = clickTarget.id.substr(11);
                                        var album = document.getElementById('album-'+albumId);
                                        libraryManager.toggleAlbum(album);
                                        break;
                                } else if (clickTarget.id.indexOf('folderTitle') > -1) {
                                        YAHOO.log ('folder clocked', 'info');
                                        var folderId = clickTarget.id.substr(12);
                                        var folder = document.getElementById('folder-'+folderId);
                                        // Not sure why the below doesn't work with 'this'
                                        libraryManager.toggleFolder(folder);
                                        break;
                                }
                        } else {
                                clickTarget = clickTarget.parentNode;
                        }
                }

        },

        toggleFolder:function(folder) {
                // For each child node make visible if not and vv
               for (var i = 0; i < folder.childNodes.length; i++) {
                        //YAHOO.log (folder.childNodes(i).tagName);
                        if (folder.childNodes[i].tagName == 'DIV') {
                                var state = folder.childNodes[i].getAttribute('currentState');
                                YAHOO.log ('existing display' + state);
                                if (state == 'hidden') {
                                        folder.childNodes[i].style.display = 'block';
                                        folder.childNodes[i].setAttribute('currentState', 'visible');
                                } else {
                                        folder.childNodes[i].style.display = 'none';
                                        folder.childNodes[i].setAttribute('currentState', 'hidden');
                                }
                        }
                }

        },

        toggleAlbum:function(album) {
                // Behaviour depends on whether the album has been displayed before or not
                if ( album.getAttribute('displayed') == 0 )  {
                        YAHOO.log ('going to load album', 'info');
                        // Album not previously displayed so we need to create it from the XML
                        // Get the ablum id
                        var id = album.getAttribute('id').substr(6);
                        album.appendChild ( libraryManager.displayAlbum(id) );
                        album.setAttribute('displayed', '1');
                        album.setAttribute('currentState', 'visible');
                } else {
                        // Do the same thing as for folders, i.e. hide/unhide it
                        // We can just use the toggleFolder function
                        libraryManager.toggleFolder(album);
                }
        },

        displayAlbum:function(id) {
                YAHOO.log ('display album with id ' + id , 'info');
                var albums = libraryXML.getElementsByTagName("album");
                var albumDiv = document.createElement('div');
                albumDiv.setAttribute ('id', 'contents-'+id);
                var html = ''; 
                // Find the requested album
                YAHOO.log ('there are '+albums.length+' albums');
                for (var i = 0; i < albums.length; i++ ) {
                        var myid = albums[i].getAttribute('id');
                        YAHOO.log (myid);
                        if (myid == id) {
                                YAHOO.log ('found xml details for '+id, 'info');
                                // Now get the versions
                                var versions = albums[i].getElementsByTagName('version');
                                var column = 0;
                                html += '<table>\n';
                                for (var j = 0; j < versions.length; j++ ) {
                                        var versionId = versions[j].getAttribute('id');
                                        var filename = versions[j].getAttribute('filename');
                                        if (column == 0) {
                                                html += '<tr>';
                                        }
                                        html += '<td id="version-' + versionId + '" filename="'+ filename + '"><img class="thumbnail" src="images/' + filename + '.square.jpg" width="50" height="50"></img></td>\n';
                                        if (column == 3) {
                                                html += '</tr>';
                                                column=-1;
                                        }
                                        column ++
                                }
                                html += '</table>\n';
                        }
                }
                YAHOO.log ('returning html' + html, 'info' );
                albumDiv.innerHTML = html;
                return albumDiv;
        },

        displayVersion:function(id, filename) {

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

                YAHOO.log ('loading filename ' + filename, 'info');

                viewerDiv.innerHTML = '<img src="images/' + filename + '"></img><div id="sidecar"></div>';

		// Show the info toggle

		var infoToggle = document.getElementById('viewerInfoToggle');
		infoToggle.style.display = 'block';

                // Load the sidecar

                sidecarManager.get(filename);

        }
};

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

var sidecarManager = {

        handleSuccess:function(o) {

                YAHOO.log('loaded sidecar xml'+o.responseText,'info');
                sidecarLoaded = 1;
                sidecarXML = o.responseXML;
//                var captionElements = sidecarXML.getElementsByTagName("key");
//                var caption = captionElements[0].firstChild.nodeValue;
		// For some reason getElementById is not working for me here
//		var caption = sidecarXML.getElementById('LensMinMM').firstChild.nodeValue;

		var propertyElements = sidecarXML.getElementsByTagName("key");

		var caption;
		var focalLength;
		var focalLength35mm;
		var shutterSpeed;
		var aperture;
		var iso;
		var whiteBalance;
		var whiteBalanceMode;
		var lens;
		var imageSize;
		var versionName;
		var year;
		var month;
		var day;
		var minute;
		var second;
		var hour;

                for (var i = 0; i < propertyElements.length; i++ ) {
                        var elementType = propertyElements[i].getAttribute('id');
			var value = propertyElements[i].firstChild.nodeValue;
			if (elementType == "Caption/Abstract") {
				caption = value;
			} else if (elementType == "FocalLength") {
				focalLength = value;
			} else if (elementType == "FocalLenIn35mmFilm") {
				focalLength35mm = value;
			} else if (elementType == "ShutterSpeed") {
				shutterSpeed = "1/" + (1 / value) ;
			} else if (elementType == "ApertureValue") {
				aperture = "f/"+value;
			} else if (elementType == "ISOSpeedRating") {
				iso = value;
			} else if (elementType == "WhiteBalance") {
				whiteBalance = value;
			} else if (elementType == "NikonWhiteBalanceMode") {
				whiteBalanceMode = value;
			} else if (elementType == "LensModel") {
				lens = value;
			} else if (elementType == "PixelSize") {
				imageSize = value;
			} else if (elementType == "VersionName") {
				versionName = value;
			} else if (elementType == "CaptureYear") {
				year = value;
			} else if (elementType == "CaptureDayOfMonth") {
				day = value;
			} else if (elementType == "CaptureMonthOfYear") {
				month = value;
			} else if (elementType == "CaptureMinuteOfHour") {
				minute = value;
			} else if (elementType == "CaptureSecondOfMinute") {
				second = value;
			} else if (elementType == "CaptureHourOfDay") {
				hour = value;
			}
		}
		var info = "<table>";
		info += "<tr><td class='infoType'>Date</td><td class='infoValue'>" + day + "/" + month + "/" + year + " " + hour + ":" + minute +"</td></tr>";
		info += "<tr><td class='infoType'>Aperture</td><td class='infoValue'>" + aperture + "</td></tr>";
		info += "<tr><td class='infoType'>Shutter Speed</td><td class='infoValue'>" + shutterSpeed + "</td></tr>";
		info += "<tr><td class='infoType'>Focal Length</td><td class='infoValue'>" + focalLength + "</td></tr>";
		if (focalLength35mm) {
			info += "<tr><td class='infoType'>Focal Length (35mm eq)</td><td class='infoValue'>" + focalLength35mm + "</td></tr>";
		}
		info += "<tr><td class='infoType'>ISO</td><td class='infoValue'>" + iso + "</td></tr>";
		if (lens) {
			info += "<tr><td class='infoType'>Lens</td><td class='infoValue'>" + lens + "</td></tr>";
		}
		info += "<tr><td class='infoType'>Image Size</td><td class='infoValue'>" + imageSize + "</td></tr>";
		info += "<tr><td class='infoType'>Name</td><td class='infoValue'>" + versionName + "</td></tr>";
		info += "</table>";

		var infoDisplay = document.getElementById('infoDisplay');

		infoDisplay.innerHTML = info;

		var sidecarDiv = document.getElementById('sidecar');
		if (caption) {
			YAHOO.log(caption);
			sidecarDiv.innerHTML="<p>"+caption+"</p>";
		} else {
			sidecarDiv.innerHTML="<p />";
		}

        },
        handleFailure:function(o) {

                YAHOO.log('Sidecar failed to load','warn');
                var sidecarDiv = document.getElementById('sidecar');
                sidecarDiv.innerHTML = "<p>Pending info</p>";

        },

        get:function(filename) {
                YAHOO.log('loading sidecars/'+filename+'.xml', 'info');
                YAHOO.util.Connect.asyncRequest('GET', 'sidecars/'+filename+'.xml', sidecarCallback, null);
        }

};
var sidecarCallback = {
        success:sidecarManager.handleSuccess,
        failure:sidecarManager.handleFailure,
        scope:sidecarManager
};


function infoToggle () {
	YAHOO.log('Toggling info box');
	// Quick function to toggle the display of the info box
	var infoDisplay = document.getElementById('infoDisplay');
	if (infoDisplayed == 1 ) {
		infoDisplay.style.display = 'none';
		infoDisplayed = 0;
	} else {
		infoDisplay.style.display = 'block';
		infoDisplayed = 1;
	}
}

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