Commit f6ce303d7bd2943d46dafddab4a538fde49042c0

Authored by Georg Hopp
1 parent 631e1688

load partials via javascript, so I do not need the server at all. closes #35

  1 +<hr />
  2 +&copy; 2013 Georg Hopp -
  3 +<a href="mailto:georg@steffers.org">contact-email</a>
  4 +
  5 +<!-- vim: set ts=4 sw=4: -->
... ...
  1 +<form>
  2 + <label for="username">username</label>
  3 + <input type="text" name="username" /><br />
  4 + <label for="password">password</label>
  5 + <input type="password" name="password" /><br />
  6 + <input type="submit" />
  7 +</form>
  8 +
  9 +<!-- vim: set ts=4 sw=4: -->
... ...
  1 +<ul>
  2 + <li class="menuedge"></li>
  3 + <li><a href="/author.html">author</a></li>
  4 + <li><a href="/documentation.html">documentation</a></li>
  5 + <li><a href="/download.html">download</a></li>
  6 + <li class="signup"><span>signup</span></li>
  7 + <li class="login"><span>login</span></li>
  8 + <li class="logout hide"><span>logout</span></li>
  9 + <li class="menuedge"></li>
  10 + <div></div>
  11 +</ul>
  12 +
  13 +<!-- vim: set ts=4 sw=4: -->
... ...
  1 +<form>
  2 + <label for="firstname">firstname</label>
  3 + <input type="text" name="firstname" /><br />
  4 + <label for="surname">surname</label>
  5 + <input type="text" name="surname" /><br />
  6 + <label for="mail">email</label>
  7 + <input type="text" name="email" /><br />
  8 + <label for="password">password</label>
  9 + <input type="password" name="password" /><br />
  10 + <label for="pwrepeat">password (again)</label>
  11 + <input type="password" name="pwrepeat" /><br />
  12 + <input type="submit" />
  13 +</form>
  14 +
  15 +<!-- vim: set ts=4 sw=4: -->
... ...
  1 +<iframe
  2 + src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Ftaskrambler.weird-web-workers.org&amp;layout=standard&amp;show_faces=false&amp;width=300&amp;action=like&amp;colorscheme=light&amp;height=30" scrolling="no"
  3 + frameborder="0"
  4 + allowTransparency="true">
  5 +</iframe>
  6 +
  7 +<ul>
  8 + <li>
  9 + <div id="sessinfo">
  10 + Session: <canvas width="100px" height="5px"></canvas>
  11 + </div>
  12 + </li>
  13 + <li id="user"></li>
  14 + <li id="version"></li>
  15 +</ul>
  16 +<br />Session ID: <span id="sessid"></span>
  17 +
  18 +<!-- vim: set ts=4 sw=4: -->
... ...
  1 +<a href="/main.html">
  2 + <div class="left">
  3 + <h1>Task</h1>
  4 + </div>
  5 + <img src="/image/rambler-logo2-small.jpg" />
  6 + <div class="right">
  7 + <h1>Rambler</h1>
  8 + </div>
  9 +</a>
  10 +
  11 +<!-- vim: set ts=4 sw=4: -->
... ...
... ... @@ -15,44 +15,20 @@
15 15 </head>
16 16
17 17 <body>
  18 + <div id="login" class="hide">
  19 + </div>
  20 +
  21 + <div id="signup" class="hide">
  22 + </div>
  23 +
