annot-server/webapp/templates/annotviz.html
changeset 110 e4f0c105090d
parent 108 082b64a5c699
child 113 7531e4180915
equal deleted inserted replaced
109:8546e2181a73 110:e4f0c105090d
    17     <script src="{{ config['STATIC_URL'] }}/js/libs-annotviz.min.js"></script>
    17     <script src="{{ config['STATIC_URL'] }}/js/libs-annotviz.min.js"></script>
    18     <script src="{{ config['STATIC_URL'] }}/js/annotviz.min.js"></script>
    18     <script src="{{ config['STATIC_URL'] }}/js/annotviz.min.js"></script>
    19     <script>
    19     <script>
    20 
    20 
    21     var PIXI = require('pixi');
    21     var PIXI = require('pixi');
    22     var annotCategories = [];
    22     var annotCategories = [
       
    23         {
       
    24             "ts": 1421928213000,
       
    25             "colors": {
       
    26                 "transgressions": "#b90000",
       
    27                 "rythmique": "#af931e",
       
    28                 "narration": "#4bdd71",
       
    29                 "relation": "#1c28ba"
       
    30             },
       
    31             "order": [
       
    32                 "transgressions",
       
    33                 "rythmique",
       
    34                 "narration",
       
    35                 "relation"
       
    36             ],
       
    37             "defaultColor": "#536991"
       
    38         }
       
    39     ];
    23 
    40 
    24     function colorToHex(input) {
    41     function colorToHex(c) {
    25         if (input.substring(0, 1) === '#') {
    42         var m = /rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/.exec(c);
    26             return input;
    43         return m ? '#' + (1 << 24 | m[1] << 16 | m[2] << 8 | m[3]).toString(16).substr(1) : c;
    27         }
       
    28         else {
       
    29             var m = input.match(/^rgb\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/i);
       
    30             var r = m[1], g=[2], b=[3];
       
    31             return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
       
    32         }
       
    33     }
    44     }
    34 
    45 
    35     function getAnnotCategories(ecode, serverUrl) {
    46     function getAnnotCategories(ecode, serverUrl) {
    36 
    47 
    37         var url = serverUrl+"/p/api/v1/event/" + ecode;
    48         var url = serverUrl+"/p/api/v1/event/" + ecode;
    55                     annotCat.colors[cat.code] = colorToHex(cat.color);
    66                     annotCat.colors[cat.code] = colorToHex(cat.color);
    56                 });
    67                 });
    57                 annotCat.defaultColor = categoriesJson.defaultColor || "#536991";
    68                 annotCat.defaultColor = categoriesJson.defaultColor || "#536991";
    58                 annotCategories.push(annotCat);
    69                 annotCategories.push(annotCat);
    59             });
    70             });
    60             console.log(annotCategories);
    71             console.log(JSON.stringify(annotCategories, null, '  '));
    61         });
    72         });
    62 
    73 
    63         jsonLoader.load();
    74         jsonLoader.load();
    64     }
    75     }
    65 
    76 
    84     var annotsvizview = new annotviz.AnnotsVizView({
    95     var annotsvizview = new annotviz.AnnotsVizView({
    85         logger: logger,
    96         logger: logger,
    86         stageView: stageView,
    97         stageView: stageView,
    87         wsPianoroll: new annotviz.WsWrapper(wsUriPianoroll, logger),
    98         wsPianoroll: new annotviz.WsWrapper(wsUriPianoroll, logger),
    88         wsAnnot: new annotviz.WsWrapper(wsUriAnnotation, logger),
    99         wsAnnot: new annotviz.WsWrapper(wsUriAnnotation, logger),
       
   100         annotCategories: annotCategories
    89     });
   101     });
    90 
   102 
    91 
   103 
    92     function stop() {
   104     function stop() {
    93         stageView.stop();
   105         stageView.stop();