DokuWiki

It's better when it's simple

User Tools

Site Tools


plugin:inlinejs

InlineJS Plugin

Compatible with DokuWiki

  • 2017-02-19 "Frusterick Manners" unknown
  • 2016-06-26 "Elenor Of Tsort" unknown
  • 2015-08-10 "Detritus" yes
  • 2014-09-29 "Hrun" unknown

plugin Allow inline JavaScript and StyleSheet in wiki pages

Last updated on
2016-07-14
Provides
Syntax, Helper, Action
Repository
Source

Tagged with javascript, style

Installation

Install the plugin through the Extension Manager or Plugin Manager using the download URL above, which points to latest version of the plugin. Refer to plugin installation instructions.

Even though this plugin installed successfully, you may need additional configuration in the configuration manager in order to make the plugin effective (except Macro syntax). Please see Configuration and Settings section below.

Examples/Usage

This plugin was initially developed to incorporate some JavaScript Chart/Plot in a DokuWiki page. In such case, you may need to 1) load several library files in <head> section of HTML, 2) prepare chart box or canvas, and 3) write inline JavaScript to produce a chart.

The inlineJS plugin enables step 1) and 3) inside your DW page by “<PRELOAD>” and “<JS>” tag markup, respectively. For example, to draw a X-Y graph using jqPlot – a plotting and charting plugin for the jQuery JavaScript framework, the DW page source looks like:

<PRELOAD>
# Step 1: load several library files in <head> section
  /js/jquery.jqplot.css    # css
# /js/jquery.min.js (not required since DokuWiki 2012-01-25 Angua uses jQuery) 
  /js/jquery.jqplot.min.js # js
</PRELOAD>

<HTML>
<!-- Step 2 : prepare chart box (canvas) -->
<p>Figure. line chart example</p>
<div id="chartbox" style="width:300px; height:300px;"></div>
</HTML>

<JS>
// Step 3 : inline JavaScript to produce a chart
// ! do not forget to replace "$.jqplot" to "jQuery.jqplot"
var data = [[0,0.0],[1,1.0],[2,1.414],[5,2.236],[7,2.646],[11,3.317]];
jQuery.jqplot('chartbox', [data]);
</JS>

Syntax

PRELOAD tag

JavaScript and Stylesheet preloader in <head> section of HTML.

<PRELOAD>
/path/to/stylesheet.css
/path/to/javascript.js
</PRELOAD>
  • HTML output:
    <head>
    <link rel="stylesheet" type="text/css" href="/path/to/stylesheet.css"/>
    <script type="text/javascript" charset="utf-8" src="/path/to/javascript.js"></script>
    </head>
  • Those files will be loaded only for specific pages, instead for all pages.
  • one line for one file to be loaded.
  • use “#” for comment
  • external .js or .css using URL
  • If <PRELOAD debug> used, filename(s) to be loaded in <head> section are displayed in the DW page.

JS tag

Inline JavaScript embedder in <body> section of HTML.

<JS> ... </JS> or <js> ... </js>
  • HTML output:
    <script type="text/javascript">
    /*<![CDATA[*/
    ...
    /*!]]>*/
    </script>
  • DokuWiki (conf/userscript.js) supports a “site-wide” JavaScript solution. Please refer javascript for detail.
  • This plugin provides a “per-page” solution for inline JavaScript.
  • Your JavaScript between <JS> and </JS> is enclosed inside CDATA section in accordance with the guidance in javascript.

CSS tag

<CSS> ... </CSS>
  • HTML output:
    <style type="text/css">
    <!--
    ...
    -->
    </style>

Configuration and Settings

By default, both “<JS>” and “<PRELOAD>” markup in the page will be ignored if htmlok is disabled in the configuration manager. The “follow_htmlok” option of this plugin is available to these markup effective independently from htmlok. The default value of “follow_htmlok” = 1.

Note that if embedding HTML using the “<html>” tag is allowed, users who can edit a page is also able to write inline JavaScript in the page without this plugin.

:!: This is a security risk when used on a freely accessible site because it enables Cross Site Scripting attacks! Prior to use this plugin, you are strongly recommended to refer htmlok, plugin_security and syntax pages.

Development

Change Log

ToDo

no plan…

Known Bugs and Issues

FAQ

Discussion

plugin/inlinejs.txt · Last modified: 2016-07-14 13:58 by s.sahara