18 24 <div id="page">
19 25 <div id="statusline">
20   - <ul>
21   - <li>
22   - <div id="sessinfo">
23   - Session: <canvas width="100px" height="5px"></canvas>
24   - </div>
25   - </li>
26   - <li id="user"></li>
27   - <li id="version"></li>
28   - </ul>
29   - <br />Session ID: <span id="sessid"></span>
30 26 </div>
31 27
32 28 <div id="title">
33   - <a href="/main.html">
34   - <div class="left">
35   - <h1>Task</h1>
36   - </div>
37   - <img src="/image/rambler-logo2-small.jpg" />
38   - <div class="right">
39   - <h1>Rambler</h1>
40   - </div>
41   - </a>
42 29 </div>
43 30
44 31 <div id="menu">
45   - <ul>
46   - <li class="menuedge"></li>
47   - <li><a href="/author.html">author</a></li>
48   - <li><a href="/documentation.html">documentation</a></li>
49   - <li><a href="/download.html">download</a></li>
50   - <li class="signup"><span>signup</span></li>
51   - <li class="login"><span>login</span></li>
52   - <li class="logout hide"><span>logout</span></li>
53   - <li class="menuedge"></li>
54   - <div></div>
55   - </ul>
56 32 </div>
57 33
58 34 <div id="main">
... ... @@ -99,32 +75,6 @@
99 75 <a href="mailto:georg@steffers.org">contact-email</a>
100 76 </div>
101 77 </div>
102   -
103   - <div id="login" class="hide">
104   - <form>
105   - <label for="username">username</label>
106   - <input type="text" name="username" /><br />
107   - <label for="password">password</label>
108   - <input type="password" name="password" /><br />
109   - <input type="submit" />
110   - </form>
111   - </div>
112   -
113   - <div id="signup" class="hide">
114   - <form>
115   - <label for="firstname">firstname</label>
116   - <input type="text" name="firstname" /><br />
117   - <label for="surname">surname</label>
118   - <input type="text" name="surname" /><br />
119   - <label for="mail">email</label>
120   - <input type="text" name="email" /><br />
121   - <label for="password">password</label>
122   - <input type="password" name="password" /><br />
123   - <label for="pwrepeat">password (again)</label>
124   - <input type="password" name="pwrepeat" /><br />
125   - <input type="submit" />
126   - </form>
127   - </div>
128 78 </body>
129 79 </html>
130 80
... ...
... ... @@ -15,45 +15,20 @@
15 15 </head>
16 16
17 17 <body>
  18 + <div id="login" class="hide">
  19 + </div>
  20 +
  21 + <div id="signup" class="hide">
  22 + </div>
  23 +
18 24 <div id="page">
19 25 <div id="statusline">
20   - <ul>
21   - <li>
22   - <div id="sessinfo">
23   - Session: <canvas width="100px" height="5px"></canvas>
24   - </div>
25   - </li>
26   - <li id="user"></li>
27   - <li id="version"></li>
28   - </ul>
29   - <br />Session ID: <span id="sessid"></span>
30 26 </div>
31 27
32 28 <div id="title">
33   - <a href="/main.html">
34   - <div class="left">
35   - <h1>Task</h1>
36   - </div>
37   - <img src="/image/rambler-logo2-small.jpg" />
38   - <div class="right">
39   - <h1>Rambler</h1>
40   - </div>
41   - </a>
42 29 </div>
43 30
44 31 <div id="menu">
45   - <ul>
46   - <li class="menuedge"></li>
47   - <li><a href="/author.html">author</a></li>
48   - <li><a href="/documentation.html">documentation</a></li>
49   - <li><a href="/download.html">download</a></li>
50   - <li class="signup"><span>signup</span></li>
51   - <li class="login"><span>login</span></li>
52   - <li class="logout hide"><span>logout</span></li>
53   - <li class="menuedge"></li>
54   - <div></div>
55   - </ul>
56   - <div class="clear"></div>
57 32 </div>
58 33
59 34 <div id="main">
... ... @@ -146,32 +121,6 @@
146 121 <a href="mailto:georg@steffers.org">contact-email</a>
147 122 </div>
148 123 </div>
149   -
150   - <div id="login" class="hide">
151   - <form>
152   - <label for="username">username</label>
153   - <input type="text" name="username" /><br />
154   - <label for="password">password</label>
155   - <input type="password" name="password" /><br />
156   - <input type="submit" />
157   - </form>
158   - </div>
159   -
160   - <div id="signup" class="hide">
161   - <form>
162   - <label for="firstname">firstname</label>
163   - <input type="text" name="firstname" /><br />
164   - <label for="surname">surname</label>
165   - <input type="text" name="surname" /><br />
166   - <label for="mail">email</label>
167   - <input type="text" name="email" /><br />
168   - <label for="password">password</label>
169   - <input type="password" name="password" /><br />
170   - <label for="pwrepeat">password (again)</label>
171   - <input type="password" name="pwrepeat" /><br />
172   - <input type="submit" />
173   - </form>
174   - </div>
175 124 </body>
176 125 </html>
177 126
... ...
... ... @@ -15,6 +15,12 @@
15 15 </head>
16 16
17 17 <body>
  18 + <div id="login" class="hide">
  19 + </div>
  20 +
  21 + <div id="signup" class="hide">
  22 + </div>
  23 +
