需要Javascript对话框脚本反馈

我在写很多典型的角色扮演游戏中看到的Javascript对话框脚本。 alt text http://www.dailynintendo.com/wp-content/uploads/2008/12/luminous-arc-2-dialogue.jpg 需要Javascript对话框脚本反馈

目前我得到一个文本字符串数组，你可以跳过槽。我得到了可以做出决定的点，并根据输入显示了不同的字符串。

但是我不认为这是正确的做法。这些都为脚本的要求：

支持多种脚本对话框
多个字符
用户输入的决定（“你喜欢我吗？”是的否）

这是我的代码的时刻：

// Intro script 
var script_intro = []; 
script_intro[0] = 'Hello how are you?'; 
script_intro[1] = 'So I heard..'; 
script_intro[2] = 'This is a cool game!'; 

script_intro[3] = []; 
script_intro[3][0] = 'Do you like me?'; 
script_intro[3][1] = []; 
script_intro[3][1][0] = 'Jah'; 
script_intro[3][1][1] = 4; 
script_intro[3][2] = []; 
script_intro[3][2][0] = 'Nah'; 
script_intro[3][2][1] = 5; 

// Intro script: variation I 
var script_intro_1 = []; 
script_intro_1[0] = 'I love you too!'; 

// Intro script: variation II 
var script_intro_2 = []; 
script_intro_2[0] = 'Damn you...'; 

function initDialog() 
{ 
    // This is where the text will be shown 
    var dialog = document.getElementById('dialog'); 
    var content = document.getElementById('content'); 

    var nextButton = document.getElementById('nextButton'); 
    var optionButton_1 = document.getElementById('optionButton_1'); 
    var optionButton_2 = document.getElementById('optionButton_2'); 

    // How fast the characters will appear after each other (milliseconds) 
    var scrollSpeed = 50; 
} 

// Scroll text per line, character 
function scrollText(script, line) 
{ 
    var char = 0; 

    // If this line contains a question that requires user input 
    if(typeof(script[line]) == 'object') 
    { 
     var textScroller = setInterval(
      function() 
      { 
       // Add the string char for char 
       content.innerHTML += script[line][0][char]; 
       char ++; 

       if(char >= script[line][0].length) 
       { 
        clearInterval(textScroller); 

        // Show options 
        options(script, line); 
       } 
      }, scrollSpeed); 
    } 
    else 
    { 
     var textScroller = setInterval(
      function() 
      { 
       content.innerHTML += script[line][char]; 
       char++; 

       if(char >= script[line].length) 
       { 
        clearInterval(textScroller); 

        // Show next line 
        next(script, line); 
       }; 
      }, scrollSpeed); 
    } 
} 

function next(script, line) 
{ 
    line = line + 1; 

    // Last line has been shown 
    if(script[line] == undefined) 
    { 
     //alert('End of dialog'); 
    } 
    else 
    { 
     nextButton.style.visibility = 'visible'; 

     nextButton.onclick = function() 
     { 
      nextButton.style.visibility = 'hidden'; 
      content.innerHTML = ''; 

      scrollText(script, line); 
     } 
    } 
} 

function options(script, line) 
{ 
    optionButton_1.innerHTML = script[line][1][0]; 
    optionButton_2.innerHTML = script[line][2][0]; 
    optionButton_1.style.visibility = 'visible'; 
    optionButton_2.style.visibility = 'visible'; 

    optionButton_1.onclick = function() 
    { 
     optionButton_1.style.visibility = 'hidden'; 
     optionButton_2.style.visibility = 'hidden'; 
     content.innerHTML = ''; 

     scrollText('script_intro_1', 0); 
    } 

    optionButton_2.onclick = function() 
    { 
     optionButton_1.style.visibility = 'hidden'; 
     optionButton_2.style.visibility = 'hidden'; 
     content.innerHTML = ''; 

     scrollText('script_intro_2', 0); 
    } 
}

HTML

<body onload="scrollText(script_intro, 0)"> 
    <h1>rpg</h1> 
    <a id="reset" href="#">Reset</a> 
    <div id="device"> 
     <div id="dialog"> 
      <strong>NPC:</strong> 
      <div id="content"></div> 
      <a id="nextButton" href="#">Next</a> 
      <a id="optionButton_1" href="#"></a> 
      <a id="optionButton_2" href="#"></a> 
     </div> 
    </div> 
</body>

我真的可以使用一些反馈。用上述要求编写这样的脚本的最好方法是什么？对于对话框脚本，使用JSON还是XML比Array更好？我特别需要关于如何在脚本中实现多项选择的一些提示。

谢谢！

来源

2009-11-22 richard

如果这是一个有脚本流的脚本，我会使用状态机模式。

http://www.eventhelix.com/RealtimeMantra/HierarchicalStateMachine.htm

有吨的链接，我只抢到第一，我从谷歌搜索。我要做的是为用户提供选项的每种情况设置一个状态。每个选项都会转换到另一个状态。因此，例如

function State(questionText){ 
    this.transitionsOut = []; 
    this.questionText = questionText; 
} 
State.prototype = { 
    transitionsOut:null, 
    questionText:null, 
} 

function Transition(startState, endState, optionText){ 
    startState.transitionsOut[startState.transitionsOut.length] = this; 
    this.start = startState; 
    this.end = endState; 
} 

Transition.prototype = { 
    start:null, 
    end:null, 
    optionText:null 
}

然后，你可以做什么，是让你的状态机，然后对当前状态，打印出你的状态消息，然后列出下面该州每个选项。

var startState = new State('Where do you want to go'); 
var north = new State('North'); 
var south = new State('South'); 
var transition1 = new Transition(startState,north,'Lets go north'); 
var transition2 = new Transition(startState,south,'Lets go south');

的代码然后显示的是在当前状态，并且选项是微不足道的，如从一个状态到另一个基于什么用户拾取的过渡。

来源

2009-11-22 18:43:28 Zoidberg

不错的选择。但是，您有一个错误：'start'未定义。我相信你的意思是'startState.transitionsOut.push（this）;' –

是的，让我解决它，谢谢。 – Zoidberg

感谢您的提示。我在IBM上找到了一篇不错的文章：ibm.com/developerworks/web/...。看起来所有新的和复杂的，但我会研究:)谢谢你的例子，也。欢迎提供更多提示。 – richard

需要Javascript对话框脚本反馈

回答

相关问题