client/app/annotationclient.html
changeset 80 dd414da0f0bb
parent 79 bd2f2c3f205c
child 81 a6bbf198bd24
equal deleted inserted replaced
79:bd2f2c3f205c 80:dd414da0f0bb
     1 <!doctype html>
       
     2 <html>
       
     3 <head>
       
     4   <meta charset="utf-8">
       
     5   <meta name="viewport" content="width=device-width, initial-scale=1">
       
     6   <title>Mons by IRI</title>
       
     7   <link rel="stylesheet" href="{{ config['STATIC_URL'] }}/css/lib.css">
       
     8   <link rel="stylesheet" href="{{ config['STATIC_URL'] }}/css/app.css">
       
     9 </head>
       
    10 <body ng-controller="homeCtrl" ng-app="mons" ng-cloak>
       
    11   <div class="container">
       
    12     <div class="row">
       
    13       <div class="col-md-12">
       
    14       <form role="form">
       
    15         <input class="form-control" placeholder="Nom d'utilisateur" ng-model="username"/>
       
    16       </form>
       
    17       </div>
       
    18     </div>
       
    19     <div class="row">
       
    20       <div class="col-md-12">
       
    21         <form role="form">
       
    22           <autocomplete ng-model="yourchoice" data="allCatLabels" attr-input-class="form-control" attr-placeholder="Catégories..." ></autocomplete>
       
    23         </form>
       
    24       </div>
       
    25     </div>
       
    26     <div class="row mons-content">
       
    27         <div class="mons-button hand return" ng-style="returnVisStyle" ng-click="selectLevel()" ng-init="returnVisStyle={visibility:'hidden'}">
       
    28           <div class="content">
       
    29               <div class="table">
       
    30                 <div class="table-cell">
       
    31                   <p class="large-cat">RETOUR</p>
       
    32                 </div>
       
    33               </div>
       
    34           </div>
       
    35         </div>
       
    36         <div class="mons-button hand send" id="sendButton" ng-click="sendAnnotation(yourchoice)" ng-class="{'success-border':sendBtnSuccess, 'error-border':sendBtnError}">
       
    37           <div class="content">
       
    38               <div class="table">
       
    39                 <div class="table-cell">
       
    40                   <p class="large-cat">ENVOYER</p>
       
    41                   <p class="normal-cat">la catégorie saisie</p>
       
    42                 </div>
       
    43               </div>
       
    44           </div>
       
    45         </div>
       
    46     </div>
       
    47     <div class="mons-content">
       
    48       <div ng-show="!selectedlevel">
       
    49           <div class="mons-button hand" ng-repeat="c in data.categories" style="background-color: {{ '{{' }} c.color {{ '}}' }}"
       
    50                                         ng-click="selectLevel(c.label, c.code, c)" ng-class="{'success-border':c.sendSuccess, 'error-border':c.sendError}">
       
    51             <div class="content">
       
    52                 <div class="table">
       
    53                   <div class="table-cell">
       
    54                     <p class="large-cat">{{ '{{' }} c.label {{ '}}' }}</p>
       
    55                     <p class="normal-cat">{{ '{{' }} c.prelabel {{ '}}' }}</p>
       
    56                   </div>
       
    57                 </div>
       
    58             </div>
       
    59           </div>
       
    60       </div>
       
    61       <div ng-show="selectedlevel">
       
    62           <div class="mons-button hand" ng-repeat="c in selectedlevel" style="background-color: {{ '{{' }} c.color {{ '}}' }}"
       
    63                                         ng-click="sendAnnotation({% raw %} (c.prelabel !== '') ? (c.prelabel + ': ' + c.label) : c.label {% endraw %}, c.code, c)" ng-class="{'success-border':c.sendSuccess, 'error-border':c.sendError}">
       
    64             <div class="content">
       
    65                 <div class="table">
       
    66                   <div class="table-cell">
       
    67                     <p class="large-cat">{{ '{{' }} c.label {{ '}}' }}</p>
       
    68                     <p class="normal-cat">{{ '{{' }} c.prelabel {{ '}}' }}</p>
       
    69                   </div>
       
    70                 </div>
       
    71             </div>
       
    72           </div>
       
    73       </div>
       
    74     </div>
       
    75     <footer>
       
    76 	  {% if logging %}<div class="row">
       
    77 	    <pre id="log" style="height: 20em; overflow-y: scroll; background-color: #faa; text-align: left;"></pre>
       
    78       </div>{% endif %}
       
    79       <div class="row">
       
    80         <div class="col-md-12 text-center">
       
    81             mons vBeta - ©IRI-2014
       
    82         </div>
       
    83       </div>
       
    84     </footer>
       
    85     <div class="row messages">
       
    86       <div class="alert" ng-class="{'alert-success':showSuccessAlert, 'alert-danger':!showSuccessAlert}" role="alert" ng-show="showAlertDiv">{{ '{{' }} alertMessage {{ '}}' }}</div>
       
    87     </div>
       
    88   </div>
       
    89   <script type="text/javascript" src="{{ config['STATIC_URL'] }}/js/lib.js"></script>
       
    90   <!--script type="text/javascript" src="{{ pre_static_path }}static/js/templates.js"></script-->
       
    91   <script type="text/javascript" src="{{ config['STATIC_URL'] }}/js/app.js"></script>
       
    92   <script type="text/javascript">
       
    93     angular.module("mons")
       
    94         .value('context', {
       
    95             {% if logging %}logging: true,{% endif %}
       
    96             urls: {
       
    97                 dataUrl: "{{ config['STATIC_URL'] }}/data/categories.json"
       
    98             },
       
    99             categories_json: '{% if categories_json %}{{categories_json}}{% endif %}',
       
   100             {% if event_code %}event_code: "{{event_code}}",{% endif %}
       
   101         });
       
   102   </script>
       
   103 </body>
       
   104 </html>