text speed
This commit is contained in:
parent
b8bd9a1234
commit
49261be164
|
@ -53,6 +53,10 @@
|
||||||
<div></div>
|
<div></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="options">
|
||||||
|
<div id="text_speed_preview"></div>
|
||||||
|
<input id="text_speed_slider" type="range" min=0 value=2 max=4 step=1/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
@ -71,6 +75,7 @@
|
||||||
<script src="scripts/game/BG_Anxiety.js"></script>
|
<script src="scripts/game/BG_Anxiety.js"></script>
|
||||||
<script src="scripts/game/Character.js"></script>
|
<script src="scripts/game/Character.js"></script>
|
||||||
<script src="scripts/game/Sounds.js"></script>
|
<script src="scripts/game/Sounds.js"></script>
|
||||||
|
<script src="scripts/game/Options.js"></script>
|
||||||
|
|
||||||
<script src="scripts/intro/Intro_SceneSetup.js"></script>
|
<script src="scripts/intro/Intro_SceneSetup.js"></script>
|
||||||
<script src="scripts/intro/Intro_BG.js"></script>
|
<script src="scripts/intro/Intro_BG.js"></script>
|
||||||
|
|
|
@ -6,11 +6,11 @@
|
||||||
|
|
||||||
n: TOTAL FEARS USED
|
n: TOTAL FEARS USED
|
||||||
|
|
||||||
n: #harm# *BEING HARMED:* 3
|
n: #harm# *BEING HARMED:* {{Game.TEXT_SPEED}}
|
||||||
|
|
||||||
n: #alone# *BEING UNLOVED:* 1
|
n: #alone# *BEING UNLOVED:* {{2+2}}
|
||||||
|
|
||||||
n: #bad# *BEING A BAD PERSON:* 4
|
n: #bad# *BEING A BAD PERSON:* {{window.dick}}
|
||||||
|
|
||||||
(...4000)
|
(...4000)
|
||||||
|
|
||||||
|
|
|
@ -75,7 +75,7 @@ b: You should multi-task and study during meals!
|
||||||
|
|
||||||
`hong({eyes:"0_annoyed"})`
|
`hong({eyes:"0_annoyed"})`
|
||||||
|
|
||||||
h: Um, I'd rather not get crumbs on my textbook.
|
h: Um, I'd rather not get crumbs on my textboo--
|
||||||
|
|
||||||
```
|
```
|
||||||
bb({mouth:"normal", eyes:"fear"});
|
bb({mouth:"normal", eyes:"fear"});
|
||||||
|
|
|
@ -103,6 +103,9 @@ Game.update = function(){
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Options update
|
||||||
|
Options.update();
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// PAUSING THE GAME
|
// PAUSING THE GAME
|
||||||
|
@ -482,6 +485,9 @@ Game.executeText = function(line){
|
||||||
// Return promise
|
// Return promise
|
||||||
var nextLineDelay = Game.TEXT_SPEED*7; // don't override this
|
var nextLineDelay = Game.TEXT_SPEED*7; // don't override this
|
||||||
if(dialogue.slice(-1)=="-") nextLineDelay=0; // sudden interrupt!
|
if(dialogue.slice(-1)=="-") nextLineDelay=0; // sudden interrupt!
|
||||||
|
if(Game.TEXT_SPEED<10){ // IF IT'S CLICK-TO-ADVANCE, INFINITE TIMEOUT.
|
||||||
|
nextLineDelay = 1000*1000; // one thousand seconds
|
||||||
|
}
|
||||||
Game.setTimeout(function(){
|
Game.setTimeout(function(){
|
||||||
Game.WHO_IS_SPEAKING = null; // DONE WITH IT.
|
Game.WHO_IS_SPEAKING = null; // DONE WITH IT.
|
||||||
resolve();
|
resolve();
|
||||||
|
@ -596,6 +602,11 @@ Game.executeWait = function(line){
|
||||||
|
|
||||||
// Get integer from (...NN)
|
// Get integer from (...NN)
|
||||||
var waitTime = parseInt(line.match(/^\(\.\.\.(\d+)\)/)[1].trim());
|
var waitTime = parseInt(line.match(/^\(\.\.\.(\d+)\)/)[1].trim());
|
||||||
|
|
||||||
|
// Unless it's click to advance, then IGNORE ALL WAITS
|
||||||
|
if(Game.TEXT_SPEED<10){
|
||||||
|
waitTime = 0; // TODO: Tag anim-waits, do not ignore.
|
||||||
|
}
|
||||||
|
|
||||||
// Delayed promise
|
// Delayed promise
|
||||||
return new RSVP.Promise(function(resolve){
|
return new RSVP.Promise(function(resolve){
|
||||||
|
@ -642,12 +653,12 @@ Game.parseLine = function(line){
|
||||||
|
|
||||||
// Get the IFs, if any
|
// Get the IFs, if any
|
||||||
var lookForIfs = true;
|
var lookForIfs = true;
|
||||||
|
var regex = /\{\{if[^\/]*\/if\}\}/ig;
|
||||||
while(lookForIfs){
|
while(lookForIfs){
|
||||||
|
|
||||||
lookForIfs = false;
|
lookForIfs = false;
|
||||||
|
|
||||||
// Look for an IF!
|
// Look for an IF!
|
||||||
var regex = /\{\{if[^\/]*\/if\}\}/ig;
|
|
||||||
var regexResult = regex.exec(line);
|
var regexResult = regex.exec(line);
|
||||||
if(regexResult){
|
if(regexResult){
|
||||||
|
|
||||||
|
@ -681,6 +692,43 @@ Game.parseLine = function(line){
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Evaluate {{expressions}}, if any
|
||||||
|
var lookForExpressions = true;
|
||||||
|
var regex = /\{\{[^\}]*\}\}/ig;
|
||||||
|
while(lookForExpressions){
|
||||||
|
|
||||||
|
lookForExpressions = false;
|
||||||
|
|
||||||
|
// Look for an IF!
|
||||||
|
var regexResult = regex.exec(line);
|
||||||
|
if(regexResult){
|
||||||
|
|
||||||
|
// The result...
|
||||||
|
var fullExpression = regexResult[0];
|
||||||
|
var startsAtIndex = regexResult.index;
|
||||||
|
var endsAtIndex = startsAtIndex + fullExpression.length;
|
||||||
|
|
||||||
|
// Extract the expression
|
||||||
|
var expression = fullExpression.match(/\{\{([^\}]*)\}\}/)[1];
|
||||||
|
|
||||||
|
// Eval condition!
|
||||||
|
var evaluated = "";
|
||||||
|
try{
|
||||||
|
evaluated = eval(expression);
|
||||||
|
}catch(e){
|
||||||
|
console.log(e);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Edit the line
|
||||||
|
line = line.slice(0,startsAtIndex) + evaluated + line.slice(endsAtIndex);
|
||||||
|
|
||||||
|
// Keep searching...
|
||||||
|
lookForExpressions = true;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
// Return line!
|
// Return line!
|
||||||
return line;
|
return line;
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,99 @@
|
||||||
|
window.Options = {};
|
||||||
|
|
||||||
|
(function(){
|
||||||
|
|
||||||
|
var text_speed_slider = $("#text_speed_slider");
|
||||||
|
var text_speed_preview = $("#text_speed_preview");
|
||||||
|
|
||||||
|
var SPEED_TEXTS = [
|
||||||
|
"Show text slowlyyyyy",
|
||||||
|
"Show text at a relaxed speed",
|
||||||
|
"Show text at the default speed",
|
||||||
|
"Show text at a brisk speed",
|
||||||
|
"Show text NOW! (& click-to-advance)"
|
||||||
|
];
|
||||||
|
var SPEEDS = [
|
||||||
|
120,
|
||||||
|
80,
|
||||||
|
60,
|
||||||
|
40,
|
||||||
|
0
|
||||||
|
];
|
||||||
|
text_speed_slider.oninput = function(){
|
||||||
|
updateText();
|
||||||
|
};
|
||||||
|
|
||||||
|
///////////////////////////////////
|
||||||
|
// For previewing the text speed //
|
||||||
|
///////////////////////////////////
|
||||||
|
|
||||||
|
Options.update = function(){
|
||||||
|
|
||||||
|
// Timeout callbacks...
|
||||||
|
for(var i=0; i<_timeoutCallbacks.length; i++){
|
||||||
|
var tc = _timeoutCallbacks[i];
|
||||||
|
tc.timeLeft -= 1000/60;
|
||||||
|
if(tc.timeLeft<=0){
|
||||||
|
tc.callback();
|
||||||
|
_timeoutCallbacks.splice(i,1); // delete that one
|
||||||
|
i -= 1; // set index back one
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
var _timeoutCallbacks = [];
|
||||||
|
var _setTimeout = function(callback, interval){
|
||||||
|
_timeoutCallbacks.push({
|
||||||
|
callback: callback,
|
||||||
|
timeLeft: interval
|
||||||
|
});
|
||||||
|
};
|
||||||
|
var _clearAllTimeouts = function(){
|
||||||
|
_timeoutCallbacks = [];
|
||||||
|
};
|
||||||
|
|
||||||
|
var updateText = function(){
|
||||||
|
|
||||||
|
var i = parseInt(text_speed_slider.value);
|
||||||
|
var div = text_speed_preview;
|
||||||
|
|
||||||
|
Game.TEXT_SPEED = SPEEDS[i];
|
||||||
|
|
||||||
|
// Clear previous crap
|
||||||
|
_clearAllTimeouts();
|
||||||
|
div.innerHTML = "";
|
||||||
|
|
||||||
|
// What's the dialogue?
|
||||||
|
var dialogue = SPEED_TEXTS[i];
|
||||||
|
|
||||||
|
// Put in the text
|
||||||
|
var span, chr;
|
||||||
|
for(var i=0; i<dialogue.length; i++){
|
||||||
|
span = document.createElement("span");
|
||||||
|
span.innerHTML = dialogue[i];
|
||||||
|
span.style.opacity = 0;
|
||||||
|
div.appendChild(span);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Then REVEAL letters one-by-one
|
||||||
|
var interval = 0;
|
||||||
|
for(var i=0; i<dialogue.length; i++){
|
||||||
|
|
||||||
|
var chr = dialogue[i];
|
||||||
|
|
||||||
|
(function(index, interval){
|
||||||
|
_setTimeout(function(){
|
||||||
|
div.children[index].style.opacity = 1;
|
||||||
|
}, interval);
|
||||||
|
})(i, interval);
|
||||||
|
|
||||||
|
// Bigger interval
|
||||||
|
interval += Game.TEXT_SPEED;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
updateText();
|
||||||
|
|
||||||
|
})();
|
|
@ -32,11 +32,11 @@ subscribe("START_GAME", function(){
|
||||||
$("#loading").style.display = "none";
|
$("#loading").style.display = "none";
|
||||||
Game.start();
|
Game.start();
|
||||||
|
|
||||||
/*SceneSetup.act1();
|
SceneSetup.act1();
|
||||||
music('battle', {volume:0.5});
|
music('battle', {volume:0.5});
|
||||||
hong({body:"phone1"});
|
hong({body:"phone1"});
|
||||||
Game.goto("act1i");*/
|
Game.goto("act1h");
|
||||||
|
|
||||||
Game.goto("intro");
|
//Game.goto("intro");
|
||||||
|
|
||||||
});
|
});
|
|
@ -119,6 +119,90 @@ body{
|
||||||
margin: 5px auto 15px auto;
|
margin: 5px auto 15px auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#options{
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0px;
|
||||||
|
}
|
||||||
|
#text_speed_preview{
|
||||||
|
color:#fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
Slider CSS by Noah Blon
|
||||||
|
https://codepen.io/noahblon/pen/OyajvN
|
||||||
|
*/
|
||||||
|
input[type="range"]{
|
||||||
|
margin: auto;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
/*height: 40px;
|
||||||
|
width: 200px;*/
|
||||||
|
cursor: pointer;
|
||||||
|
border-radius: 0; /* iOS */
|
||||||
|
|
||||||
|
width: 300px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
::-webkit-slider-runnable-track{
|
||||||
|
background: #ddd;
|
||||||
|
}
|
||||||
|
::-webkit-slider-thumb {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
width: 30px; /* 1 */
|
||||||
|
height: 30px;
|
||||||
|
background: #fff;
|
||||||
|
box-shadow: -100vw 0 0 100vw #ff4040;
|
||||||
|
border: 2px solid #999; /* 1 */
|
||||||
|
}
|
||||||
|
::-moz-range-track {
|
||||||
|
height: 30px;
|
||||||
|
background: #ddd;
|
||||||
|
}
|
||||||
|
::-moz-range-thumb {
|
||||||
|
background: #fff;
|
||||||
|
height: 30px;
|
||||||
|
width: 30px;
|
||||||
|
border: 3px solid #999;
|
||||||
|
border-radius: 0 !important;
|
||||||
|
box-shadow: -100vw 0 0 100vw #ff4040;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
::-ms-fill-lower {
|
||||||
|
background: #ff4040;
|
||||||
|
}
|
||||||
|
::-ms-thumb {
|
||||||
|
background: #fff;
|
||||||
|
border: 2px solid #999;
|
||||||
|
height: 30px;
|
||||||
|
width: 30px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
::-ms-ticks-after {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
::-ms-ticks-before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
::-ms-track {
|
||||||
|
background: #ddd;
|
||||||
|
color: transparent;
|
||||||
|
height: 30px;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
::-ms-tooltip {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/***************************************************
|
||||||
|
|
||||||
|
DIALOGUEZ
|
||||||
|
|
||||||
|
***************************************************/
|
||||||
|
|
||||||
|
|
||||||
.clear-both{
|
.clear-both{
|
||||||
clear:both;
|
clear:both;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue