| <!DOCTYPE html> |
| |
| |
| <!-- |
| | Generated by Apache Maven Doxia Site Renderer 1.11.1 from src/site/apt/jsui/template-loading.apt |
| | Rendered using Apache Maven Fluido Skin 1.11.0 |
| --> |
| <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> |
| <head> |
| <meta charset="UTF-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> |
| <meta name="generator" content="Apache Maven Doxia Site Renderer 1.11.1" /> |
| <meta name="author" content="Olivier Lamy" /> |
| <meta name="date" content="2012-09-14" /> |
| <title>Archiva – Javascript template loading</title> |
| <link rel="stylesheet" href="../css/apache-maven-fluido-1.11.0.min.css" /> |
| <link rel="stylesheet" href="../css/site.css" /> |
| <link rel="stylesheet" href="../css/print.css" media="print" /> |
| <script src="../js/apache-maven-fluido-1.11.0.min.js"></script> |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css"> |
| |
| <!-- Matomo --> |
| <script> |
| var _paq = window._paq = window._paq || []; |
| _paq.push(['disableCookies']); |
| _paq.push(['trackPageView']); |
| _paq.push(['enableLinkTracking']); |
| |
| (function() { |
| var u="https://analytics.apache.org"; |
| _paq.push(['setTrackerUrl', u+'/matomo.php']); |
| _paq.push(['setSiteId', '10']); |
| var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; |
| g.async=true; g.src=u+'/matomo.js'; s.parentNode.insertBefore(g,s); |
| })(); |
| </script> |
| <!-- End Matomo Code --> |
| </head> |
| <body class="topBarEnabled"> |
| <a href="https://github.com/apache/archiva"> |
| <img style="position: absolute; top: 0; right: 0; border: 0; z-index: 10000;" |
| src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" |
| alt="Fork me on GitHub"> |
| </a> |
| <header id="topbar" class="navbar navbar-fixed-top "> |
| <div class="navbar-inner"> |
| <div class="container"> |
| <a data-target=".nav-collapse" data-toggle="collapse" class="btn btn-navbar"> |
| <span class="icon-bar"></span> |
| <span class="icon-bar"></span> |
| <span class="icon-bar"></span> |
| </a> |
| <nav class="nav-collapse"> |
| <ul class="nav"> |
| <li class="dropdown"> |
| <a class="dropdown-toggle" data-toggle="dropdown">Introduction <b class="caret"></b></a> |
| <ul class="dropdown-menu"> |
| <li><a href="../index.html" title="About">About</a></li> |
| <li><a href="../download.html" title="Downloads">Downloads</a></li> |
| <li><a href="../versions.html" title="Versions">Versions</a></li> |
| <li><a href="../mailing-lists.html" title="Mailing Lists">Mailing Lists</a></li> |
| <li><a href="../security.html" title="Security">Security</a></li> |
| <li class="dropdown-submenu"> |
| <a href="../" title="Documentation">Documentation</a> |
| <ul class="dropdown-menu"> |
| <li><a href="../docs/2.2.10/" title="Release 2.2.10">Release 2.2.10</a></li> |
| <li><a href="../docs/3.0.0-SNAPSHOT/" title="Dev 3.0.0-SNAPSHOT">Dev 3.0.0-SNAPSHOT</a></li> |
| </ul> |
| </li> |
| </ul> |
| </li> |
| <li class="dropdown"> |
| <a class="dropdown-toggle" data-toggle="dropdown">Development <b class="caret"></b></a> |
| <ul class="dropdown-menu"> |
| <li><a href="../developers/building.html" title="Build Apache Archiva">Build Apache Archiva</a></li> |
| <li><a href="../get-involved.html" title="Get involved">Get involved</a></li> |
| <li><a href="../developers/how-we-do-things.html" title="How we do things">How we do things</a></li> |
| <li class="dropdown-submenu"> |
| <a href="../" title="Developer Reference">Developer Reference</a> |
| <ul class="dropdown-menu"> |
| <li><a href="../ref/2.2.10/index.html" title="Archiva 2.2.10">Archiva 2.2.10</a></li> |
| <li><a href="../ref/3.0.0-SNAPSHOT/index.html" title="Archiva 3.0.0-SNAPSHOT">Archiva 3.0.0-SNAPSHOT</a></li> |
| <li><a href="../redback/core/3.0.0-SNAPSHOT/index.html" title="Redback 3.0.0-SNAPSHOT">Redback 3.0.0-SNAPSHOT</a></li> |
| </ul> |
| </li> |
| <li><a href="../redback/index.html" title="Redback">Redback</a></li> |
| <li><a href="../components/index.html" title="Archiva Components Project">Archiva Components Project</a></li> |
| <li class="dropdown-submenu"> |
| <a href="../jsui/index.html" title="Javascript application Architecture">Javascript application Architecture</a> |
| <ul class="dropdown-menu"> |
| <li><a href="../jsui/rest.html" title="Rest service">Rest service</a></li> |
| <li><a title="JS Template loading">JS Template loading</a></li> |
| <li><a href="../jsui/i18n.html" title="i18n">i18n</a></li> |
| <li><a href="../jsui/knockout-binding.html" title="Knockout Binding">Knockout Binding</a></li> |
| <li><a href="../jsui/generics-js.html" title="Generic Javascipts">Generic Javascipts</a></li> |
| </ul> |
| </li> |
| <li><a href="../developers/releasing.html" title="Releasing">Releasing</a></li> |
| <li><a href="../developers/publishing-site.html" title="Site Publish">Site Publish</a></li> |
| </ul> |
| </li> |
| <li class="dropdown"> |
| <a class="dropdown-toggle" data-toggle="dropdown">ASF <b class="caret"></b></a> |
| <ul class="dropdown-menu"> |
| <li><a href="https://www.apache.org/foundation/how-it-works.html" title="How Apache Works">How Apache Works</a></li> |
| <li><a href="https://www.apache.org/foundation/" title="Foundation">Foundation</a></li> |
| <li><a href="https://www.apache.org/foundation/sponsorship.html" title="Sponsoring Apache">Sponsoring Apache</a></li> |
| <li><a href="https://www.apache.org/foundation/thanks.html" title="Thanks">Thanks</a></li> |
| </ul> |
| </li> |
| <li class="dropdown"> |
| <a class="dropdown-toggle" data-toggle="dropdown">Project Documentation <b class="caret"></b></a> |
| <ul class="dropdown-menu"> |
| <li class="dropdown-submenu"> |
| <a href="../project-info.html" title="Project Information">Project Information</a> |
| <ul class="dropdown-menu"> |
| <li><a href="../ci-management.html" title="CI Management">CI Management</a></li> |
| <li><a href="../mailing-lists.html" title="Mailing Lists">Mailing Lists</a></li> |
| <li><a href="../issue-management.html" title="Issue Management">Issue Management</a></li> |
| <li><a href="../licenses.html" title="Licenses">Licenses</a></li> |
| <li><a href="../team.html" title="Team">Team</a></li> |
| <li><a href="../scm.html" title="Source Code Management">Source Code Management</a></li> |
| </ul> |
| </li> |
| </ul> |
| </li> |
| </ul> |
| </nav> |
| <div class="nav-collapse"> |
| <form id="search-form" action="https://www.google.com/search" method="get" class="navbar-search pull-right" > |
| <input value="https://archiva.apache.org/" name="sitesearch" type="hidden"/> |
| <input class="search-query" name="q" id="query" type="text" /> |
| </form> |
| <script>asyncJs( 'https://cse.google.com/brand?form=search-form' )</script> |
| </div> |
| </div> |
| </div> |
| </header> |
| <div class="container"> |
| <header> |
| <div id="banner"> |
| <div class="pull-left"><a href="../index.html" id="bannerLeft"><img src="../images/archiva.png" alt="Apache Archiva" style="" /></a></div> |
| <div class="pull-right"><a href="https://www.apache.org/" id="bannerRight"><img src="https://www.apache.org/images/asf_logo_wide_2016.png" alt="Apache Software Foundation" style="" /></a></div> |
| <div class="clear"><hr/></div> |
| </div> |
| |
| <div id="breadcrumbs"> |
| <ul class="breadcrumb"> |
| <li class=""><a href="https://www.apache.org" class="externalLink" title="Apache">Apache</a><span class="divider">/</span></li> |
| <li class=""><a href="../" title="Archiva">Archiva</a><span class="divider">/</span></li> |
| <li class="active ">Javascript template loading</li> |
| <li id="publishDate" class="pull-right">Last Published: 20 Mar 2023</li> |
| </ul> |
| </div> |
| </header> |
| <main id="bodyColumn" > |
| <section> |
| <h2><a name="Html.2FJavascript_templates_loading"></a>Html/Javascript templates loading</h2> |
| <p>Templates are loaded on application loaded and added in the hidden div <b>#html-fragments</b>.</p> |
| <p>They are loaded using requirejs and the text plugin.</p> |
| <p>archiva templates are loaded as it <code>NOTE: the no cache is activated only on dev mode</code></p> |
| <div class="source"><pre class="prettyprint">require(['jquery',"jquery.tmpl",'i18n',"utils","text!templates/archiva/menu.html", |
| "text!templates/archiva/generics.html", |
| "text!templates/archiva/modal.html", |
| "text!templates/archiva/repositories.html", |
| "text!templates/archiva/search.html", |
| "text!templates/archiva/general-admin.html"], |
| function(jquery,jqueryTmpl,i18n,utils,menu,generics,modal,repositories, |
| search,general_admin) { |
| loadArchivaTemplate=function(){ |
| var htmlFragment=$("#html-fragments"); |
| // template loading |
| htmlFragment.append(menu); |
| htmlFragment.append(generics); |
| $.tmpl( modal ).appendTo(htmlFragment); |
| htmlFragment.append(repositories); |
| htmlFragment.append(search); |
| htmlFragment.append(general_admin); |
| $.log("main-tmpl.js loaded"); |
| } |
| } |
| );</pre></div><section> |
| <h3><a name="i18n_in_templates"></a>i18n in templates</h3><section> |
| <h4><a name="static_templates"></a>static templates</h4> |
| <p>Some templates which are only simple html which only need i18n are executed immediatly.</p> |
| <p>Simply use:</p> |
| <div class="source"><pre class="prettyprint"> $.tmpl( menu, $.i18n.map ).appendTo("#html-fragments"); |
| to get i18n values in your template you can use |
| ${register} or ${$.i18n.prop('register')} |
| |
| Note if you use the simple form ${register} and the property is not available, the template system will try to use if exists the function register |
| </pre></div></section><section> |
| <h4><a name="dynamic_templates"></a>dynamic templates</h4> |
| <p>The others are only inserted in #html-fragments.</p></section></section></section> |
| </main> |
| </div> |
| <hr/> |
| <footer> |
| <div class="container"> |
| <div class="row"> |
| <div class="row pull-left">Apache Archiva, Archiva, Apache, the Apache feather logo, and the Apache Archiva project logos are trademarks of The Apache Software Foundation.</div> |
| <div class="row"> |
| |
| </div> |
| <div class="row"> |
| <p> |
| <a href="https://archiva.apache.org/privacy-policy.html">Privacy Policy</a> |
| </p> |
| </div> |
| </div> |
| <p id="poweredBy" class="pull-right"><a href="http://maven.apache.org/" title="Built by Maven" class="poweredBy"><img class="builtBy" alt="Built by Maven" src="../images/logos/maven-feather.png" /></a> |
| </p> |
| </div> |
| </footer> |
| <script> |
| if(anchors) { |
| anchors.add(); |
| } |
| </script> |
| </body> |
| </html> |
