Skip to content

Commit

Permalink
add --instructions and related stuff
Browse files Browse the repository at this point in the history
  • Loading branch information
greggman committed Jul 15, 2015
1 parent 530c8d2 commit 002c94d
Show file tree
Hide file tree
Showing 6 changed files with 202 additions and 2 deletions.
31 changes: 31 additions & 0 deletions public/css/games.css
Original file line number Diff line number Diff line change
Expand Up @@ -163,6 +163,37 @@ html, body {
z-index: 10;
display: none;
}
#hft-connect {
position: absolute;
top: 0px;
text-align: center;
background-color: rgba(0,0,0,0.5);
color: white;
z-index: 1000;
font-size: 18pt;
font-weight: bold;
display: none;
min-width: 100%;
}
#hft-ins {
overflow: hidden;
white-space: nowrap;
margin: 0.2em;
transform: translateX(100%);
animation: hft-ins-anim 45s linear infinite;
}
/*
@keyframes hft-ins-anim {
0% {
transform: translateX(50%);
}
100% {
transform: translateX(-50%);
}
}
*/


#hft-disconnected {
position: absolute;
top: 0px;
Expand Down
47 changes: 46 additions & 1 deletion public/hft/0.x.x/scripts/gamesupport.js
Original file line number Diff line number Diff line change
Expand Up @@ -47,16 +47,22 @@ define([
'./misc/gameclock',
'./misc/logger',
'./misc/misc',
'./misc/strings',
'./hft-settings',
'./hft-splash',
'./hft-system',
'./languages',
], function(
StatsJS,
Cookie,
GameClock,
Logger,
Misc,
strings,
hftSettings,
HFTSplash,
HFTSystem) {
HFTSystem,
languages) {

var $ = function(id) {
return document.getElementById(id);
Expand Down Expand Up @@ -119,6 +125,45 @@ define([
server.addEventListener('disconnect', handleDisconnected);
}

if (options.instructions || hftSettings.instructions) {
$("hft-connect").style.display = "block";
var langs = languages.getLangs(options.langs || hftSettings.langs);
if (langs.length === 0) {
langs = [languages.getDefaultLang()];
}
$("hft-ins").innerHTML = langs.map(function(lang) {
return lang.connect;
}).join(" ");

var style = document.createElement("style");
var css = document.createTextNode("");

var computeAnim = function() {
var padding = 100;
var msgWidth = $("hft-ins").clientWidth + padding * 2;
var bodyWidth = document.body.clientWidth;
var start = bodyWidth + padding;
var end = -msgWidth - padding;
var duration = (start - end) / 60;

var anim = strings.replaceParams([
"#hft-ins { animation: hft-ins-anim %(duration)ss linear infinite; }",
"@keyframes hft-ins-anim { 0% { transform: translateX(%(start)spx); } 100% { transform: translateX(%(end)spx); } }",
].join("\n"), {
duration: duration,
start: start,
end: end,
});

css.nodeValue = anim;
};

style.appendChild(css);
document.body.appendChild(style);
computeAnim();
// window.addEventListener('resize', computeAnim, false);
}

if (options.showFPS) {
stats = new Stats();
stats.setMode(0); // 0: fps, 1: ms
Expand Down
110 changes: 110 additions & 0 deletions public/hft/0.x.x/scripts/languages.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,110 @@
/*
* Copyright 2014, Gregg Tavares.
* All rights reserved.
*
* Redistribution and use in source and binary forms, with or without
* modification, are permitted provided that the following conditions are
* met:
*
* * Redistributions of source code must retain the above copyright
* notice, this list of conditions and the following disclaimer.
* * Redistributions in binary form must reproduce the above
* copyright notice, this list of conditions and the following disclaimer
* in the documentation and/or other materials provided with the
* distribution.
* * Neither the name of Gregg Tavares. nor the names of its
* contributors may be used to endorse or promote products derived from
* this software without specific prior written permission.
*
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
* "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
* LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
* A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
* OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
* SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
* LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
* DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
* THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
* (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
* OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*/
"use strict";

define([
'./misc/strings',
'./hft-settings',
], function(
strings,
hftSettings
) {
var langs = {
"en": {
connect: 'Connect to %(wifiName)s Wifi%(password)s, on iOS just wait, on Android use Chrome and go to "h.com"',
password: " password: %(wifiPass)s",
},
"ja": {
connect: "「%(wifiName)s」の無線LANを接続%(password)s, iPhoneならそのまま待って下さい, Androidなら「Chrome」を起動して「h.com」へ行って下さい",
password: " パスワード:「%(wifiPass)s」",
},
};

Object.keys(langs).forEach(function(key) {
var lang = langs[key];
lang.id = key;

var subs = {
password: "",
wifiPass: "",
};

if (hftSettings.wifiPass) {
subs.password = strings.replaceParams(lang.password, hftSettings);
}

Object.keys(lang).forEach(function(key) {
lang[key] = strings.replaceParams(lang[key], [subs, hftSettings]);
});

});

function getLang(langId) {
var lang = langs[langId.toLowerCase()];
if (!lang) {
lang = langs[langId.toLowerCase().substr(0, 2)];
}
return lang;
}

function getDefaultLang() {
var lang = getLang(window.navigator.language);
if (!lang) {
lang = getLang("en");
}
return lang;
}

function getLangs(langIds) {
var langs = [];
if (langIds) {
if (typeof langIds === 'string') {
langIds = langIds.split(",");
}
var foundIds = {};
langIds.forEach(function(id) {
var lang = getLang(id);
if (lang && !foundIds[lang.id]) {
foundIds[lang.id] = lang.id;
langs.push(lang);
}
});
}
return langs;
}

return {
getDefaultLang: getDefaultLang,
getLang: getLang,
getLangs: getLangs,
}
});

4 changes: 4 additions & 0 deletions server/common-cli-options.js
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,10 @@ exports.options = [
{ option: 'system-name', type: 'String', description: 'name used if multiple happyFunTimes servers are running on the same network. Default = computer name'},
{ option: 'ask-name', type: 'Boolean', description: 'ask for name on start, use --no-ask-name to set to false', default: "true"},
{ option: 'menu', type: 'Boolean', description: 'show menu icon on controller, use --no-menu to turn off', default: "true"},
{ option: 'instructions', type: 'Boolean', description: 'show a instructions at the top games on how to connect', default: "false"},
{ option: 'langs', type: 'String', description: 'languages to show separated by commas (eg --langs=en,ja,es). The first one will be used where only one language can be displayed', default: "false"},
{ option: 'wifi-name', type: 'String', description: 'name of wifi to display to users', default: "HappyFunTimes"},
{ option: 'wifi-pass', type: 'String', description: 'password of wifi to display to users'},
{ option: 'minify', type: 'Boolean', description: 'minify -minify.js files', default: false},
{ option: 'optimize-controller', type: 'Boolean', description: 'optimize controller.js', default: false},
{ option: 'kiosk', type: 'Boolean', description: 'skip the index', default: false},
Expand Down
4 changes: 4 additions & 0 deletions server/hft-server.js
Original file line number Diff line number Diff line change
Expand Up @@ -476,6 +476,10 @@ var HFTServer = function(options, startedCallback) {
hftSettings: 'window.hftSettings = ' + JSON.stringify({
menu: g.menu,
apiVersion: runtimeInfo.info.happyFunTimes.apiVersion,
instructions: g.instructions,
langs: g.langs,
wifiName: g.wifiName,
wifiPass: g.wifiPass,
}),
},
]);
Expand Down
8 changes: 7 additions & 1 deletion templates/0.x.x/game.gameview.html
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<!--
<!--
/*
* Copyright 2014, Gregg Tavares.
* All rights reserved.
Expand Down Expand Up @@ -43,10 +43,16 @@
<link href="%(urls.favicon)s" rel="shortcut icon" type="image/png">
<link rel="stylesheet" href="../../css/games.css">
<link rel="stylesheet" href="css/game.css">
<script>
%(hftSettings)s
</script>
%(pages.game.beforeScripts)s
</head>
<body>
%(content)s
<div id="hft-connect">
<div id="hft-ins"></div>
</div>
<div id="hft-debug">
<pre id="hft-status"></pre>
<div id="hft-console"></div>
Expand Down

0 comments on commit 002c94d

Please sign in to comment.