FCM#70 - CRUD 5

// display the data from local storage to screen
function displayData() {
	// empty out our current list
	ge('ubuntuVersionsDisplayList').innerHTML = "";

	// check if localstorage has anything in it
	if (localStorage.length === 0) {
		alert('There is no data in Local Storage');
	}
	else { // there is local storage info

		// loop through each item in local storage
		for (var i=0, j=localStorage.length; i<j; i++) {
			// Put the information from the localStorage row into some variables
			var key = localStorage.key(i),
				value = localStorage.getItem(key),
				obj = JSON.parse(value);

			// let's check if the key for the entry starts with our ubuvers id.
			// substring lets you grab portions of the string. 0 is the first
			// character, and 7 means it goes up to character 7. This will read
			// charachters 1-7 (u b u V e r s). Note: It doesn't read the last
			// character.
			if (key.substring(0,7) == "ubuVers") {
				// let's check to make sure we are getting the right keys out
				console.log(key);
				console.log(obj);

				// now that we have our key right. let's display the data already added
				var list = ge('ubuntuVersionsDisplayList'),
					listItem = document.createElement('li'),
					ubuVersNumValue = obj.version,
					ubuVersNameValue = obj.release,
					listText = ubuVersNumValue + ": " + ubuVersNameValue + ' ',
					itemDeleteButton = document.createElement('button'),
					itemDeleteButtonText = "Remove Item";
					itemEditButton = document.createElement('button'),
					itemEditButtonText = "Edit Item";

				itemDeleteButton.setAttribute('id',key),
				itemDeleteButton.onclick = function() {deleteItem(this.id)};
				itemEditButton.setAttribute('id',key),
				itemEditButton.onclick = function() {editItem(this.id)};

				listItem.innerHTML = listText;
				itemEditButton.innerHTML = itemEditButtonText;
				itemDeleteButton.innerHTML = itemDeleteButtonText;

				listItem.appendChild(itemEditButton);
				listItem.appendChild(itemDeleteButton);

				list.appendChild(listItem);
			}
		}
	}
};