18 24 <div id="page">
19 25 <div id="statusline">
20 26 <ul>
... ... @@ -106,32 +112,6 @@
106 112 <a href="mailto:georg@steffers.org">contact-email</a>
107 113 </div>
108 114 </div>
109   -
110   - <div id="login" class="hide">
111   - <form>
112   - <label for="username">username</label>
113   - <input type="text" name="username" /><br />
114   - <label for="password">password</label>
115   - <input type="password" name="password" /><br />
116   - <input type="submit" />
117   - </form>
118   - </div>
119   -
120   - <div id="signup" class="hide">
121   - <form>
122   - <label for="firstname">firstname</label>
123   - <input type="text" name="firstname" /><br />
124   - <label for="surname">surname</label>
125   - <input type="text" name="surname" /><br />
126   - <label for="mail">email</label>
127   - <input type="text" name="email" /><br />
128   - <label for="password">password</label>
129   - <input type="password" name="password" /><br />
130   - <label for="pwrepeat">password (again)</label>
131   - <input type="password" name="pwrepeat" /><br />
132   - <input type="submit" />
133   - </form>
134   - </div>
135 115 </body>
136 116 </html>
137 117
... ...
1   -<?xml version="1.0" encoding="iso-8859-1"?>
2   -<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
3   -"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4   -<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
5   - <head>
6   - <title>This is just foo</title>
7   - </head>
8   - <body>
9   - <h1>A BIG FAT FOO</h1>
10   - </body>
11   -</html>
12   -
13   -<!-- vim: set ts=4 sw=4: -->
... ... @@ -15,44 +15,20 @@
15 15 </head>
16 16
17 17 <body>
  18 + <div id="login" class="hide">
  19 + </div>
  20 +
  21 + <div id="signup" class="hide">
  22 + </div>
  23 +
