Skip to content

Commit 57ee4d1

Browse files
Mick2ndMick2nd
committed
Mobile variant
- intermediate state - make both desktop and mobile variant working - introduced scss - introduced partials - improved position and dimension handling of panels
1 parent 4af18b3 commit 57ee4d1

21 files changed

Lines changed: 1051 additions & 622 deletions

‎src/assets/dialog-mobile.html‎

Lines changed: 236 additions & 210 deletions
Large diffs are not rendered by default.

‎src/assets/dialog.html‎

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ <h3>Katex Input Helper</h3>
3636
<form id="KATEX" name="KATEX" method="post">
3737
<input id="hidden" name="hidden" type="hidden" value="" />
3838
</form>
39-
<div id="formula"></div>
39+
<div id="formula" class="hidden"></div>
4040
</div>
4141

4242
<div id="menu">
@@ -171,8 +171,8 @@ <h3>Katex Input Helper</h3>
171171
</div>
172172
</div>
173173

174-
<div id="southRegion" data-options="region:'south',split:false" >
175-
<div id="divInformation">&nbsp;</div>
174+
<div class="southRegion" data-options="region:'south',split:false" >
175+
<div class="divInformation">&nbsp;</div>
176176
<div>
177177
<span locate="AUTHOR"></span>
178178
</div>
@@ -384,52 +384,52 @@ <h3>Katex Input Helper</h3>
384384
</div>
385385
</div>
386386

387-
<div id="wf_COMMUTATIVE_DIAGRAM_MORE" class="easyui-dialog" iconcls="icon-diagram"
387+
<div id="wf_COMMUTATIVE_DIAGRAM_MORE" class="easyui-dialog content-tailored" iconcls="icon-diagram"
388388
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
389389
title="<span id='wf_COMMUTATIVE_DIAGRAM_MORE_TITLE' locate='COMMUTATIVE_DIAGRAM' class='rtl-title-withicon'></span>" >
390390
</div>
391391

392-
<div id="wf_CHEMICAL_FORMULAE_MORE" class="easyui-dialog" iconcls="icon-chemical"
392+
<div id="wf_CHEMICAL_FORMULAE_MORE" class="easyui-dialog content-tailored" iconcls="icon-chemical"
393393
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
394394
title="<span id='wf_CHEMICAL_FORMULAE_MORE_TITLE' locate='CHEMICAL_FORMULAE' class='rtl-title-withicon'></span>" >
395395
</div>
396396

397-
<div id="wf_BRACKET_SYMBOLS_MORE" class="easyui-dialog"
397+
<div id="wf_BRACKET_SYMBOLS_MORE" class="easyui-dialog content-tailored"
398398
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
399399
title="<span id='wf_BRACKET_SYMBOLS_MORE_TITLE' class='rtl-title-withicon'>$(\ )$ &nbsp;&nbsp; $[\ \ ]$ &nbsp;&nbsp; $\|\ \|$</span>" >
400400
</div>
401401

402-
<div id="wf_RELATION_SYMBOLS_MORE" class="easyui-dialog"
402+
<div id="wf_RELATION_SYMBOLS_MORE" class="easyui-dialog content-tailored"
403403
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
404404
title="<span id='wf_RELATION_SYMBOLS_MORE_TITLE' class='rtl-title-withicon'>$\leq$ &nbsp;&nbsp; $\cong$ &nbsp;&nbsp; $\approx$</span>">
405405
</div>
406406

407-
<div id="wf_ARROW_SYMBOLS_MORE" class="easyui-dialog"
407+
<div id="wf_ARROW_SYMBOLS_MORE" class="easyui-dialog content-tailored"
408408
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
409409
title="<span id='wf_ARROW_SYMBOLS_MORE_TITLE' class='rtl-title-withicon'>$\Rightarrow$ &nbsp;&nbsp; $\circlearrowleft$ &nbsp;&nbsp; $\looparrowright$</span>" >
410410
</div>
411411

