GZ/nwyj/.svn/pristine/8a/8a80973b212c5acad3d4d1f1854b4b26999ed032.svn-base

if (!dojo._hasResource["dojox.off.ui"]) { // _hasResource checks added by
											// build. Do not use _hasResource
											// directly in your code.
	dojo._hasResource["dojox.off.ui"] = true;
	dojo.provide("dojox.off.ui");

	dojo.require("dojox.storage.Provider");
	dojo.require("dojox.storage.manager");
	dojo.require("dojox.storage.GearsStorageProvider");

	// Author: Brad Neuberg, bkn3@columbia.edu, http://codinginparadise.org

	// summary:
	// dojox.off.ui provides a standard,
	// default user-interface for a
	// Dojo Offline Widget that can easily
	// be dropped into applications that would
	// like to work offline.
	dojo.mixin(dojox.off.ui, {
		// appName: String
		// This application's name, such as "Foobar". Note that
		// this is a string, not HTML, so embedded markup will
		// not work, including entities. Only the following
		// characters are allowed: numbers, letters, and spaces.
		// You must set this property.
		appName : "setme",

		// autoEmbed: boolean
		// For advanced usage; most developers can ignore this.
		// Whether to automatically auto-embed the default Dojo Offline
		// widget into this page; default is true.
		autoEmbed : true,

		// autoEmbedID: String
		// For advanced usage; most developers can ignore this.
		// The ID of the DOM element that will contain our
		// Dojo Offline widget; defaults to the ID 'dot-widget'.
		autoEmbedID : "dot-widget",

		// runLink: String
		// For advanced usage; most developers can ignore this.
		// The URL that should be navigated to to run this
		// application offline; this will be placed inside of a
		// link that the user can drag to their desktop and double
		// click. Note that this URL must exactly match the URL
		// of the main page of our resource that is offline for
		// it to be retrieved from the offline cache correctly.
		// For example, if you have cached your main page as
		// http://foobar.com/index.html, and you set this to
		// http://www.foobar.com/index.html, the run link will
		// not work. By default this value is automatically set to
		// the URL of this page, so it does not need to be set
		// manually unless you have unusual needs.
		runLink : window.location.href,

		// runLinkTitle: String
		// For advanced usage; most developers can ignore this.
		// The text that will be inside of the link that a user
		// can drag to their desktop to run this application offline.
		// By default this is automatically set to "Run " plus your
		// application's name.
		runLinkTitle : "Run Application",

		// learnHowPath: String
		// For advanced usage; most developers can ignore this.
		// The path to a web page that has information on
		// how to use this web app offline; defaults to
		// src/off/ui-template/learnhow.html, relative to
		// your Dojo installation. Make sure to set
		// dojo.to.ui.customLearnHowPath to true if you want
		// a custom Learn How page.
		learnHowPath : dojo.moduleUrl("dojox", "off/resources/learnhow.html"),

		// customLearnHowPath: boolean
		// For advanced usage; most developers can ignore this.
		// Whether the developer is using their own custom page
		// for the Learn How instructional page; defaults to false.
		// Use in conjunction with dojox.off.ui.learnHowPath.
		customLearnHowPath : false,

		htmlTemplatePath : dojo.moduleUrl("dojox",
				"off/resources/offline-widget.html").uri,
		cssTemplatePath : dojo.moduleUrl("dojox",
				"off/resources/offline-widget.css").uri,
		onlineImagePath : dojo
				.moduleUrl("dojox", "off/resources/greenball.png").uri,
		offlineImagePath : dojo.moduleUrl("dojox", "off/resources/redball.png").uri,
		rollerImagePath : dojo.moduleUrl("dojox", "off/resources/roller.gif").uri,
		checkmarkImagePath : dojo.moduleUrl("dojox",
				"off/resources/checkmark.png").uri,
		learnHowJSPath : dojo.moduleUrl("dojox", "off/resources/learnhow.js").uri,

		_initialized : false,

		onLoad : function() {
			// summary:
			// A function that should be connected to allow your
			// application to know when Dojo Offline, the page, and
			// the Offline Widget are all initialized and ready to be
			// used:
			//
			// dojo.connect(dojox.off.ui, "onLoad", someFunc)
		},

		_initialize : function() {
			// console.debug("dojox.off.ui._initialize");

			// make sure our app name is correct
			if (this._validateAppName(this.appName) == false) {
				alert("You must set dojox.off.ui.appName; it can only contain "
						+ "letters, numbers, and spaces; right now it "
						+ "is incorrectly set to '" + dojox.off.ui.appName
						+ "'");
				dojox.off.enabled = false;
				return;
			}

			// set our run link text to its default
			this.runLinkText = "Run " + this.appName;

			// setup our event listeners for Dojo Offline events
			// to update our UI
			dojo.connect(dojox.off, "onNetwork", this, "_onNetwork");
			dojo.connect(dojox.off.sync, "onSync", this, "_onSync");

			// cache our default UI resources
			dojox.off.files.cache([this.htmlTemplatePath, this.cssTemplatePath,
					this.onlineImagePath, this.offlineImagePath,
					this.rollerImagePath, this.checkmarkImagePath]);

			// embed the offline widget UI
			if (this.autoEmbed) {
				this._doAutoEmbed();
			}
		},

		_doAutoEmbed : function() {
			// fetch our HTML for the offline widget

			// dispatch the request
			dojo.xhrGet({
						url : this.htmlTemplatePath,
						handleAs : "text",
						error : function(err) {
							dojox.off.enabled = false;
							err = err.message || err;
							alert("Error loading the Dojo Offline Widget from "
									+ this.htmlTemplatePath + ": " + err);
						},
						load : dojo.hitch(this, this._templateLoaded)
					});
		},

		_templateLoaded : function(data) {
			// console.debug("dojox.off.ui._templateLoaded");
			// inline our HTML
			var container = dojo.byId(this.autoEmbedID);
			if (container) {
				container.innerHTML = data;
			}

			// fill out our image paths
			this._initImages();

			// update our network indicator status ball
			this._updateNetIndicator();

			// update our 'Learn How' text
			this._initLearnHow();

			this._initialized = true;

			// check offline cache settings
			if (!dojox.off.hasOfflineCache) {
				this._showNeedsOfflineCache();
				return;
			}

			// check to see if we need a browser restart
			// to be able to use this web app offline
			if (dojox.off.hasOfflineCache && dojox.off.browserRestart) {
				this._needsBrowserRestart();
				return;
			} else {
				var browserRestart = dojo.byId("dot-widget-browser-restart");
				if (browserRestart) {
					browserRestart.style.display = "none";
				}
			}

			// update our sync UI
			this._updateSyncUI();

			// register our event listeners for our main buttons
			this._initMainEvtHandlers();

			// if offline functionality is disabled, disable everything
			this._setOfflineEnabled(dojox.off.enabled);

			// update our UI based on the state of the network
			this._onNetwork(dojox.off.isOnline ? "online" : "offline");

			// try to go online
			this._testNet();
		},

		_testNet : function() {
			dojox.off.goOnline(dojo.hitch(this, function(isOnline) {
						// console.debug("testNet callback,
						// isOnline="+isOnline);

						// display our online/offline results
						this._onNetwork(isOnline ? "online" : "offline");

						// indicate that our default UI
						// and Dojo Offline are now ready to
						// be used
						this.onLoad();
					}));
		},

		_updateNetIndicator : function() {
			var onlineImg = dojo.byId("dot-widget-network-indicator-online");
			var offlineImg = dojo.byId("dot-widget-network-indicator-offline");
			var titleText = dojo.byId("dot-widget-title-text");

			if (onlineImg && offlineImg) {
				if (dojox.off.isOnline == true) {
					onlineImg.style.display = "inline";
					offlineImg.style.display = "none";
				} else {
					onlineImg.style.display = "none";
					offlineImg.style.display = "inline";
				}
			}

			if (titleText) {
				if (dojox.off.isOnline) {
					titleText.innerHTML = "Online";
				} else {
					titleText.innerHTML = "Offline";
				}
			}
		},

		_initLearnHow : function() {
			var learnHow = dojo.byId("dot-widget-learn-how-link");

			if (!learnHow) {
				return;
			}

			if (!this.customLearnHowPath) {
				// add parameters to URL so the Learn How page
				// can customize itself and display itself
				// correctly based on framework settings
				var dojoPath = djConfig.baseRelativePath;
				this.learnHowPath += "?appName="
						+ encodeURIComponent(this.appName)
						+ "&hasOfflineCache=" + dojox.off.hasOfflineCache
						+ "&runLink=" + encodeURIComponent(this.runLink)
						+ "&runLinkText="
						+ encodeURIComponent(this.runLinkText)
						+ "&baseRelativePath=" + encodeURIComponent(dojoPath);

				// cache our Learn How JavaScript page and
				// the HTML version with full query parameters
				// so it is available offline without a cache miss
				dojox.off.files.cache(this.learnHowJSPath);
				dojox.off.files.cache(this.learnHowPath);
			}

			learnHow.setAttribute("href", this.learnHowPath);

			var appName = dojo.byId("dot-widget-learn-how-app-name");

			if (!appName) {
				return;
			}

			appName.innerHTML = "";
			appName.appendChild(document.createTextNode(this.appName));
		},

		_validateAppName : function(appName) {
			if (!appName) {
				return false;
			}

			return (/^[a-z0-9 ]*$/i.test(appName));
		},

		_updateSyncUI : function() {
			var roller = dojo.byId("dot-roller");
			var checkmark = dojo.byId("dot-success-checkmark");
			var syncMessages = dojo.byId("dot-sync-messages");
			var details = dojo.byId("dot-sync-details");
			var cancel = dojo.byId("dot-sync-cancel");

			if (dojox.off.sync.isSyncing) {
				this._clearSyncMessage();

				if (roller) {
					roller.style.display = "inline";
				}

				if (checkmark) {
					checkmark.style.display = "none";
				}

				if (syncMessages) {
					dojo.removeClass(syncMessages, "dot-sync-error");
				}

				if (details) {
					details.style.display = "none";
				}

				if (cancel) {
					cancel.style.display = "inline";
				}
			} else {
				if (roller) {
					roller.style.display = "none";
				}

				if (cancel) {
					cancel.style.display = "none";
				}

				if (syncMessages) {
					dojo.removeClass(syncMessages, "dot-sync-error");
				}
			}
		},

		_setSyncMessage : function(message) {
			var syncMessage = dojo.byId("dot-sync-messages");
			if (syncMessage) {
				// when used with Google Gears pre-release in Firefox/Mac OS X,
				// the browser would crash when testing in Moxie
				// if we set the message this way for some reason.
				// Brad Neuberg, bkn3@columbia.edu
				// syncMessage.innerHTML = message;

				while (syncMessage.firstChild) {
					syncMessage.removeChild(syncMessage.firstChild);
				}
				syncMessage.appendChild(document.createTextNode(message));
			}
		},

		_clearSyncMessage : function() {
			this._setSyncMessage("");
		},

		_initImages : function() {
			var onlineImg = dojo.byId("dot-widget-network-indicator-online");
			if (onlineImg) {
				onlineImg.setAttribute("src", this.onlineImagePath);
			}

			var offlineImg = dojo.byId("dot-widget-network-indicator-offline");
			if (offlineImg) {
				offlineImg.setAttribute("src", this.offlineImagePath);
			}

			var roller = dojo.byId("dot-roller");
			if (roller) {
				roller.setAttribute("src", this.rollerImagePath);
			}

			var checkmark = dojo.byId("dot-success-checkmark");
			if (checkmark) {
				checkmark.setAttribute("src", this.checkmarkImagePath);
			}
		},

		_showDetails : function(evt) {
			// cancel the button's default behavior
			evt.preventDefault();
			evt.stopPropagation();

			if (!dojox.off.sync.details.length) {
				return;
			}

			// determine our HTML message to display
			var html = "";
			html += "<html><head><title>Sync Details</title><head><body>";
			html += "<h1>Sync Details</h1>\n";
			html += "<ul>\n";
			for (var i = 0; i < dojox.off.sync.details.length; i++) {
				html += "<li>";
				html += dojox.off.sync.details[i];
				html += "</li>";
			}
			html += "</ul>\n";
			html += "<a href='javascript:window.close()' "
					+ "style='text-align: right; padding-right: 2em;'>"
					+ "Close Window" + "</a>\n";
			html += "</body></html>";

			// open a popup window with this message
			var windowParams = "height=400,width=600,resizable=true,"
					+ "scrollbars=true,toolbar=no,menubar=no,"
					+ "location=no,directories=no,dependent=yes";

			var popup = window.open("", "SyncDetails", windowParams);

			if (!popup) { // aggressive popup blocker
				alert("Please allow popup windows for this domain; can't display sync details window");
				return;
			}

			popup.document.open();
			popup.document.write(html);
			popup.document.close();

			// put the focus on the popup window
			if (popup.focus) {
				popup.focus();
			}
		},

		_cancel : function(evt) {
			// cancel the button's default behavior
			evt.preventDefault();
			evt.stopPropagation();

			dojox.off.sync.cancel();
		},

		_needsBrowserRestart : function() {
			var browserRestart = dojo.byId("dot-widget-browser-restart");
			if (browserRestart) {
				dojo.addClass(browserRestart, "dot-needs-browser-restart");
			}

			var appName = dojo.byId("dot-widget-browser-restart-app-name");
			if (appName) {
				appName.innerHTML = "";
				appName.appendChild(document.createTextNode(this.appName));
			}

			var status = dojo.byId("dot-sync-status");
			if (status) {
				status.style.display = "none";
			}
		},

		_showNeedsOfflineCache : function() {
			var widgetContainer = dojo.byId("dot-widget-container");
			if (widgetContainer) {
				dojo.addClass(widgetContainer, "dot-needs-offline-cache");
			}
		},

		_hideNeedsOfflineCache : function() {
			var widgetContainer = dojo.byId("dot-widget-container");
			if (widgetContainer) {
				dojo.removeClass(widgetContainer, "dot-needs-offline-cache");
			}
		},

		_initMainEvtHandlers : function() {
			var detailsButton = dojo.byId("dot-sync-details-button");
			if (detailsButton) {
				dojo.connect(detailsButton, "onclick", this, this._showDetails);
			}
			var cancelButton = dojo.byId("dot-sync-cancel-button");
			if (cancelButton) {
				dojo.connect(cancelButton, "onclick", this, this._cancel);
			}
		},

		_setOfflineEnabled : function(enabled) {
			var elems = [];
			elems.push(dojo.byId("dot-sync-status"));

			for (var i = 0; i < elems.length; i++) {
				if (elems[i]) {
					elems[i].style.visibility = (enabled ? "visible" : "hidden");
				}
			}
		},

		_syncFinished : function() {
			this._updateSyncUI();

			var checkmark = dojo.byId("dot-success-checkmark");
			var details = dojo.byId("dot-sync-details");

			if (dojox.off.sync.successful == true) {
				this._setSyncMessage("Sync Successful");
				if (checkmark) {
					checkmark.style.display = "inline";
				}
			} else if (dojox.off.sync.cancelled == true) {
				this._setSyncMessage("Sync Cancelled");

				if (checkmark) {
					checkmark.style.display = "none";
				}
			} else {
				this._setSyncMessage("Sync Error");

				var messages = dojo.byId("dot-sync-messages");
				if (messages) {
					dojo.addClass(messages, "dot-sync-error");
				}

				if (checkmark) {
					checkmark.style.display = "none";
				}
			}

			if (dojox.off.sync.details.length && details) {
				details.style.display = "inline";
			}
		},

		_onFrameworkEvent : function(type, saveData) {
			if (type == "save") {
				if (saveData.status == dojox.storage.FAILED
						&& !saveData.isCoreSave) {
					alert("Please increase the amount of local storage available "
							+ "to this application");
					if (dojox.storage.hasSettingsUI()) {
						dojox.storage.showSettingsUI();
					}

					// FIXME: Be able to know if storage size has changed
					// due to user configuration
				}
			} else if (type == "coreOperationFailed") {
				console
						.log("Application does not have permission to use Dojo Offline");

				if (!this._userInformed) {
					alert("This application will not work if Google Gears is not allowed to run");
					this._userInformed = true;
				}
			} else if (type == "offlineCacheInstalled") {
				// clear out the 'needs offline cache' info
				this._hideNeedsOfflineCache();

				// check to see if we need a browser restart
				// to be able to use this web app offline
				if (dojox.off.hasOfflineCache == true
						&& dojox.off.browserRestart == true) {
					this._needsBrowserRestart();
					return;
				} else {
					var browserRestart = dojo
							.byId("dot-widget-browser-restart");
					if (browserRestart) {
						browserRestart.style.display = "none";
					}
				}

				// update our sync UI
				this._updateSyncUI();

				// register our event listeners for our main buttons
				this._initMainEvtHandlers();

				// if offline is disabled, disable everything
				this._setOfflineEnabled(dojox.off.enabled);

				// try to go online
				this._testNet();
			}
		},

		_onSync : function(type) {
			// console.debug("ui, onSync="+type);
			switch (type) {
				case "start" :
					this._updateSyncUI();
					break;

				case "refreshFiles" :
					this._setSyncMessage("Downloading UI...");
					break;

				case "upload" :
					this._setSyncMessage("Uploading new data...");
					break;

				case "download" :
					this._setSyncMessage("Downloading new data...");
					break;

				case "finished" :
					this._syncFinished();
					break;

				case "cancel" :
					this._setSyncMessage("Canceling Sync...");
					break;

				default :
					dojo.warn("Programming error: "
							+ "Unknown sync type in dojox.off.ui: " + type);
					break;
			}
		},

		_onNetwork : function(type) {
			// summary:
			// Called when we go on- or off-line
			// description:
			// When we go online or offline, this method is called to update
			// our UI. Default behavior is to update the Offline
			// Widget UI and to attempt a synchronization.
			// type: String
			// "online" if we just moved online, and "offline" if we just
			// moved offline.

			if (!this._initialized) {
				return;
			}

			// update UI
			this._updateNetIndicator();

			if (type == "offline") {
				this._setSyncMessage("You are working offline");

				// clear old details
				var details = dojo.byId("dot-sync-details");
				if (details) {
					details.style.display = "none";
				}

				// if we fell offline during a sync, hide
				// the sync info
				this._updateSyncUI();
			} else { // online
				// synchronize, but pause for a few seconds
				// so that the user can orient themselves
				if (dojox.off.sync.autoSync) {
					window.setTimeout("dojox.off.sync.synchronize()", 1000);
				}
			}
		}
	});

	// register ourselves for low-level framework events
	dojo.connect(dojox.off, "onFrameworkEvent", dojox.off.ui,
			"_onFrameworkEvent");

	// start our magic when the Dojo Offline framework is ready to go
	dojo.connect(dojox.off, "onLoad", dojox.off.ui, dojox.off.ui._initialize);

}