ShoppingList.dev/uicontroler.js

var UiControlerJSRevision="$Revision: 71 $".split(' ')[1]

function changeButtonText(sBtnId,sNewText) {
	$("#" + sBtnId + " .ui-btn-text").text(sNewText);
}

function defineDisplayStatus(){
	$("#pnlHeading").hide();
	$("#pnlShopDetails").hide();
	$("#pnlEntries").hide();
	$("#lbHeading").text("???");
	$("#btnHeadingLeft").hide();
	$("#btnHeadingLeft").unbind();
	changeButtonText("btnHeadingLeft"," ");
	$("#btnHeadingRight").hide();
	$("#btnHeadingRight").unbind();
	changeButtonText("btnHeadingRight","...");
	$("#pnlShops").hide();
	$("#pnlTransferQ").hide();
	$("#pnlAbout").hide();
	$("#pnlSettings").hide();
	$("#pnlSettingsNav").hide();
}

/* ---- FRW ------------ */
function deleteData(sType,sKey){
	console.log("Delete data called",sType,sKey)
}

function addEntryToUi(sKey,sEntry){
	if ($("#entry_" + sKey).length == 0) { // Avoid adding duplicated especially after branding
		$("#lstEntries").append("<li data-icon=\"delete\" key='" + sKey + "' id='entry_" + sKey + "'><a>" + sEntry + "</a><a data-role='button' onclick='deleteEntry(\"" + sKey + "\")'></a></li>");
//		$("#lstEntries").listview("refresh");
	}
}

function showQItemDetail(Qkey,Type,data){
	$("#txtTransferQDetails").text("Sorry, Unavailable for this object");
	
	if ((Type=="DeleteEntry") || (Type=="ShopDeletion")) {
		$("#txtTransferQDetails").text("Deleted " + Type + ": " + data + " no more information available as item was deleted.");
	}

	if ((Type=="SendShop")||(Type=="SendEntry")) {
		if (Type=="SendEntry") { data=Number(data); }
		db.objectStore("Entry").get(data).done(function(result){
			$("#txtTransferQDetails").text(JSON.stringify(result));
		}).fail(function(result,event){
			$("#txtTransferQDetails").text("Error loading Item.");
			console.log("[showQItemDetail] Error loading Entry Item: ",result,event);
		})
	} 
	
}

function addTransferQItemToUi(item){
	if ($("#Qitem_" + item.key).length == 0) { // Avoid adding duplicated especially after branding
		$("#lstTransferQItems").append("<li onclick='showQItemDetail(\"" + item.key + "\",\"" + item.value.type + "\", \"" + item.value.data + "\");' data-icon=\"arrow_r\" id='Qitem_" + item.key + "'><a>" + item.key + " -- "+ item.value.type + "</a></li>");
		$("#lstTransferQItems").listview("refresh");
	}
}

function deleteEntryFromUi(sKey){
	$("#entry_" + sKey).remove();
	$("#lstEntries").listview("refresh");
}


function showSettings(){ 
	setMode("Settings"); 
}

function showTransferQ(){
	setMode("TransferQ"); 
	refreshTransferQDisplay();
}

function refreshTransferQDisplay(){
	$("#lstTransferQItems").empty();
		
	db.objectStore("TransferQ").each(function(item){
		if (null != item) {
			addTransferQItemToUi(item);
		}
	}).done(function (result, event){
		console.log("[refreshTransferQDisplay] Success, filtered by shop " , shopGlobalId);
	}).fail( function (result, event){
		console.log("[refreshTransferQDisplay] Failed: " , result , event )
	});
}

function loadAndShowEntries(shopGlobalId){
	$("#lstEntries").empty();
	$("#lstEntries").hide();
	$.mobile.showPageLoadingMsg();

	db.objectStore("Entry").each(function(item){
		if (null != item) {
			if (item.value.shopGlobalId==shopGlobalId) {
				addEntryToUi(item.key,item.value.Description);
			}
		}
	}).done(function (result, event){
		$("#lstEntries").listview("refresh");
		console.log("[loadAndShowEntries] Success, filtered by shop " , shopGlobalId);
		$("#lstEntries").show();
		$.mobile.hidePageLoadingMsg();
	}).fail( function (result, event){
		console.log("[loadAndShowEntries] Failed: " , result , event )
		$("#lstEntries").show();
		$.mobile.hidePageLoadingMsg();
	});
}

function getActiveShopGlobalId() {
	shopGlobalId=$("#pnlShops>ul>li>a.ui-btn-active").parent().attr("id");

	if (null!=shopGlobalId) {
		shopGlobalId=shopGlobalId.split("_")[1];
	} else {
		shopGlobalId=null;
	}

	return(shopGlobalId)
}

function changeShop(newShop){
		var newShopId=null;
		if (null != newShop) {
			newShopId=$(newShop).parent().attr('id').split("_")[1];
		}
		console.log("[changeShop] switching to newShopId " , newShopId);
		db.objectStore("Config").put({Id:"ActiveShopId",value:newShopId});
		loadAndShowEntries(newShopId);
}

function addShop(){
  $('#tbShopName').removeAttr('globalid') 
	$("#tbShopName").val("");
	setMode("AddShop");
}

function editShop(theShop){
	var theShopGlobalId=$(theShop).attr('id').split("_")[1];
	db.objectStore("Shop").get(theShopGlobalId).done(function(result){
	  $("#tbShopName").val(result.Description);
	  $("#tbShopName").attr("globalid",theShopGlobalId);
	}) 
	setMode("EditShop");
}


