From d8bae84fff7977844fa2b57b15b86a831b73aed2 Mon Sep 17 00:00:00 2001
From: Pacien TRAN-GIRARD
Date: Thu, 15 May 2014 16:00:45 +0200
Subject: First version

---
 views/channel.html | 28 ++++++++++++++++++
 views/client.html  | 83 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 views/home.html    | 31 ++++++++++++++++++++
 views/layout.html  | 11 ++++++++
 4 files changed, 153 insertions(+)
 create mode 100644 views/channel.html
 create mode 100644 views/client.html
 create mode 100644 views/home.html
 create mode 100644 views/layout.html

(limited to 'views')

diff --git a/views/channel.html b/views/channel.html
new file mode 100644
index 0000000..a1c13b5
--- /dev/null
+++ b/views/channel.html
@@ -0,0 +1,28 @@
+<h2>Create a channel</h2>
+
+<h3>Channel created with given password</h3>
+
+<form>
+	<label for="channel">Channel ID</label>
+	<input type="text" value="{{channel}}" readonly id="channel">
+	<br>
+	<label for="url">URL</label>
+	<input type="text" value="{{url}}" readonly id="url">
+</form>
+
+<style type="text/css">
+	label {
+		display: inline-block;
+		width: 100px;
+	}
+</style>
+
+<script type="text/javascript">
+	channel.addEventListener("click", function(event) {
+		this.select();
+	});
+	
+	url.addEventListener("click", function(event) {
+		this.select();
+	});
+</script>
diff --git a/views/client.html b/views/client.html
new file mode 100644
index 0000000..c322042
--- /dev/null
+++ b/views/client.html
@@ -0,0 +1,83 @@
+<h2>Test client</h2>
+
+<form>
+	<label for="channelField">Channel</label>
+	<input type="text" id="channelField">
+	<label for="passwordField">Password (optional)</label>
+	<input type="password" id="passwordField">
+	<input type="submit" value="Connect" id="connectButton">
+</form>
+<br>
+<form>
+	<label for="messageField">Message</label>
+	<input type="text" disabled id="messageField">
+	<input type="submit" value="Send" disabled id="sendButton">
+</form>
+
+<hr>
+<span>Log</span>
+<pre id="console"></pre>
+
+ <script src="/socket.io/socket.io.js"></script>
+<script type="text/javascript">
+	var console = document.getElementById("console");
+
+	function println(str) {
+		console.innerHTML = str + "\n" + console.innerHTML;
+	}
+
+	function changeControlState(connected) {
+		socketConnected = connected;
+		channelField.disabled = connected;
+		passwordField.disabled = connected;
+		if (connected) {
+			connectButton.value = "Disconnect";
+		} else {
+			connectButton.value = "Connect";
+		}
+
+		messageField.disabled = !connected;
+		sendButton.disabled = !connected;
+	}
+
+	var socket;
+	var socketConnected = false;
+
+	function connectSocket(channel, password) {
+		socket = io.connect("/", {
+			"query" : "channel=" + channel + "&password=" + password,
+			"force new connection" : true
+		});
+
+		socket.on("connect", function() {
+			changeControlState(true);
+			println("connected");
+		});
+
+		socket.on("disconnect", function() {
+			changeControlState(false);
+			println("disconnected");
+		});
+
+		socket.on("message", function(message) {
+			println(message);
+		});
+	}
+
+
+	connectButton.addEventListener("click", function(event) {
+		event.preventDefault();
+		if (socketConnected) {
+			socket.disconnect();
+		} else {
+			connectSocket(channelField.value, passwordField.value);
+		}
+	});
+
+	sendButton.addEventListener("click", function(event) {
+		event.preventDefault();
+		socket.emit("message", messageField.value);
+		messageField.value = "";
+	});
+
+</script>
\ No newline at end of file
diff --git a/views/home.html b/views/home.html
new file mode 100644
index 0000000..f6fef09
--- /dev/null
+++ b/views/home.html
@@ -0,0 +1,31 @@
+<h2>Create a channel</h2>
+
+<form method="post" action="/">
+	<label for="passwordField">Password (optional)</label>
+	<input type="password"  id="passwordField" name="password">
+	<input type="submit" id="randomButton" value="Generate random password">
+	<input type="submit" value="Create a new channel">
+</form>
+
+<br>
+<hr>
+
+<a href="/client">Test client</a> - <a href="https://github.com/Pacien/Webcastor">Sources</a>
+
+<script type="text/javascript">
+	randomButton.addEventListener("click", function(event) {
+		event.preventDefault();
+
+		var randomPassword = Math.random().toString(36).substr(2, 10);
+
+		passwordField.type = "text";
+		passwordField.value = randomPassword;
+	});
+
+	passwordField.addEventListener("input", function(event) {
+		if (passwordField.value.length <= 1) {
+			passwordField.type = "password";
+		}
+	});
+
+</script>
diff --git a/views/layout.html b/views/layout.html
new file mode 100644
index 0000000..c929bc9
--- /dev/null
+++ b/views/layout.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8">
+		<title>Webcastor</title>
+	</head>
+	<body>
+		<h1>Webcastor</h1>
+		{{{ yield }}}
+	</body>
+</html>
\ No newline at end of file
-- 
cgit v1.2.3