Download as
Browse Code »

Commit e4e3988b2c90fa34a58555ebb0ed74c07d76e629

Authored by Cassio Cabral
1 parent d7fee3a3
Exists in master and in 1 other branch dynamic

update engine

Showing 5 changed files with 489 additions and 475 deletions   Show diff stats
view/assets/js/dynamic-loading-engine.js
  Diff comments   View file @e4e3988
... ... @@ -2,7 +2,40 @@
2 2 var setup = undefined;
3 3  
4 4 _preprocessHtml = function(data, url) {
5   - return data.replace(/{{ server }}/g, url);
  5 + var matchMainConfig = data.match(/main(?:C|c)onfig="(.*?)"/);
  6 + var matchSubConfig = data.match(/sub(?:C|c)onfig="(.*?)"/);
  7 + var goodData = data;
  8 + var isRightHand = function(hand) {
  9 + return hand === 'right-hand';
  10 + };
  11 +
  12 + if (matchMainConfig && matchSubConfig) { // case defined
  13 + // There is no specific(right or left hand dependent) assets for: articulacao, duracao, expressao, movimento, transicao
  14 + // Specific configurations: configuracao, orientacao
  15 + // possible values on the side as comment
  16 + var mainConfig = matchMainConfig[1]; // right-hand or left-hand
  17 + var subConfig = matchSubConfig[1]; // articulacao | configuracao | duracao | expressao | movimento | orientacao | transicao
  18 +
  19 + switch (subConfig) {
  20 + case 'configuracao':
  21 + if (isRightHand(mainConfig)) {
  22 + goodData = data.replace(/{{ configuracao }}/g, 'cmd');
  23 + } else {
  24 + goodData = data.replace(/{{ configuracao }}/g, 'cme');
  25 + }
  26 + break;
  27 + case 'orientacao':
  28 + if (isRightHand(mainConfig)) {
  29 + goodData = data.replace(/{{ orientacao }}/g, 'ord');
  30 + } else {
  31 + goodData = data.replace(/{{ orientacao }}/g, 'ore');
  32 + }
  33 + break;
  34 + default:
  35 + console.log('No subConfig found');
  36 + }
  37 + }
  38 + return goodData.replace(/{{ server }}/g, url);
6 39 };
7 40  
8 41 dynengine.render = function(serverUrl, templatePath, target, prepend, callback) {
... ... @@ -29,25 +62,6 @@
29 62  
30 63 dynengine.load = function() {
31 64 var url = $('#server-url').data('url');
32   - $('.config-panel-option[name=right-hand]').bind('click', function() {
33   - console.log('click right hand on panel');
34   - });
35   -
36   - /*$('#avatar-body-right-hand').bind('click', function() {
37   - console.log('click avatar hand');
38   - dynengine.render(url, '/right-hand/movements.html', '#selection-panel', function() {
39   - $('.movimento-pontual').bind('click', function() {
40   - console.log('movimento pontual');
41   - dynengine.clean('#selection-panel');
42   - dynengine.render(url, '/right-hand/pontual/passo-1.html', '#selection-panel');
43   - dynengine.render(url, '/right-hand/pontual/passo-2.html', '#selection-panel');
44   - dynengine.render(url, '/right-hand/pontual/passo-3.html', '#selection-panel');
45   - dynengine.render(url, '/right-hand/pontual/timeline.html', '#selection-panel');
46   - });
47   - });
48   -
49   - });*/
50   -
51 65 };
52 66  
53 67 }(window.dynengine = window.dynengine || {}, jQuery));
... ...
view/hand/configuracao/passo-1.html
  Diff comments   View file @e4e3988
1 1 <div class="selection-panel-body" mainconfig="right-hand" subconfig="configuracao" step="1">
2   - <div class="panel-header">
3   - <h8>Escolha a posição mais parecida dos dedos</h8>
4   - </div>
5   - <div class="selection-panel-inner-body">
6   - <ul class="rig columns-3">
7   - <li><img class="box-panel-option selection-panel-option"
8   - src="{{ server }}/img/cmd/0007.png" value="0" />
9   - 0.</li>
10   - <li><img class="box-panel-option selection-panel-option"
11   - src="{{ server }}/img/cmd/0014.png" value="1" />
12   - 1.</li>
13   - <li><img class="box-panel-option selection-panel-option"
14   - src="{{ server }}/img/cmd/0045.png" value="2" />
15   - 2.</li>
16   - <li><img class="box-panel-option selection-panel-option"
17   - src="{{ server }}/img/cmd/0048.png" value="3" />
18   - 3.</li>
19   - <li><img class="box-panel-option selection-panel-option"
20   - src="{{ server }}/img/cmd/0040.png" value="4" />
21   - 4.</li>
22   - <li><img class="box-panel-option selection-panel-option"
23   - src="{{ server }}/img/cmd/0000.png" value="5" />
24   - 5.</li>
25   - </ul>
26   - </div>
  2 + <div class="panel-header">
  3 + <h8>Escolha a posição mais parecida dos dedos</h8>
  4 + </div>
  5 + <div class="selection-panel-inner-body">
  6 + <ul class="rig columns-3">
  7 + <li><img class="box-panel-option selection-panel-option"
  8 + src="{{ server }}/img/{{ configuracao }}/0007.png" value="0" />
  9 + 0.</li>
  10 + <li><img class="box-panel-option selection-panel-option"
  11 + src="{{ server }}/img/{{ configuracao }}/0014.png" value="1" />
  12 + 1.</li>
  13 + <li><img class="box-panel-option selection-panel-option"
  14 + src="{{ server }}/img/{{ configuracao }}/0045.png" value="2" />
  15 + 2.</li>
  16 + <li><img class="box-panel-option selection-panel-option"
  17 + src="{{ server }}/img/{{ configuracao }}/0048.png" value="3" />
  18 + 3.</li>
  19 + <li><img class="box-panel-option selection-panel-option"
  20 + src="{{ server }}/img/{{ configuracao }}/0040.png" value="4" />
  21 + 4.</li>
  22 + <li><img class="box-panel-option selection-panel-option"
  23 + src="{{ server }}/img/{{ configuracao }}/0000.png" value="5" />
  24 + 5.</li>
  25 + </ul>
  26 + </div>
27 27 </div>
28 28 <script type="text/javascript">
29   - configuration.setupFingersGroup();
30   -</script>
31 29 \ No newline at end of file
  30 + configuration.setupFingersGroup();
  31 +</script>