function loadAndShowShops(shopGlobalId){
	var activeNav=shopGlobalId || getActiveShopGlobalId();
	
	var parent=$("#pnlShops").parent();
	$("#pnlShops").remove();
	$(parent).append("<div id='pnlShops' style='display:none'>");
	$("#pnlShops").hide(); // shouldn't be needed but I can still see the shops build up...		
	
	var numItems=0;
	
	var navBarNum=1;
	$("#pnlShops").append("<ul id='lstShops" + navBarNum + "'></ul>");
	var myPromise = db.objectStore("Shop").index("Description").each(function(item){
		if (activeNav==null){
			// if no Shop was selected yet then activate the first one
			activeNav=item.value.GlobalId;
		}
		$("#lstShops" + navBarNum).append("<li id='shop_" + item.value.GlobalId + "'><a onclick='changeShop(this);'>" + item.value.Description + "</a></li>");
		$("#shop_"+item.value.GlobalId).bind("taphold",function(e){ editShop(this);});

		numItems++;
		if ((numItems % 5) == 0) { // more than 5 buttons in the navbar look ugly, in that case we create a new line...
			navBarNum++;
			$("#pnlShops").append("<ul id='lstShops" + navBarNum + "'></ul>");
		} 
	});
	myPromise.done(function (result, event){		
		$("#lstShops" + navBarNum).append("<li id='btnAddShop' data-iconpos='right' data-icon='plus'><a onclick='addShop();'>Add Shop</a></li>");
		$("#pnlShops").navbar();

		$("#pnlShops").show();		

		// Mark the previously active button as active.
		$($("#shop_" + activeNav).children()[0]).addClass("ui-btn-active")

		loadAndShowEntries(getActiveShopGlobalId());

		console.log("Success loadAndShowShops");
	});
	myPromise.fail( function (result, event){
		console.log("Failed loadAndShowShops: " , result ,  event )
	});
	return(myPromise);
}


function setMode(sMode){
	defineDisplayStatus();
	console.log("Setting Mode " , sMode)
	
	if ("Branding" == sMode) {
		$("#lbHeading").text("Branding");
		$("#pnlHeading").show();
		
		$("#pnlBranding").show();
	}
	
	if ("Entries" == sMode) {

		$("#lbHeading").text("Entries [" + sGShoppingListName + "]");
		$("#pnlHeading").show();
		$("#pnlShops").show();
		
		$("#btnHeadingRight").show();
		$("#btnHeadingRight").bind("click", showSettings);
		
		$("#pnlEntries").show();
	}

	if ("AddShop" == sMode) {
		$("#lbHeading").text("Add Shop");
		$("#pnlHeading").show();
		$("#pnlShops").hide();
		$("#btnShopDelete").hide();
		
		changeButtonText("btnShopAddEdit","Add");
		$("#pnlShopDetails").show();

		changeButtonText("btnHeadingLeft","Back");
		$("#btnHeadingLeft").bind("click", function(){ setMode("Entries"); });
		$("#btnHeadingLeft").show();
	}

	if ("EditShop" == sMode) {
		$("#lbHeading").text("Edit Shop");
		$("#pnlHeading").show();
		$("#pnlShops").hide();
		$("#btnShopDelete").show();

		changeButtonText("btnShopAddEdit","Change");
		$("#pnlShopDetails").show();

		changeButtonText("btnHeadingLeft","Back");
		$("#btnHeadingLeft").bind("click", function(){ setMode("Entries"); });
		$("#btnHeadingLeft").show();
	}
	
	if ("Settings" == sMode) {
		$("#lbHeading").text("...");
		$("#pnlHeading").show();
		if ($("#pnlSettingsNav>div>ul>li>a.ui-btn-active").length == 1) {
			$("#pnlSettingsNav>div>ul>li>a.ui-btn-active").click();
		} else {
			showTransferQ();
		}	

		$("#pnlSettingsNav").show();

		changeButtonText("btnHeadingLeft","Back");
		$("#btnHeadingLeft").bind("click", function(){ setMode("Entries"); });
		$("#btnHeadingLeft").show();
	}

	if ("About" == sMode) {
		$("#lbHeading").text("About");
		$("#pnlHeading").show();
		$("#pnlSettingsNav").show();
		$("#pnlAbout").show();

		changeButtonText("btnHeadingLeft","Back");
		$("#btnHeadingLeft").bind("click", function(){ setMode("Entries"); });
		$("#btnHeadingLeft").show();
	}

	if ("SettingsSettings" == sMode) {
		$("#lbHeading").text("Settings");
		$("#pnlHeading").show();
		$("#pnlSettingsNav").show();
		$("#pnlSettings").show();

		changeButtonText("btnHeadingLeft","Back");
		$("#btnHeadingLeft").bind("click", function(){ setMode("Entries"); });
		$("#btnHeadingLeft").show();
	}


	if ("TransferQ" == sMode){
		$("#lbHeading").text("Transfer Queue Display");
		$("#pnlHeading").show();
		$("#pnlSettingsNav").show();
		$("#pnlTransferQ").show();

		changeButtonText("btnHeadingLeft","Back");
		$("#btnHeadingLeft").bind("click", function(){ setMode("Entries"); });
		$("#btnHeadingLeft").show();
	}
}


function updateTransferQCounter(){
	db.objectStore("TransferQ").count().done(function (result) { changeButtonText("btnHeadingRight",result); });
}