data/templates/webkit/root.html

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   2           "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   3 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
   4 <head>
   5   <meta http-equiv="Content-Type" content="text/html; charset=<!-- tmpl_var content_charset -->" />
   6   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" />
   7   <link rel="apple-touch-icon" href="<!-- tmpl_var root -->apple-touch-icon.png" />
   8   <!-- tmpl_var common_header -->
   9   <style type="text/css" media="screen">
  10     @import "<!-- tmpl_var root -->webkit.css";
  11     @import "<!-- tmpl_var root -->webkit_root.css";
  12   </style>
  13   <script src="<!-- tmpl_var root -->jquery-1.4.2.min.js" type="application/javascript" charset="utf-8"></script>
  14
  15   <script type="application/javascript" charset="utf-8">
  16     jQuery(document).ready(function($) {
  17         var animation_end = false;
  18         var el = document.createElement('div');
  19         if ('WebkitTransform' in el.style) {
  20                 animation_end = 'webkitAnimationEnd';
  21         }
  22         el = null;
  23         $(window).bind('orientationchange', function(){
  24                 setTimeout(scrollTo, 300, 0, 0);
  25         });
  26         $('a').bind('click', function () {
  27                 var from = $('.current');
  28                 var to = $($(this).attr('href'));
  29
  30                 if (animation_end) {
  31                         from.addClass('flip out');
  32                         to.addClass('flip in current').one(animation_end, function() {
  33                                 from.removeClass('current out');
  34                                 to.removeClass('in flip');
  35                         });
  36                 } else {
  37                         to.addClass('current');
  38                         from.removeClass('current');
  39                 }
  40                 return false;
  41         });
  42     });
  43   </script>
  44   <!-- tmpl_var extra_header -->
  45  <title>keitairc</title>
  46 </head>
  47 <body onLoad="setTimeout(scrollTo, 100, 0, 1);">
  48 <div id="login" class="current">
  49   <div class="toolbar">
  50     <h1>keiairc</h1>
  51     <a href="#about" class="button menu_button" id="index_menu_button">About</a>
  52   </div>
  53   <form id="login_form" method="post" rel="external" action="login" class="edit">
  54     <label for="password">\83p\83X\83\8f\81[\83h</label>
  55     <input type="password" id="password" name="password" value="" />
  56     <button type="submit" rel="external" class="submit whiteButton">\83\8d\83O\83C\83\93</button>
  57   </form>
  58   <div class="info">
  59     <!-- tmpl_var timestamp --><br />
  60     keitairc <!-- tmpl_var version -->
  61   </div>
  62 </div>
  63
  64 <div id="about" class="reverse">
  65   <div class="toolbar">
  66     <h1>About</h1>
  67     <a href="#login" class="reverse button menu_button" id="index_menu_button">\83\8d\83O\83C\83\93</a>
  68   </div>
  69   <div class="info">
  70     <!-- tmpl_var timestamp --><br />
  71     keitairc <!-- tmpl_var version -->
  72   </div>
  73 </div>
  74 </body>
  75 </html>