... ...
view/hand/configuracao/passo-2.html
  Diff comments   View file @e4e3988
1 1 <div class="selection-panel-body" mainConfig="right-hand" subConfig="configuracao" step="2">
2   - <div class="panel-header">
3   - <h8>Escolha a posição dos dedos</h8>
4   - </div>
5   - <div class="selection-panel-inner-body">
6   - <div class="finger-group" group="0">
7   - <ul class="rig columns-4">
8   - <li><img class="box-panel-option selection-panel-option"
9   - src="{{ server }}/img/cmd/0001.png"
10   - value="1" /> 1.</li>
11   - <li><img class="box-panel-option selection-panel-option"
12   - src="{{ server }}/img/cmd/0002.png"
13   - value="2" /> 2.</li>
14   - <li><img class="box-panel-option selection-panel-option"
15   - src="{{ server }}/img/cmd/0007.png"
16   - value="7" /> 3.</li>
17   - <li><img class="box-panel-option selection-panel-option"
18   - src="{{ server }}/img/cmd/0008.png"
19   - value="8" /> 4.</li>
20   - <li><img class="box-panel-option selection-panel-option"
21   - src="{{ server }}/img/cmd/0009.png"
22   - value="9" /> 5.</li>
23   - <li><img class="box-panel-option selection-panel-option"
24   - src="{{ server }}/img/cmd/0010.png"
25   - value="10" /> 6.</li>
26   - <li><img class="box-panel-option selection-panel-option"
27   - src="{{ server }}/img/cmd/0011.png"
28   - value="11" /> 7.</li>
29   - <li><img class="box-panel-option selection-panel-option"
30   - src="{{ server }}/img/cmd/0016.png"
31   - value="16" /> 8.</li>
32   - <li><img class="box-panel-option selection-panel-option"
33   - src="{{ server }}/img/cmd/0017.png"
34   - value="17" /> 9.</li>
35   - <li><img class="box-panel-option selection-panel-option"
36   - src="{{ server }}/img/cmd/0018.png"
37   - value="18" /> 10.</li>
38   - <li><img class="box-panel-option selection-panel-option"
39   - src="{{ server }}/img/cmd/0019.png"
40   - value="19" /> 11.</li>
41   - <li><img class="box-panel-option selection-panel-option"
42   - src="{{ server }}/img/cmd/0020.png"
43   - value="20" /> 12.</li>
44   - <li><img class="box-panel-option selection-panel-option"
45   - src="{{ server }}/img/cmd/0021.png"
46   - value="21" /> 13.</li>
47   - <li><img class="box-panel-option selection-panel-option"
48   - src="{{ server }}/img/cmd/0022.png"
49   - value="22" /> 14.</li>
50   - <li><img class="box-panel-option selection-panel-option"
51   - src="{{ server }}/img/cmd/0023.png"
52   - value="23" /> 15.</li>
53   - <li><img class="box-panel-option selection-panel-option"
54   - src="{{ server }}/img/cmd/0024.png"
55   - value="24" /> 16.</li>
56   - <li><img class="box-panel-option selection-panel-option"
57   - src="{{ server }}/img/cmd/0058.png"
58   - value="58" /> 17.</li>
59   - <li><img class="box-panel-option selection-panel-option"
60   - src="{{ server }}/img/cmd/0059.png"
61   - value="59" /> 18.</li>
62   - <li><img class="box-panel-option selection-panel-option"
63   - src="{{ server }}/img/cmd/0060.png"
64   - value="60" /> 19.</li>
65   - </ul>
66   - </div>
67   - <div class="finger-group" group="1">
68   - <ul class="rig columns-4">
69   - <li><img class="box-panel-option selection-panel-option"
70   - src="{{ server }}/img/cmd/0003.png"
71   - value="3" /> 1.</li>
72   - <li><img class="box-panel-option selection-panel-option"
73   - src="{{ server }}/img/cmd/0005.png"
74   - value="5" /> 2.</li>
75   - <li><img class="box-panel-option selection-panel-option"
76   - src="{{ server }}/img/cmd/0006.png"
77   - value="6" /> 3.</li>
78   - <li><img class="box-panel-option selection-panel-option"
79   - src="{{ server }}/img/cmd/0012.png"
80   - value="12" /> 4.</li>
81   - <li><img class="box-panel-option selection-panel-option"
82   - src="{{ server }}/img/cmd/0013.png"
83   - value="13" /> 5.</li>
84   - <li><img class="box-panel-option selection-panel-option"
85   - src="{{ server }}/img/cmd/0014.png"
86   - value="14" /> 6.</li>
87   - <li><img class="box-panel-option selection-panel-option"
88   - src="{{ server }}/img/cmd/0030.png"
89   - value="30" /> 7.</li>
90   - <li><img class="box-panel-option selection-panel-option"
91   - src="{{ server }}/img/cmd/0052.png"
92   - value="52" /> 8.</li>
93   - </ul>
94   - </div>
95   - <div class="finger-group" group="2">
96   - <ul class="rig columns-4">
97   - <li><img class="box-panel-option selection-panel-option"
98   - src="{{ server }}/img/cmd/0004.png"
99   - value="4" /> 1.</li>
100   - <li><img class="box-panel-option selection-panel-option"
101   - src="{{ server }}/img/cmd/0015.png"
102   - value="15" /> 2.</li>
103   - <li><img class="box-panel-option selection-panel-option"
104   - src="{{ server }}/img/cmd/0029.png"
105   - value="29" /> 3.</li>
106   - <li><img class="box-panel-option selection-panel-option"
107   - src="{{ server }}/img/cmd/0031.png"
108   - value="31" /> 4.</li>
109   - <li><img class="box-panel-option selection-panel-option"
110   - src="{{ server }}/img/cmd/0032.png"
111   - value="32" /> 5.</li>
112   - <li><img class="box-panel-option selection-panel-option"
113   - src="{{ server }}/img/cmd/0035.png"
114   - value="35" /> 6.</li>
115   - <li><img class="box-panel-option selection-panel-option"
116   - src="{{ server }}/img/cmd/0036.png"
117   - value="36" /> 7.</li>
118   - <li><img class="box-panel-option selection-panel-option"
119   - src="{{ server }}/img/cmd/0045.png"
120   - value="45" /> 8.</li>
121   - <li><img class="box-panel-option selection-panel-option"
122   - src="{{ server }}/img/cmd/0051.png"
123   - value="51" /> 9.</li>
124   - </ul>
125   - </div>
126   - <div class="finger-group" group="3">
127   - <ul class="rig columns-4">
128   - <li><img class="box-panel-option selection-panel-option"
129   - src="{{ server }}/img/cmd/0033.png"
130   - value="33" /> 1.</li>
131   - <li><img class="box-panel-option selection-panel-option"
132   - src="{{ server }}/img/cmd/0034.png"
133   - value="34" /> 2.</li>
134   - <li><img class="box-panel-option selection-panel-option"
135   - src="{{ server }}/img/cmd/0037.png"
136   - value="37" /> 3.</li>
137   - <li><img class="box-panel-option selection-panel-option"
138   - src="{{ server }}/img/cmd/0039.png"
139   - value="39" /> 4.</li>
140   - <li><img class="box-panel-option selection-panel-option"
141   - src="{{ server }}/img/cmd/0043.png"
142   - value="43" /> 5.</li>
143   - <li><img class="box-panel-option selection-panel-option"
144   - src="{{ server }}/img/cmd/0044.png"
145   - value="44" /> 6.</li>
146   - <li><img class="box-panel-option selection-panel-option"
147   - src="{{ server }}/img/cmd/0046.png"
148   - value="46" /> 7.</li>
149   - <li><img class="box-panel-option selection-panel-option"
150   - src="{{ server }}/img/cmd/0047.png"
151   - value="47" /> 8.</li>
152   - <li><img class="box-panel-option selection-panel-option"
153   - src="{{ server }}/img/cmd/0048.png"
154   - value="48" /> 9.</li>
155   - <li><img class="box-panel-option selection-panel-option"
156   - src="{{ server }}/img/cmd/0049.png"
157   - value="49" /> 10.</li>
158   - <li><img class="box-panel-option selection-panel-option"
159   - src="{{ server }}/img/cmd/0050.png"
160   - value="50" /> 11.</li>
161   - </ul>
162   - </div>
163   - <div class="finger-group" group="4">
164   - <ul class="rig columns-4">
165   - <li><img class="box-panel-option selection-panel-option"
166   - src="{{ server }}/img/cmd/0038.png"
167   - value="38" /> 1.</li>
168   - <li><img class="box-panel-option selection-panel-option"
169   - src="{{ server }}/img/cmd/0040.png"
170   - value="40" /> 2.</li>
171   - <li><img class="box-panel-option selection-panel-option"
172   - src="{{ server }}/img/cmd/0041.png"
173   - value="41" /> 3.</li>
174   - <li><img class="box-panel-option selection-panel-option"
175   - src="{{ server }}/img/cmd/0042.png"
176   - value="42" /> 4.</li>
177   - </ul>
178   - </div>
179   - <div class="finger-group" group="5">
180   - <ul class="rig columns-4">
181   - <li><img class="box-panel-option selection-panel-option"
182   - src="{{ server }}/img/cmd/0025.png"
183   - value="25" /> 1.</li>
184   - <li><img class="box-panel-option selection-panel-option"
185   - src="{{ server }}/img/cmd/0026.png"
186   - value="26" /> 2.</li>
187   - <li><img class="box-panel-option selection-panel-option"
188   - src="{{ server }}/img/cmd/0027.png"
189   - value="27" /> 3.</li>
190   - <li><img class="box-panel-option selection-panel-option"
191   - src="{{ server }}/img/cmd/0028.png"
192   - value="28" /> 4.</li>
193   - <li><img class="box-panel-option selection-panel-option"
194   - src="{{ server }}/img/cmd/0053.png"
195   - value="53" /> 5.</li>
196   - <li><img class="box-panel-option selection-panel-option"
197   - src="{{ server }}/img/cmd/0054.png"
198   - value="54" /> 6.</li>
199   - <li><img class="box-panel-option selection-panel-option"
200   - src="{{ server }}/img/cmd/0055.png"
201   - value="55" /> 7.</li>
202   - <li><img class="box-panel-option selection-panel-option"
203   - src="{{ server }}/img/cmd/0056.png"
204   - value="56" /> 8.</li>
205   - <li><img class="box-panel-option selection-panel-option"
206   - src="{{ server }}/img/cmd/0057.png"
207   - value="57" /> 9.</li>
208   - </ul>
209   - </div>
210   - </div>
  2 + <div class="panel-header">
  3 + <h8>Escolha a posição dos dedos</h8>
  4 + </div>
  5 + <div class="selection-panel-inner-body">
  6 + <div class="finger-group" group="0">
  7 + <ul class="rig columns-4">
  8 + <li><img class="box-panel-option selection-panel-option"
  9 + src="{{ server }}/img/{{ configuracao }}/0001.png"
  10 + value="1" /> 1.</li>
  11 + <li><img class="box-panel-option selection-panel-option"
  12 + src="{{ server }}/img/{{ configuracao }}/0002.png"
  13 + value="2" /> 2.</li>
  14 + <li><img class="box-panel-option selection-panel-option"
  15 + src="{{ server }}/img/{{ configuracao }}/0007.png"
  16 + value="7" /> 3.</li>
  17 + <li><img class="box-panel-option selection-panel-option"
  18 + src="{{ server }}/img/{{ configuracao }}/0008.png"
  19 + value="8" /> 4.</li>
  20 + <li><img class="box-panel-option selection-panel-option"
  21 + src="{{ server }}/img/{{ configuracao }}/0009.png"
  22 + value="9" /> 5.</li>
  23 + <li><img class="box-panel-option selection-panel-option"
  24 + src="{{ server }}/img/{{ configuracao }}/0010.png"
  25 + value="10" /> 6.</li>
  26 + <li><img class="box-panel-option selection-panel-option"
  27 + src="{{ server }}/img/{{ configuracao }}/0011.png"
  28 + value="11" /> 7.</li>
  29 + <li><img class="box-panel-option selection-panel-option"
  30 + src="{{ server }}/img/{{ configuracao }}/0016.png"
  31 + value="16" /> 8.</li>
  32 + <li><img class="box-panel-option selection-panel-option"
  33 + src="{{ server }}/img/{{ configuracao }}/0017.png"
  34 + value="17" /> 9.</li>
  35 + <li><img class="box-panel-option selection-panel-option"
  36 + src="{{ server }}/img/{{ configuracao }}/0018.png"
  37 + value="18" /> 10.</li>
  38 + <li><img class="box-panel-option selection-panel-option"
  39 + src="{{ server }}/img/{{ configuracao }}/0019.png"
  40 + value="19" /> 11.</li>
  41 + <li><img class="box-panel-option selection-panel-option"
  42 + src="{{ server }}/img/{{ configuracao }}/0020.png"
  43 + value="20" /> 12.</li>
  44 + <li><img class="box-panel-option selection-panel-option"
  45 + src="{{ server }}/img/{{ configuracao }}/0021.png"
  46 + value="21" /> 13.</li>
  47 + <li><img class="box-panel-option selection-panel-option"
  48 + src="{{ server }}/img/{{ configuracao }}/0022.png"
  49 + value="22" /> 14.</li>
  50 + <li><img class="box-panel-option selection-panel-option"
  51 + src="{{ server }}/img/{{ configuracao }}/0023.png"
  52 + value="23" /> 15.</li>
  53 + <li><img class="box-panel-option selection-panel-option"
  54 + src="{{ server }}/img/{{ configuracao }}/0024.png"
  55 + value="24" /> 16.</li>
  56 + <li><img class="box-panel-option selection-panel-option"
  57 + src="{{ server }}/img/{{ configuracao }}/0058.png"
  58 + value="58" /> 17.</li>
  59 + <li><img class="box-panel-option selection-panel-option"
  60 + src="{{ server }}/img/{{ configuracao }}/0059.png"
  61 + value="59" /> 18.</li>
  62 + <li><img class="box-panel-option selection-panel-option"
  63 + src="{{ server }}/img/{{ configuracao }}/0060.png"
  64 + value="60" /> 19.</li>
  65 + </ul>
  66 + </div>
  67 + <div class="finger-group" group="1">
  68 + <ul class="rig columns-4">
  69 + <li><img class="box-panel-option selection-panel-option"
  70 + src="{{ server }}/img/{{ configuracao }}/0003.png"
  71 + value="3" /> 1.</li>
  72 + <li><img class="box-panel-option selection-panel-option"
  73 + src="{{ server }}/img/{{ configuracao }}/0005.png"
  74 + value="5" /> 2.</li>
  75 + <li><img class="box-panel-option selection-panel-option"
  76 + src="{{ server }}/img/{{ configuracao }}/0006.png"
  77 + value="6" /> 3.</li>
  78 + <li><img class="box-panel-option selection-panel-option"
  79 + src="{{ server }}/img/{{ configuracao }}/0012.png"
  80 + value="12" /> 4.</li>
  81 + <li><img class="box-panel-option selection-panel-option"
  82 + src="{{ server }}/img/{{ configuracao }}/0013.png"
  83 + value="13" /> 5.</li>
  84 + <li><img class="box-panel-option selection-panel-option"
  85 + src="{{ server }}/img/{{ configuracao }}/0014.png"
  86 + value="14" /> 6.</li>
  87 + <li><img class="box-panel-option selection-panel-option"
  88 + src="{{ server }}/img/{{ configuracao }}/0030.png"
  89 + value="30" /> 7.</li>
  90 + <li><img class="box-panel-option selection-panel-option"
  91 + src="{{ server }}/img/{{ configuracao }}/0052.png"
  92 + value="52" /> 8.</li>
  93 + </ul>
  94 + </div>
  95 + <div class="finger-group" group="2">
  96 + <ul class="rig columns-4">
  97 + <li><img class="box-panel-option selection-panel-option"
  98 + src="{{ server }}/img/{{ configuracao }}/0004.png"
  99 + value="4" /> 1.</li>
  100 + <li><img class="box-panel-option selection-panel-option"
  101 + src="{{ server }}/img/{{ configuracao }}/0015.png"
  102 + value="15" /> 2.</li>
  103 + <li><img class="box-panel-option selection-panel-option"
  104 + src="{{ server }}/img/{{ configuracao }}/0029.png"
  105 + value="29" /> 3.</li>
  106 + <li><img class="box-panel-option selection-panel-option"
  107 + src="{{ server }}/img/{{ configuracao }}/0031.png"
  108 + value="31" /> 4.</li>
  109 + <li><img class="box-panel-option selection-panel-option"
  110 + src="{{ server }}/img/{{ configuracao }}/0032.png"
  111 + value="32" /> 5.</li>
  112 + <li><img class="box-panel-option selection-panel-option"
  113 + src="{{ server }}/img/{{ configuracao }}/0035.png"
  114 + value="35" /> 6.</li>
  115 + <li><img class="box-panel-option selection-panel-option"
  116 + src="{{ server }}/img/{{ configuracao }}/0036.png"
  117 + value="36" /> 7.</li>
  118 + <li><img class="box-panel-option selection-panel-option"
  119 + src="{{ server }}/img/{{ configuracao }}/0045.png"
  120 + value="45" /> 8.</li>
  121 + <li><img class="box-panel-option selection-panel-option"
  122 + src="{{ server }}/img/{{ configuracao }}/0051.png"
  123 + value="51" /> 9.</li>
  124 + </ul>
  125 + </div>
  126 + <div class="finger-group" group="3">
  127 + <ul class="rig columns-4">
  128 + <li><img class="box-panel-option selection-panel-option"
  129 + src="{{ server }}/img/{{ configuracao }}/0033.png"
  130 + value="33" /> 1.</li>
  131 + <li><img class="box-panel-option selection-panel-option"
  132 + src="{{ server }}/img/{{ configuracao }}/0034.png"
  133 + value="34" /> 2.</li>
  134 + <li><img class="box-panel-option selection-panel-option"
  135 + src="{{ server }}/img/{{ configuracao }}/0037.png"
  136 + value="37" /> 3.</li>
  137 + <li><img class="box-panel-option selection-panel-option"
  138 + src="{{ server }}/img/{{ configuracao }}/0039.png"
  139 + value="39" /> 4.</li>
  140 + <li><img class="box-panel-option selection-panel-option"
  141 + src="{{ server }}/img/{{ configuracao }}/0043.png"
  142 + value="43" /> 5.</li>
  143 + <li><img class="box-panel-option selection-panel-option"
  144 + src="{{ server }}/img/{{ configuracao }}/0044.png"
  145 + value="44" /> 6.</li>
  146 + <li><img class="box-panel-option selection-panel-option"
  147 + src="{{ server }}/img/{{ configuracao }}/0046.png"
  148 + value="46" /> 7.</li>
  149 + <li><img class="box-panel-option selection-panel-option"
  150 + src="{{ server }}/img/{{ configuracao }}/0047.png"
  151 + value="47" /> 8.</li>
  152 + <li><img class="box-panel-option selection-panel-option"
  153 + src="{{ server }}/img/{{ configuracao }}/0048.png"
  154 + value="48" /> 9.</li>
  155 + <li><img class="box-panel-option selection-panel-option"
  156 + src="{{ server }}/img/{{ configuracao }}/0049.png"
  157 + value="49" /> 10.</li>
  158 + <li><img class="box-panel-option selection-panel-option"
  159 + src="{{ server }}/img/{{ configuracao }}/0050.png"
  160 + value="50" /> 11.</li>
  161 + </ul>
  162 + </div>
  163 + <div class="finger-group" group="4">
  164 + <ul class="rig columns-4">
  165 + <li><img class="box-panel-option selection-panel-option"
  166 + src="{{ server }}/img/{{ configuracao }}/0038.png"
  167 + value="38" /> 1.</li>
  168 + <li><img class="box-panel-option selection-panel-option"
  169 + src="{{ server }}/img/{{ configuracao }}/0040.png"
  170 + value="40" /> 2.</li>
  171 + <li><img class="box-panel-option selection-panel-option"
  172 + src="{{ server }}/img/{{ configuracao }}/0041.png"
  173 + value="41" /> 3.</li>
  174 + <li><img class="box-panel-option selection-panel-option"
  175 + src="{{ server }}/img/{{ configuracao }}/0042.png"
  176 + value="42" /> 4.</li>
  177 + </ul>
  178 + </div>
  179 + <div class="finger-group" group="5">
  180 + <ul class="rig columns-4">
  181 + <li><img class="box-panel-option selection-panel-option"
  182 + src="{{ server }}/img/{{ configuracao }}/0025.png"
  183 + value="25" /> 1.</li>
  184 + <li><img class="box-panel-option selection-panel-option"
  185 + src="{{ server }}/img/{{ configuracao }}/0026.png"
  186 + value="26" /> 2.</li>
  187 + <li><img class="box-panel-option selection-panel-option"
  188 + src="{{ server }}/img/{{ configuracao }}/0027.png"
  189 + value="27" /> 3.</li>
  190 + <li><img class="box-panel-option selection-panel-option"
  191 + src="{{ server }}/img/{{ configuracao }}/0028.png"
  192 + value="28" /> 4.</li>
  193 + <li><img class="box-panel-option selection-panel-option"
  194 + src="{{ server }}/img/{{ configuracao }}/0053.png"
  195 + value="53" /> 5.</li>
  196 + <li><img class="box-panel-option selection-panel-option"
  197 + src="{{ server }}/img/{{ configuracao }}/0054.png"
  198 + value="54" /> 6.</li>
  199 + <li><img class="box-panel-option selection-panel-option"
  200 + src="{{ server }}/img/{{ configuracao }}/0055.png"
  201 + value="55" /> 7.</li>
  202 + <li><img class="box-panel-option selection-panel-option"
  203 + src="{{ server }}/img/{{ configuracao }}/0056.png"
  204 + value="56" /> 8.</li>
  205 + <li><img class="box-panel-option selection-panel-option"
  206 + src="{{ server }}/img/{{ configuracao }}/0057.png"
  207 + value="57" /> 9.</li>
  208 + </ul>
  209 + </div>
  210 + </div>
