Commit ea70d84a644b423c059b11d8c54b46a6820dea13

Authored by David Guilherme
1 parent 4972bd11
Exists in master

Fixes

@@ -6,3 +6,6 @@ VLibrasWeb/Player/WebPlayer/* @@ -6,3 +6,6 @@ VLibrasWeb/Player/WebPlayer/*
6 6
7 *.zip 7 *.zip
8 **/*.DS_Store 8 **/*.DS_Store
  9 +
  10 +bower_components
  11 +node_modules
Gulpfile.js 0 → 100644
@@ -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
@@ -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>
VLibrasWeb/Images/fullbar.png 0 → 100644

2.71 KB

VLibrasWeb/Images/loadingbar.png 0 → 100644

2.78 KB

VLibrasWeb/Images/progresslogo.png 0 → 100644

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 }
package.json 0 → 100644
@@ -0,0 +1,10 @@ @@ -0,0 +1,10 @@
  1 +{
  2 + "name": "vlibras-web",
  3 + "version": "1.0.0",
  4 + "description": "VLibras Web",
  5 + "repository": {
  6 + "type": "git",
  7 + "url": "git@git.lavid.ufpb.br:vlibras-plugplay"
  8 + },
  9 + "author": "LAViD"
  10 +}
@@ -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>