Commit ea70d84a644b423c059b11d8c54b46a6820dea13
1 parent
4972bd11
Exists in
master
Fixes
Showing
12 changed files
with
241 additions
and
449 deletions
Show diff stats
.gitignore
@@ -0,0 +1,16 @@ | @@ -0,0 +1,16 @@ | ||
1 | +var gulp = require('gulp'); | ||
2 | +var connect = require('gulp-connect'); | ||
3 | + | ||
4 | +gulp.task('connect', function () { | ||
5 | + connect.server({ | ||
6 | + root: '.', | ||
7 | + livereload: true | ||
8 | + }); | ||
9 | +}); | ||
10 | + | ||
11 | +gulp.task('watch', ['connect'], function () { | ||
12 | + gulp.watch(['**/*.html', '**/*.js', '**/*.css'], function () { | ||
13 | + gulp.src(['**/*.html', '**/*.js', '**/*.css']) | ||
14 | + .pipe(connect.reload()); | ||
15 | + }); | ||
16 | +}); | ||
0 | \ No newline at end of file | 17 | \ No newline at end of file |
README.md
@@ -22,6 +22,7 @@ Instalação | @@ -22,6 +22,7 @@ Instalação | ||
22 | <img class="vw-btn-close" src="VLibrasWeb/Images/close.png" /> | 22 | <img class="vw-btn-close" src="VLibrasWeb/Images/close.png" /> |
23 | </div> | 23 | </div> |
24 | <div class="vw-canvas-wrapper"> | 24 | <div class="vw-canvas-wrapper"> |
25 | + <div class="vw-error"></div> | ||
25 | <div class="vw-loading active"> | 26 | <div class="vw-loading active"> |
26 | <img src="VLibrasWeb/Images/loading.gif" /> | 27 | <img src="VLibrasWeb/Images/loading.gif" /> |
27 | </div> | 28 | </div> |
@@ -47,7 +48,7 @@ Instalação | @@ -47,7 +48,7 @@ Instalação | ||
47 | </div> | 48 | </div> |
48 | ``` | 49 | ``` |
49 | 50 | ||
50 | -2. Adicione os arquivos `.css` no <head> e `.js` no final do body: | 51 | +2. Adicione os arquivos `.css` no <head> e `.js` no final do <body>: |
51 | 52 | ||
52 | ```html | 53 | ```html |
53 | <head> | 54 | <head> |
2.71 KB
2.78 KB
20.7 KB
VLibrasWeb/Player/WebGL/Setup.js
@@ -1,364 +0,0 @@ | @@ -1,364 +0,0 @@ | ||
1 | -//====================== Player Configuration =========================== | ||
2 | -// connect to canvas | ||
3 | -var Module = { | ||
4 | - TOTAL_MEMORY: 314572800, | ||
5 | - filePackagePrefixURL: VLibrasPlayer.getPath() + '/Player/WebGL/', | ||
6 | - memoryInitializerPrefixURL: VLibrasPlayer.getPath() + '/Player/WebGL/', | ||
7 | - preRun: [], | ||
8 | - postRun: [], | ||
9 | - print: (function() { | ||
10 | - return function(text) { | ||
11 | - console.log (text); | ||
12 | - }; | ||
13 | - })(), | ||
14 | - printErr: function(text) { | ||
15 | - console.error (text); | ||
16 | - }, | ||
17 | - canvas: VLibrasPlayer.getCanvasElement(), | ||
18 | - progress: null, | ||
19 | - setStatus: function(text) { | ||
20 | - if (this.progress == null) | ||
21 | - { | ||
22 | - if (typeof UnityProgress != 'function') | ||
23 | - return; | ||
24 | - this.progress = new UnityProgress (canvas); | ||
25 | - } | ||
26 | - if (!Module.setStatus.last) Module.setStatus.last = { time: Date.now(), text: '' }; | ||
27 | - if (text === Module.setStatus.text) return; | ||
28 | - this.progress.SetMessage (text); | ||
29 | - var m = text.match(/([^(]+)\((\d+(\.\d+)?)\/(\d+)\)/); | ||
30 | - if (m) | ||
31 | - this.progress.SetProgress (parseInt(m[2])/parseInt(m[4])); | ||
32 | - if (text === "") | ||
33 | - this.progress.Clear() | ||
34 | - }, | ||
35 | - totalDependencies: 0, | ||
36 | - monitorRunDependencies: function(left) { | ||
37 | - this.totalDependencies = Math.max(this.totalDependencies, left); | ||
38 | - Module.setStatus(left ? 'Preparing... (' + (this.totalDependencies-left) + '/' + this.totalDependencies + ')' : 'All downloads complete.'); | ||
39 | - } | ||
40 | -}; | ||
41 | -Module.setStatus('Downloading (0.0/1)'); | ||
42 | - | ||
43 | -//============ FileLoader ===================== | ||
44 | -if (!Module.expectedDataFileDownloads) { | ||
45 | - Module.expectedDataFileDownloads = 0; | ||
46 | - Module.finishedDataFileDownloads = 0; | ||
47 | -} | ||
48 | -Module.expectedDataFileDownloads++; | ||
49 | -(function() { | ||
50 | - var loadPackage = function(metadata) { | ||
51 | - | ||
52 | - var PACKAGE_PATH; | ||
53 | - if (typeof window === 'object') { | ||
54 | - PACKAGE_PATH = window['encodeURIComponent'](window.location.pathname.toString().substring(0, window.location.pathname.toString().lastIndexOf('/')) + '/'); | ||
55 | - } else if (typeof location !== 'undefined') { | ||
56 | - // worker | ||
57 | - PACKAGE_PATH = encodeURIComponent(location.pathname.toString().substring(0, location.pathname.toString().lastIndexOf('/')) + '/'); | ||
58 | - } else { | ||
59 | - throw 'using preloaded data can only be done on a web page or in a web worker'; | ||
60 | - } | ||
61 | - var PACKAGE_NAME = 'rnp_webgl_DC_ON_AA0x_VsyncOFF.data'; | ||
62 | - var REMOTE_PACKAGE_BASE = 'rnp_webgl_DC_ON_AA0x_VsyncOFF.data'; | ||
63 | - if (typeof Module['locateFilePackage'] === 'function' && !Module['locateFile']) { | ||
64 | - Module['locateFile'] = Module['locateFilePackage']; | ||
65 | - Module.printErr('warning: you defined Module.locateFilePackage, that has been renamed to Module.locateFile (using your locateFilePackage for now)'); | ||
66 | - } | ||
67 | - var REMOTE_PACKAGE_NAME = typeof Module['locateFile'] === 'function' ? | ||
68 | - Module['locateFile'](REMOTE_PACKAGE_BASE) : | ||
69 | - ((Module['filePackagePrefixURL'] || '') + REMOTE_PACKAGE_BASE); | ||
70 | - | ||
71 | - var REMOTE_PACKAGE_SIZE = 44246208; | ||
72 | - var PACKAGE_UUID = '98f2a60c-c33d-4976-b642-e132a50bd522'; | ||
73 | - | ||
74 | - function fetchRemotePackage(packageName, packageSize, callback, errback) { | ||
75 | - var xhr = new XMLHttpRequest(); | ||
76 | - xhr.open('GET', packageName, true); | ||
77 | - xhr.responseType = 'arraybuffer'; | ||
78 | - xhr.onprogress = function(event) { | ||
79 | - var url = packageName; | ||
80 | - var size = packageSize; | ||
81 | - if (event.total) size = event.total; | ||
82 | - if (event.loaded) { | ||
83 | - if (!xhr.addedTotal) { | ||
84 | - xhr.addedTotal = true; | ||
85 | - if (!Module.dataFileDownloads) Module.dataFileDownloads = {}; | ||
86 | - Module.dataFileDownloads[url] = { | ||
87 | - loaded: event.loaded, | ||
88 | - total: size | ||
89 | - }; | ||
90 | - } else { | ||
91 | - Module.dataFileDownloads[url].loaded = event.loaded; | ||
92 | - } | ||
93 | - var total = 0; | ||
94 | - var loaded = 0; | ||
95 | - var num = 0; | ||
96 | - for (var download in Module.dataFileDownloads) { | ||
97 | - var data = Module.dataFileDownloads[download]; | ||
98 | - total += data.total; | ||
99 | - loaded += data.loaded; | ||
100 | - num++; | ||
101 | - } | ||
102 | - total = Math.ceil(total * Module.expectedDataFileDownloads/num); | ||
103 | - if (Module['setStatus']) Module['setStatus']('Downloading data... (' + loaded + '/' + total + ')'); | ||
104 | - } else if (!Module.dataFileDownloads) { | ||
105 | - if (Module['setStatus']) Module['setStatus']('Downloading data...'); | ||
106 | - } | ||
107 | - }; | ||
108 | - xhr.onload = function(event) { | ||
109 | - var packageData = xhr.response; | ||
110 | - callback(packageData); | ||
111 | - }; | ||
112 | - xhr.send(null); | ||
113 | - }; | ||
114 | - | ||
115 | - function handleError(error) { | ||
116 | - console.error('package error:', error); | ||
117 | - }; | ||
118 | - | ||
119 | - function runWithFS() { | ||
120 | - | ||
121 | - function assert(check, msg) { | ||
122 | - if (!check) throw msg + new Error().stack; | ||
123 | - } | ||
124 | -Module['FS_createPath']('/', 'Il2CppData', true, true); | ||
125 | -Module['FS_createPath']('/Il2CppData', 'Metadata', true, true); | ||
126 | -Module['FS_createPath']('/', 'Resources', true, true); | ||
127 | - | ||
128 | - function DataRequest(start, end, crunched, audio) { | ||
129 | - this.start = start; | ||
130 | - this.end = end; | ||
131 | - this.crunched = crunched; | ||
132 | - this.audio = audio; | ||
133 | - } | ||
134 | - DataRequest.prototype = { | ||
135 | - requests: {}, | ||
136 | - open: function(mode, name) { | ||
137 | - this.name = name; | ||
138 | - this.requests[name] = this; | ||
139 | - Module['addRunDependency']('fp ' + this.name); | ||
140 | - }, | ||
141 | - send: function() {}, | ||
142 | - onload: function() { | ||
143 | - var byteArray = this.byteArray.subarray(this.start, this.end); | ||
144 | - | ||
145 | - this.finish(byteArray); | ||
146 | - | ||
147 | - }, | ||
148 | - finish: function(byteArray) { | ||
149 | - var that = this; | ||
150 | - Module['FS_createPreloadedFile'](this.name, null, byteArray, true, true, function() { | ||
151 | - Module['removeRunDependency']('fp ' + that.name); | ||
152 | - }, function() { | ||
153 | - if (that.audio) { | ||
154 | - Module['removeRunDependency']('fp ' + that.name); // workaround for chromium bug 124926 (still no audio with this, but at least we don't hang) | ||
155 | - } else { | ||
156 | - Module.printErr('Preloading file ' + that.name + ' failed'); | ||
157 | - } | ||
158 | - }, false, true); // canOwn this data in the filesystem, it is a slide into the heap that will never change | ||
159 | - this.requests[this.name] = null; | ||
160 | - }, | ||
161 | - }; | ||
162 | - | ||
163 | - new DataRequest(0, 50564, 0, 0).open('GET', '/mainData'); | ||
164 | - new DataRequest(50564, 50732, 0, 0).open('GET', '/methods_pointedto_by_uievents.xml'); | ||
165 | - new DataRequest(50732, 39552116, 0, 0).open('GET', '/sharedassets0.assets'); | ||
166 | - new DataRequest(39552116, 41855052, 0, 0).open('GET', '/Il2CppData/Metadata/global-metadata.dat'); | ||
167 | - new DataRequest(41855052, 43742476, 0, 0).open('GET', '/Resources/unity_default_resources'); | ||
168 | - new DataRequest(43742476, 44246208, 0, 0).open('GET', '/Resources/unity_builtin_extra'); | ||
169 | - | ||
170 | - var indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB; | ||
171 | - var IDB_RO = "readonly"; | ||
172 | - var IDB_RW = "readwrite"; | ||
173 | - var DB_NAME = 'EM_PRELOAD_CACHE'; | ||
174 | - var DB_VERSION = 1; | ||
175 | - var METADATA_STORE_NAME = 'METADATA'; | ||
176 | - var PACKAGE_STORE_NAME = 'PACKAGES'; | ||
177 | - function openDatabase(callback, errback) { | ||
178 | - try { | ||
179 | - var openRequest = indexedDB.open(DB_NAME, DB_VERSION); | ||
180 | - } catch (e) { | ||
181 | - return errback(e); | ||
182 | - } | ||
183 | - openRequest.onupgradeneeded = function(event) { | ||
184 | - var db = event.target.result; | ||
185 | - | ||
186 | - if(db.objectStoreNames.contains(PACKAGE_STORE_NAME)) { | ||
187 | - db.deleteObjectStore(PACKAGE_STORE_NAME); | ||
188 | - } | ||
189 | - var packages = db.createObjectStore(PACKAGE_STORE_NAME); | ||
190 | - | ||
191 | - if(db.objectStoreNames.contains(METADATA_STORE_NAME)) { | ||
192 | - db.deleteObjectStore(METADATA_STORE_NAME); | ||
193 | - } | ||
194 | - var metadata = db.createObjectStore(METADATA_STORE_NAME); | ||
195 | - }; | ||
196 | - openRequest.onsuccess = function(event) { | ||
197 | - var db = event.target.result; | ||
198 | - callback(db); | ||
199 | - }; | ||
200 | - openRequest.onerror = function(error) { | ||
201 | - errback(error); | ||
202 | - }; | ||
203 | - }; | ||
204 | - | ||
205 | - /* Check if there's a cached package, and if so whether it's the latest available */ | ||
206 | - function checkCachedPackage(db, packageName, callback, errback) { | ||
207 | - var transaction = db.transaction([METADATA_STORE_NAME], IDB_RO); | ||
208 | - var metadata = transaction.objectStore(METADATA_STORE_NAME); | ||
209 | - | ||
210 | - var getRequest = metadata.get(packageName); | ||
211 | - getRequest.onsuccess = function(event) { | ||
212 | - var result = event.target.result; | ||
213 | - if (!result) { | ||
214 | - return callback(false); | ||
215 | - } else { | ||
216 | - return callback(PACKAGE_UUID === result.uuid); | ||
217 | - } | ||
218 | - }; | ||
219 | - getRequest.onerror = function(error) { | ||
220 | - errback(error); | ||
221 | - }; | ||
222 | - }; | ||
223 | - | ||
224 | - function fetchCachedPackage(db, packageName, callback, errback) { | ||
225 | - var transaction = db.transaction([PACKAGE_STORE_NAME], IDB_RO); | ||
226 | - var packages = transaction.objectStore(PACKAGE_STORE_NAME); | ||
227 | - | ||
228 | - var getRequest = packages.get(packageName); | ||
229 | - getRequest.onsuccess = function(event) { | ||
230 | - var result = event.target.result; | ||
231 | - callback(result); | ||
232 | - }; | ||
233 | - getRequest.onerror = function(error) { | ||
234 | - errback(error); | ||
235 | - }; | ||
236 | - }; | ||
237 | - | ||
238 | - function cacheRemotePackage(db, packageName, packageData, packageMeta, callback, errback) { | ||
239 | - var transaction = db.transaction([PACKAGE_STORE_NAME, METADATA_STORE_NAME], IDB_RW); | ||
240 | - var packages = transaction.objectStore(PACKAGE_STORE_NAME); | ||
241 | - var metadata = transaction.objectStore(METADATA_STORE_NAME); | ||
242 | - | ||
243 | - var putPackageRequest = packages.put(packageData, packageName); | ||
244 | - putPackageRequest.onsuccess = function(event) { | ||
245 | - var putMetadataRequest = metadata.put(packageMeta, packageName); | ||
246 | - putMetadataRequest.onsuccess = function(event) { | ||
247 | - callback(packageData); | ||
248 | - }; | ||
249 | - putMetadataRequest.onerror = function(error) { | ||
250 | - errback(error); | ||
251 | - }; | ||
252 | - }; | ||
253 | - putPackageRequest.onerror = function(error) { | ||
254 | - errback(error); | ||
255 | - }; | ||
256 | - }; | ||
257 | - | ||
258 | - function processPackageData(arrayBuffer) { | ||
259 | - Module.finishedDataFileDownloads++; | ||
260 | - assert(arrayBuffer, 'Loading data file failed.'); | ||
261 | - var byteArray = new Uint8Array(arrayBuffer); | ||
262 | - var curr; | ||
263 | - | ||
264 | - // Reuse the bytearray from the XHR as the source for file reads. | ||
265 | - DataRequest.prototype.byteArray = byteArray; | ||
266 | - DataRequest.prototype.requests["/mainData"].onload(); | ||
267 | - DataRequest.prototype.requests["/methods_pointedto_by_uievents.xml"].onload(); | ||
268 | - DataRequest.prototype.requests["/sharedassets0.assets"].onload(); | ||
269 | - DataRequest.prototype.requests["/Il2CppData/Metadata/global-metadata.dat"].onload(); | ||
270 | - DataRequest.prototype.requests["/Resources/unity_default_resources"].onload(); | ||
271 | - DataRequest.prototype.requests["/Resources/unity_builtin_extra"].onload(); | ||
272 | - Module['removeRunDependency']('datafile_rnp_webgl_DC_ON_AA0x_VsyncOFF.data'); | ||
273 | - | ||
274 | - }; | ||
275 | - Module['addRunDependency']('datafile_rnp_webgl_DC_ON_AA0x_VsyncOFF.data'); | ||
276 | - | ||
277 | - if (!Module.preloadResults) Module.preloadResults = {}; | ||
278 | - | ||
279 | - function preloadFallback(error) { | ||
280 | - console.error(error); | ||
281 | - console.error('falling back to default preload behavior'); | ||
282 | - fetchRemotePackage(REMOTE_PACKAGE_NAME, REMOTE_PACKAGE_SIZE, processPackageData, handleError); | ||
283 | - }; | ||
284 | - | ||
285 | - openDatabase( | ||
286 | - function(db) { | ||
287 | - checkCachedPackage(db, PACKAGE_PATH + PACKAGE_NAME, | ||
288 | - function(useCached) { | ||
289 | - Module.preloadResults[PACKAGE_NAME] = {fromCache: useCached}; | ||
290 | - if (useCached) { | ||
291 | - console.info('loading ' + PACKAGE_NAME + ' from cache'); | ||
292 | - fetchCachedPackage(db, PACKAGE_PATH + PACKAGE_NAME, processPackageData, preloadFallback); | ||
293 | - } else { | ||
294 | - console.info('loading ' + PACKAGE_NAME + ' from remote'); | ||
295 | - fetchRemotePackage(REMOTE_PACKAGE_NAME, REMOTE_PACKAGE_SIZE, | ||
296 | - function(packageData) { | ||
297 | - cacheRemotePackage(db, PACKAGE_PATH + PACKAGE_NAME, packageData, {uuid:PACKAGE_UUID}, processPackageData, | ||
298 | - function(error) { | ||
299 | - console.error(error); | ||
300 | - processPackageData(packageData); | ||
301 | - }); | ||
302 | - } | ||
303 | - , preloadFallback); | ||
304 | - } | ||
305 | - } | ||
306 | - , preloadFallback); | ||
307 | - } | ||
308 | - , preloadFallback); | ||
309 | - | ||
310 | - if (Module['setStatus']) Module['setStatus']('Downloading...'); | ||
311 | - | ||
312 | - } | ||
313 | - if (Module['calledRun']) { | ||
314 | - runWithFS(); | ||
315 | - } else { | ||
316 | - if (!Module['preRun']) Module['preRun'] = []; | ||
317 | - Module["preRun"].push(runWithFS); // FS is not initialized yet, wait for it | ||
318 | - } | ||
319 | - | ||
320 | - } | ||
321 | - loadPackage(); | ||
322 | - | ||
323 | -})(); | ||
324 | -//============== Load ======================== | ||
325 | - | ||
326 | -if (!(!Math.fround)) { | ||
327 | - var script = document.createElement('script'); | ||
328 | - script.src = VLibrasPlayer.getPath() + '/Player/WebGL/rnp_webgl_DC_ON_AA0x_VsyncOFF.js'; | ||
329 | - document.body.appendChild(script); | ||
330 | -} else { | ||
331 | - var codeXHR = new XMLHttpRequest(); | ||
332 | - codeXHR.open('GET', VLibrasPlayer.getPath() + '/Player/WebGL/rnp_webgl_DC_ON_AA0x_VsyncOFF.js', true); | ||
333 | - codeXHR.onload = function() { | ||
334 | - var code = codeXHR.responseText; | ||
335 | - if (!Math.fround) { | ||
336 | -try { | ||
337 | - console.log('optimizing out Math.fround calls'); | ||
338 | - var m = /var ([^=]+)=global\.Math\.fround;/.exec(code); | ||
339 | - var minified = m[1]; | ||
340 | - if (!minified) throw 'fail'; | ||
341 | - var startAsm = code.indexOf('// EMSCRIPTEN_START_FUNCS'); | ||
342 | - var endAsm = code.indexOf('// EMSCRIPTEN_END_FUNCS'); | ||
343 | - var asm = code.substring(startAsm, endAsm); | ||
344 | - do { | ||
345 | - var moar = false; // we need to re-do, as x(x( will not be fixed | ||
346 | - asm = asm.replace(new RegExp('[^a-zA-Z0-9\\$\\_]' + minified + '\\(', 'g'), function(s) { moar = true; return s[0] + '(' }); | ||
347 | - } while (moar); | ||
348 | - code = code.substring(0, startAsm) + asm + code.substring(endAsm); | ||
349 | - code = code.replace("'use asm'", "'almost asm'"); | ||
350 | -} catch(e) { console.log('failed to optimize out Math.fround calls ' + e) } | ||
351 | - } | ||
352 | - | ||
353 | - var blob = new Blob([code], { type: 'text/javascript' }); | ||
354 | - codeXHR = null; | ||
355 | - var src = URL.createObjectURL(blob); | ||
356 | - var script = document.createElement('script'); | ||
357 | - script.src = URL.createObjectURL(blob); | ||
358 | - script.onload = function() { | ||
359 | - URL.revokeObjectURL(script.src); | ||
360 | - }; | ||
361 | - document.body.appendChild(script); | ||
362 | - }; | ||
363 | - codeXHR.send(null); | ||
364 | -} | ||
365 | \ No newline at end of file | 0 | \ No newline at end of file |
VLibrasWeb/vlibras-player.js
@@ -4,30 +4,36 @@ | @@ -4,30 +4,36 @@ | ||
4 | this.glosa = undefined; | 4 | this.glosa = undefined; |
5 | this.canvas = undefined; | 5 | this.canvas = undefined; |
6 | this.WebPlayer = undefined; | 6 | this.WebPlayer = undefined; |
7 | - this.initialized = false; | ||
8 | } | 7 | } |
9 | 8 | ||
9 | + var ENDPOINT = 'http://150.165.204.30/glosa'; | ||
10 | var noop = function () {}; | 10 | var noop = function () {}; |
11 | 11 | ||
12 | VLibrasPlayer.prototype.translate = function (text) { | 12 | VLibrasPlayer.prototype.translate = function (text) { |
13 | var self = this; | 13 | var self = this; |
14 | text = encodeURI(text); | 14 | text = encodeURI(text); |
15 | 15 | ||
16 | + this.stop(); | ||
17 | + | ||
16 | (self.onTranslateStart || noop)(); | 18 | (self.onTranslateStart || noop)(); |
17 | - getGlosa('http://150.165.204.30/glosa?texto=' + text, | 19 | + get(ENDPOINT, { texto: text }, |
18 | function (status, response) { | 20 | function (status, response) { |
19 | (self.onTranslateEnd || noop)(); | 21 | (self.onTranslateEnd || noop)(); |
20 | - self.glosa = response || decodeURI(text).toUpperCase(); | ||
21 | - self.play(); | 22 | + self.play(response || decodeURI(text).toUpperCase()); |
22 | }); | 23 | }); |
23 | }; | 24 | }; |
24 | 25 | ||
25 | - VLibrasPlayer.prototype.play = function () { | 26 | + VLibrasPlayer.prototype.play = function (glosa) { |
27 | + this.glosa = glosa || this.glosa; | ||
26 | if (this.glosa !== undefined && this.loaded === true) { | 28 | if (this.glosa !== undefined && this.loaded === true) { |
27 | this.sendMessage('PlayerManager', 'catchGlosa', this.glosa); | 29 | this.sendMessage('PlayerManager', 'catchGlosa', this.glosa); |
28 | } | 30 | } |
29 | }; | 31 | }; |
30 | 32 | ||
33 | + VLibrasPlayer.prototype.stop = function () { | ||
34 | + this.sendMessage('PlayerManager', 'StopAnimations'); | ||
35 | + }; | ||
36 | + | ||
31 | VLibrasPlayer.prototype.setSpeed = function (speed) { | 37 | VLibrasPlayer.prototype.setSpeed = function (speed) { |
32 | this.sendMessage('PlayerManager', 'setSlider', speed); | 38 | this.sendMessage('PlayerManager', 'setSlider', speed); |
33 | }; | 39 | }; |
@@ -52,6 +58,10 @@ | @@ -52,6 +58,10 @@ | ||
52 | this.onTranslateEnd = callback; | 58 | this.onTranslateEnd = callback; |
53 | }; | 59 | }; |
54 | 60 | ||
61 | + VLibrasPlayer.prototype.addErrorListener = function (callback) { | ||
62 | + this.onError = callback; | ||
63 | + } | ||
64 | + | ||
55 | VLibrasPlayer.prototype.load = function () { | 65 | VLibrasPlayer.prototype.load = function () { |
56 | this.loaded = true; | 66 | this.loaded = true; |
57 | this.onLoad(); | 67 | this.onLoad(); |
@@ -66,12 +76,11 @@ | @@ -66,12 +76,11 @@ | ||
66 | return this.path; | 76 | return this.path; |
67 | }; | 77 | }; |
68 | 78 | ||
69 | - VLibrasPlayer.prototype.initialize = function (path, wrapper, callback) { | ||
70 | - if (this.initialized) { | ||
71 | - (callback || noop)(); | ||
72 | - return; | ||
73 | - } | 79 | + VLibrasPlayer.prototype.isLoaded = function () { |
80 | + return this.loaded; | ||
81 | + } | ||
74 | 82 | ||
83 | + VLibrasPlayer.prototype.initialize = function (path, wrapper) { | ||
75 | this.path = path; | 84 | this.path = path; |
76 | 85 | ||
77 | var script = document.createElement('script'); | 86 | var script = document.createElement('script'); |
@@ -81,28 +90,38 @@ | @@ -81,28 +90,38 @@ | ||
81 | this.canvas = document.createElement('div'); | 90 | this.canvas = document.createElement('div'); |
82 | 91 | ||
83 | script.src = path + '/Player/WebPlayer/Setup.js'; | 92 | script.src = path + '/Player/WebPlayer/Setup.js'; |
84 | - | ||
85 | var self = this; | 93 | var self = this; |
86 | script.onload = function () { | 94 | script.onload = function () { |
87 | - self.WebPlayer = new UnityObject2(); | ||
88 | - | ||
89 | - self.WebPlayer.initPlugin(self.canvas, self.path + '/Player/WebPlayer/rnp_webplayer_DC_ON_AA0x_VsyncOFF.unity3d'); | ||
90 | - (callback || noop)(); | 95 | + var params = { |
96 | + logoimage: self.path + '/Images/progresslogo.png', | ||
97 | + progressbarimage: self.path + '/Images/fullbar.png', | ||
98 | + progressframeimage: self.path + '/Images/loadingbar.png' | ||
99 | + }; | ||
100 | + | ||
101 | + self.WebPlayer = new UnityObject2(params); | ||
102 | + self.WebPlayer.observeProgress(function (progress) { | ||
103 | + switch(progress.pluginStatus) { | ||
104 | + case "unsupported": | ||
105 | + case "broken": | ||
106 | + case "missing": | ||
107 | + self.onError(progress.pluginStatus); | ||
108 | + break; | ||
109 | + } | ||
110 | + }); | ||
111 | + | ||
112 | + self.WebPlayer.initPlugin(self.canvas, self.path + '/Player/WebPlayer/rnp_webplayer.unity3d'); | ||
91 | }; | 113 | }; |
92 | } else { | 114 | } else { |
93 | this.canvas = document.createElement('canvas'); | 115 | this.canvas = document.createElement('canvas'); |
94 | this.canvas.classList.add('emscripten'); | 116 | this.canvas.classList.add('emscripten'); |
95 | 117 | ||
96 | - script.src = path + '/Player/WebGL/Setup.js'; | ||
97 | - | ||
98 | - script.onload = (callback || noop); | 118 | + script.src = path + '/Player/WebGL/Release/Setup.js'; |
99 | } | 119 | } |
100 | 120 | ||
101 | this.canvas.classList.add('vw-canvas'); | 121 | this.canvas.classList.add('vw-canvas'); |
102 | wrapper.appendChild(this.canvas); | 122 | wrapper.appendChild(this.canvas); |
103 | 123 | ||
104 | document.body.appendChild(script); | 124 | document.body.appendChild(script); |
105 | - this.initialized = true; | ||
106 | }; | 125 | }; |
107 | 126 | ||
108 | VLibrasPlayer.prototype.sendMessage = function(object, method, params) { | 127 | VLibrasPlayer.prototype.sendMessage = function(object, method, params) { |
@@ -123,7 +142,14 @@ | @@ -123,7 +142,14 @@ | ||
123 | 142 | ||
124 | window.VLibrasPlayer = new VLibrasPlayer(); | 143 | window.VLibrasPlayer = new VLibrasPlayer(); |
125 | 144 | ||
126 | - function getGlosa(url, callback) { | 145 | + function get(url, params, callback) { |
146 | + url += '?'; | ||
147 | + for (param in params) { | ||
148 | + url += param + '=' + params[param]; | ||
149 | + url += ','; | ||
150 | + } | ||
151 | + url.slice(-1, 1); | ||
152 | + | ||
127 | var xhr = new XMLHttpRequest(); | 153 | var xhr = new XMLHttpRequest(); |
128 | xhr.open('GET', url, true); | 154 | xhr.open('GET', url, true); |
129 | 155 |
VLibrasWeb/vlibras-web.css
@@ -3,8 +3,10 @@ | @@ -3,8 +3,10 @@ | ||
3 | right: 0; | 3 | right: 0; |
4 | top: 50%; | 4 | top: 50%; |
5 | margin-top: -225px; | 5 | margin-top: -225px; |
6 | - z-index: 1000; | 6 | + z-index: 999999999999; |
7 | display: none; | 7 | display: none; |
8 | + font-family: Arial; | ||
9 | + color: #000; | ||
8 | } | 10 | } |
9 | 11 | ||
10 | .vlibras-widget.active { | 12 | .vlibras-widget.active { |
@@ -15,16 +17,16 @@ | @@ -15,16 +17,16 @@ | ||
15 | bottom: 40px; | 17 | bottom: 40px; |
16 | top: initial; | 18 | top: initial; |
17 | right: 50%; | 19 | right: 50%; |
18 | - margin-right: -275px; | 20 | + margin-right: -45vh; |
19 | } | 21 | } |
20 | 22 | ||
21 | .vlibras-widget.maximize .vw-player { | 23 | .vlibras-widget.maximize .vw-player { |
22 | - height: 550px; | ||
23 | - width: 550px !important; | 24 | + height: 90vh; |
25 | + width: 90vh !important; | ||
24 | } | 26 | } |
25 | 27 | ||
26 | .vlibras-widget.maximize .vw-canvas-wrapper { | 28 | .vlibras-widget.maximize .vw-canvas-wrapper { |
27 | - height: 468px; | 29 | + height: calc(90vh - 82px); |
28 | } | 30 | } |
29 | 31 | ||
30 | .vlibras-widget.left { | 32 | .vlibras-widget.left { |
@@ -40,7 +42,9 @@ | @@ -40,7 +42,9 @@ | ||
40 | width: 70px; | 42 | width: 70px; |
41 | padding: 5px; | 43 | padding: 5px; |
42 | text-align: center; | 44 | text-align: center; |
45 | + font-size: 16px; | ||
43 | background-color: #fff; | 46 | background-color: #fff; |
47 | + cursor: pointer; | ||
44 | 48 | ||
45 | -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75); | 49 | -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75); |
46 | -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75); | 50 | -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75); |
@@ -54,7 +58,7 @@ | @@ -54,7 +58,7 @@ | ||
54 | } | 58 | } |
55 | 59 | ||
56 | .vw-btn-access span { | 60 | .vw-btn-access span { |
57 | - font-size: 15px; | 61 | + font-size: 13px; |
58 | color: #004088; | 62 | color: #004088; |
59 | } | 63 | } |
60 | 64 | ||
@@ -63,11 +67,17 @@ | @@ -63,11 +67,17 @@ | ||
63 | } | 67 | } |
64 | 68 | ||
65 | .vlibras-widget .vw-player { | 69 | .vlibras-widget .vw-player { |
66 | - display: none; | 70 | + visibility: hidden; |
67 | width: 0; | 71 | width: 0; |
68 | - height: 450px; | 72 | + height: 100%; |
69 | float: right; | 73 | float: right; |
70 | 74 | ||
75 | + background-color: #ebebeb; | ||
76 | + | ||
77 | + display: -webkit-flex; | ||
78 | + display: flex; | ||
79 | + flex-direction: column; | ||
80 | + | ||
71 | -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75); | 81 | -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75); |
72 | -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75); | 82 | -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75); |
73 | box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75); | 83 | box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75); |
@@ -75,20 +85,26 @@ | @@ -75,20 +85,26 @@ | ||
75 | 85 | ||
76 | .vlibras-widget .vw-player.active { | 86 | .vlibras-widget .vw-player.active { |
77 | width: 320px; | 87 | width: 320px; |
78 | - display: block; | 88 | + visibility: visible; |
79 | } | 89 | } |
80 | 90 | ||
81 | .vw-player .vw-canvas-wrapper { | 91 | .vw-player .vw-canvas-wrapper { |
82 | position: relative; | 92 | position: relative; |
83 | width: 100%; | 93 | width: 100%; |
84 | height: 370px; | 94 | height: 370px; |
85 | - background-color: #ebebeb; | ||
86 | } | 95 | } |
87 | 96 | ||
88 | .vw-canvas-wrapper .vw-subtitle { | 97 | .vw-canvas-wrapper .vw-subtitle { |
89 | position: absolute; | 98 | position: absolute; |
90 | top: 15px; | 99 | top: 15px; |
91 | right: 15px; | 100 | right: 15px; |
101 | + cursor: pointer; | ||
102 | + | ||
103 | + display: none; | ||
104 | +} | ||
105 | + | ||
106 | +.vw-player.loaded .vw-subtitle { | ||
107 | + display: block; | ||
92 | } | 108 | } |
93 | 109 | ||
94 | .vw-subtitle .vw-subtitle-off, .vw-subtitle.active .vw-subtitle-on { | 110 | .vw-subtitle .vw-subtitle-off, .vw-subtitle.active .vw-subtitle-on { |
@@ -123,6 +139,7 @@ | @@ -123,6 +139,7 @@ | ||
123 | .vw-player .vw-btn-close { | 139 | .vw-player .vw-btn-close { |
124 | float: right; | 140 | float: right; |
125 | height: 100%; | 141 | height: 100%; |
142 | + cursor: pointer; | ||
126 | } | 143 | } |
127 | 144 | ||
128 | .vw-player .vw-btn-side { | 145 | .vw-player .vw-btn-side { |
@@ -131,6 +148,7 @@ | @@ -131,6 +148,7 @@ | ||
131 | background-color: #fff; | 148 | background-color: #fff; |
132 | width: 2em; | 149 | width: 2em; |
133 | margin: 0; | 150 | margin: 0; |
151 | + cursor: pointer; | ||
134 | } | 152 | } |
135 | 153 | ||
136 | .vw-btn-side .vw-arrow { | 154 | .vw-btn-side .vw-arrow { |
@@ -161,13 +179,20 @@ | @@ -161,13 +179,20 @@ | ||
161 | -moz-box-sizing: border-box; | 179 | -moz-box-sizing: border-box; |
162 | box-sizing: border-box; | 180 | box-sizing: border-box; |
163 | 181 | ||
182 | + visibility: hidden; | ||
183 | + | ||
164 | display: -webkit-flex; | 184 | display: -webkit-flex; |
165 | display: flex; | 185 | display: flex; |
166 | align-items: center; | 186 | align-items: center; |
167 | -webkit-align-items: center; | 187 | -webkit-align-items: center; |
168 | } | 188 | } |
169 | 189 | ||
190 | +.vw-player.loaded .vw-controls { | ||
191 | + visibility: visible; | ||
192 | +} | ||
193 | + | ||
170 | .vw-controls .vw-play { | 194 | .vw-controls .vw-play { |
195 | + cursor: pointer; | ||
171 | height: 28px; | 196 | height: 28px; |
172 | } | 197 | } |
173 | 198 | ||
@@ -176,7 +201,7 @@ | @@ -176,7 +201,7 @@ | ||
176 | } | 201 | } |
177 | 202 | ||
178 | .vw-controls .vw-progressbar { | 203 | .vw-controls .vw-progressbar { |
179 | - margin: 0 13px; | 204 | + margin: 0 20px; |
180 | width: 100%; | 205 | width: 100%; |
181 | height: 3px; | 206 | height: 3px; |
182 | background-color: #000; | 207 | background-color: #000; |
@@ -189,8 +214,7 @@ | @@ -189,8 +214,7 @@ | ||
189 | } | 214 | } |
190 | 215 | ||
191 | .vw-controls .vw-speed { | 216 | .vw-controls .vw-speed { |
192 | - padding: 3px; | ||
193 | - margin-right: 10px; | 217 | + margin-right: 20px; |
194 | font-size: 19px; | 218 | font-size: 19px; |
195 | font-weight: bold; | 219 | font-weight: bold; |
196 | cursor: pointer; | 220 | cursor: pointer; |
@@ -200,6 +224,10 @@ | @@ -200,6 +224,10 @@ | ||
200 | content: "x"; | 224 | content: "x"; |
201 | } | 225 | } |
202 | 226 | ||
227 | +.vw-window { | ||
228 | + cursor: pointer; | ||
229 | +} | ||
230 | + | ||
203 | .vw-window .vw-maximize, .vw-window.active .vw-minimize { | 231 | .vw-window .vw-maximize, .vw-window.active .vw-minimize { |
204 | display: block; | 232 | display: block; |
205 | } | 233 | } |
@@ -208,21 +236,38 @@ | @@ -208,21 +236,38 @@ | ||
208 | display: none; | 236 | display: none; |
209 | } | 237 | } |
210 | 238 | ||
211 | -.vw-text:hover, .vw-text.active { | 239 | +.vw-text:hover { |
212 | background-color: rgba(255, 102, 0, 0.5); | 240 | background-color: rgba(255, 102, 0, 0.5); |
241 | + color: #000; | ||
242 | + cursor: pointer; | ||
213 | } | 243 | } |
214 | 244 | ||
215 | -.vw-loading { | 245 | +.vw-text-active { |
246 | + background-color: #7CFC00; | ||
247 | + color: #000; | ||
248 | +} | ||
249 | + | ||
250 | +.vw-loading, .vw-error { | ||
216 | position: absolute; | 251 | position: absolute; |
217 | top: 50%; | 252 | top: 50%; |
218 | left: 50%; | 253 | left: 50%; |
254 | + z-index: 1001; | ||
255 | + display: none; | ||
256 | + text-align: center; | ||
257 | +} | ||
258 | + | ||
259 | +.vw-loading { | ||
219 | margin-left: -50px; | 260 | margin-left: -50px; |
220 | margin-top: -25px; | 261 | margin-top: -25px; |
221 | width: 100px; | 262 | width: 100px; |
222 | height: 50px; | 263 | height: 50px; |
223 | - z-index: 1001; | ||
224 | - display: none; | ||
225 | - text-align: center; | 264 | +} |
265 | + | ||
266 | +.vw-error { | ||
267 | + margin-left: -150px; | ||
268 | + margin-top: -30px; | ||
269 | + width: 300px; | ||
270 | + height: 60px; | ||
226 | } | 271 | } |
227 | 272 | ||
228 | .vw-loading img { | 273 | .vw-loading img { |
@@ -230,6 +275,6 @@ | @@ -230,6 +275,6 @@ | ||
230 | height: 50px; | 275 | height: 50px; |
231 | } | 276 | } |
232 | 277 | ||
233 | -.vw-loading.active { | 278 | +.vw-loading.active, .vw-error.active { |
234 | display: block; | 279 | display: block; |
235 | -} | ||
236 | \ No newline at end of file | 280 | \ No newline at end of file |
281 | +} |
VLibrasWeb/vlibras-web.js
1 | (function (window, document) { | 1 | (function (window, document) { |
2 | VLibrasWeb = { | 2 | VLibrasWeb = { |
3 | - path: 'VLibrasWeb' | 3 | + path: 'VLibrasWeb', |
4 | + lastTextElement: undefined | ||
4 | }; | 5 | }; |
5 | 6 | ||
6 | VLibrasWeb.init = function (path) { | 7 | VLibrasWeb.init = function (path) { |
@@ -17,8 +18,8 @@ | @@ -17,8 +18,8 @@ | ||
17 | document.body.appendChild(player); | 18 | document.body.appendChild(player); |
18 | }; | 19 | }; |
19 | 20 | ||
20 | - VLibrasWeb.loadPlayer = function (canvas, callback) { | ||
21 | - window.VLibrasPlayer.initialize(VLibrasWeb.path, canvas, callback); | 21 | + VLibrasWeb.loadPlayer = function (canvas) { |
22 | + window.VLibrasPlayer.initialize(VLibrasWeb.path, canvas); | ||
22 | }; | 23 | }; |
23 | 24 | ||
24 | VLibrasWeb.run = function (VLibrasPlayer) { | 25 | VLibrasWeb.run = function (VLibrasPlayer) { |
@@ -39,8 +40,9 @@ | @@ -39,8 +40,9 @@ | ||
39 | var vwPlay = vwControls.querySelector('.vw-play'); | 40 | var vwPlay = vwControls.querySelector('.vw-play'); |
40 | 41 | ||
41 | VLibrasPlayer.addProgressListener(function (progress) { | 42 | VLibrasPlayer.addProgressListener(function (progress) { |
42 | - if (progress >= 1) { | ||
43 | - document.querySelector('.vw-text.active').classList.remove('active'); | 43 | + var vwText = document.querySelector('.vw-text.active'); |
44 | + if (progress >= 1 && vwText) { | ||
45 | + vwText.classList.remove('active'); | ||
44 | progress = 0; | 46 | progress = 0; |
45 | } | 47 | } |
46 | 48 | ||
@@ -54,15 +56,47 @@ | @@ -54,15 +56,47 @@ | ||
54 | VLibrasPlayer.addLoadListener(function () { | 56 | VLibrasPlayer.addLoadListener(function () { |
55 | vwLoading.classList.remove('active'); | 57 | vwLoading.classList.remove('active'); |
56 | vwCanvas.querySelector('.vw-canvas').classList.add('active'); | 58 | vwCanvas.querySelector('.vw-canvas').classList.add('active'); |
59 | + vwPlayer.classList.add('loaded'); | ||
60 | + | ||
61 | + if (vwPlayer.classList.contains('active')) { | ||
62 | + addTagsTexts(); | ||
63 | + } | ||
64 | + | ||
65 | + VLibrasPlayer.play('SELECIONAR TEXTO TRADUZIR'); | ||
57 | }); | 66 | }); |
58 | 67 | ||
59 | VLibrasPlayer.addTranslateEndListener(function () { | 68 | VLibrasPlayer.addTranslateEndListener(function () { |
60 | vwLoading.classList.remove('active'); | 69 | vwLoading.classList.remove('active'); |
61 | }); | 70 | }); |
62 | 71 | ||
72 | + VLibrasPlayer.addErrorListener(function (err) { | ||
73 | + var vwError = vwCanvas.querySelector('.vw-error'); | ||
74 | + vwError.classList.add('active'); | ||
75 | + switch(err) { | ||
76 | + case 'unsupported': | ||
77 | + vwError.innerHTML = 'O seu navegador não é compatível com este widget.'; | ||
78 | + break; | ||
79 | + case 'broken': | ||
80 | + vwError.innerHTML = 'Reinicie o navegador após a instalação.'; | ||
81 | + break; | ||
82 | + case 'missing': | ||
83 | + vwError.innerHTML = 'Por favor, instale o <a href="http://unity3d.com/webplayer/" target="_blank">Unity WebPlayer</a>.'; | ||
84 | + break; | ||
85 | + default: | ||
86 | + vwError.innerHTML = 'Ocorreu um erro. Por favor, recarregue a página.' | ||
87 | + break; | ||
88 | + } | ||
89 | + }); | ||
90 | + | ||
63 | vwPlay.addEventListener('click', function (e) { | 91 | vwPlay.addEventListener('click', function (e) { |
64 | e.preventDefault(); | 92 | e.preventDefault(); |
65 | 93 | ||
94 | + if (VLibrasWeb.lastTextElement) { | ||
95 | + VLibrasWeb.lastTextElement.dispatchEvent( | ||
96 | + new MouseEvent('click') | ||
97 | + ); | ||
98 | + } | ||
99 | + | ||
66 | VLibrasPlayer.play(); | 100 | VLibrasPlayer.play(); |
67 | }); | 101 | }); |
68 | 102 | ||
@@ -94,31 +128,11 @@ | @@ -94,31 +128,11 @@ | ||
94 | vwPlayer.classList.add('active'); | 128 | vwPlayer.classList.add('active'); |
95 | vwAccess.classList.add('inactive'); | 129 | vwAccess.classList.add('inactive'); |
96 | 130 | ||
97 | - VLibrasWeb.loadPlayer(vwCanvas, function () { | ||
98 | - getAllNodeTexts(document.body, function (node) { | ||
99 | - if (vw.contains(node)) return; | ||
100 | - | ||
101 | - var span = document.createElement('span'); | ||
102 | - span.classList.add('vw-text'); | ||
103 | - var parent = node.parentNode; | ||
104 | - | ||
105 | - parent.insertBefore(span, node); | ||
106 | - parent.removeChild(node); | ||
107 | - span.appendChild(node); | ||
108 | - | ||
109 | - span.addEventListener('click', function (e) { | ||
110 | - e.preventDefault(); | ||
111 | - window.VLibrasPlayer.translate(this.textContent); | ||
112 | - | ||
113 | - var actives = document.querySelector('.vw-text.active'); | ||
114 | - if (actives) { | ||
115 | - actives.classList.remove('active'); | ||
116 | - } | ||
117 | - | ||
118 | - this.classList.add('active'); | ||
119 | - }); | ||
120 | - }); | ||
121 | - }); | 131 | + if (VLibrasPlayer.isLoaded()) { |
132 | + addTagsTexts(); | ||
133 | + } else { | ||
134 | + VLibrasWeb.loadPlayer(vwCanvas); | ||
135 | + } | ||
122 | }); | 136 | }); |
123 | 137 | ||
124 | vwClose.addEventListener('click', function () { | 138 | vwClose.addEventListener('click', function () { |
@@ -128,16 +142,9 @@ | @@ -128,16 +142,9 @@ | ||
128 | 142 | ||
129 | minimize(); | 143 | minimize(); |
130 | 144 | ||
131 | - getAllNodeTexts(document.body, function (node) { | ||
132 | - if (vw.contains(node)) return; | ||
133 | - | ||
134 | - var span = node.parentNode; | ||
135 | - var parent = span.parentNode; | ||
136 | - | ||
137 | - span.removeChild(node); | ||
138 | - parent.insertBefore(node, span); | ||
139 | - parent.removeChild(span); | ||
140 | - }); | 145 | + removeTagsTexts(); |
146 | + VLibrasPlayer.stop(); | ||
147 | + vwProgress.style.width = 0; | ||
141 | }); | 148 | }); |
142 | 149 | ||
143 | vwSide.addEventListener('click', function () { | 150 | vwSide.addEventListener('click', function () { |
@@ -146,15 +153,61 @@ | @@ -146,15 +153,61 @@ | ||
146 | minimize(); | 153 | minimize(); |
147 | }); | 154 | }); |
148 | 155 | ||
156 | + function addTagsTexts() { | ||
157 | + getAllNodeTexts(document.body, function (node) { | ||
158 | + if (vw.contains(node)) return; | ||
159 | + | ||
160 | + node.innerHTML = '<span>' + node.innerHTML + '</span>'; | ||
161 | + | ||
162 | + var span = node.querySelector('span'); | ||
163 | + span.classList.add('vw-text'); | ||
164 | + | ||
165 | + span.addEventListener('click', function (e) { | ||
166 | + e.preventDefault(); | ||
167 | + | ||
168 | + vwProgress.style.width = 0; | ||
169 | + | ||
170 | + VLibrasWeb.lastTextElement = this; | ||
171 | + window.VLibrasPlayer.translate(this.textContent); | ||
172 | + | ||
173 | + var actives = document.querySelector('.vw-text.vw-text-active'); | ||
174 | + if (actives) { | ||
175 | + actives.classList.remove('vw-text-active'); | ||
176 | + } | ||
177 | + | ||
178 | + this.classList.add('vw-text-active'); | ||
179 | + }); | ||
180 | + }); | ||
181 | + } | ||
182 | + | ||
183 | + function removeTagsTexts() { | ||
184 | + var tagsTexts = document.querySelectorAll('.vw-text'); | ||
185 | + for (var i = 0; i < tagsTexts; i++) { | ||
186 | + var span = tagsTexts[i].querySelector('span'); | ||
187 | + tagsTexts[i].innerHTML = span.innerHTML; | ||
188 | + tagsTexts[i].classList.remove('.vw-text'); | ||
189 | + tagsTexts[i].classList.remove('.vw-text-active'); | ||
190 | + } | ||
191 | + } | ||
192 | + | ||
149 | function getAllNodeTexts(root, callback) { | 193 | function getAllNodeTexts(root, callback) { |
150 | var noop = function () {}; | 194 | var noop = function () {}; |
151 | - var walk = document.createTreeWalker(root, NodeFilter.SHOW_TEXT, null, null); | ||
152 | 195 | ||
153 | - while (walk.nextNode()) { | ||
154 | - var node = walk.currentNode; | 196 | + for(var i = 0; i < root.childNodes.length; i++) { |
197 | + var node = root.childNodes[i]; | ||
198 | + var anyText = false; | ||
199 | + for(var j = 0; j < node.childNodes.length && node.tagName != 'SCRIPT'; j++) { | ||
200 | + var child = node.childNodes[j]; | ||
201 | + if (child.nodeType == Node.TEXT_NODE && child.nodeValue.trim() != '') { | ||
202 | + anyText = true; | ||
203 | + break; | ||
204 | + } | ||
205 | + } | ||
155 | 206 | ||
156 | - if (node.textContent.trim().length > 0) { | 207 | + if (anyText) { |
157 | (callback || noop)(node); | 208 | (callback || noop)(node); |
209 | + } else { | ||
210 | + getAllNodeTexts(node, callback); | ||
158 | } | 211 | } |
159 | } | 212 | } |
160 | } | 213 | } |
sample.html
@@ -3,6 +3,7 @@ | @@ -3,6 +3,7 @@ | ||
3 | <link rel="stylesheet" href="VLibrasWeb/vlibras-web.css"> | 3 | <link rel="stylesheet" href="VLibrasWeb/vlibras-web.css"> |
4 | </head> | 4 | </head> |
5 | <body> | 5 | <body> |
6 | + <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo odio ratione, numquam. Quisquam ex, nemo ea necessitatibus laudantium, rem natus officiis dignissimos a repudiandae, quam doloribus voluptatibus commodi sed aperiam.</span> | ||
6 | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo odio ratione, numquam. Quisquam ex, nemo ea necessitatibus laudantium, rem natus officiis dignissimos a repudiandae, quam doloribus voluptatibus commodi sed aperiam.</p> | 7 | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo odio ratione, numquam. Quisquam ex, nemo ea necessitatibus laudantium, rem natus officiis dignissimos a repudiandae, quam doloribus voluptatibus commodi sed aperiam.</p> |
7 | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum tempore error molestiae totam provident <a href="">incidunt</a> voluptates iste corrupti sed rerum alias id commodi, suscipit nobis eveniet, possimus consectetur a sapiente?</p> | 8 | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum tempore error molestiae totam provident <a href="">incidunt</a> voluptates iste corrupti sed rerum alias id commodi, suscipit nobis eveniet, possimus consectetur a sapiente?</p> |
8 | 9 | ||
@@ -23,6 +24,7 @@ | @@ -23,6 +24,7 @@ | ||
23 | </div> | 24 | </div> |
24 | 25 | ||
25 | <div class="vw-canvas-wrapper"> | 26 | <div class="vw-canvas-wrapper"> |
27 | + <div class="vw-error"></div> | ||
26 | <div class="vw-loading active"> | 28 | <div class="vw-loading active"> |
27 | <img src="VLibrasWeb/Images/loading.gif" /> | 29 | <img src="VLibrasWeb/Images/loading.gif" /> |
28 | </div> | 30 | </div> |