412-
<div id="wf_FR_CHAR_MORE" class="easyui-dialog"
412+
<div id="wf_FR_CHAR_MORE" class="easyui-dialog content-tailored"
413413
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
414414
title="<span id='wf_FR_CHAR_MORE_TITLE' class='rtl-title-withicon'>$\mathfrak{A}$ &nbsp;&nbsp; $\mathfrak{B}$ &nbsp;&nbsp; $\mathfrak{C}$</span>" >
415415
</div>
416416

417-
<div id="wf_BBB_CHAR_MORE" class="easyui-dialog"
417+
<div id="wf_BBB_CHAR_MORE" class="easyui-dialog content-tailored"
418418
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
419419
title="<span id='wf_BBB_CHAR_MORE_TITLE' class='rtl-title-withicon'>$\mathbb{A}$ &nbsp;&nbsp; $\mathbb{B}$ &nbsp;&nbsp; $\mathbb{C}$</span>" >
420420
</div>
421421

422-
<div id="wf_L_U_GREEK_CHAR_MORE" class="easyui-dialog"
422+
<div id="wf_L_U_GREEK_CHAR_MORE" class="easyui-dialog content-tailored"
423423
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
424424
title="<span id='wf_L_U_GREEK_CHAR_MORE_TITLE' class='rtl-title-withicon'>$\varepsilon$ &nbsp;&nbsp; $\pi$ &nbsp;&nbsp; $\Psi$</span>" >
425425
</div>
426426

427-
<div id="wf_ALL_CHAR_MORE" class="easyui-dialog"
427+
<div id="wf_ALL_CHAR_MORE" class="easyui-dialog content-tailored"
428428
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
429429
title="<span id='wf_ALL_CHAR_MORE_TITLE' class='rtl-title-withicon'>A B C</span>" >
430430
</div>
431431

432-
<div id="wf_EQUATION_MORE" class="easyui-dialog" iconcls="icon-equation"
432+
<div id="wf_EQUATION_MORE" class="easyui-dialog content-tailored" iconcls="icon-equation"
433433
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
434434
title="<span id='wf_EQUATION_MORE_TITLE' locate='EQUATION' class='rtl-title-withicon'></span>" >
435435
</div>
@@ -505,17 +505,17 @@ <h3>Katex Input Helper</h3>
505505
<a id="fSAVE_CUSTOM_EQUATIONS" href="#" ></a>
506506
</div>
507507

508-
<div id="wf_HORIZONTAL_SPACING_MORE" class="easyui-dialog" iconcls="icon-hspace"
508+
<div id="wf_HORIZONTAL_SPACING_MORE" class="easyui-dialog content-tailored" iconcls="icon-hspace"
509509
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
510510
title="&nbsp;" >
511511
</div>
512512

513-
<div id="wf_VERTICAL_SPACING_MORE" class="easyui-dialog" iconcls="icon-vspace"
513+
<div id="wf_VERTICAL_SPACING_MORE" class="easyui-dialog content-tailored" iconcls="icon-vspace"
514514
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
515515
title="&nbsp;" >
516516
</div>
517517

518-
<div id="wf_SPECIAL_CHARACTER_MORE" class="easyui-dialog" iconcls="icon-special_char"
518+
<div id="wf_SPECIAL_CHARACTER_MORE" class="easyui-dialog content-tailored" iconcls="icon-special_char"
519519
data-options="closed:true,modal:false,shadow:false,resizable:true,collapsible:true"
520520
title="&nbsp;">
521521
</div>
@@ -546,13 +546,13 @@ <h3>Katex Input Helper</h3>
546546
</div>
547547

548548
<div id="wLANGUAGE_LIST" class="easyui-window" iconcls="icon-langressource"
549-
data-options="closed:true,modal:false,collapsible:false,minimizable:false,maximizable:false,closable:true"
549+
data-options="cls:'language-list',resizable:true,closed:true,modal:false,collapsible:false,minimizable:false,maximizable:false,closable:true"
550550
title="<span locate='LANGUAGE_LIST' class='rtl-title-withicon'></span>" >
551551
<div id="tLANGUAGE_LIST" class="easyui-tabs" border="false" fit="true" plain="false"></div>
552552
</div>
553553

