1 IriSP.Widgets.Tagcloud = function(player, config) { |
1 import Mustache from "mustache"; |
2 IriSP.Widgets.Widget.call(this, player, config); |
2 import _ from "lodash"; |
3 this.stopwords = IriSP._.uniq([].concat(this.custom_stopwords).concat(this.stopword_lists[this.stopword_language])); |
3 |
4 }; |
4 import tagcloudStyles from "./Tagcloud.module.css"; |
5 |
5 |
6 IriSP.Widgets.Tagcloud.prototype = new IriSP.Widgets.Widget(); |
6 const Tagcloud = function (ns) { |
7 |
7 return class extends ns.Widgets.Widget { |
8 IriSP.Widgets.Tagcloud.prototype.template = |
8 constructor(player, config) { |
9 '<div class="Ldt-Tagcloud-Container"><ul class="Ldt-Tagcloud-List">' |
9 super(player, config); |
10 + '{{#words}}<li class="Ldt-Tagcloud-item Ldt-TraceMe" trace-info="tag:{{word}}" content="{{word}}" style="font-size: {{size}}px">{{word}}</li>{{/words}}' |
10 this.stopwords = _.uniq( |
11 + '</ul></div>'; |
11 [] |
12 |
12 .concat(this.custom_stopwords) |
13 IriSP.Widgets.Tagcloud.prototype.defaults = { |
13 .concat(this.stopword_lists[this.stopword_language]) |
14 include_titles: true, |
14 ); |
15 include_descriptions: true, |
15 } |
16 include_tag_texts: true, |
16 |
17 tag_count: 30, |
17 static template = |
18 stopword_language: "fr", |
18 '<div class="Ldt-Tagcloud-Container"><ul class="Ldt-Tagcloud-List">' + |
19 custom_stopwords: [], |
19 '{{#words}}<li class="Ldt-Tagcloud-item Ldt-TraceMe" trace-info="tag:{{word}}" content="{{word}}" style="font-size: {{size}}px">{{word}}</li>{{/words}}' + |
20 exclude_pattern: false, |
20 "</ul></div>"; |
21 annotation_type: false, |
21 |
22 segment_annotation_type: false, |
22 static defaults = { |
23 min_font_size: 10, |
23 include_titles: true, |
24 max_font_size: 26, |
24 include_descriptions: true, |
25 min_count: 2, |
25 include_tag_texts: true, |
26 remove_zero_duration: false |
26 tag_count: 30, |
27 }; |
27 stopword_language: "fr", |
28 |
28 custom_stopwords: [], |
29 IriSP.Widgets.Tagcloud.prototype.stopword_lists = { |
29 exclude_pattern: false, |
30 "fr" : [ |
30 annotation_type: false, |
31 'aussi', 'avec', 'aux', 'bien', 'car', 'cette', 'comme', 'dans', 'des', 'donc', 'dont', 'elle', 'encore', 'entre', 'est', |
31 segment_annotation_type: false, |
32 'être', 'eux', 'faire', 'fait', 'http', 'ici', 'ils', 'les', 'leur', 'leurs', 'mais', 'mes', 'même', 'mon', 'notre', |
32 min_font_size: 10, |
33 'non', 'nos', 'nous', 'ont', 'par', 'pas', 'peu', 'peut', 'plus', 'pour', 'quand', 'que', 'qui', 'quoi', 'sans', |
33 max_font_size: 26, |
34 'ses' ,'son', 'sont', 'sur', 'tes', 'très', 'the', 'ton', 'tous', 'tout', 'une', 'votre', 'vos', 'vous' |
34 min_count: 2, |
35 ], |
35 remove_zero_duration: false, |
36 "en" : [ |
36 }; |
37 'about', 'again', 'are', 'and', 'because', 'being', 'but', 'can', 'done', 'have', 'for', 'from', |
37 |
38 'get', 'here', 'http', 'like', 'more', 'one', 'our', 'she', 'that', 'the', 'their', 'then', 'there', |
38 stopword_lists = { |
39 'they', 'this', 'very', 'what', 'when', 'where', 'who', 'why', 'will', 'with', 'www', 'you', 'your' |
39 fr: [ |
40 ] |
40 "aussi", |
41 }; |
41 "avec", |
42 |
42 "aux", |
43 IriSP.Widgets.Tagcloud.prototype.draw = function() { |
43 "bien", |
44 |
44 "car", |
45 if (this.segment_annotation_type) { |
45 "cette", |
|
46 "comme", |
|
47 "dans", |
|
48 "des", |
|
49 "donc", |
|
50 "dont", |
|
51 "elle", |
|
52 "encore", |
|
53 "entre", |
|
54 "est", |
|
55 "être", |
|
56 "eux", |
|
57 "faire", |
|
58 "fait", |
|
59 "http", |
|
60 "ici", |
|
61 "ils", |
|
62 "les", |
|
63 "leur", |
|
64 "leurs", |
|
65 "mais", |
|
66 "mes", |
|
67 "même", |
|
68 "mon", |
|
69 "notre", |
|
70 "non", |
|
71 "nos", |
|
72 "nous", |
|
73 "ont", |
|
74 "par", |
|
75 "pas", |
|
76 "peu", |
|
77 "peut", |
|
78 "plus", |
|
79 "pour", |
|
80 "quand", |
|
81 "que", |
|
82 "qui", |
|
83 "quoi", |
|
84 "sans", |
|
85 "ses", |
|
86 "son", |
|
87 "sont", |
|
88 "sur", |
|
89 "tes", |
|
90 "très", |
|
91 "the", |
|
92 "ton", |
|
93 "tous", |
|
94 "tout", |
|
95 "une", |
|
96 "votre", |
|
97 "vos", |
|
98 "vous", |
|
99 ], |
|
100 en: [ |
|
101 "about", |
|
102 "again", |
|
103 "are", |
|
104 "and", |
|
105 "because", |
|
106 "being", |
|
107 "but", |
|
108 "can", |
|
109 "done", |
|
110 "have", |
|
111 "for", |
|
112 "from", |
|
113 "get", |
|
114 "here", |
|
115 "http", |
|
116 "like", |
|
117 "more", |
|
118 "one", |
|
119 "our", |
|
120 "she", |
|
121 "that", |
|
122 "the", |
|
123 "their", |
|
124 "then", |
|
125 "there", |
|
126 "they", |
|
127 "this", |
|
128 "very", |
|
129 "what", |
|
130 "when", |
|
131 "where", |
|
132 "who", |
|
133 "why", |
|
134 "will", |
|
135 "with", |
|
136 "www", |
|
137 "you", |
|
138 "your", |
|
139 ], |
|
140 }; |
|
141 |
|
142 draw() { |
|
143 if (this.segment_annotation_type) { |
46 var _this = this; |
144 var _this = this; |
47 this.source.getAnnotationsByTypeTitle(this.segment_annotation_type).forEach(function(_a) { |
145 this.source |
48 _a.on("enter", function() { |
146 .getAnnotationsByTypeTitle(this.segment_annotation_type) |
49 _this.redraw(_a.begin, _a.end); |
147 .forEach(function (_a) { |
|
148 _a.on("enter", function () { |
|
149 _this.redraw(_a.begin, _a.end); |
50 }); |
150 }); |
51 }); |
151 }); |
52 } else { |
152 } else { |
53 this.redraw(); |
153 this.redraw(); |
54 } |
154 } |
55 }; |
155 } |
56 |
156 |
57 IriSP.Widgets.Tagcloud.prototype.redraw = function(_from, _to) { |
157 redraw(_from, _to) { |
58 var _urlRegExp = /https?:\/\/[0-9a-zA-Z\.%\/-_]+/g, |
158 var _urlRegExp = /https?:\/\/[0-9a-zA-Z\.%\/-_]+/g, |
59 _words = {}, |
159 _words = {}, |
60 _this = this, |
160 _this = this, |
61 _annotations = this.getWidgetAnnotations(); |
161 _annotations = this.getWidgetAnnotations(); |
62 |
162 |
63 if(!this.include_titles && !this.include_descriptions){ |
163 if (!this.include_titles && !this.include_descriptions) { |
64 var _regexpword = /[^\.&;,'"!\?\d\(\)\+\[\]\\\…\-«»\/]{3,}/g; |
164 var _regexpword = /[^\.&;,'"!\?\d\(\)\+\[\]\\\…\-«»\/]{3,}/g; |
65 } |
165 } else { |
66 else{ |
166 var _regexpword = /[^\s\.&;,'"!\?\d\(\)\+\[\]\\\…\-«»:\/]{3,}/g; |
67 var _regexpword = /[^\s\.&;,'"!\?\d\(\)\+\[\]\\\…\-«»:\/]{3,}/g; |
167 } |
68 } |
168 |
69 |
169 if (typeof _from !== "undefined" && typeof _to !== "undefined") { |
70 if (typeof _from !== "undefined" && typeof _to !== "undefined") { |
170 _annotations = _annotations.filter(function (_annotation) { |
71 _annotations = _annotations.filter(function(_annotation) { |
171 return _annotation.begin >= _from && _annotation.end <= _to; |
72 return _annotation.begin >= _from && _annotation.end <= _to; |
|
73 }); |
172 }); |
74 } |
173 } |
75 |
174 |
76 if(this.remove_zero_duration){ |
175 if (this.remove_zero_duration) { |
77 _annotations = _annotations.filter(function(_annotation) { |
176 _annotations = _annotations.filter(function (_annotation) { |
78 return _annotation.getDuration()>0; |
177 return _annotation.getDuration() > 0; |
79 }); |
178 }); |
80 } |
179 } |
81 |
180 |
82 _annotations.forEach(function(_annotation) { |
181 _annotations.forEach(function (_annotation) { |
83 var _txt = |
182 var _txt = |
84 (_this.include_titles ? _annotation.title : '') |
183 (_this.include_titles ? _annotation.title : "") + |
85 + ' ' |
184 " " + |
86 + (_this.include_descriptions ? _annotation.description : '') |
185 (_this.include_descriptions ? _annotation.description : "") + |
87 + ' ' |
186 " " + |
88 + (_this.include_tag_texts ? _annotation.getTagTexts() : ''); |
187 (_this.include_tag_texts ? _annotation.getTagTexts() : ""); |
89 IriSP._(_txt.toLowerCase().replace(_urlRegExp, '').match(_regexpword)).each(function(_word) { |
188 _(_txt.toLowerCase().replace(_urlRegExp, "").match(_regexpword)).each( |
90 _word = _word.trim(); |
189 function (_word) { |
91 if (IriSP._(_this.stopwords).indexOf(_word) == -1 && (!_this.exclude_pattern || !_this.exclude_pattern.test(_word))) { |
190 _word = _word.trim(); |
92 _words[_word] = 1 + (_words[_word] || 0); |
191 if ( |
93 } |
192 _(_this.stopwords).indexOf(_word) == -1 && |
94 }); |
193 (!_this.exclude_pattern || !_this.exclude_pattern.test(_word)) |
95 }); |
194 ) { |
96 _words = IriSP._(_words) |
195 _words[_word] = 1 + (_words[_word] || 0); |
|
196 } |
|
197 } |
|
198 ); |
|
199 }); |
|
200 _words = _(_words) |
97 .chain() |
201 .chain() |
98 .map(function(_v, _k) { |
202 .map(function (_v, _k) { |
99 return { |
203 return { |
100 "word" : _k, |
204 word: _k, |
101 "count" : _v |
205 count: _v, |
102 }; |
206 }; |
103 }) |
207 }) |
104 .filter(function(_v) { |
208 .filter(function (_v) { |
105 return _v.count > _this.min_count; |
209 return _v.count > _this.min_count; |
106 }) |
210 }) |
107 .sortBy(function(_v) { |
211 .sortBy(function (_v) { |
108 return - _v.count; |
212 return -_v.count; |
109 }) |
213 }) |
110 .first(this.tag_count) |
214 .first(this.tag_count) |
111 .value(); |
215 .value(); |
112 if (_words.length) { |
216 if (_words && _words.length) { |
113 var _max = _words[0].count, |
217 var _max = _words[0].count, |
114 _min = Math.min(_words[_words.length - 1].count, _max - 1), |
218 _min = Math.min(_words[_words.length - 1].count, _max - 1), |
115 _scale = (this.max_font_size - this.min_font_size) / Math.sqrt(_max - _min); |
219 _scale = |
116 IriSP._(_words).each(function(_word) { |
220 (this.max_font_size - this.min_font_size) / Math.sqrt(_max - _min); |
117 _word.size = Math.floor( _this.min_font_size + _scale * Math.sqrt(_word.count - _min) ); |
221 _(_words).each(function (_word) { |
118 }); |
222 _word.size = Math.floor( |
119 } |
223 _this.min_font_size + _scale * Math.sqrt(_word.count - _min) |
120 this.$.html(Mustache.to_html(this.template, {words: _words })); |
224 ); |
121 this.$.find(".Ldt-Tagcloud-item").click(function() { |
225 }); |
122 var _txt = IriSP.jQuery(this).attr("content"); |
226 } |
|
227 this.$.html(Mustache.render(this.constructor.template, { words: _words })); |
|
228 this.$.find(".Ldt-Tagcloud-item").click(function () { |
|
229 var _txt = jQuery(this).attr("content"); |
123 _this.source.getAnnotations().searchByTags(_txt); |
230 _this.source.getAnnotations().searchByTags(_txt); |
124 }); |
231 }); |
125 this.source.getAnnotations().on("search", this.functionWrapper("onSearch")); |
232 this.source |
126 this.source.getAnnotations().on("search-cleared", this.functionWrapper("onSearch")); |
233 .getAnnotations() |
|
234 .on("search", this.functionWrapper("onSearch")); |
|
235 this.source |
|
236 .getAnnotations() |
|
237 .on("search-cleared", this.functionWrapper("onSearch")); |
|
238 } |
|
239 |
|
240 onSearch(searchString) { |
|
241 searchString = typeof searchString !== "undefined" ? searchString : ""; |
|
242 if (searchString) { |
|
243 var _rgxp = ns.Model.regexpFromTextOrArray(searchString); |
|
244 } |
|
245 this.$.find(".Ldt-Tagcloud-item").each(function () { |
|
246 var _el = jQuery(this), |
|
247 _txt = _el.attr("content"); |
|
248 if (searchString) { |
|
249 _el.html( |
|
250 _txt.replace(_rgxp, '<span class="Ldt-Tagcloud-active">$1</span>') |
|
251 ); |
|
252 } else { |
|
253 _el.html(_txt); |
|
254 } |
|
255 }); |
|
256 } |
|
257 }; |
127 }; |
258 }; |
128 |
259 |
129 IriSP.Widgets.Tagcloud.prototype.onSearch = function(searchString) { |
260 export { Tagcloud, tagcloudStyles }; |
130 searchString = typeof searchString !== "undefined" ? searchString : ''; |
|
131 if (searchString) { |
|
132 var _rgxp = IriSP.Model.regexpFromTextOrArray(searchString); |
|
133 } |
|
134 this.$.find(".Ldt-Tagcloud-item").each(function() { |
|
135 var _el = IriSP.jQuery(this), |
|
136 _txt = _el.attr("content"); |
|
137 if (searchString) { |
|
138 _el.html(_txt.replace(_rgxp, '<span class="Ldt-Tagcloud-active">$1</span>')); |
|
139 } else { |
|
140 _el.html(_txt); |
|
141 } |
|
142 }); |
|
143 }; |
|