mirror of
https://github.com/evennia/evennia.git
synced 2026-03-30 04:27:16 +02:00
Updated HTML docs.
This commit is contained in:
parent
c758f0d402
commit
57f411a6fa
95 changed files with 1370 additions and 2035 deletions
|
|
@ -17,8 +17,8 @@
|
|||
<link rel="shortcut icon" href="../_static/favicon.ico"/>
|
||||
<link rel="index" title="Index" href="../genindex.html" />
|
||||
<link rel="search" title="Search" href="../search.html" />
|
||||
<link rel="next" title="Bootstrap Components and Utilities" href="Bootstrap-Components-and-Utilities.html" />
|
||||
<link rel="prev" title="Webserver" href="Webserver.html" />
|
||||
<link rel="next" title="The Web Admin" href="Web-Admin.html" />
|
||||
<link rel="prev" title="Game website" href="Website.html" />
|
||||
</head><body>
|
||||
<div class="related" role="navigation" aria-label="related navigation">
|
||||
<h3>Navigation</h3>
|
||||
|
|
@ -30,10 +30,10 @@
|
|||
<a href="../py-modindex.html" title="Python Module Index"
|
||||
>modules</a> |</li>
|
||||
<li class="right" >
|
||||
<a href="Bootstrap-Components-and-Utilities.html" title="Bootstrap Components and Utilities"
|
||||
<a href="Web-Admin.html" title="The Web Admin"
|
||||
accesskey="N">next</a> |</li>
|
||||
<li class="right" >
|
||||
<a href="Webserver.html" title="Webserver"
|
||||
<a href="Website.html" title="Game website"
|
||||
accesskey="P">previous</a> |</li>
|
||||
<li class="nav-item nav-item-0"><a href="../index.html">Evennia 1.0-dev</a> »</li>
|
||||
<li class="nav-item nav-item-1"><a href="Components-Overview.html" accesskey="U">Core Components</a> »</li>
|
||||
|
|
@ -64,25 +64,27 @@
|
|||
<ul>
|
||||
<li><a class="reference internal" href="#">Web Client</a><ul>
|
||||
<li><a class="reference internal" href="#customizing-the-web-client">Customizing the web client</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a class="reference internal" href="#evennia-web-client-api-from-evennia-js">Evennia Web Client API (from evennia.js)</a></li>
|
||||
<li><a class="reference internal" href="#plugin-manager-api-from-webclient-gui-js">Plugin Manager API (from webclient_gui.js)</a></li>
|
||||
<li><a class="reference internal" href="#plugin-callbacks-api">Plugin callbacks API</a></li>
|
||||
<li><a class="reference internal" href="#example-default-plugins-plugins-js">Example/Default Plugins (plugins/*.js)</a></li>
|
||||
<li><a class="reference internal" href="#a-side-note-on-html-messages-vrs-text2html-messages">A side note on html messages vrs text2html messages</a></li>
|
||||
<li><a class="reference internal" href="#plugin-callbacks-api">Plugin callbacks API</a><ul>
|
||||
<li><a class="reference internal" href="#example-default-plugins-plugins-js">Example/Default Plugins (<code class="docutils literal notranslate"><span class="pre">plugins/*.js</span></code>)</a></li>
|
||||
<li><a class="reference internal" href="#a-side-note-on-html-messages-vs-text2html-messages">A side note on html messages vs text2html messages</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a class="reference internal" href="#writing-your-own-plugins">Writing your own Plugins</a><ul>
|
||||
<li><a class="reference internal" href="#goldenlayout">GoldenLayout</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h4>Previous topic</h4>
|
||||
<p class="topless"><a href="Webserver.html"
|
||||
title="previous chapter">Webserver</a></p>
|
||||
<p class="topless"><a href="Website.html"
|
||||
title="previous chapter">Game website</a></p>
|
||||
<h4>Next topic</h4>
|
||||
<p class="topless"><a href="Bootstrap-Components-and-Utilities.html"
|
||||
title="next chapter">Bootstrap Components and Utilities</a></p>
|
||||
<p class="topless"><a href="Web-Admin.html"
|
||||
title="next chapter">The Web Admin</a></p>
|
||||
<div role="note" aria-label="source link">
|
||||
<!--h3>This Page</h3-->
|
||||
<ul class="this-page-menu">
|
||||
|
|
@ -149,9 +151,8 @@ your browser cache, and see if your edit shows up.</strong></p>
|
|||
<code class="docutils literal notranslate"><span class="pre">evennia/web/templates/webclient/base.html</span></code> to
|
||||
<code class="docutils literal notranslate"><span class="pre">mygame/web/templates/webclient/base.html</span></code> and editing it to add your new plugin.</p>
|
||||
</section>
|
||||
</section>
|
||||
<section class="tex2jax_ignore mathjax_ignore" id="evennia-web-client-api-from-evennia-js">
|
||||
<h1>Evennia Web Client API (from evennia.js)<a class="headerlink" href="#evennia-web-client-api-from-evennia-js" title="Permalink to this headline">¶</a></h1>
|
||||
<section id="evennia-web-client-api-from-evennia-js">
|
||||
<h2>Evennia Web Client API (from evennia.js)<a class="headerlink" href="#evennia-web-client-api-from-evennia-js" title="Permalink to this headline">¶</a></h2>
|
||||
<ul class="simple">
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">Evennia.init(</span> <span class="pre">opts</span> <span class="pre">)</span></code></p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">Evennia.connect()</span></code></p></li>
|
||||
|
|
@ -161,8 +162,8 @@ your browser cache, and see if your edit shows up.</strong></p>
|
|||
<li><p><code class="docutils literal notranslate"><span class="pre">log()</span></code></p></li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="tex2jax_ignore mathjax_ignore" id="plugin-manager-api-from-webclient-gui-js">
|
||||
<h1>Plugin Manager API (from webclient_gui.js)<a class="headerlink" href="#plugin-manager-api-from-webclient-gui-js" title="Permalink to this headline">¶</a></h1>
|
||||
<section id="plugin-manager-api-from-webclient-gui-js">
|
||||
<h2>Plugin Manager API (from webclient_gui.js)<a class="headerlink" href="#plugin-manager-api-from-webclient-gui-js" title="Permalink to this headline">¶</a></h2>
|
||||
<ul class="simple">
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">options</span></code> Object, Stores key/value ‘state’ that can be used by plugins to coordinate behavior.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">plugins</span></code> Object, key/value list of the all the loaded plugins.</p></li>
|
||||
|
|
@ -174,8 +175,8 @@ your browser cache, and see if your edit shows up.</strong></p>
|
|||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="tex2jax_ignore mathjax_ignore" id="plugin-callbacks-api">
|
||||
<h1>Plugin callbacks API<a class="headerlink" href="#plugin-callbacks-api" title="Permalink to this headline">¶</a></h1>
|
||||
<section id="plugin-callbacks-api">
|
||||
<h2>Plugin callbacks API<a class="headerlink" href="#plugin-callbacks-api" title="Permalink to this headline">¶</a></h2>
|
||||
<ul class="simple">
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">init()</span></code> – The only required callback</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">boolean</span> <span class="pre">onKeydown(event)</span></code> This plugin listens for Keydown events</p></li>
|
||||
|
|
@ -197,24 +198,20 @@ true will short-circuit the execution, so no other plugins lower in the base.htm
|
|||
their callback for this event called. This enables things like the up/down arrow keys for the
|
||||
history.js plugin to always occur before the default_in.js plugin adds that key to the current input
|
||||
buffer.</p>
|
||||
</section>
|
||||
<section class="tex2jax_ignore mathjax_ignore" id="example-default-plugins-plugins-js">
|
||||
<h1>Example/Default Plugins (plugins/*.js)<a class="headerlink" href="#example-default-plugins-plugins-js" title="Permalink to this headline">¶</a></h1>
|
||||
<section id="example-default-plugins-plugins-js">
|
||||
<h3>Example/Default Plugins (<code class="docutils literal notranslate"><span class="pre">plugins/*.js</span></code>)<a class="headerlink" href="#example-default-plugins-plugins-js" title="Permalink to this headline">¶</a></h3>
|
||||
<ul class="simple">
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">clienthelp.js</span></code> Defines onOptionsUI from the options2 plugin. This is a mostly empty plugin to
|
||||
add some “How To” information for your game.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">default_in.js</span></code> Defines onKeydown. <enter> key or mouse clicking the arrow will send the currently
|
||||
typed text.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">default_in.js</span></code> Defines onKeydown. <code class="docutils literal notranslate"><span class="pre"><enter></span></code> key or mouse clicking the arrow will send the currently typed text.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">default_out.js</span></code> Defines onText, onPrompt, and onUnknownCmd. Generates HTML output for the user.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">default_unload.js</span></code> Defines onBeforeUnload. Prompts the user to confirm that they meant to
|
||||
leave/close the game.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">font.js</span></code> Defines onOptionsUI. The plugin adds the ability to select your font and font size.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">goldenlayout_default_config.js</span></code> Not actually a plugin, defines a global variable that
|
||||
goldenlayout uses to determine its window layout, known tag routing, etc.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">goldenlayout.js</span></code> Defines onKeydown, onText and custom functions. A very powerful “tabbed” window
|
||||
manager for drag-n-drop windows, text routing and more.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">history.js</span></code> Defines onKeydown and onSend. Creates a history of past sent commands, and uses arrow
|
||||
keys to peruse.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">goldenlayout.js</span></code> Defines onKeydown, onText and custom functions. A very powerful “tabbed” window manager for drag-n-drop windows, text routing and more.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">history.js</span></code> Defines onKeydown and onSend. Creates a history of past sent commands, and uses arrow keys to peruse.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">hotbuttons.js</span></code> Defines onGotOptions. A Disabled-by-default plugin that defines a button bar with
|
||||
user-assignable commands.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">html.js</span></code> A basic plugin to allow the client to handle “raw html” messages from the server, this
|
||||
|
|
@ -225,32 +222,21 @@ window for a side-by-side web/text interface, mostly an example of how to build
|
|||
<li><p><code class="docutils literal notranslate"><span class="pre">message_routing.js</span></code> Defines onOptionsUI, onText, onKeydown. This goldenlayout-only plugin
|
||||
implements regex matching to allow users to “tag” arbitrary text that matches, so that it gets
|
||||
routed to proper windows. Similar to “Spawn” functions for other clients.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">multimedia.js</span></code> An basic plugin to allow the client to handle “image” “audio” and “video” messages
|
||||
from the server and display them as inline HTML.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">multimedia.js</span></code> An basic plugin to allow the client to handle “image” “audio” and “video” messages from the server and display them as inline HTML.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">notifications.js</span></code> Defines onText. Generates browser notification events for each new message
|
||||
while the tab is hidden.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">oob.js</span></code> Defines onSend. Allows the user to test/send Out Of Band json messages to the server.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">options.js</span></code> Defines most callbacks. Provides a popup-based UI to coordinate options settings with the server.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">options2.js</span></code> Defines most callbacks. Provides a goldenlayout-based version of the options/settings tab.
|
||||
Integrates with other plugins via the custom onOptionsUI callback.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">options2.js</span></code> Defines most callbacks. Provides a goldenlayout-based version of the options/settings tab. Integrates with other plugins via the custom onOptionsUI callback.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">popups.js</span></code> Provides default popups/Dialog UI for other plugins to use.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">text2html.js</span></code> Provides a new message handler type: <code class="docutils literal notranslate"><span class="pre">text2html</span></code>, similar to the multimedia and html
|
||||
plugins. This plugin provides a way to offload rendering the regular pipe-styled ASCII messages
|
||||
to the client. This allows the server to do less work, while also allowing the client a place to
|
||||
customize this conversion process. To use this plugin you will need to override the current commands
|
||||
in Evennia, changing any place where a raw text output message is generated and turn it into a
|
||||
<code class="docutils literal notranslate"><span class="pre">text2html</span></code> message. For example: <code class="docutils literal notranslate"><span class="pre">target.msg("my</span> <span class="pre">text")</span></code> becomes: <code class="docutils literal notranslate"><span class="pre">target.msg(text2html=("my</span> <span class="pre">text"))</span></code>
|
||||
(even better, use a webclient pane routing tag: <code class="docutils literal notranslate"><span class="pre">target.msg(text2html=("my</span> <span class="pre">text",</span> <span class="pre">{"type":</span> <span class="pre">"sometag"}))</span></code>)
|
||||
<code class="docutils literal notranslate"><span class="pre">text2html</span></code> messages should format and behave identically to the server-side generated text2html() output.</p></li>
|
||||
<li><p><code class="docutils literal notranslate"><span class="pre">text2html.js</span></code> Provides a new message handler type: <code class="docutils literal notranslate"><span class="pre">text2html</span></code>, similar to the multimedia and html plugins. This plugin provides a way to offload rendering the regular pipe-styled ASCII messages to the client. This allows the server to do less work, while also allowing the client a place to customize this conversion process. To use this plugin you will need to override the current commands in Evennia, changing any place where a raw text output message is generated and turn it into a <code class="docutils literal notranslate"><span class="pre">text2html</span></code> message. For example: <code class="docutils literal notranslate"><span class="pre">target.msg("my</span> <span class="pre">text")</span></code> becomes: <code class="docutils literal notranslate"><span class="pre">target.msg(text2html=("my</span> <span class="pre">text"))</span></code> (even better, use a webclient pane routing tag: <code class="docutils literal notranslate"><span class="pre">target.msg(text2html=("my</span> <span class="pre">text",</span> <span class="pre">{"type":</span> <span class="pre">"sometag"}))</span></code>) <code class="docutils literal notranslate"><span class="pre">text2html</span></code> messages should format and behave identically to the server-side generated text2html() output.</p></li>
|
||||
</ul>
|
||||
</section>
|
||||
<section class="tex2jax_ignore mathjax_ignore" id="a-side-note-on-html-messages-vrs-text2html-messages">
|
||||
<h1>A side note on html messages vrs text2html messages<a class="headerlink" href="#a-side-note-on-html-messages-vrs-text2html-messages" title="Permalink to this headline">¶</a></h1>
|
||||
<section id="a-side-note-on-html-messages-vs-text2html-messages">
|
||||
<h3>A side note on html messages vs text2html messages<a class="headerlink" href="#a-side-note-on-html-messages-vs-text2html-messages" title="Permalink to this headline">¶</a></h3>
|
||||
<p>So…lets say you have a desire to make your webclient output more like standard webpages…
|
||||
For telnet clients, you could collect a bunch of text lines together, with ASCII formatted borders, etc.
|
||||
Then send the results to be rendered client-side via the text2html plugin.</p>
|
||||
<p>But for webclients, you could format a message directly with the html plugin to render the whole thing as an
|
||||
HTML table, like so:</p>
|
||||
For telnet clients, you could collect a bunch of text lines together, with ASCII formatted borders, etc. Then send the results to be rendered client-side via the text2html plugin.</p>
|
||||
<p>But for webclients, you could format a message directly with the html plugin to render the whole thing as an HTML table, like so:</p>
|
||||
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span> <span class="c1"># Server Side Python Code:</span>
|
||||
|
||||
<span class="k">if</span> <span class="n">target</span><span class="o">.</span><span class="n">is_webclient</span><span class="p">():</span>
|
||||
|
|
@ -276,13 +262,14 @@ HTML table, like so:</p>
|
|||
</pre></div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="tex2jax_ignore mathjax_ignore" id="writing-your-own-plugins">
|
||||
<h1>Writing your own Plugins<a class="headerlink" href="#writing-your-own-plugins" title="Permalink to this headline">¶</a></h1>
|
||||
</section>
|
||||
<section id="writing-your-own-plugins">
|
||||
<h2>Writing your own Plugins<a class="headerlink" href="#writing-your-own-plugins" title="Permalink to this headline">¶</a></h2>
|
||||
<p>So, you love the functionality of the webclient, but your game has specific
|
||||
types of text that need to be separated out into their own space, visually.
|
||||
The Goldenlayout plugin framework can help with this.</p>
|
||||
<section id="goldenlayout">
|
||||
<h2>GoldenLayout<a class="headerlink" href="#goldenlayout" title="Permalink to this headline">¶</a></h2>
|
||||
<h3>GoldenLayout<a class="headerlink" href="#goldenlayout" title="Permalink to this headline">¶</a></h3>
|
||||
<p>GoldenLayout is a web framework that allows web developers and their users to create their own
|
||||
tabbed/windowed layouts. Windows/tabs can be click-and-dragged from location to location by
|
||||
clicking on their titlebar and dragging until the “frame lines” appear. Dragging a window onto
|
||||
|
|
@ -376,8 +363,7 @@ base.html.</p>
|
|||
<span class="nb">type</span><span class="o">=</span><span class="s2">"text/javascript"</span><span class="o">></</span><span class="n">script</span><span class="o">></span>
|
||||
</pre></div>
|
||||
</div>
|
||||
<p>Remember, plugins are load-order dependent, so make sure the new <code class="docutils literal notranslate"><span class="pre"><script></span></code> tag comes before the
|
||||
goldenlayout.js</p>
|
||||
<p>Remember, plugins are load-order dependent, so make sure the new <code class="docutils literal notranslate"><span class="pre"><script></span></code> tag comes before the <code class="docutils literal notranslate"><span class="pre">goldenlayout.js</span></code>.</p>
|
||||
<p>Next, create a new plugin file <code class="docutils literal notranslate"><span class="pre">mygame/web/static/webclient/js/plugins/myplugin.js</span></code> and
|
||||
edit it.</p>
|
||||
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span>let myplugin = (function () {
|
||||
|
|
@ -405,9 +391,10 @@ edit it.</p>
|
|||
window.plugin_handler.add("myplugin", myplugin);
|
||||
</pre></div>
|
||||
</div>
|
||||
<p>You can then add “mycomponent” to an item’s componentName in your goldenlayout_default_config.js.</p>
|
||||
<p>You can then add “mycomponent” to an item’s <code class="docutils literal notranslate"><span class="pre">componentName</span></code> in your <code class="docutils literal notranslate"><span class="pre">goldenlayout_default_config.js</span></code>.</p>
|
||||
<p>Make sure to stop your server, evennia collectstatic, and restart your server. Then make sure to clear your browser cache before loading the webclient page.</p>
|
||||
</section>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
|
||||
|
|
@ -426,10 +413,10 @@ window.plugin_handler.add("myplugin", myplugin);
|
|||
<a href="../py-modindex.html" title="Python Module Index"
|
||||
>modules</a> |</li>
|
||||
<li class="right" >
|
||||
<a href="Bootstrap-Components-and-Utilities.html" title="Bootstrap Components and Utilities"
|
||||
<a href="Web-Admin.html" title="The Web Admin"
|
||||
>next</a> |</li>
|
||||
<li class="right" >
|
||||
<a href="Webserver.html" title="Webserver"
|
||||
<a href="Website.html" title="Game website"
|
||||
>previous</a> |</li>
|
||||
<li class="nav-item nav-item-0"><a href="../index.html">Evennia 1.0-dev</a> »</li>
|
||||
<li class="nav-item nav-item-1"><a href="Components-Overview.html" >Core Components</a> »</li>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue