<%@ Page Language="C#" EnableViewState="false" %> <%@ Import Namespace="System.IO" %> <% // BiblePage.aspx // Sample showing the integration of AJAX Actions and the Select Control. // Copyright (c) by Matthias Hertel, http://www.mathertel.de // This work is licensed under a BSD style license. See http://www.mathertel.de/License.aspx // ----- // 21.08.2005 created by Matthias Hertel. // 25.12.2005 bible subdirectory added. %> <script runat="server"> string BibleList() { string[] files = System.IO.Directory.GetFiles(Server.MapPath("./bibles"), "*.xml"); StringBuilder ret = new StringBuilder(); foreach (string f in files) { FileInfo fi = new FileInfo(f); if (ret.Length > 0) ret.Append(';'); ret.AppendFormat("{0}:{0}", fi.Name.Remove(fi.Name.Length - 4)); } return (ret.ToString()); } </script> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <title>A Bible reader application using AJAX</title> <link href="../mathertel.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="../ajaxcore/ajax.js"></script> <script type="text/javascript" src="../ajaxcore/GetJavaScriptProxy.aspx?service=../S03_AJAXControls/BibleData.asmx"></script> <style type="text/css"> .CE { margin-top: 4px; width: 600px; background-color: #cccccc; padding: 4px; } </style> </head> <body> <mh:Title ID="Title" runat="server" /><a style="position: absolute; right: 10px; top: 10px" href="../ViewSrc.aspx"> View Source</a> <p><a href="http://www.mathertel.de/">mathertel</a> -> <a href="http://www.mathertel.de/AJAXEngine/">AJAXEngine</a> -> <a href="Default.aspx">AJAX Web Controls</a> -> Bible Reader</p> <ajax:PersistHistory ID="PersistHistory1" runat="server" eventnames="version;book;chapter" stateeventnames="version;book;chapter" /> <hr /> <div style="width: 160px; height: 460px; float: right"> <h3>testing hyperninks:</h3> <a href="#chapter=3&vers=16">3-16</a> <a href="#chapter=5&vers=10">5-10</a> <a href="#chapter=6&vers=12">6-12</a> </div> <div class="CE" eventnamespace="jcl"> <table> <thead> <tr> <th>1. Select a version:</th> <th>2. Select a book:</th> <th>3. Select a chapter:</th> <th>4. Select a vers:</th> </tr> </thead> <tbody> <tr> <td> <ajax:Select ID="VersionSelect" runat="server" eventname="version" style="width: 140px"> </ajax:Select> </td> <td> <ajax:Select ID="BookSelect" runat="server" eventname="book" style="width: 140px"> </ajax:Select> <script type="text/javascript"> var cascadebook = { _handleEvent: function(name, data) { ajax.Start(this._action, this); }, // _handleEvent _action: { delay: 10, prepare: function(obj) {return (window.state.version);}, call: proxies.BibleData.ListBooks, finish: function (value, obj) {document.getElementById("BookSelect").CreateOptions(value, window.state.book);}, onException: proxies.alertException } // _action } OpenAjax.hub.subscribe("jcl.version", cascadebook._handleEvent, cascadebook); </script> </td> <td> <ajax:Select ID="ChapterSelect" runat="server" eventname="chapter" style="width: 120px"> </ajax:Select> <script defer="defer" type="text/javascript"> var cascadechapter = { _handleEvent: function(name, data) { ajax.Start(this._action, this); }, // _handleEvent _action: { delay: 10, prepare: function(obj) {return (window.state.version + ";" + window.state.book);}, call: proxies.BibleData.ListChapters, finish: function (value, obj) {document.getElementById("ChapterSelect").CreateOptions(value, window.state.chapter);}, onException: proxies.alertException } // _action } OpenAjax.hub.subscribe("jcl.version", cascadechapter._handleEvent, cascadechapter); OpenAjax.hub.subscribe("jcl.book", cascadechapter._handleEvent, cascadechapter); </script> </td> <td> <ajax:Select ID="VersSelect" runat="server" eventname="vers" style="width: 120px" value="1"> </ajax:Select> <script defer="defer" type="text/javascript"> var cascadevers = { _handleEvent: function(name, data) { ajax.Start(this._action, this); }, // _handleEvent _action: { delay: 10, prepare: function(obj) {return (window.state.version + ";" + window.state.book + ";" + window.state.chapter);}, call: proxies.BibleData.ListVerses, finish: function (value, obj) {document.getElementById("VersSelect").CreateOptions(value, window.state.vers);}, onException: proxies.alertException } // _action } OpenAjax.hub.subscribe("jcl.version", cascadevers._handleEvent, cascadevers); OpenAjax.hub.subscribe("jcl.book", cascadevers._handleEvent, cascadevers); OpenAjax.hub.subscribe("jcl.chapter", cascadevers._handleEvent, cascadevers); </script> </td> </tr> </tbody> </table> </div> <div class="CE"> <div id="PrologText" style="border: solid 1px #203050; padding: 2px; height: 60px; overflow-y: auto;"> </div> </div> <div class="CE"> <div id="VersText" style="border: solid 1px #203050; padding: 2px; height: 160px; direction: rtl"> </div> </div> <div class="CE" style="text-align: right"> <button onclick="PrevVerse()"><< Prev</button> <button onclick="NextVerse()">Next >></button> </div> <ajax:OpenAjaxEventLog runat="server" /> <script defer="defer" type="text/javascript"> var cascadetexts = { _handleEvent: function(name, data) { var en = jcl.LocalEventName(name); if (en == "version" || en == "book") ajax.Start(this._actionprolog, this); ajax.Start(this._actiontext, this); }, // _handleEvent _actionprolog: { delay: 10, prepare: function(obj) {return (window.state.version + ";" + window.state.book);}, call: proxies.BibleData.GetProlog, finish: function (value, obj) {document.getElementById("PrologText").innerHTML = value;}, onException: proxies.alertException }, // _actionprolog _actiontext: { delay: 10, prepare: function(obj) {return (window.state.version + ";" + window.state.book + ";" + window.state.chapter + ";" + window.state.vers);}, call: proxies.BibleData.GetVers, finish: function (value, obj) { var field = document.getElementById("VersText"); field.style.direction = ((window.state.version == "biblehebr") ? "rtl" : "ltr"); document.getElementById("VersText").innerHTML = value;}, onException: proxies.alertException } // _actionprolog } OpenAjax.hub.subscribe("jcl.version", cascadetexts._handleEvent, cascadetexts); OpenAjax.hub.subscribe("jcl.book", cascadetexts._handleEvent, cascadetexts); OpenAjax.hub.subscribe("jcl.chapter", cascadetexts._handleEvent, cascadetexts); OpenAjax.hub.subscribe("jcl.vers", cascadetexts._handleEvent, cascadetexts); // Set the values of the select boxes to the next verse. function NextVerse() { vsel = document.getElementById("VersSelect"); csel = document.getElementById("ChapterSelect"); bsel = document.getElementById("BookSelect"); if (vsel.selectedIndex < vsel.options.length-1) { vsel.selectedIndex += 1; OpenAjax.hub.publish("jcl.vers", vsel.value); } else if (csel.selectedIndex < csel.options.length-1) { csel.selectedIndex += 1; vsel.selectedIndex = 0; OpenAjax.hub.publish("jcl.chapter", csel.value); } else if (bsel.selectedIndex < bsel.options.length-1) { bsel.selectedIndex += 1; csel.selectedIndex = 0; vsel.selectedIndex = 0; OpenAjax.hub.publish("jcl.book", bsel.value); } // if } // NextVerse // Set the values of the select boxes to the previous verse. function PrevVerse() { vsel = document.getElementById("VersSelect"); csel = document.getElementById("ChapterSelect"); bsel = document.getElementById("BookSelect"); if (vsel.selectedIndex > 0) { vsel.selectedIndex -= 1; OpenAjax.hub.publish("jcl.vers", vsel.value); } else if (csel.selectedIndex > 0) { csel.selectedIndex -= 1; vsel.selLast = true; OpenAjax.hub.publish("jcl.chapter", csel.value); } else if (bsel.selectedIndex > 0) { bsel.selectedIndex -= 1; csel.selLast = true; vsel.selLast = true; OpenAjax.hub.publish("jcl.book", bsel.value); } // if } // PrevVerse // save all event values window.state = { _handleEvent : function(eventName, eventData) { var en = jcl.LocalEventName(eventName); this[en] = eventData; // inspectObj(this); } } // window.state OpenAjax.hub.subscribe("jcl.*", window.state._handleEvent, window.state); var obj = document.getElementById("PersistHistory1"); // set default values; obj.setDefaultValue("jcl.version", "luther1912"); obj.setDefaultValue("jcl.book", "1"); obj.setDefaultValue("jcl.chapter", "1"); obj.setDefaultValue("jcl.vers", "1"); // initial load the list of available versions. var obj = document.getElementById("VersionSelect"); obj.CreateOptions("<%=BibleList() %>", window.state.version); </script> <hr /> <p>This application can use any bible or even the koran that is formatted using the Zefania XML Bible Markup Language.</p> <p>Various bible packages using this XML format can be found at: <a href="http://sourceforge.net/projects/zefania-sharp/"> http://sourceforge.net/projects/zefania-sharp/</a> </p> <p>The texts for this demo page are not deployed within the AJAX.zip files to avoid binding my software to GNU license.</p> <p>In this case it would not be possible to use this software in commercial applications without again putting this software under the GNU license. I want to share my ideas and source code with everyone and without the restrictions of the GNU license.</p> <mh:Footer ID="foot" runat="server" /> </body> </html>
This page is part of the http://www.mathertel.de/AJAXEngine/default.aspx project. For updates and discussions see The AJAX Engine blog.
For updates and discussions see http://ajaxaspects.blogspot.com/.