summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--public/css/css.css21
-rw-r--r--public/js/index.js2
-rw-r--r--public/js/lib/user.js4
-rw-r--r--public/js/lib/views/index.js9
-rw-r--r--public/js/lib/views/lobby/index.js8
-rw-r--r--public/js/lib/views/login.js29
-rw-r--r--public/js/lib/views/room/index.js3
-rw-r--r--public/js/lib/ws.js9
-rw-r--r--public/js/vendor/util.js35
-rw-r--r--views/pages/lobby.ejs14
-rw-r--r--views/partials/scripts.ejs5
11 files changed, 124 insertions, 15 deletions
diff --git a/public/css/css.css b/public/css/css.css
index 1fce66f..a8d3df1 100644
--- a/public/css/css.css
+++ b/public/css/css.css
@@ -3,3 +3,24 @@ html,body{width:100%;height:100%;margin:0;padding:0;}
#bg.tile{background-size:auto auto;}
html{background:black;}
body{background:transparent;}
+#login {
+ display: none;
+}
+#login {
+ position: absolute; top: 0; left: 0;
+ width: 100%; height: 100%;
+ background: rgba(0,0,0,0.95);
+}
+#lobby form, #login form {
+ position: absolute;
+ top: 50%; left: 50%;
+ -webkit-transform: translate(-50%,-50%);
+ transform: translate(-50%,-50%);
+ background: #fff;
+ padding: 20px;
+}
+
+#lobby input {
+ font-size: 3vw;
+ width: 40vw;
+} \ No newline at end of file
diff --git a/public/js/index.js b/public/js/index.js
index 30f5975..6e171fc 100644
--- a/public/js/index.js
+++ b/public/js/index.js
@@ -4,8 +4,6 @@ var app = (function(){
app.init = function(){
user.init()
- app.socket = ws.connect()
-
app.router = new SiteRouter ()
$(window).on("focus", app.focus)
diff --git a/public/js/lib/user.js b/public/js/lib/user.js
index f96946f..1293895 100644
--- a/public/js/lib/user.js
+++ b/public/js/lib/user.js
@@ -2,10 +2,9 @@ var user = (function(){
var user = {}
user.init = function(){
user.load()
- user.bind()
}
user.bind = function(){
- $("#username").on("input", user.save)
+ // $("#username").on("input", user.save)
}
user.load = function(){
user.username = user.getCookie()
@@ -38,6 +37,7 @@ var user = (function(){
}
user.save = function(){
var username = user.sanitize()
+ if (! username.length) return
if (username != user.username) user.setCookie(username);
}
user.setCookie = function(username){
diff --git a/public/js/lib/views/index.js b/public/js/lib/views/index.js
index d96bffb..d5ec35d 100644
--- a/public/js/lib/views/index.js
+++ b/public/js/lib/views/index.js
@@ -10,13 +10,20 @@ var SiteRouter = Router.extend({
},
initialize: function(){
- this.route()
+ if (! user.username) {
+ $("#login").show()
+ }
+ else {
+ this.route()
+ }
},
lobby: function(){
+ this.view = new LobbyView ()
},
room: function(name){
+ this.view = new RoomView (name)
},
}) \ No newline at end of file
diff --git a/public/js/lib/views/lobby/index.js b/public/js/lib/views/lobby/index.js
index 5ed1966..70b63c4 100644
--- a/public/js/lib/views/lobby/index.js
+++ b/public/js/lib/views/lobby/index.js
@@ -1,9 +1,17 @@
var LobbyView = View.extend({
events: {
+ "form submit": "join"
},
initialize: function(){
+ this.$createRoom = this.$("#create-room")
+ },
+
+ join: function(){
+ var name = this.$createRoom.sanitize()
+ if (! name) { return }
+ window.location.href = "/v/" + name
}
}) \ No newline at end of file
diff --git a/public/js/lib/views/login.js b/public/js/lib/views/login.js
new file mode 100644
index 0000000..325d22d
--- /dev/null
+++ b/public/js/lib/views/login.js
@@ -0,0 +1,29 @@
+var LoginView = View.extend({
+ el: "#login",
+
+ events: {
+ "form submit": "save",
+ },
+
+ initialize: function(){
+ this.$el.show()
+ },
+
+ save: function(e){
+ e.preventDefault()
+ user.save()
+ var that = this
+ if (user.username.length) {
+ app.router.route()
+ oktween.add({
+ obj: this.el.style,
+ from: { opacity: 1 },
+ to: { opacity: 0 },
+ duration: 500,
+ finished: function(){
+ that.el.style.display = "none"
+ }
+ })
+ }
+ },
+}) \ No newline at end of file
diff --git a/public/js/lib/views/room/index.js b/public/js/lib/views/room/index.js
index b266e29..58d7449 100644
--- a/public/js/lib/views/room/index.js
+++ b/public/js/lib/views/room/index.js
@@ -3,7 +3,8 @@ var RoomView = View.extend({
events: {
},
- initialize: function(){
+ initialize: function(name){
+ app.socket = ws.connect(name)
}
}) \ No newline at end of file
diff --git a/public/js/lib/ws.js b/public/js/lib/ws.js
index fbf9211..15af8a1 100644
--- a/public/js/lib/ws.js
+++ b/public/js/lib/ws.js
@@ -1,9 +1,9 @@
-var ws = function(){
+var ws = (function(){
var ws = {}
var socket, socketIsReady
- ws.connect = function () {
+ ws.connect = function (room) {
if (this.socket) return;
- var socketPath = window.location.origin + '/' + posthang.room.subdomain
+ var socketPath = window.location.origin + '/' + room
ws.socket = socket = io(socketPath)
// this.socket.on('connect', function(){ console.log(new Date(), "connected")})
@@ -41,4 +41,5 @@ var ws = function(){
console.log(new Date(), "disconnected")
// this.chatView.appendInfo({ content: "Disconnected." })
}
-}
+ return ws
+})()
diff --git a/public/js/vendor/util.js b/public/js/vendor/util.js
index 0f5c6ed..7c73ae2 100644
--- a/public/js/vendor/util.js
+++ b/public/js/vendor/util.js
@@ -240,6 +240,41 @@ if (!Function.prototype.bind) {
};
}());
+// Identify browser based on useragent string
+(function( ua ) {
+ ua = ua.toLowerCase();
+ var match = /(chrome)[ \/]([\w.]+)/.exec( ua ) ||
+ /(webkit)[ \/]([\w.]+)/.exec( ua ) ||
+ /(opera)(?:.*version|)[ \/]([\w.]+)/.exec( ua ) ||
+ /(msie) ([\w.]+)/.exec( ua ) ||
+ ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec( ua ) ||
+ [];
+ var matched = {
+ browser: match[ 1 ] || "",
+ version: match[ 2 ] || "0"
+ };
+ browser = {};
+ if ( matched.browser ) {
+ browser[ matched.browser ] = true;
+ browser.version = matched.version;
+ }
+ // Chrome is Webkit, but Webkit is also Safari.
+ if ( browser.chrome ) {
+ browser.webkit = true;
+ } else if ( browser.webkit ) {
+ browser.safari = true;
+ }
+ if (window.$) $.browser = browser;
+ return browser;
+})( navigator.userAgent );
+
+// Naive useragent detection pattern
+var is_iphone = (navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))
+var is_ipad = (navigator.userAgent.match(/iPad/i))
+var is_android = (navigator.userAgent.match(/Android/i))
+var is_mobile = is_iphone || is_ipad || is_android
+var is_desktop = ! is_mobile;
+var app_devicePixelRatio = is_mobile ? devicePixelRatio : 1;
function selectElementContents(el) {
if (window.getSelection && document.createRange) {
diff --git a/views/pages/lobby.ejs b/views/pages/lobby.ejs
index 46b634c..80bbf88 100644
--- a/views/pages/lobby.ejs
+++ b/views/pages/lobby.ejs
@@ -3,19 +3,23 @@
<head>
<title>yt-chat</title>
<link rel="stylesheet" href="/css/css.css">
-<style>
-</style>
</head>
<body>
<div id="bg"></div>
<div id="login">
- please enter your nick..<br>
- <input type="text" id="username">
+ <form>
+ please enter your nick..<br>
+ <input type="text" id="username">
+ </form>
</div>
-<input type="text" id="create-room" placeholder="enter a url to make a room">
+<div id="lobby">
+ <form>
+ <input type="text" id="create-room" placeholder="enter a url to make a room">
+ </form>
+</div>
</body>
<% include ../partials/scripts %>
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index 5908ee7..844d884 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -16,7 +16,12 @@
<script src="js/lib/user.js"></script>
<script src="js/lib/video.js"></script>
<script src="js/lib/ws.js"></script>
+<script src="js/lib/views/room/index.js"></script>
<script src="js/lib/views/lobby/index.js"></script>
+<script src="js/lib/views/login.js"></script>
+<script src="js/lib/views/index.js"></script>
<script src="js/index.js"></script>
+<!--
<script type="text/javascript" src="http://www.youtube.com/player_api"></script>
+ -->
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-10 23:18:06 +0000