<!doctype html>
<html>
<head>
<title>Javascript Object Oriented Primer Tutorial</title>

<script type="text/javascript">
var cur_book = 0;
var book_array = [];
var myObject;

var Book = {
init: function(title, subtitle, total_pages, total_chapters, author, publishing_date, published, comments) {
this.title = title;
this.subtitle = subtitle;
this.total_pages = total_pages;
this.total_chapters = total_chapters;
this.author = author;
this.publishing_date = publishing_date;
this.published = published;
this.comments = comments;
},
showInfo: function(andmore) {
var bookb = document.getElementById('book_body');
bookb.innerHTML = bookb.innerHTML + "<tr id='tr" + cur_book + "'><td><a href='#' onclick=' myObject.highlight(" + cur_book + ");' >" + cur_book + "</a></td><td>" + this.title + "</td><td>" + this.subtitle + "</td><td>" + this.author + "</td><td>" + this.published + "</td><td>" + this.publishing_date + "</td><td>" + this.total_pages + "</td><td>" + this.total_chapters + "</td><td>" + this.comments + "</td></tr>";
book_array.push({
title: this.title,
subtitle: this.subtitle,
total_pages: this.total_pages,
total_chapters: this.total_chapters,
author: this.author,
publishing_date: this.publishing_date,
published: this.published,
comments: this.comments
});
var obbih = document.getElementById('bbih');
obbih.value = bookb.innerHTML;
if (andmore == 'more') this.book_ask();
},
highlight: function(whichone) {
var thisone = document.getElementById('tr' + whichone);
if (thisone.style.backgroundColor == 'pink') {
thisone.style.backgroundColor = 'white';
} else {
thisone.style.backgroundColor = 'pink';
}
//alert(book_array[(whichone - 1)].title);
},
book_ask: function() {
cur_book = cur_book + 1;
var title = prompt("Please enter your Book " + cur_book + "'s Title (use Cancel to quit)", "");

if (title != null && title != "") {
var subtitle = prompt("Please enter an optional Subtitle for " + title + " (" + cur_book + ")", "");
var author = prompt("Please enter the Author for " + title + " (" + cur_book + ")", "");
var published = prompt("Please enter the Publisher for " + title + " (" + cur_book + ")", "");
var publishing_date = prompt("Please enter the Publishing Date for " + title + " (" + cur_book + ")", "31/12/1960");
var total_pages = prompt("Please enter the Total Pages in " + title + " (" + cur_book + ")", "0");
var total_chapters = prompt("Please enter the Total Chapters in " + title + " (" + cur_book + ")", "0");
var comments = prompt("Please enter Comments for " + title + " (" + cur_book + ")", "");

this.init(title, subtitle, total_pages, total_chapters, author, publishing_date, published, comments);
this.showInfo('more');
}
}
};
</script>
</head>
<body onload=" myObject = Object.create(Book); myObject.book_ask(); ">
<div align="center" style="width: 100%;">
<h1>Your Book List (towards OOP) goes below ...</h1>
<table id="book_table" border=1 cellpadding=5>
<tbody id="book_body">
<tr style="background-color: yellow;"><th>Book Number</th><th>Title</th><th>Subtitle</th><th>Author</th><th>Published By</th><th>Published Date</th><th>Total Pages</th><th>Total Chapters</th><th>Comments</th></tr>
</tbody>
</table>
</div>
</body>
</html>