muvmuv/reviewpage.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
   2 <html>
   3 <head>
   4 <title>MuvMuv - Muvie Review</title>
   5
   6 <link rel="stylesheet" type="text/css" href="static/style.css" />
   7
   8 <script src="static/common.js" type="text/javascript"></script>
   9 <script src="http://code.google.com/js/jquery.js" type="text/javascript">
  10 </script>
  11 <script src="static/json2.js" type="text/javascript"></script>
  12
  13 </head>
  14 <script>
  15
  16   var muvmuv = muvmuv || {};
  17
  18   muvmuv.URL_ARGS = muvmuv.getUrlArgs();
  19   muvmuv.USER = '{{user}}' || 'None';
  20
  21   var WRITE_REVIEW_LABEL = 'Write Review';
  22   var SUBMIT_REVIEW_LABEL = 'Submit';
  23
  24   $(document).ready(function() {
  25
  26     muvmuv.initReviewBox();
  27
  28     muvmuv.fetchMovieData();
  29   });
  30
  31   muvmuv.initReviewBox = function() {
  32     $('#reviewbox').hide();
  33
  34     $('#cancel').click(function() {
  35       $('#reviewbox').hide();
  36       $('#writereview').show();
  37     });
  38
  39     $('#submitreview').click(function() {
  40       muvmuv.submitReview();
  41     });
  42
  43     $('#writereview').click(function() {
  44       if (muvmuv.USER == 'None') {
  45         top.location.href = $('#login').attr('href');
  46       } else {
  47         $('#writereview').hide();
  48         $('#reviewbox').show();
  49
  50         document.body.scrollTop = document.body.scrollHeight;
  51         $('#reviewcomment').get(0).focus();
  52       }
  53     });
  54   };
  55
  56   muvmuv.setReviews = function(reviews) {
  57
  58     var html = []
  59
  60     for (var i = 0; i <reviews.length; i++) {
  61       var review = reviews[i];
  62
  63       var author = review.author;
  64       var comment = review.comment;
  65
  66       var date = new Date(Date.parse(review.date));
  67
  68       html.push('<b>Name: </b>');
  69       html.push(author);
  70       html.push('<br/>');
  71       html.push('<b>Date: </b>');
  72       html.push(date);
  73       html.push('<br/>');
  74       html.push('<b>Review: </b>');
  75       html.push('<br/>');
  76       html.push(comment);
  77       html.push('<br/>');
  78       html.push('<br/>');
  79     }
  80
  81     $('#comments').html(html.join(''));
  82     $('#writereview').show();
  83   };
  84
  85   muvmuv.fetchMovieData = function() {
  86
  87     var title = muvmuv.getTitle();
  88
  89     var callback = function(data) {
  90       var json = JSON.parse(data);
  91       var movie = json.movie;
  92       var rating_average = movie.rating_average;
  93       var rating_count = movie.rating_count;
  94       var pic = movie.pic;
  95       var summary = movie.summary;
  96       var release_date = new Date(Date.parse(movie.release_date));
  97
  98       if (!$('#title').html()) {
  99         $('#title').html(movie.title);
 100         $('#releasedate').html(
 101           ['<b>Released date: </b>', release_date.toString()].join(''));
 102         $('#pic').attr({src: pic});
 103         $('#summary').html(['<b>Sypnosis: </b>', summary].join(''));
 104
 105         muvmuv.findVideo(decodeURI(title), summary);
 106       }
 107       muvmuv.setReviews(json.reviews);
 108     };
 109
 110     $.ajax({type: 'get', url: 'reviews', data: 'title=' + title,
 111         success: callback});
 112   };
 113
 114   muvmuv.MovieReview = function() {
 115     this.title = null;
 116     this.author = null;
 117     this.reviewComment = null;
 118   };
 119
 120   muvmuv.MovieReview.prototype.toJson = function() {
 121     return JSON.stringify(this);
 122   };
 123
 124   muvmuv.submitReview = function() {
 125
 126     var review = new muvmuv.MovieReview();
 127     review.title = decodeURI(muvmuv.getTitle());
 128     review.reviewComment = $('#reviewcomment').val();
 129
 130     if (!$.trim(review.reviewComment)) {
 131       alert('Review cannot be empty');
 132       return;
 133     }
 134
 135     var jsonString = review.toJson();
 136
 137     var onSuccess = function() {
 138       $('#reviewbox').hide();
 139       $('#reviewcomment').val('');
 140       muvmuv.fetchMovieData();
 141     }
 142
 143     $.ajax({type: 'post', url: 'submitreview',
 144         data: 'json=' + jsonString, success: onSuccess});
 145   };
 146
 147   muvmuv.findVideo = function(title, summary) {
 148
 149     var keywords = [];
 150
 151     var re = /\([a-zA-Z0-9'\- ]+(, [a-zA-Z0-9'\- ]+)*\)/g
 152
 153     var matches = summary.match(re);
 154
 155     if (!matches) {
 156       matches = [];
 157     }
 158
 159     for (var i = 0; i < matches.length; i++) {
 160       var match = matches[i];
 161
 162       var hasComma = match.indexOf(',') >= 0 | false;
 163
 164       if (hasComma) {
 165         var matches_ = match.split(',');
 166
 167         for (var j = 0; j < matches_.length; j++) {
 168           var match_ = matches_[j];
 169
 170           match_ = match_.replace(/[()]/g, '');
 171
 172           keywords.push(match_);
 173         }
 174       } else {
 175         match = match.replace(/[()]/g, '');
 176
 177         keywords.push(match);
 178       }
 179     }
 180
 181     matches = title.split(' ');
 182
 183     for (var i = 0; i < matches.length; i++) {
 184       var match = matches[i];
 185
 186       match = match.replace(/[^a-zA-Z]/g, '');
 187
 188       keywords.push(match);
 189     }
 190
 191     if (Array.map) {
 192       keywords = keywords.map(function(element) {
 193         element = element.replace(/ /g, '+');
 194         return element.toLowerCase();
 195       });
 196     } else {
 197       for (var i = 0; i< keywords.length; i++) {
 198         keywords[i] = keywords[i].replace(/ /g, '+');
 199       }
 200     }
 201
 202     var callbackName = 'muvmuv.processYouTubeFeed';
 203
 204     var youtubeFeed =
 205       ['http://gdata.youtube.com/feeds/api/videos?callback=',
 206       callbackName, '&alt=json-in-script&vq=',
 207       keywords.join('+')].join('');
 208
 209     var script = document.createElement('script');
 210     script.src = youtubeFeed;
 211
 212     document.body.appendChild(script);
 213   }
 214
 215   muvmuv.processYouTubeFeed = function(feed) {
 216
 217     var data = eval(feed);
 218
 219     if (data.feed.openSearch$totalResults.$t > 0) {
 220
 221       var url = data.feed.entry[0].link[0].href;
 222       var id = url.replace('http://www.youtube.com/watch?v=', '');
 223       var videoUrl = 'http://www.youtube.com/v/' + id;
 224
 225       var html = [];
 226
 227       html.push('<object width="250" height="200">');
 228       html.push('<param name="movie" value="');
 229       html.push(videoUrl);
 230       html.push('"></param>');
 231       html.push('<param name="wmode" value="transparent"></param>');
 232       html.push('<embed src="');
 233       html.push(videoUrl);
 234       html.push('" type="application/x-shockwave-flash"');
 235       html.push(' wmode="transparent" width="250" height="200">');
 236       html.push('</embed></object>');
 237
 238       $('#video').html(html.join(''));
 239     }
 240   }
 241
 242 </script>
 243 <body>
 244
 245 <div align="center" id="main">
 246 {% include "header.html" %}
 247
 248   <div id="reviewsection">
 249
 250     <h1 id="title"></h1>
 251     <p align="center" id="releasedate"></p>
 252     <table>
 253     <tr>
 254     <td align="center" style="width: 250px; height: 200px; background: black;">
 255     <img id="pic" src="">
 256     </td>
 257     <td>
 258     <div id="video"/>
 259     </td>
 260     </tr>
 261     </table>
 262     <br>
 263
 264     <p id="summary" align="left">
 265     </p>
 266
 267     <p id="comments" align="left">
 268     </p>
 269
 270     <br>
 271     <input id="writereview" type="button" value="Write Review">
 272     <div id="reviewbox">
 273       <textarea style="height: 150px; width: 500px;"
 274       id="reviewcomment"></textarea>
 275       <br>
 276       <input id="submitreview" type="button" value="Submit"/>
 277       <input id="cancel" type="button" value="Cancel"/>
 278     </div>
 279   </div>
 280 </div>
 281 </body>
 282 </html>