home *** CD-ROM | disk | FTP | other *** search
/ PC World 2005 October / PCWorld_2005-10_cd.bin / software / topware / mpcl / mplayerc.exe / 1033 / HTML / 347 < prev   
Text File  |  2005-03-20  |  10KB  |  303 lines

  1. <html>
  2.  
  3. <head>
  4.  
  5. <meta HTTP-EQUIV="content-type" CONTENT="text/html; charset=UTF-8">
  6.  
  7. <title>Media Player Classic</title>
  8.  
  9. <script language="JavaScript" type="text/JavaScript">
  10.  
  11. function getXMLHTTP()
  12. {
  13.     try {return new ActiveXObject("Msxml2.XMLHTTP");}
  14.     catch(e) {try {return new ActiveXObject("Microsoft.XMLHTTP");}
  15.     catch(e) {}}
  16.     if(typeof XMLHttpRequest != "undefined") {return new XMLHttpRequest();}
  17.     return null;
  18. }
  19.  
  20. function MakeRequest(req)
  21. {
  22.     var httpRequest = getXMLHTTP();
  23.     
  24.     try
  25.     {
  26.         httpRequest.open("GET", req, true);
  27.         httpRequest.send(null);
  28.     }
  29.     catch(e)
  30.     {
  31.     }
  32. }
  33.  
  34. function urlencode(s)
  35. {
  36.     if(encodeURIComponent) return encodeURIComponent(s);
  37.     if(escape) return escape(s);
  38.     return s; // whatever
  39. }
  40.  
  41. function getOffsetX(m)
  42. {
  43.     var x = m.offsetLeft;
  44.     while (m.offsetParent)    {x += (m = m.offsetParent).offsetLeft; }
  45.     return x;
  46. }
  47.  
  48. OnStatus = function(title, status, pos, posstr, dur, durstr, muted, volume)
  49. {
  50.     var maxtitle = 70;
  51.     if(title.length > maxtitle) title = title.substr(0, maxtitle-3) + '...';
  52.     var timestr = dur > 0 && posstr && durstr ? posstr + ' / ' + durstr : ' ';
  53.     if(!dur || dur == 0) dur = 1;    
  54.     var sbpercent = Math.floor(100*pos/dur);
  55.  
  56.     if(e = document.getElementById('title')) e.innerHTML = title;
  57.     if(e = document.getElementById('seekbarchleft')) e.width = sbpercent > 0 ? sbpercent + '%' : '1px';
  58.     if(e = document.getElementById('seekbarchright')) e.width = sbpercent < 100 ? (100 - sbpercent) + '%' : '1px';
  59.     if((e = document.getElementById('status')) && e.innerHTML != status) e.innerHTML = status;
  60.     if((e = document.getElementById('timer')) && e.innerHTML != timestr) e.innerHTML = timestr;
  61.     if(e = document.getElementById('controlvolumemute')) {url = 'url(controlvolume' + (muted?'off':'on') + '.png)'; if(e.style.backgroundImage != url) e.style.backgroundImage = url;}
  62.     if(e = document.getElementById('controlvolumegrip')) 
  63.     {
  64.         volume = (document.getElementById('controlvolumebar').offsetWidth - e.offsetWidth) * volume / 100;
  65.         e.style.position = 'relative';
  66.         e.style.top = '2px';
  67.         e.style.left = Math.floor(volume) + 'px';
  68.     }
  69. }
  70.  
  71. var httpRequestStatus;
  72.  
  73. function OnReadyStateChange()
  74. {
  75.     if(httpRequestStatus && httpRequestStatus.readyState == 4 && httpRequestStatus.responseText)
  76.     {
  77.         if(httpRequestStatus.responseText.charAt(0) != "<") eval(httpRequestStatus.responseText);
  78.         else {alert(httpRequestStatus.responseText);}
  79.         httpRequestStatus = null;
  80.   }
  81. }
  82.  
  83. function StatusLoop()
  84. {
  85.     if(!httpRequestStatus || httpRequestStatus.readyState == 0)
  86.     {
  87.         httpRequestStatus = getXMLHTTP();
  88.  
  89.         try
  90.         {
  91.             httpRequestStatus.open("GET", 'status.html', true);
  92.             httpRequestStatus.onreadystatechange = OnReadyStateChange;
  93.             httpRequestStatus.send(null);
  94.         }
  95.         catch(e)
  96.         {
  97.         }
  98.     }
  99.         
  100.     setTimeout("StatusLoop()", 500);
  101. }
  102.  
  103. var snapshotcounter = 0;
  104.  
  105. function LoadSnapShot()
  106. {
  107.     if(img = document.getElementById('snapshot'))
  108.     {
  109.         img.src = 'snapshot.jpg' + '?' + snapshotcounter++;
  110.     }
  111. }
  112.  
  113. function OnLoadSnapShot()
  114. {
  115.     setTimeout("LoadSnapShot()", 5000);
  116. }
  117.  
  118. function OnAbortErrorSnapShot(e)
  119. {
  120.     setTimeout("LoadSnapShot()", 10000);
  121. }
  122.  
  123. function OnSeek(e)
  124. {
  125.     left = right = 0;
  126.     if(sb = document.getElementById('seekbarchleft')) left = getOffsetX(sb);
  127.     if(sb = document.getElementById('seekbarchright')) {right = getOffsetX(sb) + sb.offsetWidth;}
  128.     if(sb = document.getElementById('seekbargrip')) {left += sb.offsetWidth / 2; right -= sb.offsetWidth / 2;}
  129.     if(left > 0 && left < right)
  130.     {
  131.         percent = 100 * ((window.event ? window.event.clientX : e.clientX) - left) / (right - left);
  132.         if(percent < 0) percent = 0;
  133.         else if(percent > 100) percent = 100;
  134.         
  135.         MakeRequest('command.html?wm_command=[setposcommand]&percent='+percent);
  136.     }
  137. }
  138.  
  139. function OnVolume(e)
  140. {
  141.     left = right = 0;
  142.     if(cv = document.getElementById('controlvolumebar')) {left = getOffsetX(cv)+3; right = getOffsetX(cv) + cv.offsetWidth-3;}
  143.     if(left > 0 && left < right)
  144.     {
  145.         percent = 100 * ((window.event ? window.event.clientX : e.clientX) - left) / (right - left);
  146.         if(percent < 0) percent = 0;
  147.         else if(percent > 100) percent = 100;
  148.  
  149.         MakeRequest('command.html?wm_command=[setvolumecommand]&volume='+percent);
  150.     }
  151. }
  152.  
  153. function OnCommand(id)
  154. {
  155.         MakeRequest('command.html?wm_command='+id);
  156. }
  157.  
  158. function Init()
  159. {
  160.     StatusLoop();
  161.     LoadSnapShot();
  162.  
  163.     if(e = document.getElementById('seekbar'))
  164.         e.onclick = OnSeek;
  165.  
  166.     if(e = document.getElementById('controlvolumebar'))
  167.         e.onclick = OnVolume;
  168. }
  169.  
  170. </script>
  171.  
  172. <style>
  173. img {padding: 0; margin: 0; border: 0;}
  174. #player {margin-left: auto; margin-right: auto;}
  175. #player td {font-family: Sans-Serif; font-size: 13px;}
  176. #header {width: 100%;}
  177. #header td {height: 30px;}
  178. #headericon {background-image: url(headericon.png); background-repeat: no-repeat; width: 22px;}
  179. #headerback {background-image: url(headerback.png); background-repeat: repeat-x; color: white; font-weight: bold; padding-top: 5px}
  180. #headerclose {background-image: url(headerclose.png);  background-repeat: no-repeat; width: 28px;}
  181. #title, #status, #posstr, #durstr {display: inline;}
  182. #menu td {font-family: Sans-Serif; font-size: 12px; padding: 1px 5px;}
  183. #menu, #controlbar {background-color: #ece6d4;}
  184. #statusbar td {font-family: Sans-Serif; font-size: 12px;}
  185. #video, #statusbar {background-color: black; color: white;}
  186. #video {padding: 1px; cursor: pointer;}
  187. #controlbar {background-image: url(controlback.png); background-repeat: repeat-x; height: 28px;}
  188. #controlbuttonplay {background-image: url(controlbuttonplay.png); background-repeat: no-repeat; width: 25px; height: 28px;}
  189. #controlbuttonpause {background-image: url(controlbuttonpause.png); background-repeat: no-repeat; width: 23px; height: 28px;}
  190. #controlbuttonstop {background-image: url(controlbuttonstop.png); background-repeat: no-repeat; width: 25px; height: 28px;}
  191. #controlbuttonskipback {background-image: url(controlbuttonskipback.png); background-repeat: no-repeat; width: 24px; height: 28px;}
  192. #controlbuttondecrate {background-image: url(controlbuttondecrate.png); background-repeat: no-repeat; width: 22px; height: 28px;}
  193. #controlbuttonincrate {background-image: url(controlbuttonincrate.png); background-repeat: no-repeat; width: 23px; height: 28px;}
  194. #controlbuttonskipforward {background-image: url(controlbuttonskipforward.png); background-repeat: no-repeat; width: 28px; height: 28px;}
  195. #controlbuttonstep {background-image: url(controlbuttonstep.png); background-repeat: no-repeat; width: 31px; height: 28px;}
  196. #controlvolumemute {background-image: url(controlvolumeon.png); background-repeat: no-repeat; width: 28px; height: 28px;}
  197. #controlvolumebar {background-image: url(controlvolumebar.png); background-repeat: no-repeat; width: 55px; height: 28px;}
  198. #seekbar {background-image: url(seekbarmid.png); background-repeat: repeat-x;}
  199. #seekbar td {height: 15px;}
  200. #center {width: 100%;}
  201. #leftside {background-image: url(leftside.png); background-repeat: repeat-y; width: 4px;}
  202. #rightside {background-image: url(rightside.png); background-repeat: repeat-y; width: 4px;}
  203. #leftbottomside {background-image: url(leftbottomside.png); background-repeat: repeat-x; width: 4px; height: 4px;}
  204. #bottomside {background-image: url(bottomside.png); background-repeat: repeat-x; height: 4px;}
  205. #rightbottomside {background-image: url(rightbottomside.png); background-repeat: repeat-x; width: 4px; height: 4px;}
  206. </style>
  207.  
  208. </head>
  209.  
  210. <body onload="Init()">
  211.  
  212.     <div align="center">
  213.     <table id="player" cellpadding="0" cellspacing="0">
  214.     <tr>
  215.         <td colspan="3">
  216.             <table id="header" cellpadding="0" cellspacing="0">
  217.                 <tr>
  218.                     <td id="headericon"></td>
  219.                     <td id="headerback"><nobr> <div id="title"></div> </nobr></td>
  220.                     <td id="headerclose" onclick="OnCommand(135)"></td>
  221.                 </tr>
  222.             </table>
  223.         </td>
  224.     </tr>
  225.     <tr>
  226.         <td id="leftside"></td>
  227.         <td>
  228.             <table cellpadding="0" cellspacing="0" id="center">
  229.                 <tr>
  230.                     <td>
  231.                         <table id="menu" width="100%">
  232.                             <tr>
  233.                                 <td>File</td>
  234.                                 <td>View</td>
  235.                                 <td>Play</td>
  236.                                 <td>Navigate</td>
  237.                                 <td>Favorites</td>
  238.                                 <td width="100%" align="right">Help</td>
  239.                             </tr>
  240.                         </table>
  241.                     </td>
  242.                 </tr>
  243.                 <tr>
  244.                     <td id="video" align="center" onclick="OnCommand(157)">
  245.                         <img src="snapshot.png" alt="snapshot" id="snapshot" onload="OnLoadSnapShot()" onabort="OnAbortErrorSnapShot()" onerror="OnAbortErrorSnapShot()" />
  246.                     </td>
  247.                 </tr>
  248.                 <tr>
  249.                     <td>
  250.                         <table width="100%" id="seekbar" cellpadding="0" cellspacing="0">
  251.                             <tr>
  252.                                 <td id="seekbarleft"><img src="seekbarleft.png"></td>
  253.                                 <td id="seekbarchleft" width="0%"></td>
  254.                                 <td id="seekbargrip"><img src="seekbargrip.png"></td>
  255.                                 <td id="seekbarchright" width="100%"></td>
  256.                                 <td id="seekbarright"><img src="seekbarright.png"></td>
  257.                             </tr>
  258.                         </table>
  259.                     </td>
  260.                 </tr>
  261.                 <tr>
  262.                     <td>
  263.                         <table width="100%" cellpadding="0" cellspacing="0" id="controlbar">
  264.                             <tr>
  265.                                 <td id="controlbuttonplay" onclick="OnCommand(155)"></td>
  266.                                 <td id="controlbuttonpause" onclick="OnCommand(156)"></td>
  267.                                 <td id="controlbuttonstop" onclick="OnCommand(158)"></td>
  268.                                 <td id="controlbuttonskipback" onclick="OnCommand(164)"></td>
  269.                                 <td id="controlbuttondecrate" onclick="OnCommand(159)"></td>
  270.                                 <td id="controlbuttonincrate" onclick="OnCommand(160)"></td>
  271.                                 <td id="controlbuttonskipforward" onclick="OnCommand(165)"></td>
  272.                                 <td id="controlbuttonstep" onclick="OnCommand(32773)"></td>
  273.                                 <td> </td>
  274.                                 <td id="controlvolumemute" onclick="OnCommand(163)"></td>
  275.                                 <td id="controlvolumebar" valign="top"><img src="controlvolumegrip.png" id="controlvolumegrip"></td>
  276.                             </tr>
  277.                         </table>
  278.                     </td>
  279.                 </tr>
  280.                 <tr>
  281.                     <td>
  282.                         <table width="100%" id="statusbar">
  283.                             <tr>
  284.                                 <td><div id="status"></div></td>
  285.                                 <td align="right"><div id="timer"> </div></td>
  286.                             </tr>
  287.                         </table>
  288.                     </td>
  289.                 </tr>
  290.             </table>
  291.         </td>
  292.         <td id="rightside"></td>
  293.     </tr>
  294.     <tr>
  295.         <td id="leftbottomside"></td>
  296.         <td id="bottomside"></td>
  297.         <td id="rightbottomside"></td>
  298.     </tr>
  299.     </table>
  300.     </div>
  301. </body>
  302.  
  303. </html>