211 211 </div>
212 212 <script type="text/javascript">
213   - configuration.setupFingersPosition();
214   -</script>
215 213 \ No newline at end of file
  214 + configuration.setupFingersPosition();
  215 +</script>
... ...
view/hand/orientacao/passo-1.html
  Diff comments   View file @e4e3988
1 1 <div class="selection-panel-body" mainConfig="right-hand" subConfig="orientacao" step="1">
2   - <div class="panel-header">
3   - <h8>Palma da mão</h8>
4   - </div>
5   - <div class="selection-panel-inner-body">
6   - <ul class="rig columns-3">
7   - <li><img class="box-panel-option selection-panel-option"
8   - src="{{ server }}/img/ord/01.png" value="68" />1.</li>
9   - <li><img class="box-panel-option selection-panel-option"
10   - src="{{ server }}/img/ord/02.png" value="66" />2.</li>
11   - <li><img class="box-panel-option selection-panel-option"
12   - src="{{ server }}/img/ord/03.png" value="64" />3.</li>
13   - <li><img class="box-panel-option selection-panel-option"
14   - src="{{ server }}/img/ord/04.png" value="2" />4.</li>
15   - <li><img class="box-panel-option selection-panel-option"
16   - src="{{ server }}/img/ord/05.png" value="9" />5.</li>
17   - <li><img class="box-panel-option selection-panel-option"
18   - src="{{ server }}/img/ord/06.png" value="16" />6.</li>
19   - <li><img class="box-panel-option selection-panel-option"
20   - src="{{ server }}/img/ord/07.png" value="92" />7.</li>
21   - <li><img class="box-panel-option selection-panel-option"
22   - src="{{ server }}/img/ord/08.png" value="90" />8.</li>
23   - <li><img class="box-panel-option selection-panel-option"
24   - src="{{ server }}/img/ord/09.png" value="88" />9.</li>
25   - <li><img class="box-panel-option selection-panel-option"
26   - src="{{ server }}/img/ord/10.png" value="4" />10.</li>
27   - <li><img class="box-panel-option selection-panel-option"
28   - src="{{ server }}/img/ord/11.png" value="11" />11.</li>
29   - <li><img class="box-panel-option selection-panel-option"
30   - src="{{ server }}/img/ord/12.png" value="18" />12.</li>
31   - </ul>
32   - </div>
  2 + <div class="panel-header">
  3 + <h8>Palma da mão</h8>
  4 + </div>
  5 + <div class="selection-panel-inner-body">
  6 + <ul class="rig columns-3">
  7 + <li><img class="box-panel-option selection-panel-option"
  8 + src="{{ server }}/img/{{ orientacao }}/01.png" value="68" />1.</li>
  9 + <li><img class="box-panel-option selection-panel-option"
  10 + src="{{ server }}/img/{{ orientacao }}/02.png" value="66" />2.</li>
  11 + <li><img class="box-panel-option selection-panel-option"
  12 + src="{{ server }}/img/{{ orientacao }}/03.png" value="64" />3.</li>
  13 + <li><img class="box-panel-option selection-panel-option"
  14 + src="{{ server }}/img/{{ orientacao }}/04.png" value="2" />4.</li>
  15 + <li><img class="box-panel-option selection-panel-option"
  16 + src="{{ server }}/img/{{ orientacao }}/05.png" value="9" />5.</li>
  17 + <li><img class="box-panel-option selection-panel-option"
  18 + src="{{ server }}/img/{{ orientacao }}/06.png" value="16" />6.</li>
  19 + <li><img class="box-panel-option selection-panel-option"
  20 + src="{{ server }}/img/{{ orientacao }}/07.png" value="92" />7.</li>
  21 + <li><img class="box-panel-option selection-panel-option"
  22 + src="{{ server }}/img/{{ orientacao }}/08.png" value="90" />8.</li>
  23 + <li><img class="box-panel-option selection-panel-option"
  24 + src="{{ server }}/img/{{ orientacao }}/09.png" value="88" />9.</li>
  25 + <li><img class="box-panel-option selection-panel-option"
  26 + src="{{ server }}/img/{{ orientacao }}/10.png" value="4" />10.</li>
  27 + <li><img class="box-panel-option selection-panel-option"
  28 + src="{{ server }}/img/{{ orientacao }}/11.png" value="11" />11.</li>
  29 + <li><img class="box-panel-option selection-panel-option"
  30 + src="{{ server }}/img/{{ orientacao }}/12.png" value="18" />12.</li>
  31 + </ul>
  32 + </div>
33 33 </div>
34 34 <script type="text/javascript">
35   - orientation.setup();
36   -</script>
37 35 \ No newline at end of file
  36 + orientation.setup();
  37 +</script>
... ...
view/template-backup.html
  Diff comments   View file @e4e3988
... ... @@ -4,193 +4,193 @@
4 4 import 'facial-configuration.html' as facialConfig with context %}
5 5  
6 6 <div id="main-container" class="container">
7   - <div id="initial-screen">
8   - <div class="col-sm-6 col-centered">
9   - <div class="col-sm-8 col-centered">
10   - <video src="" preload="metadata"
11   - class="ref-video video-body-main video-border" autoplay loop
12   - controls>
13   - <source type="video/webm">
14   - </video>
15   - </div>
16   - <h6 class="text-center">
17   - Ajude a criar o sinal <span class="sign-label"></span>.
18   - </h6>
19   - <div class="col-sm-4 col-centered">
20   - <div id="start-button" class="col-sm-12 btn btn-default">OK</div>
21   - </div>
22   - </div>
23   - </div>
24   - <div id="configuration-screen">
25   - <div class="row">
26   - <div class="col-sm-3">
27   - <h8>Vídeo de referência "<span class="sign-label"></span>"</h8>
28   - <div id="ref-video-panel" class="col-sm-12">
29   - <div id="ref-video-container" class="col-sm-10">
30   - <video src="" preload="metadata"
31   - class="ref-video video-body-main video-border" autoplay loop
32   - controls>
33   - <source type="video/webm">
34   - </video>
35   - </div>
36   - <div id="minimize-icon-container" class="col-sm-2 icon_container"
37   - name="minimize">
38   - <img src="{{ server }}/img/minimize-icon.png"></img>
39   - </div>
40   - <div id="maximize-icon-container" class="col-sm-2 icon_container"
41   - name="maximize">
42   - <img id="maximize-icon" src="{{ server }}/img/maximize-icon.png"></img>
43   - </div>
44   - </div>
45   - <div id="configuration-panel" class="col-sm-8">
46   - <div class="icon_container config-panel-option" name="facial"
47   - panel="facial">
48   - <img src="{{ server }}/img/facial-icon.png"</img> <span
49   - class="configuration-panel-label">Expressão</span>
50   - </div>
51   - <div class="icon_container config-panel-option" name="right-hand"
52   - panel="right-hand">
53   - <img src="{{ server }}/img/right-hand-icon.png"></img> <span
54   - class="configuration-panel-label">Mão direita</span>
55   - </div>
56   - <div class="icon_container config-panel-option" name="left-hand"
57   - panel="left-hand">
58   - <img src="{{ server }}/img/left-hand-icon.png"></img> <span
59   - class="configuration-panel-label">Mão esquerda</span>
60   - </div>
61   - </div>
62   - </div>
63   - <div id="avatar-container" class="col-sm-7 avatar-container-zoom-out">
64   - <div id="facial-edit" class="edit-container">
65   - <img class="check-icon" src="{{ server }}/img/check-icon.png"></img>
66   - <div class="icon_container config-panel-option" name="edit"
67   - panel="facial">
68   - <img src="{{ server }}/img/edit-icon.png"></img>
69   - </div>
70   - </div>
71   - <div id="right-hand-edit" class="edit-container">
72   - <img class="check-icon" src="{{ server }}/img/check-icon.png"></img>
73   - <div class="icon_container config-panel-option" name="edit"
74   - panel="right-hand">
75   - <img src="{{ server }}/img/edit-icon.png"></img>
76   - </div>
77   - </div>
78   - <div id="left-hand-edit" class="edit-container">
79   - <img class="check-icon" src="{{ server }}/img/check-icon.png"></img>
80   - <div class="icon_container config-panel-option" name="edit"
81   - panel="left-hand">
82   - <img src="{{ server }}/img/edit-icon.png"></img>
83   - </div>
84   - </div>
85   - <div id="avatar-default" class="avatar-img">
86   - <div id="avatar-body-face"
87   - class="icon_container config-panel-option" name="avatar-facial"
88   - panel="facial">
89   - <img src="{{ server }}/img/avatar-facial-icon.png"></img>
90   - </div>
91   - <div id="avatar-body-right-hand"
92   - class="icon_container config-panel-option"
93   - name="avatar-right-hand" panel="right-hand">
94   - <img src="{{ server }}/img/avatar-right-hand-icon.png"></img>
95   - </div>
96   - <div id="avatar-body-left-hand"
97   - class="icon_container config-panel-option" name="avatar-left-hand"
98   - panel="left-hand">
99   - <img src="{{ server }}/img/avatar-left-hand-icon.png"></img>
100   - </div>
101   - <img class="avatar-img-zoom-out" src="{{ server }}/img/avatar.png"></img>
102   - </div>
103   - <img id="avatar-facial" class="avatar-img avatar-img-zoom-out"
104   - src="{{ server }}/img/avatar-facial.png"></img> <img
105   - id="avatar-right-hand" class="avatar-img avatar-img-zoom-out"
106   - src="{{ server }}/img/avatar-right-hand.png"></img> <img
107   - id="avatar-left-hand" class="avatar-img avatar-img-zoom-out"
108   - src="{{ server }}/img/avatar-left-hand.png"></img>
109   - </div>
110   - <div id="selection-container" class="col-sm-2">
111   - <div id="selection-panel">
112   - <div class="x btn-default"></div>
  7 + <div id="initial-screen">
  8 + <div class="col-sm-6 col-centered">
  9 + <div class="col-sm-8 col-centered">
  10 + <video src="" preload="metadata"
  11 + class="ref-video video-body-main video-border" autoplay loop
  12 + controls>
  13 + <source type="video/webm">
  14 + </video>
  15 + </div>
  16 + <h6 class="text-center">
  17 + Ajude a criar o sinal <span class="sign-label"></span>.
  18 + </h6>
  19 + <div class="col-sm-4 col-centered">
  20 + <div id="start-button" class="col-sm-12 btn btn-default">OK</div>
  21 + </div>
  22 + </div>
  23 + </div>
  24 + <div id="configuration-screen">
  25 + <div class="row">
  26 + <div class="col-sm-3">
  27 + <h8>Vídeo de referência "<span class="sign-label"></span>"</h8>
  28 + <div id="ref-video-panel" class="col-sm-12">
  29 + <div id="ref-video-container" class="col-sm-10">
  30 + <video src="" preload="metadata"
  31 + class="ref-video video-body-main video-border" autoplay loop
  32 + controls>
  33 + <source type="video/webm">
  34 + </video>
  35 + </div>
  36 + <div id="minimize-icon-container" class="col-sm-2 icon_container"
  37 + name="minimize">
  38 + <img src="{{ server }}/img/minimize-icon.png"></img>
  39 + </div>
  40 + <div id="maximize-icon-container" class="col-sm-2 icon_container"
  41 + name="maximize">
  42 + <img id="maximize-icon" src="{{ server }}/img/maximize-icon.png"></img>
  43 + </div>
  44 + </div>
  45 + <div id="configuration-panel" class="col-sm-8">
  46 + <div class="icon_container config-panel-option" name="facial"
  47 + panel="facial">
  48 + <img src="{{ server }}/img/facial-icon.png"</img> <span
  49 + class="configuration-panel-label">Expressão</span>
  50 + </div>
  51 + <div class="icon_container config-panel-option" name="right-hand"
  52 + panel="right-hand">
  53 + <img src="{{ server }}/img/right-hand-icon.png"></img> <span
  54 + class="configuration-panel-label">Mão direita</span>
  55 + </div>
  56 + <div class="icon_container config-panel-option" name="left-hand"
  57 + panel="left-hand">
  58 + <img src="{{ server }}/img/left-hand-icon.png"></img> <span
  59 + class="configuration-panel-label">Mão esquerda</span>
  60 + </div>
  61 + </div>
  62 + </div>
  63 + <div id="avatar-container" class="col-sm-7 avatar-container-zoom-out">
  64 + <div id="facial-edit" class="edit-container">
  65 + <img class="check-icon" src="{{ server }}/img/check-icon.png"></img>
  66 + <div class="icon_container config-panel-option" name="edit"
  67 + panel="facial">
  68 + <img src="{{ server }}/img/edit-icon.png"></img>
  69 + </div>
  70 + </div>
  71 + <div id="right-hand-edit" class="edit-container">
  72 + <img class="check-icon" src="{{ server }}/img/check-icon.png"></img>
  73 + <div class="icon_container config-panel-option" name="edit"
  74 + panel="right-hand">
  75 + <img src="{{ server }}/img/edit-icon.png"></img>
  76 + </div>
  77 + </div>
  78 + <div id="left-hand-edit" class="edit-container">
  79 + <img class="check-icon" src="{{ server }}/img/check-icon.png"></img>
  80 + <div class="icon_container config-panel-option" name="edit"
  81 + panel="left-hand">
  82 + <img src="{{ server }}/img/edit-icon.png"></img>
  83 + </div>
  84 + </div>
  85 + <div id="avatar-default" class="avatar-img">
  86 + <div id="avatar-body-face"
  87 + class="icon_container config-panel-option" name="avatar-facial"
  88 + panel="facial">
  89 + <img src="{{ server }}/img/avatar-facial-icon.png"></img>
  90 + </div>
  91 + <div id="avatar-body-right-hand"
  92 + class="icon_container config-panel-option"
  93 + name="avatar-right-hand" panel="right-hand">
  94 + <img src="{{ server }}/img/avatar-right-hand-icon.png"></img>
  95 + </div>
  96 + <div id="avatar-body-left-hand"
  97 + class="icon_container config-panel-option" name="avatar-left-hand"
  98 + panel="left-hand">
  99 + <img src="{{ server }}/img/avatar-left-hand-icon.png"></img>
  100 + </div>
  101 + <img class="avatar-img-zoom-out" src="{{ server }}/img/avatar.png"></img>
  102 + </div>
  103 + <img id="avatar-facial" class="avatar-img avatar-img-zoom-out"
  104 + src="{{ server }}/img/avatar-facial.png"></img> <img
  105 + id="avatar-right-hand" class="avatar-img avatar-img-zoom-out"
  106 + src="{{ server }}/img/avatar-right-hand.png"></img> <img
  107 + id="avatar-left-hand" class="avatar-img avatar-img-zoom-out"
  108 + src="{{ server }}/img/avatar-left-hand.png"></img>
  109 + </div>
  110 + <div id="selection-container" class="col-sm-2">
  111 + <div id="selection-panel">
  112 + <div class="x btn-default"></div>