554554
<div id="wINFORMATIONS" class="easyui-window" iconcls="icon-info"
555-
data-options="resizable:true,closed:true,modal:false,collapsible:false,minimizable:false,maximizable:false,closable:true"
555+
data-options="cls:'informations',resizable:true,closed:true,modal:false,collapsible:false,minimizable:false,maximizable:false,closable:true"
556556
title="<span locate='INFORMATIONS' class='rtl-title-withicon'></span>" >
557557
<div id="tINFORMATIONS" class="easyui-tabs" border="false" fit="true" plain="false">
558558
<div title="<span locate='COPYRIGHT'></span>" id="tCOPYRIGHT" iconcls="icon-copyright" closable="false"

‎src/assets/formulas/f_HORIZONTAL_SPACING_MORE.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11

2-
<div style="width:65px;margin:5px;">
2+
<div style="margin:5px;">
33
<a style=text-align:left href="#" class=s latex="\! ">$a \! b$</a>
44
<a style=text-align:left href="#" class=s latex=" " ascii=" ">$a b$</a>
55
<a style=text-align:left href="#" class=s latex="\, ">$a \, b$</a>

‎src/assets/formulas/f_SPECIAL_CHARACTER_MORE.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11

2-
<div style="width:25px;margin:5px;">
2+
<div style="margin:5px; ">
33
<a style=text-align:left href="#" class=s latex="\$ " ascii="$ ">$\$$</a>
44
<a style=text-align:left href="#" class=s latex="\% " ascii="% ">$\%$</a>
55
<a style=text-align:left href="#" class=s latex="\_ " ascii="\_ ">$\_$</a>

‎src/assets/information/tEQUATION.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div style="font-size:200%;">
1+
<div style="font-size:150%;">
22
<a href="#" class="s" latex="\begin{aligned}
33
\dot{x} & = \sigma(y-x) \\
44
\dot{y} & = \rho x - y - xz \\

‎src/assets/js/bootLoader.ts‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -125,10 +125,11 @@ export class BootLoader implements IBootLoader {
125125
async initApp() {
126126
try {
127127
this.vme = this.factory();
128-
window.vme = this.vme; // prevents garbage collection?
128+
window.vme = this.vme; // prevents garbage collection?
129129
await this.vme.initialise();
130-
$('#myContainer').layout({fit: true});
131-
$('#divEquationInputOutput').layout({});
130+
//$('#myContainer').layout({fit: true}); // TODO: move to initialise, can be better controlled
131+
//$('#divEquationInputOutput').layout({});
132+
//$('#innerLayout').layout({fit: true});
132133
} finally {
133134
console.info('App initialization finished');
134135
}

‎src/assets/js/codeMirrorProxy.ts‎

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,21 @@ export function codeMirrorProxy() : ICodeMirror {
2727
// const cm = CodeMirror.fromTextArea($("#mathTextInput")[0] as HTMLTextAreaElement, options);
2828
const cm = CodeMirror($("#divMathTextInput")[0] as HTMLElement, options);
2929

30-
(cm as ICodeMirror).version = CodeMirror.version;
30+
function removeChar() {
31+
const endCursor = cm.getCursor();
32+
const startCursor = { line: endCursor.line, ch: endCursor.ch - 1 };
33+
cm.replaceRange('', startCursor, endCursor);
34+
}
35+
36+
function activate() {
37+
cm.replaceSelection(' ');
38+
removeChar();
39+
}
40+
41+
activate(); // this is a workaround for the mobile version
42+
((cm as any) as ICodeMirror).activateEditor = activate;
43+
((cm as any) as ICodeMirror).removeCharBeforeCursor = removeChar;
44+
((cm as any) as ICodeMirror).version = CodeMirror.version;
3145

32-
return cm;
46+
return (cm as any) as ICodeMirror;
3347
}

0 commit comments

Comments
 (0)