docs/site/Rockwell/Optix/CreareUnaNuovaPagina/index.html

452 lines
18 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="docmd is a Node.js command-line tool for generating beautiful, lightweight static documentation sites from Markdown files.">
<link rel="canonical" href="/Rockwell/Optix/CreareUnaNuovaPagina/">
<meta property="og:title" content="Creare una nuova pagina | docmd">
<meta property="og:description" content="docmd is a Node.js command-line tool for generating beautiful, lightweight static documentation sites from Markdown files.">
<meta property="og:url" content="/Rockwell/Optix/CreareUnaNuovaPagina/">
<meta property="og:site_name" content="docmd">
<meta property="og:image" content="/assets/images/docmd-preview.png">
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Creare una nuova pagina | docmd">
<meta name="twitter:description" content="docmd is a Node.js command-line tool for generating beautiful, lightweight static documentation sites from Markdown files.">
<meta name="twitter:image" content="/assets/images/docmd-preview.png">
<title>Creare una nuova pagina : docmd</title>
<link rel="shortcut icon" href="../../assets/favicon.ico" type="image/x-icon">
<script>// Source file from the docmd project — https://github.com/mgks/docmd
/*
* Initialize the theme from localStorage
*/
(function() {
try {
const storedTheme = localStorage.getItem('docmd-theme');
if (storedTheme) {
document.documentElement.setAttribute('data-theme', storedTheme);
// Also update highlight CSS link to match the stored theme
const highlightThemeLink = document.getElementById('highlight-theme');
if (highlightThemeLink) {
const baseHref = highlightThemeLink.getAttribute('data-base-href');
if (baseHref) {
const newHref = baseHref + `docmd-highlight-${storedTheme}.css`;
highlightThemeLink.setAttribute('href', newHref);
}
}
}
} catch (e) {
console.error('Error applying theme from localStorage', e);
}
})();</script>
<link rel="stylesheet" href="../../assets/css/docmd-main.css">
<link rel="stylesheet" id="highlight-theme" href="../../assets/css/docmd-highlight-light.css" data-base-href="../../assets/css/">
<link rel="stylesheet" href="../../assets/css/docmd-theme-sky.css">
<!-- Google Analytics GA4 -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-8QVBDQ4KM1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-8QVBDQ4KM1');
</script>
</head>
<body class="sidebar-collapsible"
data-theme="light" data-default-collapsed="false"
data-copy-code-enabled="true">
<aside class="sidebar">
<div class="sidebar-header">
<a href="/" class="logo-link">
<img src="../../assets/images/docmd-logo-light.png" alt="docmd logo" class="logo-light" >
<img src="../../assets/images/docmd-logo-dark.png" alt="docmd logo" class="logo-dark" >
</a>
</div>
<nav class="sidebar-nav" aria-label="Main navigation">
<ul>
<li class="" >
<a href="../../" class="" >
<svg class="lucide-icon icon-home" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8" />
<path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
</svg>
<span class="nav-item-title">Welcome</span>
</a>
</li>
<li class="collapsible" data-nav-id="#">
<a href="#" class="" >
<svg class="lucide-icon icon-rocket" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z" />
<path d="m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z" />
<path d="M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0" />
<path d="M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5" />
</svg>
<span class="nav-item-title">Getting Started</span>
<svg class="lucide-icon icon-chevron-right collapse-icon" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="m9 18 6-6-6-6" />
</svg>
</a>
<ul class="submenu">
<li class="" >
<a href="https://docmd.mgks.dev" class="" target="_blank" rel="noopener">
<svg class="lucide-icon icon-scroll" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M19 17V5a2 2 0 0 0-2-2H4" />
<path d="M8 21h12a2 2 0 0 0 2-2v-1a1 1 0 0 0-1-1H11a1 1 0 0 0-1 1v1a2 2 0 1 1-4 0V5a2 2 0 1 0-4 0v2a1 1 0 0 0 1 1h3" />
</svg>
<span class="nav-item-title">Documentation</span>
<svg class="lucide-icon icon-external-link nav-external-icon" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 3h6v6" />
<path d="M10 14 21 3" />
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" />
</svg>
</a>
</li>
<li class="" >
<a href="https://docmd.mgks.dev/getting-started/installation" class="" target="_blank" rel="noopener">
<svg class="lucide-icon icon-download" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 15V3" />
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
<path d="m7 10 5 5 5-5" />
</svg>
<span class="nav-item-title">Installation</span>
<svg class="lucide-icon icon-external-link nav-external-icon" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 3h6v6" />
<path d="M10 14 21 3" />
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" />
</svg>
</a>
</li>
<li class="" >
<a href="https://docmd.mgks.dev/getting-started/basic-usage" class="" target="_blank" rel="noopener">
<svg class="lucide-icon icon-play" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z" />
</svg>
<span class="nav-item-title">Basic Usage</span>
<svg class="lucide-icon icon-external-link nav-external-icon" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 3h6v6" />
<path d="M10 14 21 3" />
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" />
</svg>
</a>
</li>
<li class="" >
<a href="https://docmd.mgks.dev/content" class="" target="_blank" rel="noopener">
<svg class="lucide-icon icon-layout-template" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect width="18" height="7" x="3" y="3" rx="1" />
<rect width="9" height="7" x="3" y="14" rx="1" />
<rect width="5" height="7" x="16" y="14" rx="1" />
</svg>
<span class="nav-item-title">Content</span>
<svg class="lucide-icon icon-external-link nav-external-icon" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 3h6v6" />
<path d="M10 14 21 3" />
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" />
</svg>
</a>
</li>
</ul>
</li>
<li class="" >
<a href="https://github.com/mgks/docmd" class="" target="_blank" rel="noopener">
<svg class="lucide-icon icon-github" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4" />
<path d="M9 18c-4.51 2-5-2-7-2" />
</svg>
<span class="nav-item-title">GitHub</span>
<svg class="lucide-icon icon-external-link nav-external-icon" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 3h6v6" />
<path d="M10 14 21 3" />
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" />
</svg>
</a>
</li>
<li class="" >
<a href="https://github.com/sponsors/mgks" class="" target="_blank" rel="noopener">
<svg class="lucide-icon icon-heart" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M2 9.5a5.5 5.5 0 0 1 9.591-3.676.56.56 0 0 0 .818 0A5.49 5.49 0 0 1 22 9.5c0 2.29-1.5 4-3 5.5l-5.492 5.313a2 2 0 0 1-3 .019L5 15c-1.5-1.5-3-3.2-3-5.5" />
</svg>
<span class="nav-item-title">Support the Project</span>
<svg class="lucide-icon icon-external-link nav-external-icon" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M15 3h6v6" />
<path d="M10 14 21 3" />
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" />
</svg>
</a>
</li>
</ul>
</nav>
</aside>
<div class="main-content-wrapper">
<div class="page-header">
<div class="header-left">
<button id="sidebar-toggle-button" class="sidebar-toggle-button" aria-label="Toggle Sidebar">
<svg class="lucide-icon icon-panel-left-close" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect width="18" height="18" x="3" y="3" rx="2" />
<path d="M9 3v18" />
<path d="m16 15-3-3 3-3" />
</svg>
</button>
<h1>Creare una nuova pagina</h1>
</div>
<div class="header-right">
<button id="theme-toggle-button" aria-label="Toggle theme" class="theme-toggle-button theme-toggle-header">
<svg class="lucide-icon icon-sun icon-sun" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="12" cy="12" r="4" />
<path d="M12 2v2" />
<path d="M12 20v2" />
<path d="m4.93 4.93 1.41 1.41" />
<path d="m17.66 17.66 1.41 1.41" />
<path d="M2 12h2" />
<path d="M20 12h2" />
<path d="m6.34 17.66-1.41 1.41" />
<path d="m19.07 4.93-1.41 1.41" />
</svg>
<svg class="lucide-icon icon-moon icon-moon" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401" />
</svg>
</button>
</div>
</div>
<main class="content-area">
<div class="content-layout">
<div class="main-content">
<p>import useBaseUrl from @docusaurus/useBaseUrl;</p>
<h2 id="creare-una-nuova-pagina-in-optix">🛠️ Creare una nuova pagina in Optix</h2>
<p>Creare una nuova pagina nel progetto <strong>Optix</strong> è molto semplice, ma richiede luso di un tipo derivato, non della pagina base standard. Questo perché la nostra struttura adotta proprietà estese per funzionalità avanzate.</p>
<hr>
<h3 id="dove-creare-la-pagina">📁 Dove creare la pagina</h3>
<p>Per iniziare:</p>
<ol><li>Fai <strong>clic destro</strong> sulla cartella <code>Screens</code> o su una delle sue sottocartelle.</li>
<li>Seleziona:<br>
<code>New &gt; All &gt; User interface &gt; tpTemplates &gt; tpScreens &gt; tpBaseScreen</code></li>
</ol>
<p>&lt;img src={useBaseUrl(img/screenshots/optix/createBasePage.jpg)} alt=“Creazione pagina base in Optix” style={{ maxWidth: 100%, marginTop: 1rem, borderRadius: 8px }} /&gt;</p>
<hr>
<h3 id="parametri-fondamentali">⚙️ Parametri fondamentali</h3>
<p>Una volta creata la pagina, selezionala dal menu laterale e configura i seguenti parametri nel pannello di sinistra:</p>
<table>
<thead>
<tr>
<th><strong>Parametro</strong></th>
<th><strong>Descrizione</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td><code>PageNumber</code></td>
<td>Il numero identificativo univoco della pagina. Serve sia alla documentazione che alla navigazione gestita da PLC. <strong>Deve essere univoco!</strong></td>
</tr>
<tr>
<td><code>PageName</code></td>
<td>Il nome della pagina. È un campo di tipo <strong>Localized Text</strong>, quindi può essere collegato al dizionario delle traduzioni. Verrà visualizzato insieme al <code>PageNumber</code> nell<strong>Header</strong> del pannello.</td>
</tr>
<tr>
<td><code>PageType</code></td>
<td>Definisce il tipo di pagina tramite un <strong>enumeratore</strong>. Questo valore influisce sul colore dellheader e sulla logica di accesso.</td>
</tr>
<tr>
<td><code>Father</code></td>
<td>Indica la <strong>pagina padre</strong>, ovvero quella a cui tornare premendo “indietro” nellheader del pannello.</td>
</tr>
</tbody>
</table>
<hr>
<h3 id="pagetype-elenco-dei-tipi-disponibili">🧭 PageType — Elenco dei tipi disponibili</h3>
<p>Qui sotto trovi lelenco dei valori disponibili per <code>PageType</code>:</p>
<table>
<thead>
<tr>
<th><strong>Valore</strong></th>
<th><strong>Display Name</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td>0</td>
<td>Home</td>
</tr>
<tr>
<td>1</td>
<td>Menù</td>
</tr>
<tr>
<td>2</td>
<td>Allarmi</td>
</tr>
<tr>
<td>3</td>
<td>Modalità operativa</td>
</tr>
<tr>
<td>4</td>
<td>Ricette</td>
</tr>
<tr>
<td>5</td>
<td>Abilitazioni</td>
</tr>
<tr>
<td>67</td>
<td>Reserved</td>
</tr>
<tr>
<td>8</td>
<td>Masse saldanti</td>
</tr>
<tr>
<td>9</td>
<td>Reserved</td>
</tr>
<tr>
<td>10</td>
<td>Mini setup</td>
</tr>
<tr>
<td>11</td>
<td>Full setup</td>
</tr>
<tr>
<td>12</td>
<td>Diagnostica</td>
</tr>
<tr>
<td>1319</td>
<td>Reserved</td>
</tr>
<tr>
<td>20</td>
<td>Altro</td>
</tr>
</tbody>
</table>
<blockquote>
<p>⚠️ Attenzione: I valori “Reserved” non devono essere utilizzati a meno di indicazioni specifiche da parte del team di sviluppo.</p>
</blockquote>
<hr>
<h3 id="conclusione">✅ Conclusione</h3>
<p>Seguendo questi semplici passaggi, sarai in grado di creare una pagina completamente funzionale allinterno dellambiente Optix, con parametri ben configurati per garantire compatibilità, navigazione e coerenza visiva.</p>
<p>Grandi cose ti aspettano, giovane Padawan! 🧙‍♂️✨</p>
</div>
<!-- DEBUG: {"headingsLength":5} -->
<!-- TOC sidebar -->
<div class="toc-sidebar">
<div class="toc-container">
<h2 class="toc-title">On This Page</h2>
<ul class="toc-list">
<li class="toc-item toc-level-2">
<a href="#creare-una-nuova-pagina-in-optix" class="toc-link">🛠️ Creare una nuova pagina in Optix</a>
</li>
<li class="toc-item toc-level-3">
<a href="#dove-creare-la-pagina" class="toc-link">📁 Dove creare la pagina</a>
</li>
<li class="toc-item toc-level-3">
<a href="#parametri-fondamentali" class="toc-link">⚙️ Parametri fondamentali</a>
</li>
<li class="toc-item toc-level-3">
<a href="#pagetype-elenco-dei-tipi-disponibili" class="toc-link">🧭 PageType — Elenco dei tipi disponibili</a>
</li>
<li class="toc-item toc-level-3">
<a href="#conclusione" class="toc-link">✅ Conclusione</a>
</li>
</ul>
</div>
</div>
</div>
</main>
<footer class="page-footer">
<div class="footer-content">
<div class="user-footer">
© 2025 Project.
</div>
<div class="branding-footer">
Build with <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path><path d="M12 5 9.04 7.96a2.17 2.17 0 0 0 0 3.08c.82.82 2.13.85 3 .07l2.07-1.9a2.82 2.82 0 0 1 3.79 0l2.96 2.66"></path><path d="m18 15-2-2"></path><path d="m15 18-2-2"></path></svg> <a href="https://docmd.mgks.dev" target="_blank" rel="noopener">docmd.</a>
</div>
</div>
</footer>
</div>
<script src="../../assets/js/docmd-main.js"></script>
<script src="../../assets/js/docmd-image-lightbox.js"></script>
</body>
</html>