113 113  
114   - {{ facialConfig.selectionPanel() }} {{
115   - handConfig.selectionPanel('right-hand') }} {{
116   - handConfig.selectionPanel('left-hand') }}
  114 + {{ facialConfig.selectionPanel() }} {{
  115 + handConfig.selectionPanel('right-hand') }} {{
  116 + handConfig.selectionPanel('left-hand') }}
117 117  
118   - <div class="subconfiguration-panel col-sm-12">
119   - <div class="arrow icon_container col-sm-1" name="left-arrow">
120   - <img src="{{ server }}/img/left-arrow-icon.png" />
121   - </div>
  118 + <div class="subconfiguration-panel col-sm-12">
  119 + <div class="arrow icon_container col-sm-1" name="left-arrow">
  120 + <img src="{{ server }}/img/left-arrow-icon.png" />
  121 + </div>
122 122  
123   - {{ facialConfig.subconfigPanel() }} {{
124   - handConfig.subconfigPanel('right-hand') }} {{
125   - handConfig.subconfigPanel('left-hand') }}
  123 + {{ facialConfig.subconfigPanel() }} {{
  124 + handConfig.subconfigPanel('right-hand') }} {{
  125 + handConfig.subconfigPanel('left-hand') }}
126 126  
127   - <div class="arrow icon_container col-sm-1" name="right-arrow">
128   - <img src="{{ server }}/img/right-arrow-icon.png" />
129   - </div>
130   - </div>
131   - </div>
132   - </div>
133   - </div>
134   - <div class="row">
135   - <div id="ready-button" class="btn btn-default pull-right disabled">GERAR
136   - SINAL</div>
137   - </div>
138   - </div>
139   - <div id="render-screen">
140   - <div id="render-main" class="row">
141   - <div id="render-ref" class="col-sm-6">
142   - <h6>Vídeo de referência</h6>
143   - <div class="col-sm-12">
144   - <video src="" preload="metadata"
145   - class="ref-video video-body-main video-border" loop controls>
146   - <source type="video/webm">
147   - </video>
148   - </div>
149   - </div>
150   - <div class="col-sm-6">
151   - <div id="render-avatar" class="col-sm-12">
152   - <h6>
153   - Sinal "<span class="sign-label"></span>" construído
154   - </h6>
155   - <video src="" preload="metadata"
156   - class="video-body-main video-border" autoplay loop controls>
157   - <source type="video/webm">
158   - </video>
159   - <div id="render-edit" class="icon_container" name="big-edit">
160   - <img class="col-centered" src="{{ server }}/img/big-edit-icon.png"></img>
161   - </div>
162   - </div>
163   - <div id="render-loading">
164   - <h6>
165   - Gerando o sinal "<span class="sign-label"></span>"
166   - </h6>
167   - <div id="loading-container" class="video-border">
168   - <img src="{{ server }}/img/loading.gif">
169   - </div>
170   - </div>
171   - </div>
172   - </div>
173   - <div class="row">
174   - <div id="finish-button" class="btn btn-default pull-right disabled">ENVIAR
175   - SINAL</div>
176   - </div>
177   - </div>
178   - <div id="thanks-screen">
179   - <div class="col-sm-6 col-centered">
180   - <div id="completed-task-msg">
181   - <h3 class="text-center">Obrigado,</h3>
182   - <h6 class="text-center">você configurou o sinal com sucesso!</h6>
183   - </div>
184   - <div id="completed-all-task-msg">
185   - <h3 class="text-center">Parabéns,</h3>
186   - <h6 class="text-center">você configurou todos os sinais
187   - disponíveis!</h6>
188   - </div>
189   - <div class="col-sm-11 col-centered">
190   - <img src="{{ server }}/img/avatar-thanks.png"></img>
191   - </div>
192   - </div>
193   - </div>
  127 + <div class="arrow icon_container col-sm-1" name="right-arrow">
  128 + <img src="{{ server }}/img/right-arrow-icon.png" />
  129 + </div>
  130 + </div>
  131 + </div>
  132 + </div>
  133 + </div>
  134 + <div class="row">
  135 + <div id="ready-button" class="btn btn-default pull-right disabled">GERAR
  136 + SINAL</div>
  137 + </div>
  138 + </div>
  139 + <div id="render-screen">
  140 + <div id="render-main" class="row">
  141 + <div id="render-ref" class="col-sm-6">
  142 + <h6>Vídeo de referência</h6>
  143 + <div class="col-sm-12">
  144 + <video src="" preload="metadata"
  145 + class="ref-video video-body-main video-border" loop controls>
  146 + <source type="video/webm">
  147 + </video>
  148 + </div>
  149 + </div>
  150 + <div class="col-sm-6">
  151 + <div id="render-avatar" class="col-sm-12">
  152 + <h6>
  153 + Sinal "<span class="sign-label"></span>" construído
  154 + </h6>
  155 + <video src="" preload="metadata"
  156 + class="video-body-main video-border" autoplay loop controls>
  157 + <source type="video/webm">
  158 + </video>
  159 + <div id="render-edit" class="icon_container" name="big-edit">
  160 + <img class="col-centered" src="{{ server }}/img/big-edit-icon.png"></img>
  161 + </div>
  162 + </div>
  163 + <div id="render-loading">
  164 + <h6>
  165 + Gerando o sinal "<span class="sign-label"></span>"
  166 + </h6>
  167 + <div id="loading-container" class="video-border">
  168 + <img src="{{ server }}/img/loading.gif">
  169 + </div>
  170 + </div>
  171 + </div>
  172 + </div>
  173 + <div class="row">
  174 + <div id="finish-button" class="btn btn-default pull-right disabled">ENVIAR
  175 + SINAL</div>
  176 + </div>
  177 + </div>
  178 + <div id="thanks-screen">
  179 + <div class="col-sm-6 col-centered">
  180 + <div id="completed-task-msg">
  181 + <h3 class="text-center">Obrigado,</h3>
  182 + <h6 class="text-center">você configurou o sinal com sucesso!</h6>
  183 + </div>
  184 + <div id="completed-all-task-msg">
  185 + <h3 class="text-center">Parabéns,</h3>
  186 + <h6 class="text-center">você configurou todos os sinais
  187 + disponíveis!</h6>
  188 + </div>
  189 + <div class="col-sm-11 col-centered">
  190 + <img src="{{ server }}/img/avatar-thanks.png"></img>
  191 + </div>
  192 + </div>
  193 + </div>
194 194 </div>
195 195  
196 196 <script src="{{ server }}/assets/js/js.cookie.js"></script>
... ... @@ -198,5 +198,5 @@ import &#39;facial-configuration.html&#39; as facialConfig with context %}
198 198 <script src="{{ server }}/assets/js/wikilibras.js"></script>
199 199  
200 200 <script type="text/javascript">
201   - wikilibras.run("{{ server }}", "{{ server_backend }}", "{{ app_shortname }}", "{{ api_host }}");
  201 + wikilibras.run("{{ server }}", "{{ server_backend }}", "{{ app_shortname }}", "{{ api_host }}");
202 202 </script>
... ...