Matteo Scandolo | 4fc06db | 2016-04-29 09:14:58 -0700 | [diff] [blame^] | 1 | <!-- browserSync --> |
| 2 | <!-- bower:css --> |
| 3 | <link rel="stylesheet" href="vendor/bootstrap-css/css/bootstrap.min.css" /> |
| 4 | <!-- endbower --> |
| 5 | <!-- endcss --> |
| 6 | <!-- inject:css --> |
| 7 | <link rel="stylesheet" href="/css/main.css"> |
| 8 | <link rel="stylesheet" href="/../../../xos/core/static/xosNgLib.css"> |
| 9 | <!-- endinject --> |
| 10 | |
| 11 | <div ng-app="xos.helperView" id="xosHelperView" class="container-fluid"> |
| 12 | <div class="row"> |
| 13 | <div class="col-xs-12"> |
| 14 | <h1>Hi Matteo!</h1> |
| 15 | <h3>Welcome to you development environment.</h3> |
| 16 | <p> |
| 17 | We provided this environment to help you creating a custom view. |
| 18 | </p> |
| 19 | <p> |
| 20 | When the environment is running you will have an |
| 21 | <code>auto-reload</code> |
| 22 | feature enabled, so any time you update one of your files, the browser will be reloaded. |
| 23 | </p> |
| 24 | <p> <i>Note that is environment is already functional and that it is loading information from the XOS APIs and presenting them using the |
| 25 | <code>xos-table</code> |
| 26 | component.</i> |
| 27 | </p> |
| 28 | <h3>Development notes:</h3> |
| 29 | <p> |
| 30 | This views are designed using |
| 31 | <a href="https://angularjs.org/" target="_blank">Angular Js</a> |
| 32 | version 1.4.7 and |
| 33 | <a href="http://getbootstrap.com/" target="_blank">Bootstrap</a> |
| 34 | 3.3.6 is included. |
| 35 | </p> |
| 36 | <p> |
| 37 | We just want to remind you that this development environment provide you three helper command: |
| 38 | <ul> |
| 39 | <li> |
| 40 | <code>npm start</code> |
| 41 | - will start your setup (you should already be familiar with it) |
| 42 | </li> |
| 43 | <li> |
| 44 | <code>npm test</code> |
| 45 | - will execute your unit tests defined with |
| 46 | <a href="https://karma-runner.github.io/0.13/index.html" target="_blank">Karma</a> |
| 47 | and |
| 48 | <a href="jasmine.github.io" target="_blank">Jasmine</a> |
| 49 | . You can check the |
| 50 | <code>spec/</code> |
| 51 | folder to see an example of your first test. |
| 52 | </li> |
| 53 | <li> |
| 54 | <code>npm run build</code> |
| 55 | - will build your dashboard and make it available to XOS |
| 56 | </li> |
| 57 | </ul> |
| 58 | </p> |
| 59 | <h3>Helpers:</h3> |
| 60 | <p> |
| 61 | We provide a set of helpers that you can leverage in your dashboard: |
| 62 | <ul> |
| 63 | <li> |
| 64 | <code>xos.helpers</code> |
| 65 | - A set of |
| 66 | <a href="https://docs.angularjs.org/guide/services" target="_blank">Angular Services</a> |
| 67 | </li> |
| 68 | <li> |
| 69 | <code>xos.uiComponents</code> |
| 70 | - A set of |
| 71 | <a href="https://docs.angularjs.org/guide/directive" target="_blank">Angular Directives</a> |
| 72 | </li> |
| 73 | <li> |
| 74 | <code>xos.rest</code> |
| 75 | - A set of |
| 76 | <a href="https://docs.angularjs.org/api/ngResource/service/$resource" target="_blank">Angular $resources</a> |
| 77 | </li> |
| 78 | </ul> |
| 79 | To know more about this helpers you can naviate to |
| 80 | <code>/views/ngXosLib/</code> |
| 81 | and generate the documentation with |
| 82 | <code>npm run doc</code> |
| 83 | </p> |
| 84 | <h3>Example:</h3> |
| 85 | </div> |
| 86 | </div> |
| 87 | <div ui-view></div> |
| 88 | </div> |
| 89 | |
| 90 | <!-- bower:js --> |
| 91 | <script src="vendor/jquery/dist/jquery.js"></script> |
| 92 | <script src="vendor/angular/angular.js"></script> |
| 93 | <script src="vendor/angular-mocks/angular-mocks.js"></script> |
| 94 | <script src="vendor/angular-ui-router/release/angular-ui-router.js"></script> |
| 95 | <script src="vendor/angular-cookies/angular-cookies.js"></script> |
| 96 | <script src="vendor/angular-animate/angular-animate.js"></script> |
| 97 | <script src="vendor/angular-resource/angular-resource.js"></script> |
| 98 | <script src="vendor/lodash/lodash.js"></script> |
| 99 | <script src="vendor/bootstrap-css/js/bootstrap.min.js"></script> |
| 100 | <!-- endbower --> |
| 101 | <!-- endjs --> |
| 102 | <!-- inject:js --> |
| 103 | <script src="/../../../xos/core/xoslib/static/js/vendor/ngXosHelpers.js"></script> |
| 104 | <script src="/.tmp/main.js"></script> |
| 105 | <!-- endinject --> |