Changed index to use templates so chat and video only versions can be made

close #1
This commit is contained in:
joeyak 2019-03-12 01:53:51 -04:00
parent 192d97727b
commit 272272e29c
6 changed files with 100 additions and 93 deletions

View File

@ -2,9 +2,10 @@ package main
import (
"fmt"
//"net"
"html/template"
"net/http"
"path/filepath"
"strings"
"github.com/gorilla/websocket"
)
@ -104,3 +105,40 @@ func wsHandler(w http.ResponseWriter, r *http.Request) {
}()
}
func handleIndexTemplate(w http.ResponseWriter, r *http.Request) {
t, err := template.ParseFiles("./static/index.html")
if err != nil {
fmt.Printf("[ERR] could not parse template file, %v\n", err)
return
}
type Data struct {
Title string
Video, Chat bool
}
data := Data{
Title: "Movie Night!",
Video: true,
Chat: true,
}
path := strings.Split(strings.TrimLeft(r.URL.Path, "/"), "/")
fmt.Printf("%#v\n", path)
if path[0] == "chat" {
data.Video = false
data.Title += " - chat"
} else if path[0] == "video" {
data.Chat = false
data.Title += " - video"
}
fmt.Println(data)
err = t.Execute(w, data)
if err != nil {
fmt.Printf("[ERR] could not execute file, %v", err)
}
}

View File

@ -112,8 +112,8 @@ func main() {
http.HandleFunc("/static/site.css", wsStaticFiles)
http.HandleFunc("/emotes/", wsEmotes)
http.HandleFunc("/favicon.ico", wsStaticFiles)
http.HandleFunc("/justchat", wsStaticFiles)
http.HandleFunc("/justvideo", wsStaticFiles)
http.HandleFunc("/chat", handleIndexTemplate)
http.HandleFunc("/video", handleIndexTemplate)
http.HandleFunc("/help", wsStaticFiles)
http.HandleFunc("/modhelp", wsStaticFiles)
http.HandleFunc("/adminhelp", wsStaticFiles)
@ -140,7 +140,7 @@ func main() {
fmt.Println("[http 404] ", r.URL.Path)
http.NotFound(w, r)
} else {
http.ServeFile(w, r, "./static/index.html")
handleIndexTemplate(w, r)
}
}
})

View File

@ -2,37 +2,74 @@
<html>
<head>
<meta charset='utf-8'>
<title>Movie Night!</title>
<title>{{ .Title }}</title>
<link rel="stylesheet" type="text/css" href="/static/site.css">
<script type="application/javascript" src="/static/js/jquery.js"></script>
<script type="application/javascript" src="/static/js/flv.min.js"></script>
<script type="application/javascript" src="/static/js/wasm_exec.js"></script>
<script type="application/javascript" src="/static/js/client.js"></script>
{{ if .Chat }}
<script>
window.onload = onloadChat;
</script>
<!-- If it is only the chat window, the the chat needs to be fullscreen -->
{{ if not .Video }}
<style>
#chatbox {
float: left;
}
#phase1 {
margin: 0px 10px;
}
</style>
{{ end }}
{{ end }}
{{ if .Video }}
<script type="application/javascript" src="/static/js/video.js"></script>
<script type="application/javascript" src="/static/js/flv.min.js"></script>
{{ if not .Chat }}
<style>
#streambox {
background: purple;
width: 100%;
height: 100%;
}
</style>
{{ end }}
{{ end }}
</head>
<body>
<div id="streambox">
<video id="videoElement" controls autoplay x5-video-player-type="h5" x5-video-player-fullscreen="true" playsinline webkit-playsinline>
Your browser is too old and doesn't support HTML5 video.
</video>
<script>initPlayer();</script>
{{ if .Video }}
<div id="streambox" onload="initPlayer();">
<video id="videoElement" controls autoplay x5-video-player-type="h5" x5-video-player-fullscreen="true" playsinline webkit-playsinline>
Your browser is too old and doesn't support HTML5 video.
</video>
</div>
{{ end }}
{{ if and .Chat .Video }}
<button style="float:right" id="reload" onclick="initPlayer();">Reload Player</button>
<div id="playingDiv"><span id="playing"></span><br /><a href="" target="_blank" id="playinglink"></a></div>
</div>
<div id="chatbox">
<div id="phase1">
<p style="color:#e5e0e5">Please enter your name to Join the chat</P>
<input id="name" maxlength="36">
<button id="join" onclick="join();">Join</button>
{{ end }}
{{ if .Chat }}
<div id="chatbox">
<div id="phase1">
<p style="color:#e5e0e5">Please enter your name to Join the chat</P>
<input id="name" maxlength="36">
<button id="join" onclick="join();">Join</button>
</div>
<div id="error"></div>
<div id="phase2" style="opacity:0">
<div id="messages"></div>
<textarea id="msg"></textarea>
<br/><button id="send">Send</button>
</div>
</div>
<div id="error"></div>
<div id="phase2" style="opacity:0">
<div id="messages"></div>
<textarea id="msg"></textarea>
<br/><button id="send">Send</button>
</div>
</div>
{{ end }}
</body>
</html>

View File

@ -97,7 +97,7 @@ function websocketSend(data) {
ws.send(data)
}
window.onload = function () {
function onloadChat() {
startGo();
$("#name").keypress(function (evt) {

View File

@ -1,35 +0,0 @@
<!doctype html>
<html>
<head>
<meta charset='utf-8'>
<title>Movie Night! - Chat</title>
<link rel="stylesheet" type="text/css" href="/static/site.css">
<script src="/static/js/jquery.js"></script>
<script src="/static/js/client.js"></script>
<style>
#chatbox {
float: left;
}
#phase1 {
margin: 0px 10px;
}
</style>
</head>
<body>
<div id="chatbox">
<div id="phase1">
<p style="color:#e5e0e5">Please enter your name to Join the chat</P>
<input id="name">
<button id="join">Join</button>
</div>
<div id="error"></div>
<div id="phase2" style="opacity:0">
<div id="messages"></div>
<textarea id="msg"></textarea>
<br /><button id="send">Send</button>
</div>
</div>
</body>
</html>

View File

@ -1,33 +0,0 @@
<!doctype html>
<html>
<head>
<meta charset='utf-8'>
<title>Movie Night!</title>
<link rel="stylesheet" type="text/css" href="/static/site.css">
<script src="/static/js/jquery.js"></script>
<script src="/static/js/flv.min.js"></script>
<script>
function initPlayer() {
if (flvjs.isSupported()) {
var videoElement = document.getElementById('videoElement');
var flvPlayer = flvjs.createPlayer({
type: 'flv',
url: '/live'
});
flvPlayer.attachMediaElement(videoElement);
flvPlayer.load();
flvPlayer.play();
}
}
</script>
</head>
<body>
<video id="videoElement" controls autoplay x5-video-player-type="h5" x5-video-player-fullscreen="true" playsinline webkit-playsinline>
Your browser is too old and doesn't support HTML5 video.
</video>
<script>initPlayer();</script>
</body>
</html>