299 lines
7.5 KiB
JavaScript
299 lines
7.5 KiB
JavaScript
|
||
|
||
function MapCharacterTable(characterUse) {
|
||
var characterArray = characterUse.textContent.split('\n');
|
||
var table = this.table = {};
|
||
for (var i=0, l=characterArray.length; i<l; i++) {
|
||
if (characterArray[i]) {
|
||
table[characterArray[i].substr(1)] = characterArray[i].charAt(0);
|
||
}
|
||
}
|
||
}
|
||
|
||
MapCharacterTable.prototype = {
|
||
constructor: MapCharacterTable,
|
||
findAlphabet: function (character) {
|
||
var table = this.table
|
||
for (var i in table) if (table[i] === character) return i;
|
||
return undefined;
|
||
},
|
||
getCharacterAndAlphabet: function (oldAlphabet) {
|
||
var table = this.table;
|
||
table[oldAlphabet] = undefined;
|
||
for (var i in table) {
|
||
if (typeof(table[i]) == 'string' && table[i].length == 1) {
|
||
return [table[i], i];
|
||
}
|
||
}
|
||
return false;
|
||
},
|
||
findCharacter: function (alphabet) {
|
||
return this.table[alphabet]
|
||
},
|
||
};
|
||
|
||
var alphabetTable = { a:'日', b:'月', c:'金', d:'木', e:'水', f:'火', g:'土', h:'竹', i:'戈', j:'十', k:'大', l:'中', m:'一', n:'弓', o:'人', p:'心', q:'手', r:'口', s:'尸', t:'廿', u:'山', v:'女', w:'田', x:'難', y:'卜', z:'重' };
|
||
|
||
var tabler = {
|
||
getCurrentId: function () {
|
||
var hash = window.location.hash.substr(1);
|
||
var id = Number(hash);
|
||
if (0 <= id && id < 32) return id;
|
||
else return 0;
|
||
},
|
||
setTable: function () {
|
||
document.getElementById('characterUse').textContent =
|
||
document.getElementById(this.getCurrentId())
|
||
.textContent.replace(/[a-z]*\n/g,' ');
|
||
},
|
||
};
|
||
|
||
var characterTable;
|
||
|
||
var respondWindow = {
|
||
node: document.getElementById('respond'),
|
||
say: function (sentence, type) {
|
||
if ( /^[ \t\n]*$/.test(sentence) ) return false;
|
||
|
||
var paragraph = document.createElement('p');
|
||
paragraph.textContent = sentence ;
|
||
paragraph.className = type || '';
|
||
|
||
this.node.appendChild(paragraph);
|
||
this.node.scrollTop += 150;
|
||
|
||
return true;
|
||
},
|
||
show: function (node) {
|
||
if (node && this.node.appendChild(node)) {
|
||
this.node.scrollTop += 150;
|
||
return true;
|
||
}
|
||
|
||
return false;
|
||
}
|
||
};
|
||
|
||
|
||
var visualBar = {node: document.getElementById('visual')};
|
||
var inputBar = document.getElementById('input');
|
||
var questCharacter = {node: document.getElementById('quest')};
|
||
var hintBar = {node: document.getElementById('hint')};
|
||
|
||
hintBar.newHintState = function() {
|
||
var answerAlphabetLength = questCharacter.node.title.length;
|
||
var hintState = [];
|
||
for (var i=0, l=answerAlphabetLength; i<l; i++) hintState.push('＊');
|
||
this.node.textContent = hintState.join(' ');
|
||
};
|
||
|
||
hintBar.hintCharacter = function(){
|
||
|
||
var answerAlphabet = questCharacter.node.title;
|
||
var hintState = this.node.textContent.split(' ');
|
||
|
||
if (hintState.indexOf('＊') == -1) return true;
|
||
|
||
var hideState = [];
|
||
for (var i=0; i<hintState.length; i++) {
|
||
if (hintState[i] == '＊') hideState.push(i);
|
||
}
|
||
var newIndex = hideState[Math.floor(Math.random() * hideState.length)];
|
||
|
||
hintState[newIndex] = alphabetTable[answerAlphabet.charAt(newIndex)];
|
||
|
||
this.node.textContent = hintState.join(' ');
|
||
return false
|
||
};
|
||
|
||
questCharacter.nextCharacter = function () {
|
||
var characterAndAlphabet =
|
||
characterTable.getCharacterAndAlphabet(this.node.title);
|
||
|
||
if (characterAndAlphabet) {
|
||
this.node.textContent = characterAndAlphabet[0];
|
||
this.node.title = characterAndAlphabet[1];
|
||
hintBar.newHintState();
|
||
}
|
||
else respondRobot.endStage();
|
||
|
||
};
|
||
|
||
visualBar.generateCharacter = function (allAlphabet) {
|
||
var allAlphabetArray = allAlphabet.split('');
|
||
var visualString = '';
|
||
|
||
for (var i=0, l=allAlphabetArray.length; i<l; i++) {
|
||
visualString += (
|
||
alphabetTable[ allAlphabetArray[i] ] ||
|
||
allAlphabetArray[i]
|
||
) + ' ';
|
||
}
|
||
|
||
this.node.textContent = visualString + '_' ;
|
||
};
|
||
|
||
visualBar.verifyCharacter = function () {
|
||
switch (this.node.textContent) {
|
||
case '_':
|
||
respondRobot.inputRespond(2);
|
||
return false;
|
||
break;
|
||
case questCharacter.node.textContent:
|
||
respondRobot.inputRespond(0);
|
||
return true;
|
||
break;
|
||
default:
|
||
respondRobot.inputRespond(1);
|
||
return false;
|
||
break;
|
||
}
|
||
};
|
||
|
||
var respondRobot = {
|
||
current: 0,
|
||
inputTimes: 0,
|
||
cumulateTimes: 0,
|
||
doCumulate: function () {
|
||
var current = this.current, cumulateTimes = this.cumulateTimes;
|
||
if (current == 0) {
|
||
if (cumulateTimes >= 0) this.cumulateTimes++;
|
||
else {
|
||
if (cumulateTimes <= -3) respondWindow.say("耶！對了！",'good');
|
||
else respondWindow.say("對。",'good');
|
||
this.cumulateTimes = 0;
|
||
}
|
||
}
|
||
else {
|
||
if (cumulateTimes <= 0) this.cumulateTimes--;
|
||
else {
|
||
if (cumulateTimes >= 5) respondWindow.say("啊，錯了？",'bad');
|
||
else respondWindow.say("錯了。",'bad');
|
||
this.cumulateTimes = 0;
|
||
}
|
||
}
|
||
},
|
||
chatBack: function () {
|
||
function chatBackLater(){
|
||
var respond = document.getElementById('chatBack').children[0]
|
||
respond.className = 'gm';
|
||
respondWindow.show(respond);
|
||
}
|
||
setTimeout(chatBackLater, 1000 + 2000*Math.random());
|
||
},
|
||
cumulateRespond: function () {
|
||
var sentence, point, cumulateTimes = this.cumulateTimes;
|
||
if(cumulateTimes > 0) {
|
||
sentence = '對！';
|
||
point = 'good';
|
||
} else if(cumulateTimes < 0){
|
||
sentence = '錯。';
|
||
point = 'bad';
|
||
}
|
||
|
||
switch(cumulateTimes){
|
||
case 3: sentence = '不錯喔！';
|
||
break;
|
||
case 5: sentence = '欸唷，這個屌！';
|
||
break;
|
||
case -2: sentence = '又錯了。';
|
||
break;
|
||
case -3: sentence = '還是錯……';
|
||
break;
|
||
}
|
||
if (Math.random() < 0.07) sentence = '幫我撐十秒！';
|
||
|
||
sentence && respondWindow.say(sentence,point);
|
||
},
|
||
hintRespond: function () {
|
||
if (this.inputTimes%7 == 6 && this.current == 0) {
|
||
function sayHint(){
|
||
var paragraph = document.getElementById('respondMaterial').children[0] ||
|
||
false;
|
||
paragraph.className = 'gm';
|
||
respondWindow.show(paragraph);
|
||
}
|
||
window.setTimeout(sayHint, 3 + Math.random()*3);
|
||
}
|
||
},
|
||
endStage: function () {
|
||
var currentStage = tabler.getCurrentId(), paragraph = [];
|
||
for (var i=0; i<3; i++) {
|
||
paragraph[i] = document.getElementById(
|
||
'nextStage'
|
||
).children[i].cloneNode(true);
|
||
|
||
paragraph[i].className = 'system';
|
||
}
|
||
|
||
var paragraphText = paragraph[1].textContent;
|
||
paragraphText = paragraphText.replace('tableId',currentStage);
|
||
paragraphText = paragraphText.replace('leftTable',31-currentStage);
|
||
paragraph[1].textContent = paragraphText;
|
||
|
||
var anchor = paragraph[2].children[0];
|
||
anchor.href = '#' + (currentStage + 1) ;
|
||
|
||
var anchorText = anchor.textContent;
|
||
anchorText = anchorText.replace('nextTableId',currentStage+1);
|
||
anchor.textContent = anchorText;
|
||
|
||
for (i=0; i<3; i++) respondWindow.show(paragraph[i]);
|
||
},
|
||
inputRespond: function (state) {
|
||
this.current = state;
|
||
this.inputTimes++;
|
||
this.hintRespond();
|
||
this.doCumulate();
|
||
this.cumulateRespond();
|
||
},
|
||
};
|
||
|
||
|
||
var fontPx = document.getElementById('fontPx').children[1];
|
||
|
||
fontPx.oninput = function () {
|
||
document.body.style.fontSize = this.value + 'pt';
|
||
}
|
||
|
||
|
||
inputBar.oninput = function(){
|
||
var allAlphabet = this.value;
|
||
if (allAlphabet.substr(-1) === '\n') {
|
||
if (respondWindow.say(allAlphabet)) respondRobot.chatBack();
|
||
this.value = '';
|
||
}
|
||
else if (allAlphabet.charAt(0) == ':') ;
|
||
else if (allAlphabet.substr(-1) === ' ') {
|
||
this.value = '';
|
||
visualBar.node.textContent = characterTable.findCharacter(
|
||
allAlphabet.substr(0, allAlphabet.length-1)
|
||
) || '_';
|
||
|
||
if (visualBar.verifyCharacter()) questCharacter.nextCharacter();
|
||
else hintBar.hintCharacter();
|
||
}
|
||
else visualBar.generateCharacter(allAlphabet);
|
||
|
||
};
|
||
|
||
|
||
function init() {
|
||
tabler.setTable();
|
||
characterTable = new MapCharacterTable(
|
||
document.getElementById( tabler.getCurrentId() )
|
||
);
|
||
|
||
if (!characterTable.findCharacter(questCharacter.node.title)) {
|
||
questCharacter.nextCharacter();
|
||
}
|
||
hintBar.newHintState();
|
||
inputBar.focus();
|
||
inputBar.select();
|
||
}
|
||
|
||
window.onhashchange = init;
|
||
|
||
document.body.onload = init;
|
||
|