Guest User

Ryan Stewart

a guest
Jul 8th, 2010
5,260
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <html>
  2. <head>
  3.     <meta http-equiv="Content-type" content="text/html; charset=utf-8">
  4.     <title>socket</title>
  5.     <script type="text/javascript" charset="utf-8">
  6.         function startSocket()
  7.         {
  8.             if("WebSocket" in window)
  9.             {
  10.                 var ws = new WebSocket("ws://localhost:1740");
  11.  
  12.                 ws.onopen = function(event) {
  13.                     document.getElementById('status').innerHTML = "open: " + this.readyState;
  14.                     drawCanvas();
  15.                 }
  16.  
  17.                 ws.onmessage = function(event) {
  18.                     document.getElementById('stock').innerHTML = event.data;
  19.                     drawIncrement(event.data);
  20.                 }
  21.                
  22.                 ws.onclose = function(event) {
  23.                     document.getElementById('status').innerHTML = "closed";
  24.                 }          
  25.             }
  26.            
  27.         }
  28.        
  29.  
  30.     </script>
  31.     <script type="text/javascript">
  32.     function drawCanvas()
  33.     {
  34.         counter = 15;
  35.        
  36.         canvas = document.getElementById('myCanvas');
  37.         ctx = canvas.getContext('2d');
  38.         ctx.strokeStyle = "#efefef";
  39.         ctx.textBaseline = 'middle';
  40.         for(var i = 0; i< 400; i+=10)
  41.         {
  42.             ctx.fillText  (((400-i)/10).toString(), 0, i)
  43.             ctx.beginPath();
  44.             ctx.moveTo(counter,i);
  45.             ctx.lineTo(400,i);
  46.             ctx.closePath();
  47.             ctx.stroke();
  48.         }
  49.     }
  50.    
  51.     function drawLines()
  52.     {
  53.  
  54.     }
  55.    
  56.     function drawIncrement(quote)
  57.     {
  58.         ctx.beginPath();
  59.         ctx.arc(counter, canvas.height-(quote*10), 2, 0, Math.PI*2, true);
  60.         ctx.closePath();
  61.         ctx.fill();
  62.            
  63.         counter = counter + 5;
  64.            
  65.     }
  66.     </script>
  67. </head>
  68. <body >
  69.     <div id="status">
  70.    
  71.     </div>
  72.     <div id="stock">
  73.    
  74.     </div>
  75.     <canvas id="myCanvas" width="400" height="400" style="border:1px dotted;float:left">your browser does
  76.     not support the canvas tag </canvas>
  77.     <button onclick="startSocket();">Click Me!</button>
  78. </body>
  79. </html>
RAW Paste Data