blob: d9905a46d7eb05295f51d6823a2def56a2ad80a3 [file] [log] [blame]
<!-- browserSync -->
<!-- bower:css -->
<link rel="stylesheet" href="vendor/bootstrap-css/css/bootstrap.min.css" />
<!-- endbower -->
<!-- endcss -->
<!-- inject:css -->
<link rel="stylesheet" href="/css/main.css">
<link rel="stylesheet" href="/../../../xos/core/static/xosNgLib.css">
<!-- endinject -->
<div ng-app="xos.sampleView" id="xosSampleView" class="container-fluid">
<div class="row">
<div class="col-xs-12">
<h1>Hi Matteo!</h1>
<h3>Welcome to you development environment.</h3>
<p>
We provided this environment to help you creating a custom view.
</p>
<p>
When the environment is running you will have an
<code>auto-reload</code>
feature enabled, so any time you update one of your files, the browser will be reloaded.
</p>
<p> <i>Note that is environment is already functional and that it is loading information from the XOS APIs and presenting them using the
<code>xos-table</code>
component.</i>
</p>
<h3>Development notes:</h3>
<p>
This views are designed using
<a href="https://angularjs.org/" target="_blank">Angular Js</a>
version 1.4.7 and
<a href="http://getbootstrap.com/" target="_blank">Bootstrap</a>
3.3.6 is included.
</p>
<p>
We just want to remind you that this development environment provide you three helper command:
<ul>
<li>
<code>npm start</code>
- will start your setup (you should already be familiar with it)
</li>
<li>
<code>npm test</code>
- will execute your unit tests defined with
<a href="https://karma-runner.github.io/0.13/index.html" target="_blank">Karma</a>
and
<a href="jasmine.github.io" target="_blank">Jasmine</a>
. You can check the
<code>spec/</code>
folder to see an example of your first test.
</li>
<li>
<code>npm run build</code>
- will build your dashboard and make it available to XOS
</li>
</ul>
</p>
<h3>Helpers:</h3>
<p>
We provide a set of helpers that you can leverage in your dashboard:
<ul>
<li>
<code>xos.helpers</code>
- A set of
<a href="https://docs.angularjs.org/guide/services" target="_blank">Angular Services</a>
</li>
<li>
<code>xos.uiComponents</code>
- A set of
<a href="https://docs.angularjs.org/guide/directive" target="_blank">Angular Directives</a>
</li>
<li>
<code>xos.rest</code>
- A set of
<a href="https://docs.angularjs.org/api/ngResource/service/$resource" target="_blank">Angular $resources</a>
</li>
</ul>
To know more about this helpers you can naviate to
<code>/views/ngXosLib/</code>
and generate the documentation with
<code>npm run doc</code>
</p>
<h3>Example:</h3>
</div>
</div>
<div ui-view></div>
</div>
<!-- bower:js -->
<script src="vendor/jquery/dist/jquery.js"></script>
<script src="vendor/angular/angular.js"></script>
<script src="vendor/angular-mocks/angular-mocks.js"></script>
<script src="vendor/angular-ui-router/release/angular-ui-router.js"></script>
<script src="vendor/angular-cookies/angular-cookies.js"></script>
<script src="vendor/angular-animate/angular-animate.js"></script>
<script src="vendor/angular-resource/angular-resource.js"></script>
<script src="vendor/lodash/lodash.js"></script>
<script src="vendor/bootstrap-css/js/bootstrap.min.js"></script>
<!-- endbower -->
<!-- endjs -->
<!-- inject:js -->
<script src="/../../../xos/core/xoslib/static/js/vendor/ngXosHelpers.js"></script>
<script src="/.tmp/main.js"></script>
<!-- endinject -->