<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> <title>IntroQuiz2018</title> <script type="text/javascript" src="intro.js" charset="utf-8"></script> <style type="text/css"> <!-- body {background: limegreen;} p#info {padding: 1ex; margin: 0; border: 3px ; background: white; font-size: 100%;} p#warn {color: red;} button#push {font-size:5em; width: 90%; height: 5em; margin: 0 auto;} button.win {background: linear-gradient(#f8eb22, #878013);} .c {text-align: center;} --> </style> <script> /* ピッチインピッチアウトによる拡大縮小を禁止 */ document.documentElement.addEventListener('touchstart', function (e) { if (e.touches.length >= 2) {e.preventDefault();} }, false); /* ダブルタップによる拡大を禁止 */ var t = 0; document.documentElement.addEventListener('touchend', function (e) { var now = new Date().getTime(); if ((now - t) < 350){e.preventDefault();} t = now; }, false); // </script> <style> body, input, textarea, select, button { /* 入力欄にフォーカスが当たっても拡大しない */ font-size:17px; } </style> <script type="text/javascript"> function intro() { var team = document.getElementById("tm"), button = document.getElementById("push"), warn = document.getElementById("warn"), info = document.getElementById("info"); var conn, PORT=4946, server = 0.0.0.0; function initConn() { try { conn = new WebSocket('ws://' + server + ':' + PORT + '/'); conn.onopen = function() {}; // Nothing special conn.onerror = function(err) { info.textContent = 'WebSocket failure: ' + err }; warn.textContent = null; conn.onmessage = function(ev) { if (ev.data) { var j = JSON.parse(ev.data); info.textContent = j.info; warn.textContent = j.warn; if (j.rank == 1) button.setAttribute("class", "win"); else button.setAttribute("class", null); } }; conn.onclose = function(ev) { info.textContent = "接続断: PUSHで参加"; conn = null; }; info.textContent = "Ready..."; } catch (err) { alert("Socket Creation Error\n\ Firefoxですか? URLウィンドウに about:config と入れて\n\ Search: 窓に websocket と入れて、\n\ network..websocket.allowInsecureFromHTTP\n\ の行をダブルクリックして true に変えてください。\n" + err); } } function push(ev) { if (!conn) initConn(); conn.send(team.value); } button.addEventListener("mousedown", push, false); initConn(); } document.addEventListener("DOMContentLoaded", intro, false); </script> </head> <body> <h1>HAYA OSHI</h1> <!-- <li><a href="./index.html">ちゃっと</a></li> --> <p>Team(1〜):<select name="team" id="tm" maxlength="1"> <option value="">Please choose a your team.</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> <option>6</option> </select> </p> <p id="info">Ready</p> <p id="warn"></p> <p class="c"> <button id="push" type="button" value="PUSH">push</button></p> <hr> </body> </html>