8000 New example. · JavaScriptExpert/examples@a98c8ea · GitHub
[go: up one dir, main page]
Skip to content

Commit a98c8ea

Browse files
petersirkapetersirka
committed
New example.
1 parent cb30e0c commit a98c8ea

File tree

9 files changed

+100
-0
lines changed

9 files changed

+100
-0
lines changed

‎views-websocket/controllers/default.js

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
exports.install = function() {
2+
F.route('/*', 'app');
3+
F.websocket('/', reader, ['json']);
4+
};
5+
6+
function reader() {
7+
var self = this;
8+
self.on('message', function(client, message) {
9+
switch (message.url) {
10+
case '/':
11+
case '/company/':
12+
case '/products/':
13+
case '/contact/':
14+
var view = message.url.replace(/\//g, '');
15+
if (!view)
16+
view = 'homepage';
17+
client.send({ status: 200, body: F.view(view) });
18+
break;
19+
default:
20+
client.send({ status: 404 });
21+
break;
22+
}
23+
});
24+
}

‎views-websocket/index.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
// ===================================================
2+
// IMPORTANT: only for development
3+
// total.js - web application framework for node.js
4+
// http://www.totaljs.com
5+
// ===================================================
6+
7+
require('total.js').http('debug');

‎views-websocket/public/css/default.css

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
/*auto*/
2+
3+
body { font-family: Arial; font-size: 14px; line-height: 16px; color: gray; background-color: white; margin: 0; }
4+
nav { background-color: #F0F0F0; padding: 20px; }
5+
nav a { position: relative; display: inline-block; margin-right: 15px; text-decoration: none; color: gray; padding: 5px; }
6+
nav .selected { color: black; background-color: white; }
7+
#body { padding: 30px; }
8+
h1 { font: normal bold 18px Arial; margin: 0 0 20px; padding: 0; color: black; }

‎views-websocket/public/js/jrouting.min.js

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎views-websocket/views/app.html

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
@{layout('')}
2+
3+
<!DOCTYPE html>
4+
<html>
5+
<head>
6+
<title>Websocket example with views</title>
7+
<meta charset="utf-8" />
8+
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
9+
@{import('jrouting.min.js', 'default.css')}
10+
</head>
11+
<body>
12+
<nav>
13+
<a href="/" class="jrouting">Homepage</a>
14+
<a href="/company/" class="jrouting">Company</a>
15+
<a href="/products/" class="jrouting">Products</a>
16+
<a href="/contact/" class="jrouting">Contact</a>
17+
</nav>
18+
<div id="body">LOADING ...</div>
19+
20+
<script>
21+
$('.jrouting').jRouting(true);
22+
23+
var ws = new WebSocket('ws://127.0.0.1:8000/');
24+
25+
ws.onmessage = function(e) {
26+
var container = $('#body');
27+
var message = JSON.parse(decodeURIComponent(e.data));
28+
29+
if (message.status === 200) {
30+
// TIP: here you can cache the view body
31+
container.html(message.body);
32+
return;
33+
}
34+
35+
container.html('404 - page not found');
36+
};
37+
38+
jRouting.route('/*', function() {
39+
send({ url: jRouting.url });
40+
var nav = $('nav');
41+
nav.find('.selected').removeClass('selected');
42+
nav.find('[href="' + jRouting.url + '"]').addClass('selected');
43+
});
44+
45+
function send(obj) {
46+
ws.send(encodeURIComponent(JSON.stringify(obj)));
47+
}
48+
49+
</script>
50+
51+
</body>
52+
</html>

‎views-websocket/views/company.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
<h1>Company</h1>
2+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium, voluptas.</p>

‎views-websocket/views/contact.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
<h1>Contact</h1>
2+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore similique, fuga totam soluta enim? Quos!</p>

‎views-websocket/views/homepage.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
<h1>WebSocket and Views example</h1>
2+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus, reiciendis.<br />Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus, sit.</p>

‎views-websocket/views/products.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
<h1>Products</h1>
2+
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eum, corporis!</p>

0 commit comments

Comments
 (0)
0