mirror of
https://github.com/Combodo/iTop.git
synced 2026-03-06 09:34:13 +01:00
Doc Twig UI blocks
This commit is contained in:
Eric Espie
0
docs/.nojekyll
Normal file
0
docs/.nojekyll
Normal file
4
docs/UI/html/documentation/3.0/.buildinfo
Normal file
4
docs/UI/html/documentation/3.0/.buildinfo
Normal file
@@ -0,0 +1,4 @@
|
||||
# Sphinx build info version 1
|
||||
# This file hashes the configuration used when building these files. When it is not found, a full rebuild will be done.
|
||||
config: 0e56475910a81e9dc43c43e795719b2d
|
||||
tags: 645f666f9bcd5a90fca523b33c5a78b7
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
docs/UI/html/documentation/3.0/.doctrees/environment.pickle
Normal file
BIN
docs/UI/html/documentation/3.0/.doctrees/environment.pickle
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
docs/UI/html/documentation/3.0/.doctrees/index.doctree
Normal file
BIN
docs/UI/html/documentation/3.0/.doctrees/index.doctree
Normal file
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
150
docs/UI/html/documentation/3.0/TwigBase/TwigBase.html
Normal file
150
docs/UI/html/documentation/3.0/TwigBase/TwigBase.html
Normal file
@@ -0,0 +1,150 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="writer-html5" lang="en" >
|
||||
<head>
|
||||
<meta charset="utf-8" /><meta name="generator" content="Docutils 0.17.1: http://docutils.sourceforge.net/" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Twig Base Presentation — iTop UI iTop 3.1.0 documentation</title>
|
||||
<link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../_static/css/theme.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../_static/css/ui-doc.css" type="text/css" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="../_static/js/html5shiv.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<script data-url_root="../" id="documentation_options" src="../_static/documentation_options.js"></script>
|
||||
<script src="../_static/jquery.js"></script>
|
||||
<script src="../_static/underscore.js"></script>
|
||||
<script src="../_static/doctools.js"></script>
|
||||
<script src="../_static/js/theme.js"></script>
|
||||
<link rel="index" title="Index" href="../genindex.html" />
|
||||
<link rel="search" title="Search" href="../search.html" />
|
||||
<link rel="next" title="Twig Base Tutorial" href="../TwigBaseTuto/TwigBaseTuto.html" />
|
||||
<link rel="prev" title="Welcome to iTop UI documentation!" href="../index.html" />
|
||||
</head>
|
||||
|
||||
<body class="wy-body-for-nav">
|
||||
<div class="wy-grid-for-nav">
|
||||
<nav data-toggle="wy-nav-shift" class="wy-nav-side">
|
||||
<div class="wy-side-scroll">
|
||||
<div class="wy-side-nav-search" >
|
||||
<a href="../index.html" class="icon icon-home"> iTop UI
|
||||
<img src="../_static/itop-logo.png" class="logo" alt="Logo"/>
|
||||
</a>
|
||||
<div role="search">
|
||||
<form id="rtd-search-form" class="wy-form" action="../search.html" method="get">
|
||||
<input type="text" name="q" placeholder="Search docs" />
|
||||
<input type="hidden" name="check_keywords" value="yes" />
|
||||
<input type="hidden" name="area" value="default" />
|
||||
</form>
|
||||
</div>
|
||||
</div><div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="Navigation menu">
|
||||
<p class="caption" role="heading"><span class="caption-text">Twig Base:</span></p>
|
||||
<ul class="current">
|
||||
<li class="toctree-l1 current"><a class="current reference internal" href="#">Twig Base Presentation</a></li>
|
||||
<li class="toctree-l1"><a class="reference internal" href="../TwigBaseTuto/TwigBaseTuto.html">Twig Base Tutorial</a></li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<section data-toggle="wy-nav-shift" class="wy-nav-content-wrap"><nav class="wy-nav-top" aria-label="Mobile navigation menu" >
|
||||
<i data-toggle="wy-nav-top" class="fa fa-bars"></i>
|
||||
<a href="../index.html">iTop UI</a>
|
||||
</nav>
|
||||
|
||||
<div class="wy-nav-content">
|
||||
<div class="rst-content">
|
||||
<div role="navigation" aria-label="Page navigation">
|
||||
<ul class="wy-breadcrumbs">
|
||||
<li><a href="../index.html" class="icon icon-home"></a> »</li>
|
||||
<li>Twig Base Presentation</li>
|
||||
<li class="wy-breadcrumbs-aside">
|
||||
</li>
|
||||
</ul>
|
||||
<hr/>
|
||||
</div>
|
||||
<div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
|
||||
|
||||
|
||||
<div itemprop="articleBody">
|
||||
|
||||
<section id="twig-base-presentation">
|
||||
<h1>Twig Base Presentation<a class="headerlink" href="#twig-base-presentation" title="Permalink to this headline"></a></h1>
|
||||
<p>This feature is intended to help extension creators to design forms in a <em>modern</em> way.</p>
|
||||
<p>The <strong>Twig Base</strong> feature is based on MVC structure:</p>
|
||||
<img alt="../_images/MVC.png" src="../_images/MVC.png" />
|
||||
<p>When creating an extension following this structure, some parts have to be done:</p>
|
||||
<dl class="field-list simple">
|
||||
<dt class="field-odd">Model</dt>
|
||||
<dd class="field-odd"><p>Optional part to define the specific data model for the extension</p>
|
||||
</dd>
|
||||
<dt class="field-even">Service</dt>
|
||||
<dd class="field-even"><p>Recommended part to produce the data to be displayed</p>
|
||||
</dd>
|
||||
<dt class="field-odd">Controller</dt>
|
||||
<dd class="field-odd"><p>Mandatory part to gather the data from the <em>Service</em> and display using the <em>View</em>.
|
||||
The <em>Controller</em> contains an automatic routing mechanism to be selected by the <em>operation</em> parameter.</p>
|
||||
</dd>
|
||||
<dt class="field-even">View</dt>
|
||||
<dd class="field-even"><p>Mandatory part to display the data given by the <em>Controller</em></p>
|
||||
</dd>
|
||||
<dt class="field-odd">End point</dt>
|
||||
<dd class="field-odd"><p>Mandatory part receiving the request and calling the <em>Controller</em></p>
|
||||
</dd>
|
||||
</dl>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer><div class="rst-footer-buttons" role="navigation" aria-label="Footer">
|
||||
<a href="../index.html" class="btn btn-neutral float-left" title="Welcome to iTop UI documentation!" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> Previous</a>
|
||||
<a href="../TwigBaseTuto/TwigBaseTuto.html" class="btn btn-neutral float-right" title="Twig Base Tutorial" accesskey="n" rel="next">Next <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
|
||||
<div role="contentinfo">
|
||||
<p>© Copyright 2022, Combodo.</p>
|
||||
</div>
|
||||
|
||||
Built with <a href="https://www.sphinx-doc.org/">Sphinx</a> using a
|
||||
<a href="https://github.com/readthedocs/sphinx_rtd_theme">theme</a>
|
||||
provided by <a href="https://readthedocs.org">Read the Docs</a>.
|
||||
|
||||
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
~ @copyright Copyright (C) 2010-2022 Combodo SARL
|
||||
~ @license http://opensource.org/licenses/AGPL-3.0
|
||||
-->
|
||||
|
||||
<div class="rst-versions" data-toggle="rst-versions" role="note" aria-label="versions">
|
||||
<span class="rst-current-version" data-toggle="rst-current-version">
|
||||
<span class="fa fa-book"> Other Versions</span>
|
||||
v: documentation/3.0
|
||||
<span class="fa fa-caret-down"></span>
|
||||
</span>
|
||||
<div class="rst-other-versions">
|
||||
<dl>
|
||||
<dt>Branches</dt>
|
||||
<dd><a href="TwigBase.html">documentation/3.0</a></dd>
|
||||
<dd><a href="../../latest/TwigBase/TwigBase.html">documentation/latest</a></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div><script>
|
||||
jQuery(function () {
|
||||
SphinxRtdTheme.Navigation.enable(true);
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
194
docs/UI/html/documentation/3.0/TwigBaseTuto/Step1/Step1.html
Normal file
194
docs/UI/html/documentation/3.0/TwigBaseTuto/Step1/Step1.html
Normal file
@@ -0,0 +1,194 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="writer-html5" lang="en" >
|
||||
<head>
|
||||
<meta charset="utf-8" /><meta name="generator" content="Docutils 0.17.1: http://docutils.sourceforge.net/" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>1. Creating the structure — iTop UI iTop 3.1.0 documentation</title>
|
||||
<link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../../_static/css/theme.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../../_static/css/ui-doc.css" type="text/css" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="../../_static/js/html5shiv.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<script data-url_root="../../" id="documentation_options" src="../../_static/documentation_options.js"></script>
|
||||
<script src="../../_static/jquery.js"></script>
|
||||
<script src="../../_static/underscore.js"></script>
|
||||
<script src="../../_static/doctools.js"></script>
|
||||
<script src="../../_static/js/theme.js"></script>
|
||||
<link rel="index" title="Index" href="../../genindex.html" />
|
||||
<link rel="search" title="Search" href="../../search.html" />
|
||||
<link rel="next" title="2. Hello World!" href="../Step2/Step2.html" />
|
||||
<link rel="prev" title="Twig Base Tutorial" href="../TwigBaseTuto.html" />
|
||||
</head>
|
||||
|
||||
<body class="wy-body-for-nav">
|
||||
<div class="wy-grid-for-nav">
|
||||
<nav data-toggle="wy-nav-shift" class="wy-nav-side">
|
||||
<div class="wy-side-scroll">
|
||||
<div class="wy-side-nav-search" >
|
||||
<a href="../../index.html" class="icon icon-home"> iTop UI
|
||||
<img src="../../_static/itop-logo.png" class="logo" alt="Logo"/>
|
||||
</a>
|
||||
<div role="search">
|
||||
<form id="rtd-search-form" class="wy-form" action="../../search.html" method="get">
|
||||
<input type="text" name="q" placeholder="Search docs" />
|
||||
<input type="hidden" name="check_keywords" value="yes" />
|
||||
<input type="hidden" name="area" value="default" />
|
||||
</form>
|
||||
</div>
|
||||
</div><div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="Navigation menu">
|
||||
<p class="caption" role="heading"><span class="caption-text">Twig Base:</span></p>
|
||||
<ul class="current">
|
||||
<li class="toctree-l1"><a class="reference internal" href="../../TwigBase/TwigBase.html">Twig Base Presentation</a></li>
|
||||
<li class="toctree-l1 current"><a class="reference internal" href="../TwigBaseTuto.html">Twig Base Tutorial</a><ul class="current">
|
||||
<li class="toctree-l2 current"><a class="current reference internal" href="#">1. Creating the structure</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step2/Step2.html">2. Hello World!</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step3/Step3.html">3. Passing variables to templates</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step4/Step4.html">4. Adding new operations</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<section data-toggle="wy-nav-shift" class="wy-nav-content-wrap"><nav class="wy-nav-top" aria-label="Mobile navigation menu" >
|
||||
<i data-toggle="wy-nav-top" class="fa fa-bars"></i>
|
||||
<a href="../../index.html">iTop UI</a>
|
||||
</nav>
|
||||
|
||||
<div class="wy-nav-content">
|
||||
<div class="rst-content">
|
||||
<div role="navigation" aria-label="Page navigation">
|
||||
<ul class="wy-breadcrumbs">
|
||||
<li><a href="../../index.html" class="icon icon-home"></a> »</li>
|
||||
<li><a href="../TwigBaseTuto.html">Twig Base Tutorial</a> »</li>
|
||||
<li>1. Creating the structure</li>
|
||||
<li class="wy-breadcrumbs-aside">
|
||||
</li>
|
||||
</ul>
|
||||
<hr/>
|
||||
</div>
|
||||
<div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
|
||||
|
||||
|
||||
<div itemprop="articleBody">
|
||||
|
||||
<section id="creating-the-structure">
|
||||
<span id="step1"></span><h1>1. Creating the structure<a class="headerlink" href="#creating-the-structure" title="Permalink to this headline"></a></h1>
|
||||
<p>Create a module using the <a class="reference external" href="https://www.itophub.io/wiki/page?id=latest%3Acustomization%3Adatamodel#creating_your_own_extension">helper to create a new extension</a> you’ll get the following structure:</p>
|
||||
<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="nx">my</span><span class="o">-</span><span class="nx">module</span>
|
||||
<span class="nx">├──</span> <span class="nx">assets</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">css</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">img</span>
|
||||
<span class="nx">│ </span> <span class="nx">└──</span> <span class="nx">js</span>
|
||||
<span class="nx">├──</span> <span class="nx">doc</span>
|
||||
<span class="nx">├──</span> <span class="nx">src</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Controller</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Helper</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Hook</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Model</span>
|
||||
<span class="nx">│ </span> <span class="nx">└──</span> <span class="nx">Service</span>
|
||||
<span class="nx">└──</span> <span class="nx">vendor</span>
|
||||
</pre></div>
|
||||
</div>
|
||||
<p><code class="docutils literal notranslate"><span class="pre">src/Controller</span></code></p>
|
||||
<blockquote>
|
||||
<div><p>Contains all the PHP to control the display of the different pages of the module.</p>
|
||||
</div></blockquote>
|
||||
<p><code class="docutils literal notranslate"><span class="pre">src/Service</span></code></p>
|
||||
<blockquote>
|
||||
<div><p>Contains the PHP used to generate the data to be displayed.</p>
|
||||
</div></blockquote>
|
||||
<p>Create a folder <code class="docutils literal notranslate"><span class="pre">templates</span></code> for the <em>Twig</em> templates used for the presentation:</p>
|
||||
<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="nx">my</span><span class="o">-</span><span class="nx">module</span>
|
||||
<span class="nx">├──</span> <span class="nx">assets</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">css</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">img</span>
|
||||
<span class="nx">│ </span> <span class="nx">└──</span> <span class="nx">js</span>
|
||||
<span class="nx">├──</span> <span class="nx">doc</span>
|
||||
<span class="nx">├──</span> <span class="nx">src</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Controller</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Helper</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Hook</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Model</span>
|
||||
<span class="nx">│ </span> <span class="nx">└──</span> <span class="nx">Service</span>
|
||||
<span class="nx">├──</span> <span class="nx">templates</span>
|
||||
<span class="nx">└──</span> <span class="nx">vendor</span>
|
||||
</pre></div>
|
||||
</div>
|
||||
<p>If your module is for iTop version 3.0 and above, you can put all the dictionaries into a dedicated folder <code class="docutils literal notranslate"><span class="pre">dictionaries</span></code>:</p>
|
||||
<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="nx">my</span><span class="o">-</span><span class="nx">module</span>
|
||||
<span class="nx">├──</span> <span class="nx">assets</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">css</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">img</span>
|
||||
<span class="nx">│ </span> <span class="nx">└──</span> <span class="nx">js</span>
|
||||
<span class="nx">├──</span> <span class="nx">dictionaries</span>
|
||||
<span class="nx">├──</span> <span class="nx">doc</span>
|
||||
<span class="nx">├──</span> <span class="nx">src</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Controller</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Helper</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Hook</span>
|
||||
<span class="nx">│ </span> <span class="nx">├──</span> <span class="nx">Model</span>
|
||||
<span class="nx">│ </span> <span class="nx">└──</span> <span class="nx">Service</span>
|
||||
<span class="nx">├──</span> <span class="nx">templates</span>
|
||||
<span class="nx">└──</span> <span class="nx">vendor</span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer><div class="rst-footer-buttons" role="navigation" aria-label="Footer">
|
||||
<a href="../TwigBaseTuto.html" class="btn btn-neutral float-left" title="Twig Base Tutorial" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> Previous</a>
|
||||
<a href="../Step2/Step2.html" class="btn btn-neutral float-right" title="2. Hello World!" accesskey="n" rel="next">Next <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
|
||||
<div role="contentinfo">
|
||||
<p>© Copyright 2022, Combodo.</p>
|
||||
</div>
|
||||
|
||||
Built with <a href="https://www.sphinx-doc.org/">Sphinx</a> using a
|
||||
<a href="https://github.com/readthedocs/sphinx_rtd_theme">theme</a>
|
||||
provided by <a href="https://readthedocs.org">Read the Docs</a>.
|
||||
|
||||
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
~ @copyright Copyright (C) 2010-2022 Combodo SARL
|
||||
~ @license http://opensource.org/licenses/AGPL-3.0
|
||||
-->
|
||||
|
||||
<div class="rst-versions" data-toggle="rst-versions" role="note" aria-label="versions">
|
||||
<span class="rst-current-version" data-toggle="rst-current-version">
|
||||
<span class="fa fa-book"> Other Versions</span>
|
||||
v: documentation/3.0
|
||||
<span class="fa fa-caret-down"></span>
|
||||
</span>
|
||||
<div class="rst-other-versions">
|
||||
<dl>
|
||||
<dt>Branches</dt>
|
||||
<dd><a href="Step1.html">documentation/3.0</a></dd>
|
||||
<dd><a href="../../../latest/TwigBaseTuto/Step1/Step1.html">documentation/latest</a></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div><script>
|
||||
jQuery(function () {
|
||||
SphinxRtdTheme.Navigation.enable(true);
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
236
docs/UI/html/documentation/3.0/TwigBaseTuto/Step2/Step2.html
Normal file
236
docs/UI/html/documentation/3.0/TwigBaseTuto/Step2/Step2.html
Normal file
@@ -0,0 +1,236 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="writer-html5" lang="en" >
|
||||
<head>
|
||||
<meta charset="utf-8" /><meta name="generator" content="Docutils 0.17.1: http://docutils.sourceforge.net/" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>2. Hello World! — iTop UI iTop 3.1.0 documentation</title>
|
||||
<link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../../_static/css/theme.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../../_static/css/ui-doc.css" type="text/css" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="../../_static/js/html5shiv.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<script data-url_root="../../" id="documentation_options" src="../../_static/documentation_options.js"></script>
|
||||
<script src="../../_static/jquery.js"></script>
|
||||
<script src="../../_static/underscore.js"></script>
|
||||
<script src="../../_static/doctools.js"></script>
|
||||
<script src="../../_static/js/theme.js"></script>
|
||||
<link rel="index" title="Index" href="../../genindex.html" />
|
||||
<link rel="search" title="Search" href="../../search.html" />
|
||||
<link rel="next" title="3. Passing variables to templates" href="../Step3/Step3.html" />
|
||||
<link rel="prev" title="1. Creating the structure" href="../Step1/Step1.html" />
|
||||
</head>
|
||||
|
||||
<body class="wy-body-for-nav">
|
||||
<div class="wy-grid-for-nav">
|
||||
<nav data-toggle="wy-nav-shift" class="wy-nav-side">
|
||||
<div class="wy-side-scroll">
|
||||
<div class="wy-side-nav-search" >
|
||||
<a href="../../index.html" class="icon icon-home"> iTop UI
|
||||
<img src="../../_static/itop-logo.png" class="logo" alt="Logo"/>
|
||||
</a>
|
||||
<div role="search">
|
||||
<form id="rtd-search-form" class="wy-form" action="../../search.html" method="get">
|
||||
<input type="text" name="q" placeholder="Search docs" />
|
||||
<input type="hidden" name="check_keywords" value="yes" />
|
||||
<input type="hidden" name="area" value="default" />
|
||||
</form>
|
||||
</div>
|
||||
</div><div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="Navigation menu">
|
||||
<p class="caption" role="heading"><span class="caption-text">Twig Base:</span></p>
|
||||
<ul class="current">
|
||||
<li class="toctree-l1"><a class="reference internal" href="../../TwigBase/TwigBase.html">Twig Base Presentation</a></li>
|
||||
<li class="toctree-l1 current"><a class="reference internal" href="../TwigBaseTuto.html">Twig Base Tutorial</a><ul class="current">
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step1/Step1.html">1. Creating the structure</a></li>
|
||||
<li class="toctree-l2 current"><a class="current reference internal" href="#">2. Hello World!</a><ul>
|
||||
<li class="toctree-l3"><a class="reference internal" href="#the-controller">The controller</a></li>
|
||||
<li class="toctree-l3"><a class="reference internal" href="#the-template">The template</a></li>
|
||||
<li class="toctree-l3"><a class="reference internal" href="#the-end-point">The end point</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step3/Step3.html">3. Passing variables to templates</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step4/Step4.html">4. Adding new operations</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<section data-toggle="wy-nav-shift" class="wy-nav-content-wrap"><nav class="wy-nav-top" aria-label="Mobile navigation menu" >
|
||||
<i data-toggle="wy-nav-top" class="fa fa-bars"></i>
|
||||
<a href="../../index.html">iTop UI</a>
|
||||
</nav>
|
||||
|
||||
<div class="wy-nav-content">
|
||||
<div class="rst-content">
|
||||
<div role="navigation" aria-label="Page navigation">
|
||||
<ul class="wy-breadcrumbs">
|
||||
<li><a href="../../index.html" class="icon icon-home"></a> »</li>
|
||||
<li><a href="../TwigBaseTuto.html">Twig Base Tutorial</a> »</li>
|
||||
<li>2. Hello World!</li>
|
||||
<li class="wy-breadcrumbs-aside">
|
||||
</li>
|
||||
</ul>
|
||||
<hr/>
|
||||
</div>
|
||||
<div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
|
||||
|
||||
|
||||
<div itemprop="articleBody">
|
||||
|
||||
<section id="hello-world">
|
||||
<span id="step2"></span><h1>2. Hello World!<a class="headerlink" href="#hello-world" title="Permalink to this headline"></a></h1>
|
||||
<section id="the-controller">
|
||||
<h2>The controller<a class="headerlink" href="#the-controller" title="Permalink to this headline"></a></h2>
|
||||
<p>Create a controller into <code class="docutils literal notranslate"><span class="pre">my-module/src/Controller</span></code>, let’s call it <code class="docutils literal notranslate"><span class="pre">MyModuleController</span></code> extending <code class="docutils literal notranslate"><span class="pre">Combodo\iTop\Application\TwigBase\Controller\Controller</span></code></p>
|
||||
<div class="literal-block-wrapper docutils container" id="id1">
|
||||
<div class="code-block-caption"><span class="caption-text">src/Controller/MyModuleController.php</span><a class="headerlink" href="#id1" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="linenos">1</span><span class="o"><?</span><span class="nx">php</span>
|
||||
<span class="linenos">2</span>
|
||||
<span class="linenos">3</span><span class="k">namespace</span> <span class="nx">MyCompany\iTop\MyModule\Controller</span><span class="p">;</span>
|
||||
<span class="linenos">4</span><span class="k">use</span> <span class="nx">Combodo\iTop\Application\TwigBase\Controller\Controller</span><span class="p">;</span>
|
||||
<span class="linenos">5</span>
|
||||
<span class="linenos">6</span><span class="k">class</span> <span class="nc">MyModuleController</span> <span class="k">extends</span> <span class="nx">Controller</span>
|
||||
<span class="linenos">7</span><span class="p">{</span>
|
||||
<span class="linenos">8</span><span class="p">}</span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p>Let’s add a <em>Hello World</em> operation</p>
|
||||
<div class="literal-block-wrapper docutils container" id="id2">
|
||||
<div class="code-block-caption"><span class="caption-text">src/Controller/MyModuleController.php</span><a class="headerlink" href="#id2" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="linenos">1</span><span class="o"><?</span><span class="nx">php</span>
|
||||
<span class="linenos">2</span>
|
||||
<span class="linenos">3</span><span class="k">class</span> <span class="nc">MyModuleController</span> <span class="k">extends</span> <span class="nx">Controller</span>
|
||||
<span class="linenos">4</span><span class="p">{</span>
|
||||
<span class="linenos">5</span> <span class="k">public</span> <span class="k">function</span> <span class="nf">OperationHelloWorld</span><span class="p">()</span>
|
||||
<span class="linenos">6</span> <span class="p">{</span>
|
||||
<span class="linenos">7</span> <span class="nv">$this</span><span class="o">-></span><span class="na">DisplayPage</span><span class="p">();</span>
|
||||
<span class="linenos">8</span> <span class="p">}</span>
|
||||
<span class="linenos">9</span><span class="p">}</span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p>This will just display the Twig template corresponding to this operation.
|
||||
Here the operation is <strong>HelloWorld</strong> without space.
|
||||
The name of the method is built from the operation name by adding <em>Operation</em> at the beginning: <code class="docutils literal notranslate"><span class="pre">OperationHelloWorld</span></code>.</p>
|
||||
<p>Calling the method <code class="docutils literal notranslate"><span class="pre">DisplayPage()</span></code> will render the template named after the operation: <code class="docutils literal notranslate"><span class="pre">HelloWorld.html.twig</span></code> it will be located in the folder <code class="docutils literal notranslate"><span class="pre">my-module/templates</span></code>.</p>
|
||||
</section>
|
||||
<section id="the-template">
|
||||
<h2>The template<a class="headerlink" href="#the-template" title="Permalink to this headline"></a></h2>
|
||||
<p>Let’s create the template <code class="docutils literal notranslate"><span class="pre">my-module/templates/HelloWorld.html.twig</span></code> with a nice title.</p>
|
||||
<div class="literal-block-wrapper docutils container" id="id3">
|
||||
<div class="code-block-caption"><span class="caption-text">templates/HelloWorld.html.twig</span><a class="headerlink" href="#id3" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-twig notranslate"><div class="highlight"><pre><span></span><span class="linenos">1</span><span class="cp">{%</span> <span class="k">UITitle</span> <span class="p">F</span><span class="nv">orPage</span> <span class="o">{</span><span class="nv">sTitle</span><span class="s1">:'Hello World!'</span><span class="o">}</span> <span class="cp">%}{%</span> <span class="k">EndUITitle</span> <span class="cp">%}</span><span class="x"></span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p>Twig syntax can be found <a class="reference external" href="https://twig.symfony.com/doc/3.x/">Here</a>.</p>
|
||||
<p>For more information on specific iTop Twig tags you can check <span class="xref std std-ref">Components</span> and <span class="xref std std-ref">Layouts</span>, <em>note that UI blocks are new in iTop 3.0 and cannot be used in iTop 2.7</em></p>
|
||||
</section>
|
||||
<section id="the-end-point">
|
||||
<h2>The end point<a class="headerlink" href="#the-end-point" title="Permalink to this headline"></a></h2>
|
||||
<p>Then create landing page for your module <code class="docutils literal notranslate"><span class="pre">my-module/index.php</span></code></p>
|
||||
<div class="literal-block-wrapper docutils container" id="id4">
|
||||
<div class="code-block-caption"><span class="caption-text">index.php</span><a class="headerlink" href="#id4" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 1</span><span class="o"><?</span><span class="nx">php</span>
|
||||
<span class="linenos"> 2</span>
|
||||
<span class="linenos"> 3</span><span class="k">namespace</span> <span class="nx">MyCompany\iTop\MyModule</span><span class="p">;</span>
|
||||
<span class="linenos"> 4</span>
|
||||
<span class="linenos"> 5</span><span class="k">use</span> <span class="nx">MyCompany\iTop\MyModule\Controller\MyModuleController</span><span class="p">;</span>
|
||||
<span class="linenos"> 6</span>
|
||||
<span class="linenos"> 7</span><span class="k">require_once</span><span class="p">(</span><span class="nx">APPROOT</span><span class="o">.</span><span class="s1">'application/startup.inc.php'</span><span class="p">);</span>
|
||||
<span class="linenos"> 8</span>
|
||||
<span class="linenos"> 9</span><span class="nv">$oUpdateController</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">MyModuleController</span><span class="p">(</span><span class="nx">MODULESROOT</span><span class="o">.</span><span class="s1">'my-module/templates'</span><span class="p">,</span> <span class="s1">'my-module'</span><span class="p">);</span>
|
||||
<span class="linenos">10</span><span class="nv">$oUpdateController</span><span class="o">-></span><span class="na">SetDefaultOperation</span><span class="p">(</span><span class="s1">'HelloWorld'</span><span class="p">);</span>
|
||||
<span class="linenos">11</span><span class="nv">$oUpdateController</span><span class="o">-></span><span class="na">HandleOperation</span><span class="p">();</span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p>Create an instance of the controller indicating the templates path and the module name.
|
||||
The default operation is set to the operation we want when entering the module.
|
||||
The method <code class="docutils literal notranslate"><span class="pre">HandleOperation()</span></code> will call the method corresponding to the specified operation.</p>
|
||||
<p>Now you have to build the autoloader by running <code class="docutils literal notranslate"><span class="pre">composer</span> <span class="pre">dump-autoload</span></code> into the module folder <code class="docutils literal notranslate"><span class="pre">my-module</span></code>.</p>
|
||||
<p>The next operation is the <a class="reference external" href="https://www.itophub.io/wiki/page?id=latest%3Ainstall%3Ainstall_wizard">setup</a>. You will be able to select your module.</p>
|
||||
<img alt="../../_images/Setup.png" src="../../_images/Setup.png" />
|
||||
<p>For more comfort during the development of your module, you can <a class="reference external" href="https://www.itophub.io/wiki/page?id=latest%3Acustomization%3Adatamodel#installing_the_toolkit">install the toolkit</a> and update your iTop with symlinks.</p>
|
||||
<p>if you go to your module page <code class="docutils literal notranslate"><span class="pre">https://localhost/itop/pages/exec.php?exec_module=my-module&exec_page=index.php</span></code> you should see:</p>
|
||||
<img alt="../../_images/Step2.png" src="../../_images/Step2.png" />
|
||||
<p>You will notice that if you work with an iTop from an official package (not the sources from <code class="docutils literal notranslate"><span class="pre">https://github.com/Combodo/iTop</span></code>, when you modify the twig template, the result does not change.</p>
|
||||
<p>In this case, you’ll have to add the following parameter to your iTop configuration:</p>
|
||||
<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="o"><?</span><span class="nx">php</span>
|
||||
|
||||
<span class="sd">/**</span>
|
||||
<span class="sd"> *</span>
|
||||
<span class="sd"> * Configuration file, generated by the iTop configuration wizard</span>
|
||||
<span class="sd"> *</span>
|
||||
<span class="sd"> * The file is used in MetaModel::LoadConfig() which does all the necessary initialization job</span>
|
||||
<span class="sd"> *</span>
|
||||
<span class="sd"> */</span>
|
||||
<span class="nv">$MySettings</span> <span class="o">=</span> <span class="k">array</span><span class="p">(</span>
|
||||
<span class="c1">// developer_mode.enabled: If true then unlocks dev env functionalities, see \utils::IsDevelopmentEnvironment</span>
|
||||
<span class="s1">'developer_mode.enabled'</span> <span class="o">=></span> <span class="k">true</span><span class="p">,</span>
|
||||
|
||||
<span class="c1">// ...</span>
|
||||
<span class="p">);</span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer><div class="rst-footer-buttons" role="navigation" aria-label="Footer">
|
||||
<a href="../Step1/Step1.html" class="btn btn-neutral float-left" title="1. Creating the structure" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> Previous</a>
|
||||
<a href="../Step3/Step3.html" class="btn btn-neutral float-right" title="3. Passing variables to templates" accesskey="n" rel="next">Next <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
|
||||
<div role="contentinfo">
|
||||
<p>© Copyright 2022, Combodo.</p>
|
||||
</div>
|
||||
|
||||
Built with <a href="https://www.sphinx-doc.org/">Sphinx</a> using a
|
||||
<a href="https://github.com/readthedocs/sphinx_rtd_theme">theme</a>
|
||||
provided by <a href="https://readthedocs.org">Read the Docs</a>.
|
||||
|
||||
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
~ @copyright Copyright (C) 2010-2022 Combodo SARL
|
||||
~ @license http://opensource.org/licenses/AGPL-3.0
|
||||
-->
|
||||
|
||||
<div class="rst-versions" data-toggle="rst-versions" role="note" aria-label="versions">
|
||||
<span class="rst-current-version" data-toggle="rst-current-version">
|
||||
<span class="fa fa-book"> Other Versions</span>
|
||||
v: documentation/3.0
|
||||
<span class="fa fa-caret-down"></span>
|
||||
</span>
|
||||
<div class="rst-other-versions">
|
||||
<dl>
|
||||
<dt>Branches</dt>
|
||||
<dd><a href="Step2.html">documentation/3.0</a></dd>
|
||||
<dd><a href="../../../latest/TwigBaseTuto/Step2/Step2.html">documentation/latest</a></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div><script>
|
||||
jQuery(function () {
|
||||
SphinxRtdTheme.Navigation.enable(true);
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
212
docs/UI/html/documentation/3.0/TwigBaseTuto/Step3/Step3.html
Normal file
212
docs/UI/html/documentation/3.0/TwigBaseTuto/Step3/Step3.html
Normal file
@@ -0,0 +1,212 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="writer-html5" lang="en" >
|
||||
<head>
|
||||
<meta charset="utf-8" /><meta name="generator" content="Docutils 0.17.1: http://docutils.sourceforge.net/" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>3. Passing variables to templates — iTop UI iTop 3.1.0 documentation</title>
|
||||
<link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../../_static/css/theme.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../../_static/css/ui-doc.css" type="text/css" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="../../_static/js/html5shiv.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<script data-url_root="../../" id="documentation_options" src="../../_static/documentation_options.js"></script>
|
||||
<script src="../../_static/jquery.js"></script>
|
||||
<script src="../../_static/underscore.js"></script>
|
||||
<script src="../../_static/doctools.js"></script>
|
||||
<script src="../../_static/js/theme.js"></script>
|
||||
<link rel="index" title="Index" href="../../genindex.html" />
|
||||
<link rel="search" title="Search" href="../../search.html" />
|
||||
<link rel="next" title="4. Adding new operations" href="../Step4/Step4.html" />
|
||||
<link rel="prev" title="2. Hello World!" href="../Step2/Step2.html" />
|
||||
</head>
|
||||
|
||||
<body class="wy-body-for-nav">
|
||||
<div class="wy-grid-for-nav">
|
||||
<nav data-toggle="wy-nav-shift" class="wy-nav-side">
|
||||
<div class="wy-side-scroll">
|
||||
<div class="wy-side-nav-search" >
|
||||
<a href="../../index.html" class="icon icon-home"> iTop UI
|
||||
<img src="../../_static/itop-logo.png" class="logo" alt="Logo"/>
|
||||
</a>
|
||||
<div role="search">
|
||||
<form id="rtd-search-form" class="wy-form" action="../../search.html" method="get">
|
||||
<input type="text" name="q" placeholder="Search docs" />
|
||||
<input type="hidden" name="check_keywords" value="yes" />
|
||||
<input type="hidden" name="area" value="default" />
|
||||
</form>
|
||||
</div>
|
||||
</div><div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="Navigation menu">
|
||||
<p class="caption" role="heading"><span class="caption-text">Twig Base:</span></p>
|
||||
<ul class="current">
|
||||
<li class="toctree-l1"><a class="reference internal" href="../../TwigBase/TwigBase.html">Twig Base Presentation</a></li>
|
||||
<li class="toctree-l1 current"><a class="reference internal" href="../TwigBaseTuto.html">Twig Base Tutorial</a><ul class="current">
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step1/Step1.html">1. Creating the structure</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step2/Step2.html">2. Hello World!</a></li>
|
||||
<li class="toctree-l2 current"><a class="current reference internal" href="#">3. Passing variables to templates</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step4/Step4.html">4. Adding new operations</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<section data-toggle="wy-nav-shift" class="wy-nav-content-wrap"><nav class="wy-nav-top" aria-label="Mobile navigation menu" >
|
||||
<i data-toggle="wy-nav-top" class="fa fa-bars"></i>
|
||||
<a href="../../index.html">iTop UI</a>
|
||||
</nav>
|
||||
|
||||
<div class="wy-nav-content">
|
||||
<div class="rst-content">
|
||||
<div role="navigation" aria-label="Page navigation">
|
||||
<ul class="wy-breadcrumbs">
|
||||
<li><a href="../../index.html" class="icon icon-home"></a> »</li>
|
||||
<li><a href="../TwigBaseTuto.html">Twig Base Tutorial</a> »</li>
|
||||
<li>3. Passing variables to templates</li>
|
||||
<li class="wy-breadcrumbs-aside">
|
||||
</li>
|
||||
</ul>
|
||||
<hr/>
|
||||
</div>
|
||||
<div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
|
||||
|
||||
|
||||
<div itemprop="articleBody">
|
||||
|
||||
<section id="passing-variables-to-templates">
|
||||
<span id="step3"></span><h1>3. Passing variables to templates<a class="headerlink" href="#passing-variables-to-templates" title="Permalink to this headline"></a></h1>
|
||||
<p>We have seen in <a class="reference internal" href="../Step2/Step2.html#step2"><span class="std std-ref">2. Hello World!</span></a> how to create a static template. Let’s send some variables to have a more dynamic display.</p>
|
||||
<div class="literal-block-wrapper docutils container" id="id1">
|
||||
<div class="code-block-caption"><span class="caption-text">src/Controller/MyModuleController.php</span><a class="headerlink" href="#id1" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 1</span><span class="o"><?</span><span class="nx">php</span>
|
||||
<span class="linenos"> 2</span>
|
||||
<span class="linenos"> 3</span><span class="k">namespace</span> <span class="nx">MyCompany\iTop\MyModule\Controller</span><span class="p">;</span>
|
||||
<span class="linenos"> 4</span><span class="k">use</span> <span class="nx">Combodo\iTop\Application\TwigBase\Controller\Controller</span><span class="p">;</span>
|
||||
<span class="linenos"> 5</span><span class="k">use</span> <span class="nx">UserRights</span><span class="p">;</span>
|
||||
<span class="linenos"> 6</span>
|
||||
<span class="linenos"> 7</span><span class="k">class</span> <span class="nc">MyModuleController</span> <span class="k">extends</span> <span class="nx">Controller</span>
|
||||
<span class="linenos"> 8</span><span class="p">{</span>
|
||||
<span class="linenos"> 9</span> <span class="k">public</span> <span class="k">function</span> <span class="nf">OperationHelloWorld</span><span class="p">()</span>
|
||||
<span class="linenos">10</span> <span class="p">{</span>
|
||||
<span class="linenos">11</span> <span class="nv">$aParams</span><span class="p">[</span><span class="s1">'sName'</span><span class="p">]</span> <span class="o">=</span> <span class="nx">UserRights</span><span class="o">::</span><span class="na">GetUser</span><span class="p">();</span>
|
||||
<span class="linenos">12</span> <span class="nv">$aParams</span><span class="p">[</span><span class="s1">'sDate'</span><span class="p">]</span> <span class="o">=</span> <span class="nb">date</span><span class="p">(</span><span class="s2">"r"</span><span class="p">);</span>
|
||||
<span class="linenos">13</span> <span class="nv">$this</span><span class="o">-></span><span class="na">DisplayPage</span><span class="p">(</span><span class="nv">$aParams</span><span class="p">);</span>
|
||||
<span class="linenos">14</span> <span class="p">}</span>
|
||||
<span class="linenos">15</span><span class="p">}</span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p>The <code class="docutils literal notranslate"><span class="pre">DisplayPage()</span></code> method accept an array of parameters. This array is transformed into variables for the Twig template.</p>
|
||||
<p>Here two variables are created: <code class="docutils literal notranslate"><span class="pre">sName</span></code> and <code class="docutils literal notranslate"><span class="pre">sDate</span></code>, we can use them in the template.</p>
|
||||
<div class="literal-block-wrapper docutils container" id="id2">
|
||||
<div class="code-block-caption"><span class="caption-text">templates/HelloWorld.html.twig</span><a class="headerlink" href="#id2" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-twig notranslate"><div class="highlight"><pre><span></span><span class="linenos">1</span><span class="cp">{%</span> <span class="k">UITitle</span> <span class="p">F</span><span class="nv">orPage</span> <span class="o">{</span><span class="nv">sTitle</span><span class="s1">:'Hello '</span> <span class="o">~</span> <span class="nv">sName</span> <span class="o">~</span> <span class="s1">'!'</span><span class="o">}</span> <span class="cp">%}{%</span> <span class="k">EndUITitle</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">2</span><span class="cp">{%</span> <span class="k">UIContentBlock</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="p">D</span><span class="nv">ataAttributes</span><span class="o">:</span> <span class="o">{</span><span class="nv">role</span><span class="o">:</span> <span class="s1">'date'</span><span class="o">}}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">3</span><span class="x"> We are currently </span><span class="cp">{{</span> <span class="nv">sDate</span> <span class="cp">}}</span><span class="x"></span>
|
||||
<span class="linenos">4</span><span class="cp">{%</span> <span class="k">EndUIContentBlock</span> <span class="cp">%}</span><span class="x"></span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p>The output is then</p>
|
||||
<img alt="../../_images/Hello2.png" src="../../_images/Hello2.png" />
|
||||
<p>The variables can be of any type, for example you can give an array as a variable:</p>
|
||||
<div class="literal-block-wrapper docutils container" id="id3">
|
||||
<div class="code-block-caption"><span class="caption-text">src/Controller/MyModuleController.php</span><a class="headerlink" href="#id3" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 1</span><span class="o"><?</span><span class="nx">php</span>
|
||||
<span class="linenos"> 2</span>
|
||||
<span class="linenos"> 3</span><span class="k">namespace</span> <span class="nx">MyCompany\iTop\MyModule\Controller</span><span class="p">;</span>
|
||||
<span class="linenos"> 4</span><span class="k">use</span> <span class="nx">Combodo\iTop\Application\TwigBase\Controller\Controller</span><span class="p">;</span>
|
||||
<span class="linenos"> 5</span><span class="k">use</span> <span class="nx">UserRights</span><span class="p">;</span>
|
||||
<span class="linenos"> 6</span>
|
||||
<span class="linenos"> 7</span><span class="k">class</span> <span class="nc">MyModuleController</span> <span class="k">extends</span> <span class="nx">Controller</span>
|
||||
<span class="linenos"> 8</span><span class="p">{</span>
|
||||
<span class="linenos"> 9</span> <span class="k">public</span> <span class="k">function</span> <span class="nf">OperationHelloWorld</span><span class="p">()</span>
|
||||
<span class="linenos">10</span> <span class="p">{</span>
|
||||
<span class="linenos">11</span> <span class="nv">$aParams</span><span class="p">[</span><span class="s1">'sName'</span><span class="p">]</span> <span class="o">=</span> <span class="nx">UserRights</span><span class="o">::</span><span class="na">GetUser</span><span class="p">();</span>
|
||||
<span class="linenos">12</span> <span class="nv">$aParams</span><span class="p">[</span><span class="s1">'sDate'</span><span class="p">]</span> <span class="o">=</span> <span class="nb">date</span><span class="p">(</span><span class="s2">"r"</span><span class="p">);</span>
|
||||
<span class="linenos">13</span> <span class="nv">$aParams</span><span class="p">[</span><span class="s1">'aQuarter'</span><span class="p">]</span> <span class="o">=</span> <span class="p">[</span><span class="s1">'January'</span><span class="p">,</span> <span class="s1">'February'</span><span class="p">,</span> <span class="s1">'March'</span><span class="p">];</span>
|
||||
<span class="linenos">14</span> <span class="nv">$this</span><span class="o">-></span><span class="na">DisplayPage</span><span class="p">(</span><span class="nv">$aParams</span><span class="p">);</span>
|
||||
<span class="linenos">15</span> <span class="p">}</span>
|
||||
<span class="linenos">16</span><span class="p">}</span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p>Here <code class="docutils literal notranslate"><span class="pre">aQuarter</span></code> is an array containing some months, we can use it in a selector:</p>
|
||||
<div class="literal-block-wrapper docutils container" id="id4">
|
||||
<div class="code-block-caption"><span class="caption-text">templates/HelloWorld.html.twig</span><a class="headerlink" href="#id4" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-twig notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 1</span><span class="cp">{%</span> <span class="k">UITitle</span> <span class="p">F</span><span class="nv">orPage</span> <span class="o">{</span><span class="nv">sTitle</span><span class="s1">:'Hello '</span> <span class="o">~</span> <span class="nv">sName</span> <span class="o">~</span> <span class="s1">'!'</span><span class="o">}</span> <span class="cp">%}{%</span> <span class="k">EndUITitle</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos"> 2</span><span class="cp">{%</span> <span class="k">UIContentBlock</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="p">D</span><span class="nv">ataAttributes</span><span class="o">:</span> <span class="o">{</span><span class="nv">role</span><span class="o">:</span> <span class="s1">'date'</span><span class="o">}}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos"> 3</span><span class="x"> We are currently </span><span class="cp">{{</span> <span class="nv">sDate</span> <span class="cp">}}</span><span class="x"></span>
|
||||
<span class="linenos"> 4</span><span class="cp">{%</span> <span class="k">EndUIContentBlock</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos"> 5</span>
|
||||
<span class="linenos"> 6</span><span class="cp">{%</span> <span class="k">UIForm</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="nv">sId</span><span class="s1">:'my-form'</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos"> 7</span><span class="x"> Select Month:</span>
|
||||
<span class="linenos"> 8</span><span class="x"> </span><span class="cp">{%</span> <span class="k">UISelect</span> <span class="p">F</span><span class="nv">orSelect</span> <span class="o">{</span><span class="nv">sName</span><span class="s1">:'month'</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos"> 9</span><span class="x"> </span><span class="cp">{%</span> <span class="k">for</span> <span class="nv">index</span><span class="o">,</span><span class="nv">sMonth</span> <span class="k">in</span> <span class="nv">aQuarter</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">10</span><span class="x"> </span><span class="cp">{%</span> <span class="k">UISelectOption</span> <span class="p">F</span><span class="nv">orSelectOption</span> <span class="o">{</span><span class="nv">sValue</span><span class="o">:</span> <span class="nv">index</span><span class="o">,</span> <span class="nv">sLabel</span><span class="o">:</span> <span class="nv">sMonth</span><span class="o">,</span> <span class="nv">bSelected</span><span class="o">:</span><span class="kp">false</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">11</span><span class="x"> </span><span class="cp">{%</span> <span class="k">endfor</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">12</span><span class="x"> </span><span class="cp">{%</span> <span class="k">EndUISelect</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">13</span><span class="cp">{%</span> <span class="k">EndUIForm</span> <span class="cp">%}</span><span class="x"></span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p>The output is:</p>
|
||||
<img alt="../../_images/Hello3.png" src="../../_images/Hello3.png" />
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer><div class="rst-footer-buttons" role="navigation" aria-label="Footer">
|
||||
<a href="../Step2/Step2.html" class="btn btn-neutral float-left" title="2. Hello World!" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> Previous</a>
|
||||
<a href="../Step4/Step4.html" class="btn btn-neutral float-right" title="4. Adding new operations" accesskey="n" rel="next">Next <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
|
||||
<div role="contentinfo">
|
||||
<p>© Copyright 2022, Combodo.</p>
|
||||
</div>
|
||||
|
||||
Built with <a href="https://www.sphinx-doc.org/">Sphinx</a> using a
|
||||
<a href="https://github.com/readthedocs/sphinx_rtd_theme">theme</a>
|
||||
provided by <a href="https://readthedocs.org">Read the Docs</a>.
|
||||
|
||||
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
~ @copyright Copyright (C) 2010-2022 Combodo SARL
|
||||
~ @license http://opensource.org/licenses/AGPL-3.0
|
||||
-->
|
||||
|
||||
<div class="rst-versions" data-toggle="rst-versions" role="note" aria-label="versions">
|
||||
<span class="rst-current-version" data-toggle="rst-current-version">
|
||||
<span class="fa fa-book"> Other Versions</span>
|
||||
v: documentation/3.0
|
||||
<span class="fa fa-caret-down"></span>
|
||||
</span>
|
||||
<div class="rst-other-versions">
|
||||
<dl>
|
||||
<dt>Branches</dt>
|
||||
<dd><a href="Step3.html">documentation/3.0</a></dd>
|
||||
<dd><a href="../../../latest/TwigBaseTuto/Step3/Step3.html">documentation/latest</a></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div><script>
|
||||
jQuery(function () {
|
||||
SphinxRtdTheme.Navigation.enable(true);
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
191
docs/UI/html/documentation/3.0/TwigBaseTuto/Step4/Step4.html
Normal file
191
docs/UI/html/documentation/3.0/TwigBaseTuto/Step4/Step4.html
Normal file
@@ -0,0 +1,191 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="writer-html5" lang="en" >
|
||||
<head>
|
||||
<meta charset="utf-8" /><meta name="generator" content="Docutils 0.17.1: http://docutils.sourceforge.net/" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>4. Adding new operations — iTop UI iTop 3.1.0 documentation</title>
|
||||
<link rel="stylesheet" href="../../_static/pygments.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../../_static/css/theme.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../../_static/css/ui-doc.css" type="text/css" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="../../_static/js/html5shiv.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<script data-url_root="../../" id="documentation_options" src="../../_static/documentation_options.js"></script>
|
||||
<script src="../../_static/jquery.js"></script>
|
||||
<script src="../../_static/underscore.js"></script>
|
||||
<script src="../../_static/doctools.js"></script>
|
||||
<script src="../../_static/js/theme.js"></script>
|
||||
<link rel="index" title="Index" href="../../genindex.html" />
|
||||
<link rel="search" title="Search" href="../../search.html" />
|
||||
<link rel="prev" title="3. Passing variables to templates" href="../Step3/Step3.html" />
|
||||
</head>
|
||||
|
||||
<body class="wy-body-for-nav">
|
||||
<div class="wy-grid-for-nav">
|
||||
<nav data-toggle="wy-nav-shift" class="wy-nav-side">
|
||||
<div class="wy-side-scroll">
|
||||
<div class="wy-side-nav-search" >
|
||||
<a href="../../index.html" class="icon icon-home"> iTop UI
|
||||
<img src="../../_static/itop-logo.png" class="logo" alt="Logo"/>
|
||||
</a>
|
||||
<div role="search">
|
||||
<form id="rtd-search-form" class="wy-form" action="../../search.html" method="get">
|
||||
<input type="text" name="q" placeholder="Search docs" />
|
||||
<input type="hidden" name="check_keywords" value="yes" />
|
||||
<input type="hidden" name="area" value="default" />
|
||||
</form>
|
||||
</div>
|
||||
</div><div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="Navigation menu">
|
||||
<p class="caption" role="heading"><span class="caption-text">Twig Base:</span></p>
|
||||
<ul class="current">
|
||||
<li class="toctree-l1"><a class="reference internal" href="../../TwigBase/TwigBase.html">Twig Base Presentation</a></li>
|
||||
<li class="toctree-l1 current"><a class="reference internal" href="../TwigBaseTuto.html">Twig Base Tutorial</a><ul class="current">
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step1/Step1.html">1. Creating the structure</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step2/Step2.html">2. Hello World!</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="../Step3/Step3.html">3. Passing variables to templates</a></li>
|
||||
<li class="toctree-l2 current"><a class="current reference internal" href="#">4. Adding new operations</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<section data-toggle="wy-nav-shift" class="wy-nav-content-wrap"><nav class="wy-nav-top" aria-label="Mobile navigation menu" >
|
||||
<i data-toggle="wy-nav-top" class="fa fa-bars"></i>
|
||||
<a href="../../index.html">iTop UI</a>
|
||||
</nav>
|
||||
|
||||
<div class="wy-nav-content">
|
||||
<div class="rst-content">
|
||||
<div role="navigation" aria-label="Page navigation">
|
||||
<ul class="wy-breadcrumbs">
|
||||
<li><a href="../../index.html" class="icon icon-home"></a> »</li>
|
||||
<li><a href="../TwigBaseTuto.html">Twig Base Tutorial</a> »</li>
|
||||
<li>4. Adding new operations</li>
|
||||
<li class="wy-breadcrumbs-aside">
|
||||
</li>
|
||||
</ul>
|
||||
<hr/>
|
||||
</div>
|
||||
<div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
|
||||
|
||||
|
||||
<div itemprop="articleBody">
|
||||
|
||||
<section id="adding-new-operations">
|
||||
<span id="step4"></span><h1>4. Adding new operations<a class="headerlink" href="#adding-new-operations" title="Permalink to this headline"></a></h1>
|
||||
<p>We currently have only one operation <code class="docutils literal notranslate"><span class="pre">HelloWorld</span></code>. Generally multiple operations are needed, let’s add a new one.</p>
|
||||
<p>In the previous part <a class="reference internal" href="../Step3/Step3.html#step3"><span class="std std-ref">3. Passing variables to templates</span></a> we have created a form, it will be used to call the operation <code class="docutils literal notranslate"><span class="pre">SelectMonth</span></code>.</p>
|
||||
<p>Modify the form to add an hidden input to set the operation and add a submit button:</p>
|
||||
<div class="literal-block-wrapper docutils container" id="id1">
|
||||
<div class="code-block-caption"><span class="caption-text">templates/HelloWorld.html.twig</span><a class="headerlink" href="#id1" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-twig notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 6</span><span class="cp">{%</span> <span class="k">UIForm</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="nv">sId</span><span class="s1">:'myform'</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos"> 7</span><span class="x"> Select Month:</span>
|
||||
<span class="linenos"> 8</span><span class="x"> </span><span class="cp">{%</span> <span class="k">UISelect</span> <span class="p">F</span><span class="nv">orSelect</span> <span class="o">{</span><span class="nv">sName</span><span class="s1">:'month'</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos"> 9</span><span class="x"> </span><span class="cp">{%</span> <span class="k">for</span> <span class="nv">index</span><span class="o">,</span><span class="nv">sMonth</span> <span class="k">in</span> <span class="nv">aQuarter</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">10</span><span class="x"> </span><span class="cp">{%</span> <span class="k">UISelectOption</span> <span class="p">F</span><span class="nv">orSelectOption</span> <span class="o">{</span><span class="nv">sValue</span><span class="o">:</span> <span class="nv">index</span><span class="o">,</span> <span class="nv">sLabel</span><span class="o">:</span> <span class="nv">sMonth</span><span class="o">,</span> <span class="nv">bSelected</span><span class="o">:</span><span class="kp">false</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">11</span><span class="x"> </span><span class="cp">{%</span> <span class="k">endfor</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">12</span><span class="x"> </span><span class="cp">{%</span> <span class="k">EndUISelect</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">13</span><span class="x"> </span><span class="cp">{%</span> <span class="k">UIInput</span> <span class="p">F</span><span class="nv">orHidden</span> <span class="o">{</span><span class="nv">sName</span><span class="s1">:'operation'</span><span class="o">,</span> <span class="nv">sValue</span><span class="s1">:'SelectMonth'</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">14</span><span class="x"> </span><span class="cp">{%</span> <span class="k">UIContentBlock</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="p">D</span><span class="nv">ataAttributes</span><span class="o">:</span> <span class="o">{</span><span class="nv">role</span><span class="o">:</span> <span class="s1">'actions'</span><span class="o">}}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">15</span><span class="x"> </span><span class="cp">{%</span> <span class="k">UIButton</span> <span class="p">F</span><span class="nv">orPrimaryAction</span> <span class="o">{</span><span class="nv">sLabel</span><span class="s1">:'Ok'</span><span class="o">,</span> <span class="nv">bIsSubmit</span><span class="o">:</span><span class="kp">true</span><span class="o">}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">16</span><span class="x"> </span><span class="cp">{%</span> <span class="k">EndUIContentBlock</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">17</span><span class="cp">{%</span> <span class="k">EndUIForm</span> <span class="cp">%}</span><span class="x"></span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p>The output of this template is:</p>
|
||||
<img alt="../../_images/form.png" src="../../_images/form.png" />
|
||||
<p>Now add the operation in the controller:</p>
|
||||
<div class="literal-block-wrapper docutils container" id="id2">
|
||||
<div class="code-block-caption"><span class="caption-text">src/Controller/MyModuleController.php</span><a class="headerlink" href="#id2" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-php notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 1</span><span class="o"><?</span><span class="nx">php</span>
|
||||
<span class="linenos"> 2</span>
|
||||
<span class="linenos"> 3</span><span class="c1">// ...</span>
|
||||
<span class="linenos"> 4</span>
|
||||
<span class="linenos"> 5</span><span class="k">class</span> <span class="nc">MyModuleController</span> <span class="k">extends</span> <span class="nx">Controller</span>
|
||||
<span class="linenos"> 6</span><span class="p">{</span>
|
||||
<span class="linenos"> 7</span> <span class="c1">// ...</span>
|
||||
<span class="linenos"> 8</span>
|
||||
<span class="linenos"> 9</span> <span class="k">public</span> <span class="k">function</span> <span class="nf">OperationSelectMonth</span><span class="p">()</span>
|
||||
<span class="linenos">10</span> <span class="p">{</span>
|
||||
<span class="linenos">11</span> <span class="nv">$aMonths</span> <span class="o">=</span> <span class="p">[</span><span class="s1">'January'</span><span class="p">,</span> <span class="s1">'February'</span><span class="p">,</span> <span class="s1">'March'</span><span class="p">];</span>
|
||||
<span class="linenos">12</span> <span class="nv">$iMonth</span> <span class="o">=</span> <span class="nx">utils</span><span class="o">::</span><span class="na">ReadParam</span><span class="p">(</span><span class="s1">'month'</span><span class="p">,</span> <span class="mi">0</span><span class="p">);</span>
|
||||
<span class="linenos">13</span> <span class="nv">$aParams</span><span class="p">[</span><span class="s1">'sSelectedMonth'</span><span class="p">]</span> <span class="o">=</span> <span class="nv">$aMonths</span><span class="p">[</span><span class="nv">$iMonth</span><span class="p">];</span>
|
||||
<span class="linenos">14</span> <span class="nv">$this</span><span class="o">-></span><span class="na">DisplayPage</span><span class="p">(</span><span class="nv">$aParams</span><span class="p">);</span>
|
||||
<span class="linenos">15</span> <span class="p">}</span>
|
||||
<span class="linenos">16</span><span class="p">}</span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p><em>Disclaimer: The code is for tutorial only, don’t use it in production as no check is done on the entries</em></p>
|
||||
<p>The corresponding template must be created <code class="docutils literal notranslate"><span class="pre">templates/SelectMonth.html.twig</span></code></p>
|
||||
<div class="literal-block-wrapper docutils container" id="id3">
|
||||
<div class="code-block-caption"><span class="caption-text">templates/SelectMonth.html.twig</span><a class="headerlink" href="#id3" title="Permalink to this code"></a></div>
|
||||
<div class="highlight-twig notranslate"><div class="highlight"><pre><span></span><span class="linenos">1</span><span class="cp">{%</span> <span class="k">UITitle</span> <span class="p">F</span><span class="nv">orPage</span> <span class="o">{</span><span class="nv">sTitle</span><span class="s1">:'Selected month'</span><span class="o">}</span> <span class="cp">%}{%</span> <span class="k">EndUITitle</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">2</span>
|
||||
<span class="linenos">3</span><span class="cp">{%</span> <span class="k">UIContentBlock</span> <span class="p">S</span><span class="nv">tandard</span> <span class="o">{</span><span class="p">D</span><span class="nv">ataAttributes</span><span class="o">:</span> <span class="o">{</span><span class="nv">role</span><span class="o">:</span> <span class="s1">'Information'</span><span class="o">}}</span> <span class="cp">%}</span><span class="x"></span>
|
||||
<span class="linenos">4</span><span class="x"> The selected month is </span><span class="cp">{{</span> <span class="nv">sSelectedMonth</span> <span class="cp">}}</span><span class="x"></span>
|
||||
<span class="linenos">5</span><span class="cp">{%</span> <span class="k">EndUIContentBlock</span> <span class="cp">%}</span><span class="x"></span>
|
||||
</pre></div>
|
||||
</div>
|
||||
</div>
|
||||
<p>The output of this operation is:</p>
|
||||
<img alt="../../_images/SelectMonth.png" src="../../_images/SelectMonth.png" />
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer><div class="rst-footer-buttons" role="navigation" aria-label="Footer">
|
||||
<a href="../Step3/Step3.html" class="btn btn-neutral float-left" title="3. Passing variables to templates" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> Previous</a>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
|
||||
<div role="contentinfo">
|
||||
<p>© Copyright 2022, Combodo.</p>
|
||||
</div>
|
||||
|
||||
Built with <a href="https://www.sphinx-doc.org/">Sphinx</a> using a
|
||||
<a href="https://github.com/readthedocs/sphinx_rtd_theme">theme</a>
|
||||
provided by <a href="https://readthedocs.org">Read the Docs</a>.
|
||||
|
||||
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
~ @copyright Copyright (C) 2010-2022 Combodo SARL
|
||||
~ @license http://opensource.org/licenses/AGPL-3.0
|
||||
-->
|
||||
|
||||
<div class="rst-versions" data-toggle="rst-versions" role="note" aria-label="versions">
|
||||
<span class="rst-current-version" data-toggle="rst-current-version">
|
||||
<span class="fa fa-book"> Other Versions</span>
|
||||
v: documentation/3.0
|
||||
<span class="fa fa-caret-down"></span>
|
||||
</span>
|
||||
<div class="rst-other-versions">
|
||||
<dl>
|
||||
<dt>Branches</dt>
|
||||
<dd><a href="Step4.html">documentation/3.0</a></dd>
|
||||
<dd><a href="../../../latest/TwigBaseTuto/Step4/Step4.html">documentation/latest</a></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div><script>
|
||||
jQuery(function () {
|
||||
SphinxRtdTheme.Navigation.enable(true);
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
143
docs/UI/html/documentation/3.0/TwigBaseTuto/TwigBaseTuto.html
Normal file
143
docs/UI/html/documentation/3.0/TwigBaseTuto/TwigBaseTuto.html
Normal file
@@ -0,0 +1,143 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="writer-html5" lang="en" >
|
||||
<head>
|
||||
<meta charset="utf-8" /><meta name="generator" content="Docutils 0.17.1: http://docutils.sourceforge.net/" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Twig Base Tutorial — iTop UI iTop 3.1.0 documentation</title>
|
||||
<link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../_static/css/theme.css" type="text/css" />
|
||||
<link rel="stylesheet" href="../_static/css/ui-doc.css" type="text/css" />
|
||||
<!--[if lt IE 9]>
|
||||
<script src="../_static/js/html5shiv.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<script data-url_root="../" id="documentation_options" src="../_static/documentation_options.js"></script>
|
||||
<script src="../_static/jquery.js"></script>
|
||||
<script src="../_static/underscore.js"></script>
|
||||
<script src="../_static/doctools.js"></script>
|
||||
<script src="../_static/js/theme.js"></script>
|
||||
<link rel="index" title="Index" href="../genindex.html" />
|
||||
<link rel="search" title="Search" href="../search.html" />
|
||||
<link rel="next" title="1. Creating the structure" href="Step1/Step1.html" />
|
||||
<link rel="prev" title="Twig Base Presentation" href="../TwigBase/TwigBase.html" />
|
||||
</head>
|
||||
|
||||
<body class="wy-body-for-nav">
|
||||
<div class="wy-grid-for-nav">
|
||||
<nav data-toggle="wy-nav-shift" class="wy-nav-side">
|
||||
<div class="wy-side-scroll">
|
||||
<div class="wy-side-nav-search" >
|
||||
<a href="../index.html" class="icon icon-home"> iTop UI
|
||||
<img src="../_static/itop-logo.png" class="logo" alt="Logo"/>
|
||||
</a>
|
||||
<div role="search">
|
||||
<form id="rtd-search-form" class="wy-form" action="../search.html" method="get">
|
||||
<input type="text" name="q" placeholder="Search docs" />
|
||||
<input type="hidden" name="check_keywords" value="yes" />
|
||||
<input type="hidden" name="area" value="default" />
|
||||
</form>
|
||||
</div>
|
||||
</div><div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="Navigation menu">
|
||||
<p class="caption" role="heading"><span class="caption-text">Twig Base:</span></p>
|
||||
<ul class="current">
|
||||
<li class="toctree-l1"><a class="reference internal" href="../TwigBase/TwigBase.html">Twig Base Presentation</a></li>
|
||||
<li class="toctree-l1 current"><a class="current reference internal" href="#">Twig Base Tutorial</a><ul>
|
||||
<li class="toctree-l2"><a class="reference internal" href="Step1/Step1.html">1. Creating the structure</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="Step2/Step2.html">2. Hello World!</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="Step3/Step3.html">3. Passing variables to templates</a></li>
|
||||
<li class="toctree-l2"><a class="reference internal" href="Step4/Step4.html">4. Adding new operations</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<section data-toggle="wy-nav-shift" class="wy-nav-content-wrap"><nav class="wy-nav-top" aria-label="Mobile navigation menu" >
|
||||
<i data-toggle="wy-nav-top" class="fa fa-bars"></i>
|
||||
<a href="../index.html">iTop UI</a>
|
||||
</nav>
|
||||
|
||||
<div class="wy-nav-content">
|
||||
<div class="rst-content">
|
||||
<div role="navigation" aria-label="Page navigation">
|
||||
<ul class="wy-breadcrumbs">
|
||||
<li><a href="../index.html" class="icon icon-home"></a> »</li>
|
||||
<li>Twig Base Tutorial</li>
|
||||
<li class="wy-breadcrumbs-aside">
|
||||
</li>
|
||||
</ul>
|
||||
<hr/>
|
||||
</div>
|
||||
<div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
|
||||
|
||||
|
||||
<div itemprop="articleBody">
|
||||
|
||||
<section id="twig-base-tutorial">
|
||||
<h1>Twig Base Tutorial<a class="headerlink" href="#twig-base-tutorial" title="Permalink to this headline"></a></h1>
|
||||
<div class="toctree-wrapper compound">
|
||||
<p class="caption" role="heading"><span class="caption-text">Tutorial:</span></p>
|
||||
<ul>
|
||||
<li class="toctree-l1"><a class="reference internal" href="Step1/Step1.html">1. Creating the structure</a></li>
|
||||
<li class="toctree-l1"><a class="reference internal" href="Step2/Step2.html">2. Hello World!</a></li>
|
||||
<li class="toctree-l1"><a class="reference internal" href="Step3/Step3.html">3. Passing variables to templates</a></li>
|
||||
<li class="toctree-l1"><a class="reference internal" href="Step4/Step4.html">4. Adding new operations</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer><div class="rst-footer-buttons" role="navigation" aria-label="Footer">
|
||||
<a href="../TwigBase/TwigBase.html" class="btn btn-neutral float-left" title="Twig Base Presentation" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> Previous</a>
|
||||
<a href="Step1/Step1.html" class="btn btn-neutral float-right" title="1. Creating the structure" accesskey="n" rel="next">Next <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
|
||||
<div role="contentinfo">
|
||||
<p>© Copyright 2022, Combodo.</p>
|
||||
</div>
|
||||
|
||||
Built with <a href="https://www.sphinx-doc.org/">Sphinx</a> using a
|
||||
<a href="https://github.com/readthedocs/sphinx_rtd_theme">theme</a>
|
||||
provided by <a href="https://readthedocs.org">Read the Docs</a>.
|
||||
|
||||
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
~ @copyright Copyright (C) 2010-2022 Combodo SARL
|
||||
~ @license http://opensource.org/licenses/AGPL-3.0
|
||||
-->
|
||||
|
||||
<div class="rst-versions" data-toggle="rst-versions" role="note" aria-label="versions">
|
||||
<span class="rst-current-version" data-toggle="rst-current-version">
|
||||
<span class="fa fa-book"> Other Versions</span>
|
||||
v: documentation/3.0
|
||||
<span class="fa fa-caret-down"></span>
|
||||
</span>
|
||||
<div class="rst-other-versions">
|
||||
<dl>
|
||||
<dt>Branches</dt>
|
||||
<dd><a href="TwigBaseTuto.html">documentation/3.0</a></dd>
|
||||
<dd><a href="../../latest/TwigBaseTuto/TwigBaseTuto.html">documentation/latest</a></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div><script>
|
||||
jQuery(function () {
|
||||
SphinxRtdTheme.Navigation.enable(true);
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
BIN
docs/UI/html/documentation/3.0/_images/AlertFailure.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/AlertFailure.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
BIN
docs/UI/html/documentation/3.0/_images/AlertFailureExample.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/AlertFailureExample.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.4 KiB |
BIN
docs/UI/html/documentation/3.0/_images/AlertInformation.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/AlertInformation.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
BIN
docs/UI/html/documentation/3.0/_images/AlertSuccess.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/AlertSuccess.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.9 KiB |
BIN
docs/UI/html/documentation/3.0/_images/AlertWarning.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/AlertWarning.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
BIN
docs/UI/html/documentation/3.0/_images/Button-all.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/Button-all.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
BIN
docs/UI/html/documentation/3.0/_images/Datatable.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/Datatable.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
BIN
docs/UI/html/documentation/3.0/_images/DatatableStatic.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/DatatableStatic.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
docs/UI/html/documentation/3.0/_images/Field.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/Field.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
BIN
docs/UI/html/documentation/3.0/_images/FieldSet-explained.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/FieldSet-explained.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
BIN
docs/UI/html/documentation/3.0/_images/FieldSet.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/FieldSet.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
docs/UI/html/documentation/3.0/_images/Hello2.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/Hello2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
BIN
docs/UI/html/documentation/3.0/_images/Hello3.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/Hello3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
BIN
docs/UI/html/documentation/3.0/_images/MVC.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/MVC.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
BIN
docs/UI/html/documentation/3.0/_images/SelectMonth.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/SelectMonth.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
BIN
docs/UI/html/documentation/3.0/_images/Setup.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/Setup.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
BIN
docs/UI/html/documentation/3.0/_images/Step2.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/Step2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
docs/UI/html/documentation/3.0/_images/Title.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/Title.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.3 KiB |
BIN
docs/UI/html/documentation/3.0/_images/form.png
Normal file
BIN
docs/UI/html/documentation/3.0/_images/form.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
904
docs/UI/html/documentation/3.0/_static/basic.css
Normal file
904
docs/UI/html/documentation/3.0/_static/basic.css
Normal file
@@ -0,0 +1,904 @@
|
||||
/*
|
||||
* basic.css
|
||||
* ~~~~~~~~~
|
||||
*
|
||||
* Sphinx stylesheet -- basic theme.
|
||||
*
|
||||
* :copyright: Copyright 2007-2021 by the Sphinx team, see AUTHORS.
|
||||
* :license: BSD, see LICENSE for details.
|
||||
*
|
||||
*/
|
||||
|
||||
/* -- main layout ----------------------------------------------------------- */
|
||||
|
||||
div.clearer {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
div.section::after {
|
||||
display: block;
|
||||
content: '';
|
||||
clear: left;
|
||||
}
|
||||
|
||||
/* -- relbar ---------------------------------------------------------------- */
|
||||
|
||||
div.related {
|
||||
width: 100%;
|
||||
font-size: 90%;
|
||||
}
|
||||
|
||||
div.related h3 {
|
||||
display: none;
|
||||
}
|
||||
|
||||
div.related ul {
|
||||
margin: 0;
|
||||
padding: 0 0 0 10px;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
div.related li {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
div.related li.right {
|
||||
float: right;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
/* -- sidebar --------------------------------------------------------------- */
|
||||
|
||||
div.sphinxsidebarwrapper {
|
||||
padding: 10px 5px 0 10px;
|
||||
}
|
||||
|
||||
div.sphinxsidebar {
|
||||
float: left;
|
||||
width: 230px;
|
||||
margin-left: -100%;
|
||||
font-size: 90%;
|
||||
word-wrap: break-word;
|
||||
overflow-wrap : break-word;
|
||||
}
|
||||
|
||||
div.sphinxsidebar ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
div.sphinxsidebar ul ul,
|
||||
div.sphinxsidebar ul.want-points {
|
||||
margin-left: 20px;
|
||||
list-style: square;
|
||||
}
|
||||
|
||||
div.sphinxsidebar ul ul {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
div.sphinxsidebar form {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
div.sphinxsidebar input {
|
||||
border: 1px solid #98dbcc;
|
||||
font-family: sans-serif;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
div.sphinxsidebar #searchbox form.search {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
div.sphinxsidebar #searchbox input[type="text"] {
|
||||
float: left;
|
||||
width: 80%;
|
||||
padding: 0.25em;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
div.sphinxsidebar #searchbox input[type="submit"] {
|
||||
float: left;
|
||||
width: 20%;
|
||||
border-left: none;
|
||||
padding: 0.25em;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* -- search page ----------------------------------------------------------- */
|
||||
|
||||
ul.search {
|
||||
margin: 10px 0 0 20px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
ul.search li {
|
||||
padding: 5px 0 5px 20px;
|
||||
background-image: url(file.png);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0 7px;
|
||||
}
|
||||
|
||||
ul.search li a {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
ul.search li p.context {
|
||||
color: #888;
|
||||
margin: 2px 0 0 30px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
ul.keywordmatches li.goodmatch a {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* -- index page ------------------------------------------------------------ */
|
||||
|
||||
table.contentstable {
|
||||
width: 90%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
table.contentstable p.biglink {
|
||||
line-height: 150%;
|
||||
}
|
||||
|
||||
a.biglink {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
span.linkdescr {
|
||||
font-style: italic;
|
||||
padding-top: 5px;
|
||||
font-size: 90%;
|
||||
}
|
||||
|
||||
/* -- general index --------------------------------------------------------- */
|
||||
|
||||
table.indextable {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
table.indextable td {
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
table.indextable ul {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
table.indextable > tbody > tr > td > ul {
|
||||
padding-left: 0em;
|
||||
}
|
||||
|
||||
table.indextable tr.pcap {
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
table.indextable tr.cap {
|
||||
margin-top: 10px;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
img.toggler {
|
||||
margin-right: 3px;
|
||||
margin-top: 3px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
div.modindex-jumpbox {
|
||||
border-top: 1px solid #ddd;
|
||||
border-bottom: 1px solid #ddd;
|
||||
margin: 1em 0 1em 0;
|
||||
padding: 0.4em;
|
||||
}
|
||||
|
||||
div.genindex-jumpbox {
|
||||
border-top: 1px solid #ddd;
|
||||
border-bottom: 1px solid #ddd;
|
||||
margin: 1em 0 1em 0;
|
||||
padding: 0.4em;
|
||||
}
|
||||
|
||||
/* -- domain module index --------------------------------------------------- */
|
||||
|
||||
table.modindextable td {
|
||||
padding: 2px;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
/* -- general body styles --------------------------------------------------- */
|
||||
|
||||
div.body {
|
||||
min-width: 450px;
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
div.body p, div.body dd, div.body li, div.body blockquote {
|
||||
-moz-hyphens: auto;
|
||||
-ms-hyphens: auto;
|
||||
-webkit-hyphens: auto;
|
||||
hyphens: auto;
|
||||
}
|
||||
|
||||
a.headerlink {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
a.brackets:before,
|
||||
span.brackets > a:before{
|
||||
content: "[";
|
||||
}
|
||||
|
||||
a.brackets:after,
|
||||
span.brackets > a:after {
|
||||
content: "]";
|
||||
}
|
||||
|
||||
h1:hover > a.headerlink,
|
||||
h2:hover > a.headerlink,
|
||||
h3:hover > a.headerlink,
|
||||
h4:hover > a.headerlink,
|
||||
h5:hover > a.headerlink,
|
||||
h6:hover > a.headerlink,
|
||||
dt:hover > a.headerlink,
|
||||
caption:hover > a.headerlink,
|
||||
p.caption:hover > a.headerlink,
|
||||
div.code-block-caption:hover > a.headerlink {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
div.body p.caption {
|
||||
text-align: inherit;
|
||||
}
|
||||
|
||||
div.body td {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.first {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
p.rubric {
|
||||
margin-top: 30px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
img.align-left, figure.align-left, .figure.align-left, object.align-left {
|
||||
clear: left;
|
||||
float: left;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
img.align-right, figure.align-right, .figure.align-right, object.align-right {
|
||||
clear: right;
|
||||
float: right;
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
img.align-center, figure.align-center, .figure.align-center, object.align-center {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
img.align-default, figure.align-default, .figure.align-default {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.align-left {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.align-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.align-default {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.align-right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* -- sidebars -------------------------------------------------------------- */
|
||||
|
||||
div.sidebar,
|
||||
aside.sidebar {
|
||||
margin: 0 0 0.5em 1em;
|
||||
border: 1px solid #ddb;
|
||||
padding: 7px;
|
||||
background-color: #ffe;
|
||||
width: 40%;
|
||||
float: right;
|
||||
clear: right;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
p.sidebar-title {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
div.admonition, div.topic, blockquote {
|
||||
clear: left;
|
||||
}
|
||||
|
||||
/* -- topics ---------------------------------------------------------------- */
|
||||
|
||||
div.topic {
|
||||
border: 1px solid #ccc;
|
||||
padding: 7px;
|
||||
margin: 10px 0 10px 0;
|
||||
}
|
||||
|
||||
p.topic-title {
|
||||
font-size: 1.1em;
|
||||
font-weight: bold;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/* -- admonitions ----------------------------------------------------------- */
|
||||
|
||||
div.admonition {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
padding: 7px;
|
||||
}
|
||||
|
||||
div.admonition dt {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
p.admonition-title {
|
||||
margin: 0px 10px 5px 0px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
div.body p.centered {
|
||||
text-align: center;
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
/* -- content of sidebars/topics/admonitions -------------------------------- */
|
||||
|
||||
div.sidebar > :last-child,
|
||||
aside.sidebar > :last-child,
|
||||
div.topic > :last-child,
|
||||
div.admonition > :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
div.sidebar::after,
|
||||
aside.sidebar::after,
|
||||
div.topic::after,
|
||||
div.admonition::after,
|
||||
blockquote::after {
|
||||
display: block;
|
||||
content: '';
|
||||
clear: both;
|
||||
}
|
||||
|
||||
/* -- tables ---------------------------------------------------------------- */
|
||||
|
||||
table.docutils {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
border: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
table.align-center {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
table.align-default {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
table caption span.caption-number {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
table caption span.caption-text {
|
||||
}
|
||||
|
||||
table.docutils td, table.docutils th {
|
||||
padding: 1px 8px 1px 5px;
|
||||
border-top: 0;
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
border-bottom: 1px solid #aaa;
|
||||
}
|
||||
|
||||
table.footnote td, table.footnote th {
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
th {
|
||||
text-align: left;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
table.citation {
|
||||
border-left: solid 1px gray;
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
table.citation td {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
th > :first-child,
|
||||
td > :first-child {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
th > :last-child,
|
||||
td > :last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
/* -- figures --------------------------------------------------------------- */
|
||||
|
||||
div.figure, figure {
|
||||
margin: 0.5em;
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
div.figure p.caption, figcaption {
|
||||
padding: 0.3em;
|
||||
}
|
||||
|
||||
div.figure p.caption span.caption-number,
|
||||
figcaption span.caption-number {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
div.figure p.caption span.caption-text,
|
||||
figcaption span.caption-text {
|
||||
}
|
||||
|
||||
/* -- field list styles ----------------------------------------------------- */
|
||||
|
||||
table.field-list td, table.field-list th {
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
.field-list ul {
|
||||
margin: 0;
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
.field-list p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.field-name {
|
||||
-moz-hyphens: manual;
|
||||
-ms-hyphens: manual;
|
||||
-webkit-hyphens: manual;
|
||||
hyphens: manual;
|
||||
}
|
||||
|
||||
/* -- hlist styles ---------------------------------------------------------- */
|
||||
|
||||
table.hlist {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
table.hlist td {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* -- object description styles --------------------------------------------- */
|
||||
|
||||
.sig {
|
||||
font-family: 'Consolas', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', monospace;
|
||||
}
|
||||
|
||||
.sig-name, code.descname {
|
||||
background-color: transparent;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.sig-name {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
code.descname {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.sig-prename, code.descclassname {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.optional {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.sig-paren {
|
||||
font-size: larger;
|
||||
}
|
||||
|
||||
.sig-param.n {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* C++ specific styling */
|
||||
|
||||
.sig-inline.c-texpr,
|
||||
.sig-inline.cpp-texpr {
|
||||
font-family: unset;
|
||||
}
|
||||
|
||||
.sig.c .k, .sig.c .kt,
|
||||
.sig.cpp .k, .sig.cpp .kt {
|
||||
color: #0033B3;
|
||||
}
|
||||
|
||||
.sig.c .m,
|
||||
.sig.cpp .m {
|
||||
color: #1750EB;
|
||||
}
|
||||
|
||||
.sig.c .s, .sig.c .sc,
|
||||
.sig.cpp .s, .sig.cpp .sc {
|
||||
color: #067D17;
|
||||
}
|
||||
|
||||
|
||||
/* -- other body styles ----------------------------------------------------- */
|
||||
|
||||
ol.arabic {
|
||||
list-style: decimal;
|
||||
}
|
||||
|
||||
ol.loweralpha {
|
||||
list-style: lower-alpha;
|
||||
}
|
||||
|
||||
ol.upperalpha {
|
||||
list-style: upper-alpha;
|
||||
}
|
||||
|
||||
ol.lowerroman {
|
||||
list-style: lower-roman;
|
||||
}
|
||||
|
||||
ol.upperroman {
|
||||
list-style: upper-roman;
|
||||
}
|
||||
|
||||
:not(li) > ol > li:first-child > :first-child,
|
||||
:not(li) > ul > li:first-child > :first-child {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
:not(li) > ol > li:last-child > :last-child,
|
||||
:not(li) > ul > li:last-child > :last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
ol.simple ol p,
|
||||
ol.simple ul p,
|
||||
ul.simple ol p,
|
||||
ul.simple ul p {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
ol.simple > li:not(:first-child) > p,
|
||||
ul.simple > li:not(:first-child) > p {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
ol.simple p,
|
||||
ul.simple p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
dl.footnote > dt,
|
||||
dl.citation > dt {
|
||||
float: left;
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
|
||||
dl.footnote > dd,
|
||||
dl.citation > dd {
|
||||
margin-bottom: 0em;
|
||||
}
|
||||
|
||||
dl.footnote > dd:after,
|
||||
dl.citation > dd:after {
|
||||
content: "";
|
||||
clear: both;
|
||||
}
|
||||
|
||||
dl.field-list {
|
||||
display: grid;
|
||||
grid-template-columns: fit-content(30%) auto;
|
||||
}
|
||||
|
||||
dl.field-list > dt {
|
||||
font-weight: bold;
|
||||
word-break: break-word;
|
||||
padding-left: 0.5em;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
dl.field-list > dt:after {
|
||||
content: ":";
|
||||
}
|
||||
|
||||
dl.field-list > dd {
|
||||
padding-left: 0.5em;
|
||||
margin-top: 0em;
|
||||
margin-left: 0em;
|
||||
margin-bottom: 0em;
|
||||
}
|
||||
|
||||
dl {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
dd > :first-child {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
dd ul, dd table {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin-top: 3px;
|
||||
margin-bottom: 10px;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
dl > dd:last-child,
|
||||
dl > dd:last-child > :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
dt:target, span.highlighted {
|
||||
background-color: #fbe54e;
|
||||
}
|
||||
|
||||
rect.highlighted {
|
||||
fill: #fbe54e;
|
||||
}
|
||||
|
||||
dl.glossary dt {
|
||||
font-weight: bold;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
.versionmodified {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.system-message {
|
||||
background-color: #fda;
|
||||
padding: 5px;
|
||||
border: 3px solid red;
|
||||
}
|
||||
|
||||
.footnote:target {
|
||||
background-color: #ffa;
|
||||
}
|
||||
|
||||
.line-block {
|
||||
display: block;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.line-block .line-block {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
margin-left: 1.5em;
|
||||
}
|
||||
|
||||
.guilabel, .menuselection {
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
.accelerator {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.classifier {
|
||||
font-style: oblique;
|
||||
}
|
||||
|
||||
.classifier:before {
|
||||
font-style: normal;
|
||||
margin: 0.5em;
|
||||
content: ":";
|
||||
}
|
||||
|
||||
abbr, acronym {
|
||||
border-bottom: dotted 1px;
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
/* -- code displays --------------------------------------------------------- */
|
||||
|
||||
pre {
|
||||
overflow: auto;
|
||||
overflow-y: hidden; /* fixes display issues on Chrome browsers */
|
||||
}
|
||||
|
||||
pre, div[class*="highlight-"] {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
span.pre {
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
-webkit-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
div[class*="highlight-"] {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
td.linenos pre {
|
||||
border: 0;
|
||||
background-color: transparent;
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
table.highlighttable {
|
||||
display: block;
|
||||
}
|
||||
|
||||
table.highlighttable tbody {
|
||||
display: block;
|
||||
}
|
||||
|
||||
table.highlighttable tr {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
table.highlighttable td {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
table.highlighttable td.linenos {
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
||||
table.highlighttable td.code {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.highlight .hll {
|
||||
display: block;
|
||||
}
|
||||
|
||||
div.highlight pre,
|
||||
table.highlighttable pre {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
div.code-block-caption + div {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
div.code-block-caption {
|
||||
margin-top: 1em;
|
||||
padding: 2px 5px;
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
div.code-block-caption code {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
table.highlighttable td.linenos,
|
||||
span.linenos,
|
||||
div.highlight span.gp { /* gp: Generic.Prompt */
|
||||
user-select: none;
|
||||
-webkit-user-select: text; /* Safari fallback only */
|
||||
-webkit-user-select: none; /* Chrome/Safari */
|
||||
-moz-user-select: none; /* Firefox */
|
||||
-ms-user-select: none; /* IE10+ */
|
||||
}
|
||||
|
||||
div.code-block-caption span.caption-number {
|
||||
padding: 0.1em 0.3em;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
div.code-block-caption span.caption-text {
|
||||
}
|
||||
|
||||
div.literal-block-wrapper {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
code.xref, a code {
|
||||
background-color: transparent;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
h1 code, h2 code, h3 code, h4 code, h5 code, h6 code {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.viewcode-link {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.viewcode-back {
|
||||
float: right;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
div.viewcode-block:target {
|
||||
margin: -1px -10px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
/* -- math display ---------------------------------------------------------- */
|
||||
|
||||
img.math {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
div.body div.math p {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
span.eqno {
|
||||
float: right;
|
||||
}
|
||||
|
||||
span.eqno a.headerlink {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
div.math:hover a.headerlink {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
/* -- printout stylesheet --------------------------------------------------- */
|
||||
|
||||
@media print {
|
||||
div.document,
|
||||
div.documentwrapper,
|
||||
div.bodywrapper {
|
||||
margin: 0 !important;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
div.sphinxsidebar,
|
||||
div.related,
|
||||
div.footer,
|
||||
#top-link {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user