src/widgets/Polemic.js
branchnew-model
changeset 930 165f236e42f2
parent 925 28efc97b5d78
child 937 eb3c442cec50
equal deleted inserted replaced
929:a39ff507b050 930:165f236e42f2
    23     annotation_type : "tweet",
    23     annotation_type : "tweet",
    24     defaultcolor : "#585858",
    24     defaultcolor : "#585858",
    25     foundcolor : "#fc00ff",
    25     foundcolor : "#fc00ff",
    26     polemics : [
    26     polemics : [
    27         {
    27         {
       
    28             "name" : "OK",
    28             "keywords" : [ "++" ],
    29             "keywords" : [ "++" ],
    29             "color" : "#1D973D"
    30             "color" : "#1D973D"
    30         },
    31         },
    31         {
    32         {
       
    33             "name" : "KO",
    32             "keywords" : [ "--" ],
    34             "keywords" : [ "--" ],
    33             "color" : "#CE0A15"
    35             "color" : "#CE0A15"
    34         },
    36         },
    35         {
    37         {
       
    38             "name" : "REF",
    36             "keywords" : [ "==", "http://" ],
    39             "keywords" : [ "==", "http://" ],
    37             "color" : "#C5A62D"  
    40             "color" : "#C5A62D"  
    38         },
    41         },
    39         {
    42         {
       
    43             "name" : "Q",
    40             "keywords" : [ "?" ],
    44             "keywords" : [ "?" ],
    41             "color" : "#036AAE"
    45             "color" : "#036AAE"
    42         }
    46         }
    43     ]
    47     ]
    44 };
    48 };
   142             });
   146             });
   143             
   147             
   144             var _x = 0,
   148             var _x = 0,
   145                 _html = '';
   149                 _html = '';
   146             
   150             
   147             function displayElement(_x, _y, _color, _id, _title) {
   151             function displayElement(_x, _y, _color, _id, _title, _polemic) {
   148                 _html += Mustache.to_html(
   152                 _html += Mustache.to_html(
   149                     '<div class="Ldt-Polemic-TweetDiv Ldt-TraceMe" trace-info="annotation-id:{{id}}" annotation-id="{{id}}" tweet-title="{{title}}" pos-x="{{posx}}" pos-y="{{top}}" polemic-color="{{color}}"'
   153                     '<div class="Ldt-Polemic-TweetDiv Ldt-TraceMe" trace-info="annotation-id:{{id}}, media-id={{media_id}}, polemic={{polemic}}" annotation-id="{{id}}" tweet-title="{{title}}" pos-x="{{posx}}" pos-y="{{top}}" polemic-color="{{color}}"'
   150                     + ' style="width: {{width}}px; height: {{height}}px; top: {{top}}px; left: {{left}}px; background: {{color}}"></div>',
   154                     + ' style="width: {{width}}px; height: {{height}}px; top: {{top}}px; left: {{left}}px; background: {{color}}"></div>',
   151                 {
   155                 {
   152                     id: _id,
   156                     id: _id,
       
   157                     media_id: _this.source.currentMedia.id,
       
   158                     polemic: _polemic,
   153                     title: _title,
   159                     title: _title,
   154                     posx: Math.floor(_x + (_this.element_width - 1) / 2),
   160                     posx: Math.floor(_x + (_this.element_width - 1) / 2),
   155                     left: _x,
   161                     left: _x,
   156                     top: _y,
   162                     top: _y,
   157                     color: _color,
   163                     color: _color,
   162             
   168             
   163             IriSP._(_slices).forEach(function(_slice) {
   169             IriSP._(_slices).forEach(function(_slice) {
   164                 var _y = _this.height;
   170                 var _y = _this.height;
   165                 _slice.annotations.forEach(function(_annotation) {
   171                 _slice.annotations.forEach(function(_annotation) {
   166                     _y -= _this.element_height;
   172                     _y -= _this.element_height;
   167                     displayElement(_x, _y, _this.defaultcolor, _annotation.id, _annotation.title);
   173                     displayElement(_x, _y, _this.defaultcolor, _annotation.id, _annotation.title, "none");
   168                 });
   174                 });
   169                 IriSP._(_slice.polemicStacks).forEach(function(_annotations, _j) {
   175                 IriSP._(_slice.polemicStacks).forEach(function(_annotations, _j) {
   170                     var _color = _this.polemics[_j].color;
   176                     var _color = _this.polemics[_j].color,
       
   177                         _polemic = _this.polemics[_j].name;
   171                     _annotations.forEach(function(_annotation) {
   178                     _annotations.forEach(function(_annotation) {
   172                         _y -= _this.element_height;
   179                         _y -= _this.element_height;
   173                         displayElement(_x, _y, _color, _annotation.id, _annotation.title);
   180                         displayElement(_x, _y, _color, _annotation.id, _annotation.title, _polemic);
   174                     });
   181                     });
   175                 });
   182                 });
   176                 _x += _this.element_width;
   183                 _x += _this.element_width;
   177             });
   184             });
   178             
   185             
   213         
   220         
   214         var _x = 0,
   221         var _x = 0,
   215             _html = '',
   222             _html = '',
   216             _scale = this.max_elements * this.element_height / _max;
   223             _scale = this.max_elements * this.element_height / _max;
   217             
   224             
   218         function displayStackElement(_x, _y, _h, _color, _nums, _begin, _end) {
   225         function displayStackElement(_x, _y, _h, _color, _nums, _begin, _end, _polemic) {
   219             _html += Mustache.to_html(
   226             _html += Mustache.to_html(
   220                 '<div class="Ldt-Polemic-TweetDiv Ldt-TraceMe" trace-info="annotation-block,time:{{begin}}" pos-x="{{posx}}" pos-y="{{top}}" annotation-counts="{{nums}}" begin-time="{{begin}}" end-time="{{end}}"'
   227                 '<div class="Ldt-Polemic-TweetDiv Ldt-TraceMe" trace-info="annotation-block, media-id={{media_id}}, polemic={{polemic}}, time:{{begin}}" pos-x="{{posx}}" pos-y="{{top}}" annotation-counts="{{nums}}" begin-time="{{begin}}" end-time="{{end}}"'
   221                 + ' style="width: {{width}}px; height: {{height}}px; top: {{top}}px; left: {{left}}px; background: {{color}}"></div>',
   228                 + ' style="width: {{width}}px; height: {{height}}px; top: {{top}}px; left: {{left}}px; background: {{color}}"></div>',
   222             {
   229             {
   223                 nums: _nums,
   230                 nums: _nums,
   224                 posx: Math.floor(_x + (_this.element_width - 1) / 2),
   231                 posx: Math.floor(_x + (_this.element_width - 1) / 2),
       
   232                 media_id: _this.source.currentMedia.id,
       
   233                 polemic: _polemic,
   225                 left: _x,
   234                 left: _x,
   226                 top: _y,
   235                 top: _y,
   227                 color: _color,
   236                 color: _color,
   228                 width: (_this.element_width-1),
   237                 width: (_this.element_width-1),
   229                 height: _h,
   238                 height: _h,
   238                     return _annotations.length
   247                     return _annotations.length
   239                 }).join(",");
   248                 }).join(",");
   240             if (_slice.annotations.length) {
   249             if (_slice.annotations.length) {
   241                 var _h = Math.ceil(_scale * _slice.annotations.length);
   250                 var _h = Math.ceil(_scale * _slice.annotations.length);
   242                 _y -= _h;
   251                 _y -= _h;
   243                 displayStackElement(_x, _y, _h, _this.defaultcolor, _nums, _slice.begin, _slice.end);
   252                 displayStackElement(_x, _y, _h, _this.defaultcolor, _nums, _slice.begin, _slice.end, "none");
   244             }
   253             }
   245             IriSP._(_slice.polemicStacks).forEach(function(_annotations, _j) {
   254             IriSP._(_slice.polemicStacks).forEach(function(_annotations, _j) {
   246                 if (_annotations.length) {
   255                 if (_annotations.length) {
   247                     var _color = _this.polemics[_j].color,
   256                     var _color = _this.polemics[_j].color,
       
   257                         _polemic = _this.polemics[_j].name,
   248                         _h = Math.ceil(_scale * _annotations.length);
   258                         _h = Math.ceil(_scale * _annotations.length);
   249                     _y -= _h;
   259                     _y -= _h;
   250                     displayStackElement(_x, _y, _h, _color, _nums, _slice.begin, _slice.end);
   260                     displayStackElement(_x, _y, _h, _color, _nums, _slice.begin, _slice.end, _polemic);
   251                 }
   261                 }
   252             });
   262             });
   253             _x += _this.element_width;
   263             _x += _this.element_width;
   254         });
   264         });
   255         
   265