Difference between revisions of "HTML5WS"

From mi-linux
Jump to navigationJump to search
Line 5: Line 5:
 
This page features the full code of the following webpage:
 
This page features the full code of the following webpage:
 
[http://mi-linux.wlv.ac.uk/~in9352/websockets/ http://mi-linux.wlv.ac.uk/~in9352/websockets/]
 
[http://mi-linux.wlv.ac.uk/~in9352/websockets/ http://mi-linux.wlv.ac.uk/~in9352/websockets/]
 +
 +
=== index.html ===
 +
 +
<pre>
 +
<!DOCTYPE HTML>
 +
<html>
 +
  <head>
 +
    <title>Share a happy thought</title>
 +
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 +
   
 +
    <link rel="stylesheet" type="text/css" href="css/style.css" />
 +
    <script src="http://js.pusherapp.com/1.9/pusher.js"></script>
 +
    <script src="js/jquery-1.6.2.min.js"></script>
 +
    <script src="js/websockets.js"></script>
 +
  </head>
 +
  <body>
 +
    <header>
 +
      <h1>Share a happy thought</h1>
 +
      <p>An idea, a saying, a funny quote, a link... anything!</p>
 +
    </header>
 +
    <section id="new-message">
 +
      <form>
 +
        <input type="text" id="yourname" placeholder="Your name">
 +
        <input type="text" id="yourmessage" placeholder="Your happy thought">
 +
        <input type="button" id="postit" value="Post">
 +
        <span id="debugmessage"></span>
 +
      </form>
 +
    </section>
 +
    <section id="messages"></section>
 +
    <footer>
 +
      Powered by
 +
      <a href="http://www.html5rocks.com/en/">HTML5</a>,
 +
      <a href="http://dev.w3.org/html5/websockets/">Web Sockets</a>,
 +
      <a href="http://pusher.com/">Pusher</a>,
 +
      <a href="http://jquery.com/">JQuery</a> and
 +
      <a href="http://www.css3.info/">CSS3</a>.
 +
      Copyright 2011 by Alix Bergeret. All Rights Reserved.
 +
    </footer>
 +
  </body>
 +
</html>
 +
</pre>

Revision as of 15:08, 3 August 2011

Main Page >> Advanced Web Technologies >> Workbook >> Week 05 - HTML5 Web Sockets

HTML5 Web Sockets

This page features the full code of the following webpage: http://mi-linux.wlv.ac.uk/~in9352/websockets/

index.html

<!DOCTYPE HTML>
<html>
  <head>
    <title>Share a happy thought</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
    <link rel="stylesheet" type="text/css" href="css/style.css" />
    <script src="http://js.pusherapp.com/1.9/pusher.js"></script>
    <script src="js/jquery-1.6.2.min.js"></script>
    <script src="js/websockets.js"></script>
  </head>
  <body>
    <header>
      <h1>Share a happy thought</h1>
      <p>An idea, a saying, a funny quote, a link... anything!</p>
    </header>
    <section id="new-message">
      <form>
        <input type="text" id="yourname" placeholder="Your name">
        <input type="text" id="yourmessage" placeholder="Your happy thought">
        <input type="button" id="postit" value="Post">
        <span id="debugmessage"></span>
      </form>
    </section>
    <section id="messages"></section>
    <footer>
      Powered by 
      <a href="http://www.html5rocks.com/en/">HTML5</a>, 
      <a href="http://dev.w3.org/html5/websockets/">Web Sockets</a>, 
      <a href="http://pusher.com/">Pusher</a>, 
      <a href="http://jquery.com/">JQuery</a> and 
      <a href="http://www.css3.info/">CSS3</a>. 
      Copyright 2011 by Alix Bergeret. All Rights Reserved.
    </footer>
  </body>
</html>