Wiki
Clone wikiamarok3 / Templates
Os arquivos de views usados no amarok sao templates de SMARTY
A tag padrao do Smarty foi modificada pra nao conflitar com o Angular e nem os Js da pagina. Fica livre a transicao de informacoes do PHP e o Js script da Pagina.
como usar um layout da web ou entender como funciona , tah aqui Envio de temas e templates
Um Otimo exemplo disse eh para usar funcoes ajax na pagina seu template deve sempre ter a Tag Tag padrao SMARTY : {? ... ?} Os templates devem comecar do body os includes de css devem vir em seguida, logo apos o html , e no rodape o js global. Por padrao vem carregados : Jquery , Twitter Bootstrap e AngularJs.
index.tpl
#!html <body> <!-- Main stylesheets --> <link href="{?$css?}main.css" rel="stylesheet" type="text/css"> <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements --> <!--[if lt IE 9]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <div class="navbar navbar-inverse navbar-fixed-top"> <div class="navbar-inner"> <div class="container"> <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="brand" href="#">{?$nome_site?}</a> <div class="nav-collapse collapse"> <ul class="nav"> <li class="active"><a href="home">Home</a></li> <li><a href="conectar">Conectar</a></li> <li><a href="forms">Forms</a></li> <li><a href="contato">Contato</a></li> <li><a href="logoff">Logoff</a></li> </ul> </div><!--/.nav-collapse --> </div> </div> </div> <div class="container"> {?include file=$partial?} </div> <!-- /container --> <script type="text/javascript" src="{?$js?}exemplo.js"></script> <script type="text/javascript"> // document ready function $(document).ready(function() { console.log("javascript aqui"); }); </script> </body>
_home.tpl
#!html <!--pode ter listagem de entidades do sistema. --> <script> function ExemploListCtrl($scope) { {?carregar entidade="usuario" nome="zezinho"?} {?lista entidade="grupo" nome="grupos"?} } </script> <div class="container" style="padding-top: 60px" ng-controller="ExemploListCtrl"> Filtro: <input ng-model="query"> <ul> <li ng-repeat="grupo in grupos | filter:query"> {{grupo.NOME}} <p>{{grupo.DESCRICAO}}</p> </li> </ul> ..{{zezinho.NOME}}.. <br> Filtro: <input ng-model="usuario.NOME"> <ul> <li ng-repeat="endereco in usuario.ENDERECO"> <p>{{endereco}}</p> </li> </ul> </div>
Aqui carregamos do servidor {? ... ?}os dados de um usuario ou uma listagem de grupos e usamos elas na paina como se fossem um objeto json , repare que p fpreach eh uma tag html e nao uma class ou id.
Updated