Changed documentation build target

This commit is contained in:
Eric Espie
2022-03-10 13:13:40 +01:00
parent fb5704e470
commit bc6d7ccf19
212 changed files with 5 additions and 34559 deletions

View File

@@ -6,7 +6,7 @@
SPHINXOPTS ?=
SPHINXBUILD ?= sphinx-build
SOURCEDIR = source
BUILDDIR = build
BUILDDIR = ../../docs
# Put it first so that "make" without argument is like "make help".
help:

View File

@@ -537,8 +537,10 @@ EOF
// Rebuild doc
$sRootDir = dirname(__DIR__);
if (strtoupper(substr(PHP_OS, 0, 3)) === 'WIN') {
echo "Windows build\n";
shell_exec("$sRootDir/make.bat html");
} else {
echo "Linux build\n";
shell_exec("$sRootDir/make html");
}

View File

@@ -8,7 +8,7 @@ if "%SPHINXBUILD%" == "" (
set SPHINXBUILD=sphinx-multiversion
)
set SOURCEDIR=source
set BUILDDIR=build
set BUILDDIR=..\..\docs
if "%1" == "" goto help

View File

@@ -1,4 +0,0 @@
# 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: 667217900e0532b156d0a193aa571110
tags: 645f666f9bcd5a90fca523b33c5a78b7

View File

@@ -1,154 +0,0 @@
<!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 &mdash; 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>
<p class="caption" role="heading"><span class="caption-text">Tags reference:</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../generated/Component/Component.html">UI Components</a></li>
<li class="toctree-l1"><a class="reference internal" href="../generated/Layout/Layout.html">UI Layouts</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> &raquo;</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>&#169; 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: feature/faf_doc_twig_blocks
<span class="fa fa-caret-down"></span>
</span>
<div class="rst-other-versions">
<dl>
<dt>Branches</dt>
<dd><a href="TwigBase.html">feature/faf_doc_twig_blocks</a></dd>
</dl>
</div>
</div><script>
jQuery(function () {
SphinxRtdTheme.Navigation.enable(true);
});
</script>
</body>
</html>

View File

@@ -1,198 +0,0 @@
<!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 &mdash; 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>
<p class="caption" role="heading"><span class="caption-text">Tags reference:</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../../generated/Component/Component.html">UI Components</a></li>
<li class="toctree-l1"><a class="reference internal" href="../../generated/Layout/Layout.html">UI Layouts</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> &raquo;</li>
<li><a href="../TwigBaseTuto.html">Twig Base Tutorial</a> &raquo;</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> youll 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>&#169; 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: feature/faf_doc_twig_blocks
<span class="fa fa-caret-down"></span>
</span>
<div class="rst-other-versions">
<dl>
<dt>Branches</dt>
<dd><a href="Step1.html">feature/faf_doc_twig_blocks</a></dd>
</dl>
</div>
</div><script>
jQuery(function () {
SphinxRtdTheme.Navigation.enable(true);
});
</script>
</body>
</html>

View File

