Luke Briggs

Updated localisation example to use the new JS engine; typo in upgrade UI

......@@ -63,7 +63,7 @@ namespace PowerUI{
Settings=new SettingTickbox[]{
new SettingTickbox("Hide the warning","ACCEPTED_DOM_NOTICE","I'm not upgrading or I've upgraded - hide the warning."),
new SettingTickbox("Show required changes","LEGACY_DOM_UPGRADE","Removes the new APIs such that code which requires upgrading will fail to compile. Convert to setAttribute and getAttribute."),
new SettingTickbox("Use the legacy mode","LEGACY_DOM","This will stop major javascript libraries jQuery from working properly but you won't have to upgrade anything."),
new SettingTickbox("Use the legacy mode","LEGACY_DOM","This will stop major javascript libraries like jQuery from working properly but you won't have to upgrade anything."),
};
}
......
<!-- Declare which languages this document supports. Note that it will inherit if you've got iframes which don't declare this. --><meta name='languages' content='en,fr,ar'/> <!-- Optionally declare src='..' on the above meta tag to change where your text actually comes from. (src='/Languages/' is the default). When you use a group, like &GroupName.VariableName;, it goes in a sub-folder. So for example you'll see &Example.LocalizationTitle; below. When set to English, it's coming from resources://Languages/Example/en.xml --> <!-- The PowerUI logo in the middle of the screen. --><div style='background:url(powerUI-logo.png) no-repeat;background-position:center;height:100%;position:fixed;'></div> <style type='text/css'> html{ background:url(noise-background.png);} .padded{ padding:20px;} body{ overflow-y:auto;} </style> <div style='padding:25px;'> <b> <u id='nitro_title'> &Example.LocalizationTitle; </u> </b> <br> <br> &Example.SelectLanguage; <span id='languageSelect'></span> <br> <br> &Example.LocalizationIntro; <br> <br> <br> &Example.SelectAUsername; <input type='text' value='Bob' onkeyup='changeUsername'/> &Example.SelectGender; <select onchange='changeGender'> <option value=''>&Example.Either;</option> <option value='boy'>&Example.Boy;</option> <option value='girl'>&Example.Girl;</option> </select> <br> <br> &Example.AWonderfulStory;</div> <script type='text/nitro'> /* --- This version of Nitro is now depreciated --- Use C# instead, or request the new JavaScript engine. */ function changeUsername(){ // e:UIEvent is optional in here // Grab the username: var username=this.value; // We don't want the player to write HTML, so let's escape it (this bit's of course optional): username=escapeHTML(username); // Write to our username variable: UI.Variables["Username"]=username; } function changeGender(){ // Note that gender is of course optional! UI.Gender=this.value; } function changeLanguage(){ // Value is the language code, so all we need to do is this: UI.Language=this.value; } // Set the starting language: // UI.Language="fr"; // Set the default username variable: UI.Variables["Username"]="Bob"; // Build a language dropdown with all available languages. // This is more advanced and is of course optional. var dropdown="<select onchange='changeLanguage'>"; // Get all languages: var allLanguages=document.languages.all; // For each one.. for(var i=0;i<allLanguages.Length;i++){ // Grab the language: var lang=allLanguages[i]; // Add to our current dropdown text: dropdown+="<option value='"+lang.Code+"'"; // Is this the current language? if(lang.Code==UI.Language){ // current language - make it selected by default on the dropdown. dropdown+=" selected"; } // Add the name and the rest of the option: dropdown+=">"+lang.Name+"</option>"; } // All done! dropdown+="</select>"; // Write it to the UI: ((document.getElementById("languageSelect")):HtmlElement).innerHTML=dropdown; </script>
\ No newline at end of file
<!-- Declare which languages this document supports. Note that it will inherit if you've got iframes which don't declare this. --><meta name='languages' content='en,fr,ar'/> <!-- Optionally declare src='..' on the above meta tag to change where your text actually comes from. (src='/Languages/' is the default). When you use a group, like &GroupName.VariableName;, it goes in a sub-folder. So for example you'll see &Example.LocalizationTitle; below. When set to English, it's coming from resources://Languages/Example/en.xml --> <!-- The PowerUI logo in the middle of the screen. --><div style='background:url(powerUI-logo.png) no-repeat;background-position:center;height:100%;position:fixed;'></div> <style type='text/css'> html{ background:url(noise-background.png);} .padded{ padding:20px;} body{ overflow-y:auto;} </style> <div style='padding:25px;'> <b> <u id='nitro_title'> &Example.LocalizationTitle; </u> </b> <br> <br> &Example.SelectLanguage; <span id='languageSelect'></span> <br> <br> &Example.LocalizationIntro; <br> <br> <br> &Example.SelectAUsername; <input type='text' value='Bob' onkeyup='changeUsername(event)'/> &Example.SelectGender; <select onchange='changeGender(event)'> <option value=''>&Example.Either;</option> <option value='boy'>&Example.Boy;</option> <option value='girl'>&Example.Girl;</option> </select> <br> <br> &Example.AWonderfulStory;</div> <script type='text/javascript'> /* Javascript is totally optional - everything it can do, C# can do too (see also UI.document, a static reference) */ // Get a reference to the UI class ('PowerUI' is a global reference to the PowerUI namespace): var UI = PowerUI.UI; function changeUsername(e){ // Grab the username: var username=e.target.value; // We don't want the player to write HTML, so let's escape it (this bit's of course optional): username=escapeHTML(username); // Write to our username variable: UI.Variables["Username"]=username; } function changeGender(e){ // Note that gender is of course optional! UI.Gender=e.target.value; } function changeLanguage(e){ // Value is the language code, so all we need to do is this: UI.Language=e.target.value; } // Set the starting language: // UI.Language="fr"; // Set the default username variable: UI.Variables["Username"]="Bob"; // Build a language dropdown with all available languages. // This is more advanced and is of course optional. var dropdown="<select onchange='changeLanguage(event)'>"; // Get all languages: var allLanguages=document.languages.all; // For each one.. for(var i=0;i<allLanguages.length;i++){ // Grab the language: var lang=allLanguages[i]; // Add to our current dropdown text: dropdown+="<option value='"+lang.Code+"'"; // Is this the current language? if(lang.Code==UI.Language){ // current language - make it selected by default on the dropdown. dropdown+=" selected"; } // Add the name and the rest of the option: dropdown+=">"+lang.Name+"</option>"; } // All done! dropdown+="</select>"; // Write it to the UI: document.getElementById("languageSelect").innerHTML=dropdown; </script>
\ No newline at end of file
......
......@@ -42,21 +42,27 @@ namespace PowerUI{
.SetValue("Promise", TypeReference.CreateTypeReference(Engine, typeof(PowerUI.Promise)))
.SetValue("XMLHttpRequest", TypeReference.CreateTypeReference(Engine, typeof(PowerUI.XMLHttpRequest)))
.SetValue("Module", TypeReference.CreateTypeReference(Engine, typeof(WebAssembly.Module)))
.SetValue("console", new JavaScript.console());
.SetValue("console", new JavaScript.console())
.SetValue("PowerUI", new NamespaceReference(Engine, "PowerUI"));
var coreWindow = (window as PowerUI.Window);
if(coreWindow!=null){
Engine.SetValue("location", coreWindow.location)
.SetValue("innerWidth", coreWindow.innerWidth)
.SetValue("innerHeight", coreWindow.innerHeight)
.SetValue("atob", new Func<string, string>((string obj) => { return coreWindow.atob(obj); }))
.SetValue("btoa", new Func<string, string>((string obj) => { return coreWindow.btoa(obj); }))
.SetValue("addEventListener", new Action<string, object>((string evt, object method) => coreWindow.addEventListener(evt, method)))
.SetValue("removeEventListener", new Action<string, object>((string evt, object method) => coreWindow.removeEventListener(evt, method)))
.SetValue("dispatchEvent", new Action<UIEvent>((UIEvent e) => coreWindow.dispatchEvent(e)))
.SetValue("dispatchEvent", new Func<UIEvent, bool>((UIEvent e) => {return coreWindow.dispatchEvent(e);}))
.SetValue("clearInterval", new Action<UITimer>((UITimer obj) => coreWindow.clearInterval(obj)))
.SetValue("alert", new Action<object>((object obj) => coreWindow.alert(obj)))
.SetValue("prompt", new Action<object>((object obj) => coreWindow.prompt(obj)))
.SetValue("confirm", new Action<object>((object obj) => coreWindow.confirm(obj)))
.SetValue("setInterval", new DelegateWrapper(Engine, new Action<object, object>((object method, object time) => coreWindow.setInterval(method, time))))
.SetValue("setTimeout", new DelegateWrapper(Engine, new Action<object, object>((object method, object time) => coreWindow.setTimeout(method, time))));
.SetValue("prompt", new Func<object, string>((object obj) => {return coreWindow.prompt(obj);}))
.SetValue("confirm", new Func<object, bool>((object obj) => {return coreWindow.confirm(obj);}))
.SetValue("escapeHTML", new Func<string, string>((string obj) => {return coreWindow.escapeHTML(obj);}))
.SetValue("setInterval", new DelegateWrapper(Engine, new Func<object, object, UITimer>((object method, object time) => {return coreWindow.setInterval(method, time);})))
.SetValue("setTimeout", new DelegateWrapper(Engine, new Func<object, object, UITimer>((object method, object time) => {return coreWindow.setTimeout(method, time);})));
}
Document=doc;
......