include/doc_single_day.html

   1 <html>
   2 <head>
   3 <title>TV Guide</title>
   4 <style type="text/css">
   5 img.recpic {
   6     float: right;
   7 }
   8 div {
   9     border-width: 2px;
  10     border-style: solid;
  11     position: absolute;
  12     font-size: small;
  13     font-family: verdana, helv, arial, sans-serif;
  14     padding-top: 5px;
  15     padding-left: 2px;
  16     vertical-align: middle;
  17     overflow: hidden;
  18     height: $heightpx;
  19 }
  20 a:hover {
  21     color: red;
  22 }
  23 div.progdiv {
  24     border-color: black;
  25     background-color: #eef7ee;
  26 }
  27 div.progrecdiv {
  28     border-color: black;
  29     background-color: #ffdddd;
  30 }
  31 div.timediv {
  32         vertical-align: middle;
  33         top: 0px;
  34         height: 100%;
  35         border-right-style: none;
  36         border-top-style: none;
  37         border-bottom-style: none;
  38         border-width: 1px;
  39 }
  40 div.time-bar {
  41         border-style: none;
  42         position: absolute;
  43         left: 10%;
  44         top: 0%;
  45         width: 89%;
  46         height:5%;
  47         max-height: 30px;
  48         overflow: hidden;
  49         padding: 0px;
  50         margin: 0px;
  51 }
  52 div.channel-bar {
  53         border-style: none;
  54         position: absolute;
  55         vertical-align: middle;
  56         top: 5%;
  57         left: 0px;
  58         width: 9%;
  59         height: 94%;
  60         overflow: hidden;
  61         padding: 0px;
  62         margin: 0px;
  63 }
  64 div.programme-region {
  65         border-style: none;
  66         position: absolute;
  67         left: 10%;
  68         top: 5%;
  69         width: 89%;
  70         height:94%;
  71         overflow: auto;
  72         padding: 0px;
  73         margin: 0px;
  74 }
  75 </style>
  76 <script type="text/javascript" language="javascript">
  77 <!--
  78
  79 function scrollProgrammeRegion()
  80 {
  81         document.getElementById( "time-bar" ).scrollLeft = document.getElementById( "programme-region" ).scrollLeft;
  82 }
  83
  84 function mi( id )
  85 {
  86     if( document.getElementById )
  87     {
  88         el = document.getElementById( id );
  89         if( el )
  90         {
  91             if( el.style.overflow != 'auto' )
  92             {
  93                 el.title = el.innerHTML
  94             }
  95
  96             if( el.className == 'progdiv' )
  97             {
  98                 el.style.backgroundColor = '#ccffcc';
  99             }
 100             else
 101             {
 102                 el.style.backgroundColor = '#ffbbbb';
 103             }
 104         }
 105     }
 106 }
 107
 108 function mo( id )
 109 {
 110     if( document.getElementById )
 111     {
 112         el = document.getElementById( id );
 113         if( el )
 114         {
 115             el.title = '';
 116             el.style.backgroundColor = '';
 117         }
 118     }
 119 }
 120
 121 function cl( id )
 122 {
 123     if( document.getElementById )
 124     {
 125         el = document.getElementById( id );
 126         if( el )
 127         {
 128             if( el.style.overflow == 'auto' )
 129             {
 130                 doUnSelect( el );
 131             }
 132             else
 133             {
 134                 makeRequest( 'prog-' + id + '.inc', id );
 135             }
 136         }
 137     }
 138
 139 }
 140
 141 function doSelect( id, text )
 142 {
 143     if( document.prevSelected )
 144     {
 145         doUnSelect( document.prevSelected );
 146     }
 147
 148     if( document.getElementById )
 149     {
 150         el = document.getElementById( id );
 151         if( el )
 152         {
 153             document.prevSelected = el;
 154             w = el.style.width
 155             if( w.substring( 0, w.length - 2 ) < 300 )
 156             {
 157                 el.oldWidth = el.style.width;
 158                 el.style.width = 300;
 159             }
 160             el.style.height = 150;
 161             el.style.overflow = 'auto';
 162             el.oldInnerHTML = el.innerHTML
 163             el.innerHTML = text;
 164             el.style.zIndex = 1;
 165
 166         }
 167     }
 168 }
 169
 170 function doUnSelect( el )
 171 {
 172     document.prevSelected = 0;
 173
 174     el.style.overflow = 'hidden';
 175     el.style.height = $height;
 176     if( el.oldWidth )
 177     {
 178         el.style.width = el.oldWidth;
 179     }
 180     el.innerHTML = el.oldInnerHTML;
 181     el.style.zIndex = 0;
 182 }
 183
 184 function makeRequest( url, arg )
 185 {
 186     var httpRequest;
 187
 188     if( window.XMLHttpRequest )  // Mozilla, Safari etc.
 189     {
 190         httpRequest = new XMLHttpRequest();
 191         //if (httpRequest.overrideMimeType) {
 192         //    httpRequest.overrideMimeType('text/xml');
 193         //    // See note below about this line
 194         //}
 195     }
 196     else if( window.ActiveXObject )  // IE
 197     {
 198         try
 199         {
 200             httpRequest = new ActiveXObject( "Msxml2.XMLHTTP" );
 201         }
 202         catch( e )
 203         {
 204             try
 205             {
 206                 httpRequest = new ActiveXObject( "Microsoft.XMLHTTP" );
 207             }
 208             catch( e )
 209             {
 210             }
 211         }
 212     }
 213
 214     if( !httpRequest )
 215     {
 216         return false;
 217     }
 218
 219     httpRequest.onreadystatechange = function()
 220     {
 221         receiveAnswer( httpRequest, arg );
 222     };
 223
 224     httpRequest.open('GET', url, true);
 225     httpRequest.send('');
 226 }
 227
 228 function receiveAnswer( httpRequest, id )
 229 {
 230     if( httpRequest.readyState == 4 )
 231     {
 232         if( httpRequest.status == 200 )
 233         {
 234             doSelect( id, httpRequest.responseText );
 235         }
 236     }
 237 }
 238
 239 -->
 240 </script>
 241 </head>
 242 <body>
 243
 244 <div class="time-bar" id="time-bar">
 245 $times
 246 </div>
 247
 248 <div class="channel-bar" id="channel-bar">
 249 $channels
 250 </div>
 251
 252 <div class="programme-region" id="programme-region" onScroll="scrollProgrammeRegion()">
 253 $programmes
 254 </div>
 255 </body>
 256 </html>
 257
 258