@@ -1,240 +0,0 @@
<!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! &mdash; 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>
<p class="caption" role="heading"><span class="caption-text">Tags reference:</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../../generated/Component/Component.html">UI Components</a></li>
<li class="toctree-l1"><a class="reference internal" href="../../generated/Layout/Layout.html">UI Layouts</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> &raquo;</li>
<li><a href="../TwigBaseTuto.html">Twig Base Tutorial</a> &raquo;</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>, lets 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">&lt;?</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>Lets 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">&lt;?</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">-&gt;</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>Lets 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">:&#39;Hello World!&#39;</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 <a class="reference internal" href="../../generated/Component/Component.html#components"><span class="std std-ref">UI Components</span></a> and <a class="reference internal" href="../../generated/Layout/Layout.html#layouts"><span class="std std-ref">UI Layouts</span></a>, <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">&lt;?</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">&#39;application/startup.inc.php&#39;</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">&#39;my-module/templates&#39;</span><span class="p">,</span> <span class="s1">&#39;my-module&#39;</span><span class="p">);</span>
<span class="linenos">10</span><span class="nv">$oUpdateController</span><span class="o">-&gt;</span><span class="na">SetDefaultOperation</span><span class="p">(</span><span class="s1">&#39;HelloWorld&#39;</span><span class="p">);</span>
<span class="linenos">11</span><span class="nv">$oUpdateController</span><span class="o">-&gt;</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&amp;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, youll 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">&lt;?</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">&#39;developer_mode.enabled&#39;</span> <span class="o">=&gt;</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>&#169; 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: feature/faf_doc_twig_blocks
<span class="fa fa-caret-down"></span>
</span>
<div class="rst-other-versions">
<dl>
<dt>Branches</dt>
<dd><a href="Step2.html">feature/faf_doc_twig_blocks</a></dd>
</dl>
</div>
</div><script>
jQuery(function () {
SphinxRtdTheme.Navigation.enable(true);
});
</script>
</body>
</html>

View File

@@ -1,216 +0,0 @@
<!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 &mdash; 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>
<p class="caption" role="heading"><span class="caption-text">Tags reference:</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../../generated/Component/Component.html">UI Components</a></li>
<li class="toctree-l1"><a class="reference internal" href="../../generated/Layout/Layout.html">UI Layouts</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> &raquo;</li>
<li><a href="../TwigBaseTuto.html">Twig Base Tutorial</a> &raquo;</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. Lets 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">&lt;?</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">&#39;sName&#39;</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">&#39;sDate&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="nb">date</span><span class="p">(</span><span class="s2">&quot;r&quot;</span><span class="p">);</span>
<span class="linenos">13</span> <span class="nv">$this</span><span class="o">-&gt;</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">:&#39;Hello &#39;</span> <span class="o">~</span> <span class="nv">sName</span> <span class="o">~</span> <span class="s1">&#39;!&#39;</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">&#39;date&#39;</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">&lt;?</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">&#39;sName&#39;</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">&#39;sDate&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="nb">date</span><span class="p">(</span><span class="s2">&quot;r&quot;</span><span class="p">);</span>
<span class="linenos">13</span> <span class="nv">$aParams</span><span class="p">[</span><span class="s1">&#39;aQuarter&#39;</span><span class="p">]</span> <span class="o">=</span> <span class="p">[</span><span class="s1">&#39;January&#39;</span><span class="p">,</span> <span class="s1">&#39;February&#39;</span><span class="p">,</span> <span class="s1">&#39;March&#39;</span><span class="p">];</span>
<span class="linenos">14</span> <span class="nv">$this</span><span class="o">-&gt;</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">:&#39;Hello &#39;</span> <span class="o">~</span> <span class="nv">sName</span> <span class="o">~</span> <span class="s1">&#39;!&#39;</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">&#39;date&#39;</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">:&#39;my-form&#39;</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">:&#39;month&#39;</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>&#169; 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: feature/faf_doc_twig_blocks
<span class="fa fa-caret-down"></span>
</span>
<div class="rst-other-versions">
<dl>
<dt>Branches</dt>
<dd><a href="Step3.html">feature/faf_doc_twig_blocks</a></dd>
</dl>
</div>
</div><script>
jQuery(function () {
SphinxRtdTheme.Navigation.enable(true);
});
</script>
</body>
</html>

View File

@@ -1,197 +0,0 @@
<!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 &mdash; 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="UI Components" href="../../generated/Component/Component.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>
<p class="caption" role="heading"><span class="caption-text">Tags reference:</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../../generated/Component/Component.html">UI Components</a></li>
<li class="toctree-l1"><a class="reference internal" href="../../generated/Layout/Layout.html">UI Layouts</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> &raquo;</li>
<li><a href="../TwigBaseTuto.html">Twig Base Tutorial</a> &raquo;</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, lets 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">:&#39;myform&#39;</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">:&#39;month&#39;</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">:&#39;operation&#39;</span><span class="o">,</span> <span class="nv">sValue</span><span class="s1">:&#39;SelectMonth&#39;</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">&#39;actions&#39;</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">:&#39;Ok&#39;</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">&lt;?</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">&#39;January&#39;</span><span class="p">,</span> <span class="s1">&#39;February&#39;</span><span class="p">,</span> <span class="s1">&#39;March&#39;</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">&#39;month&#39;</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">&#39;sSelectedMonth&#39;</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">-&gt;</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, dont 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">:&#39;Selected month&#39;</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">&#39;Information&#39;</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>
<a href="../../generated/Component/Component.html" class="btn btn-neutral float-right" title="UI Components" accesskey="n" rel="next">Next <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
</div>
<hr/>
<div role="contentinfo">
<p>&#169; 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: feature/faf_doc_twig_blocks
<span class="fa fa-caret-down"></span>
</span>
<div class="rst-other-versions">
<dl>
<dt>Branches</dt>
<dd><a href="Step4.html">feature/faf_doc_twig_blocks</a></dd>
</dl>
</div>
</div><script>
jQuery(function () {
SphinxRtdTheme.Navigation.enable(true);
});
</script>
</body>
</html>

View File

@@ -1,147 +0,0 @@
<!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 &mdash; 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>
<p class="caption" role="heading"><span class="caption-text">Tags reference:</span></p>
<ul>
<li class="toctree-l1"><a class="reference internal" href="../generated/Component/Component.html">UI Components</a></li>
<li class="toctree-l1"><a class="reference internal" href="../generated/Layout/Layout.html">UI Layouts</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> &raquo;</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>&#169; 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: feature/faf_doc_twig_blocks
<span class="fa fa-caret-down"></span>
</span>
<div class="rst-other-versions">
<dl>
<dt>Branches</dt>
<dd><a href="TwigBaseTuto.html">feature/faf_doc_twig_blocks</a></dd>
</dl>
</div>
</div><script>
jQuery(function () {
SphinxRtdTheme.Navigation.enable(true);
});
</script>
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 39 KiB

Some files were not shown because too many files have changed in this diff Show More