18 24 <div id="page">
19 25 <div id="statusline">
20   - <ul>
21   - <li>
22   - <div id="sessinfo">
23   - Session: <canvas width="100px" height="5px"></canvas>
24   - </div>
25   - </li>
26   - <li id="user"></li>
27   - <li id="version"></li>
28   - </ul>
29   - <br />Session ID: <span id="sessid"></span>
30 26 </div>
31 27
32 28 <div id="title">
33   - <a href="/main.html">
34   - <div class="left">
35   - <h1>Task</h1>
36   - </div>
37   - <img src="/image/rambler-logo2-small.jpg" />
38   - <div class="right">
39   - <h1>Rambler</h1>
40   - </div>
41   - </a>
42 29 </div>
43 30
44 31 <div id="menu">
45   - <ul>
46   - <li class="menuedge"></li>
47   - <li><a href="/author.html">author</a></li>
48   - <li><a href="/documentation.html">documentation</a></li>
49   - <li><a href="/download.html">download</a></li>
50   - <li class="signup"><span>signup</span></li>
51   - <li class="login"><span>login</span></li>
52   - <li class="logout hide"><span>logout</span></li>
53   - <li class="menuedge"></li>
54   - <div></div>
55   - </ul>
56 32 </div>
57 33
58 34 <div id="main">
... ... @@ -247,33 +223,6 @@
247 223 <a href="mailto:georg@steffers.org">contact-email</a>
248 224 </div>
249 225 </div>
250   -
251   - <div id="login" class="hide">
252   - <form>
253   - <label for="username">username</label>
254   - <input type="text" name="username" /><br />
255   - <label for="password">password</label>
256   - <input type="password" name="password" /><br />
257   - <input type="submit" />
258   - </form>
259   - </div>
260   -
261   - <div id="signup" class="hide">
262   - <form>
263   - <label for="firstname">firstname</label>
264   - <input type="text" name="firstname" /><br />
265   - <label for="surname">surname</label>
266   - <input type="text" name="surname" /><br />
267   - <label for="mail">email</label>
268   - <input type="text" name="email" /><br />
269   - <label for="password">password</label>
270   - <input type="password" name="password" /><br />
271   - <label for="pwrepeat">password (again)</label>
272   - <input type="password" name="pwrepeat" /><br />
273   - <input type="submit" />
274   - </form>
275   - </div>
276   -
277 226 </body>
278 227 </html>
279 228
... ...
1 1 var sess = null;
2 2
3 3 $(document).ready(function() {
4   - var sval = new ServerVal("#randval");
  4 + var sval = new ServerVal("#randval");
5 5
6   - sess = new Session("#sessinfo", "#sessid", "#user");
  6 + $("#title").load("/_title.html");
  7 + $("#footer").load("/_footer.html");
7 8
8   - $.getJSON(
9   - "/version/",
10   - function(data) {
11   - $("#version").empty().append("version: " + data.version);
12   - }
13   - );
  9 + $("#menu").load("/_menu.html", function() {
  10 + $("div#menu ul li.signup").click(function() {
  11 + $("#signup").removeClass("hide");
  12 + });
14 13
15   - $.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
16   - $.getJSON("/user/get/", $.proxy(sess.loadUserJSON, sess));
17   -
18   - $(window).focus(function() {
19   - $.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
  14 + $("div#menu ul li.login").click(function() {
  15 + $("#login").removeClass("hide");
  16 + });
20 17 });
21 18
22   - $("div#menu ul li.signup").click(function() {
23   - $("#signup").removeClass("hide");
24   - });
  19 + $("#statusline").load("/_statusline.html", function (){
  20 + sess = new Session("#sessinfo", "#sessid", "#user");
25 21
26   - $("div#menu ul li.login").click(function() {
27   - $("#login").removeClass("hide");
28   - });
  22 + $.getJSON(
  23 + "/version/",
  24 + function(data) {
  25 + $("#version").empty().append("version: " + data.version);
  26 + }
  27 + );
29 28
30   - $("div#menu ul li.logout").click(function() {
31   - $.getJSON("/logout/", $.proxy(sess.loadUserJSON, sess));
32 29 $.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
33   - });
  30 + $.getJSON("/user/get/", $.proxy(sess.loadUserJSON, sess));
34 31
35   - $("#randval").click(function() {
36   - sval.stop();
37   - });
  32 + $(window).focus(function() {
  33 + $.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
  34 + });
38 35
39   - $("#login form").submit(function(event) {
40   - event.preventDefault();
41   - $.post("/login/",
42   - $("#login form").serialize(),
43   - $.proxy(sess.loadUserJSON, sess));
44   - $("#login").addClass("hide");
45   - $.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
  36 + $("div#menu ul li.logout").click(function() {
  37 + $.getJSON("/logout/", $.proxy(sess.loadUserJSON, sess));
  38 + $.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
  39 + });
  40 +
  41 + $("#login").load("/_login.html", function (){
  42 + $("#login form").submit(function(event) {
  43 + event.preventDefault();
  44 + $.post("/login/",
  45 + $("#login form").serialize(),
  46 + $.proxy(sess.loadUserJSON, sess));
  47 + $("#login").addClass("hide");
  48 + $.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
  49 + });
  50 + });
  51 +
  52 + $("#signup").load("/_signup.html", function (){
  53 + $("#signup form").submit(function(event) {
  54 + event.preventDefault();
  55 + $.post("/signup/",
  56 + $("#signup form").serialize(),
  57 + $.proxy(sess.loadUserJSON, sess));
  58 + $("#signup").addClass("hide");
  59 + $.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
  60 + });
  61 + });
46 62 });
47 63
48   - $("#signup form").submit(function(event) {
49   - event.preventDefault();
50   - $.post("/signup/",
51   - $("#signup form").serialize(),
52   - $.proxy(sess.loadUserJSON, sess));
53   - $("#signup").addClass("hide");
54   - $.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
  64 + $("#randval").click(function() {
  65 + sval.stop();
55 66 });
56 67 });
57 68
... ...
... ... @@ -134,13 +134,22 @@ div.border div.br {
134 134 text-align: right;
135 135 }
136 136
  137 +#statusline iframe {
  138 + display: inline-block;
  139 + float: left;
  140 + border: none;
  141 + overflow: hidden;
  142 + width: 300px;
  143 + height: 30px;
  144 +}
  145 +
137 146 #statusline ul {
138   - display: inline-block;
139   - width: 780px;
140   - height: 15px;
141   - list-style: none;
142   - padding: 0px;
143   - margin: 0px;
  147 + display: inline-block;
  148 + width: 480px;
  149 + height: 15px;
  150 + list-style: none;
  151 + padding: 0px;
  152 + margin: 0px;
144 153 }
145 154
146 155 #statusline ul li {
... ...
Please register or login to post a comment