<?php
$izero = 0;
$athere = '<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>';
if (isset($_POST['clear'])) {
  if (file_exists(dirname(__FILE__) . "/" . $_SERVER['REMOTE_ADDR'] . "_books.txt")) {
    unlink(dirname(__FILE__) . "/" . $_SERVER['REMOTE_ADDR'] . "_books.txt");
  }
} else if (isset($_POST['bbih'])) {
  $athere = str_replace(" highlight(", " myObject.highlight(", str_replace("\\", "", $_POST['bbih']));
  file_put_contents(dirname(__FILE__) . "/" . $_SERVER['REMOTE_ADDR'] . "_books.txt", $_POST['bbih']);
  $izero = 0;
  while (strpos($athere, ">" . ($izero + 1) . "<") !== false) {
    $izero = $izero + 1;
  }
} else if (file_exists(dirname(__FILE__) . "/" . $_SERVER['REMOTE_ADDR'] . "_books.txt")) {
  $athere = str_replace(" highlight(", " myObject.highlight(", str_replace("\\", "", file_get_contents(dirname(__FILE__) . "/" . $_SERVER['REMOTE_ADDR'] . "_books.txt")));
  $izero = 0;
  while (strpos($athere, ">" . ($izero + 1) . "<") !== false) {
    $izero = $izero + 1;
  }
}
?>
<!doctype html>
<html>
<head>
<title>Javascript Object Oriented Primer Tutorial</title>

<script type="text/javascript">
var cur_book = <?php echo $izero; ?>;
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');
       } else {
          var formx = document.getElementById('xform');
          formx.style.display = 'block';
       }
    }
};

</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">
<?php echo $athere; ?>
</tbody>
</table>
<form id="xform" action="./javascript_object_oriented.php" style="display: none;" method="POST">
<?php
  echo '<input id="bbih" name="bbih" type="hidden" value=""></input>' . "\n";
?>
<input type="submit" id="submit" name="submit" value="Save"></input><input type="submit" id="clear" name="clear" value="Clear"></input>
</form>
</div>
</body>
</html>
