Commit 5e1a356702c0b847f86ccad210f07f41c5059f00

Authored by Lars Jørgen Fredheim
1 parent ae77d47e

Help-overlay

css/style.css
... ... @@ -136,10 +136,6 @@ ul li {
136 136 /* ----------------------------------------------------------- */
137 137 /* ------------------- Measurement input --------------------- */
138 138  
139   -#measurements {
140   -
141   -}
142   -
143 139 #lengths {
144 140 padding-top: 20px;
145 141 padding-bottom: 20px;
... ... @@ -327,7 +323,6 @@ ul li {
327 323 #gui {
328 324 width: 100%;
329 325 height: 100%;
330   - /*display: none;*/
331 326 z-index: 10;
332 327 }
333 328  
... ... @@ -543,7 +538,7 @@ ul li {
543 538 border: none;
544 539 height: 20px;
545 540 transform: rotate(180deg);
546   - transition: all 1s;
  541 + transition: all 0.5s;
547 542 }
548 543  
549 544 #moduleMenuGUI {
... ... @@ -565,7 +560,7 @@ ul li {
565 560 background: url("../images/wallpapers/funky-lines.png");
566 561 border-top-left-radius: 10px;
567 562 border-bottom-left-radius: 10px;
568   - transition: right 1s;
  563 + transition: right 0.5s;
569 564 }
570 565  
571 566 .poleButtons {
... ... @@ -610,10 +605,6 @@ ul li {
610 605 margin-top: 10px;
611 606 }
612 607  
613   -#glassTypeInfo {
614   - padding-bottom: 2%;
615   -}
616   -
617 608 #glassButtons {
618 609 position: relative;
619 610 }
... ... @@ -639,11 +630,16 @@ ul li {
639 630 left: 10%;
640 631 }
641 632  
642   -.option-dropdown-info {
  633 +#glass-type-selection, #glass-width-selection {
  634 + width: 80%;
  635 + left: 10%;
  636 +}
  637 +
  638 +#glassTypeInfo, #glassWidthInfo{
643 639 width: 35%;
644 640 }
645 641  
646   -.option-dropdown-selection {
  642 +#glassTypeSelect, #glassWidthSelect {
647 643 width: 65%;
648 644 }
649 645  
... ... @@ -871,26 +867,98 @@ ul li {
871 867 background-color: rgba(0, 0, 0, 0.8);
872 868 }
873 869  
  870 +#info {
  871 + font-size: 1.25em;
  872 + overflow-y: auto;
  873 + overflow-x: hidden;
  874 +}
  875 +
874 876 .infotext {
875   - position: absolute;
876   - top: 50%;
877   - left: 35%;
878   - font-size: 50px;
879 877 color: white;
  878 + margin-top: 5px;
  879 + float: left;
  880 + text-align: left;
  881 + font-size: 0.8em;
880 882 }
881 883  
882   -.close-info {
883   - position: absolute;
884   - top: 20px;
885   - right: 40px;
  884 +.close {
  885 + position: fixed;
  886 + top: 10px;
  887 + right: 25px;
  888 + z-index: 31;
886 889 font-size: 3em;
887 890 color: white;
888 891 cursor: pointer;
889 892 }
890 893  
891   -.btNextTip {
892   - position: absolute;
893   - right: 50px;
894   - top: 50%;
895   - width: 100px;
  894 +.close:hover {
  895 + color: white;
  896 +}
  897 +
  898 +.info-pole-buttons {
  899 + background-color: white;
  900 + border: 1px solid black;
  901 + border-radius: 5px;
  902 + height: 60px;
  903 + width: 60px;
  904 +}
  905 +
  906 +.element-row{
  907 + margin-top: 8px;
  908 +}
  909 +
  910 +.right {
  911 + float: right;
  912 +}
  913 +
  914 +.select-img {
  915 + height: 30px;
  916 + float: right;
  917 +}
  918 +
  919 +.scaled-img {
  920 + height: 60px;
  921 + float: right;
  922 + transform: scaleX(1.4);
  923 + padding-left: 40px;
  924 +}
  925 +
  926 +.glass-row {
  927 + margin-right: 20px;
  928 +}
  929 +
  930 +.img {
  931 + height: 30px;
  932 + background-color: rgba(255, 255, 255, 0.9);
  933 + border: 1px solid black;
  934 + border-radius: 5px;
896 935 }
  936 +
  937 +.shopping-cart {
  938 + height: 30px;
  939 + background-color: rgba(255, 255, 255, 0.9);
  940 + border: 1px solid black;
  941 + border-radius: 5px;
  942 + padding: 2px;
  943 +}
  944 +
  945 +.pdf {
  946 + height: 55px;
  947 +}
  948 +
  949 +.perspective {
  950 + height: 50px;
  951 +}
  952 +
  953 +.ruler {
  954 + height: 45px;
  955 + margin-bottom: 50px;
  956 +}
  957 +
  958 +.offset15 {
  959 + margin-top: 15px;
  960 +}
  961 +
  962 +.offset20 {
  963 + margin-top: 20px;
  964 +}
897 965 \ No newline at end of file
... ...
images/icons/close.png 0 → 100644

3.95 KB

images/icons/pdf.png

4.58 KB | W: | H:

4.79 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
images/icons/pdf_2.png 0 → 100644

5.02 KB

images/icons/type.png 0 → 100644

10.7 KB

images/icons/view_outlined.png 0 → 100644

7 KB

images/icons/width.png 0 → 100644

11.8 KB

images/references.txt
... ... @@ -12,7 +12,7 @@ help.png https://www.iconfinder.com/icons/40797/blue_help_icon#size=128
12 12 double_arrow.png https://www.iconfinder.com/icons/383079/arrow_double_right_icon#size=128
13 13 cancel.png https://www.iconfinder.com/icons/646197/cancel_close_cross_delete_remove_stop_wrong_icon#size=128
14 14 finished.png https://www.iconfinder.com/icons/646195/done_ok_right_success_tick_valid_yes_icon#size=128
15   -pdf.png https://www.iconfinder.com/icons/511559/document_download_file_files_pdf_icon#size=128
16   -
  15 +pdf.png https://www.iconfinder.com/icons/511559/document_download_file_files_pdf_icon#size=128
  16 +close.png https://www.iconfinder.com/icons/216470/close_icon#size=128
17 17  
18 18 graySpecularHDR.dds https://github.com/sbtron/BabylonJS-glTFLoader/blob/master/src/images/graySpecularHDR.dds
19 19 \ No newline at end of file
... ...
index.html
... ... @@ -292,8 +292,8 @@
292 292  
293 293 <!-- Glass -->
294 294 <div id="glassHeader" class="menuHeader">Glass</div>
295   - <div class="input-group mb-3 option-dropdown" id="glass-type-selection">
296   - <div class="input-group-prepend option-dropdown-info">
  295 + <div class="input-group mb-3" id="glass-type-selection">
  296 + <div class="input-group-prepend option-dropdown-info" id="glassTypeInfo">
297 297 <label class="input-group-text full-width" for="glassTypeSelect">Type</label>
298 298 </div>
299 299 <select class="custom-select option-dropdown-selection" id="glassTypeSelect" onchange="changeMenuGlassType()">
... ... @@ -303,8 +303,8 @@
303 303 </select>
304 304 </div>
305 305  
306   - <div class="input-group mb-3 option-dropdown" id="glass-width-selection">
307   - <div class="input-group-prepend option-dropdown-info">
  306 + <div class="input-group mb-3" id="glass-width-selection">
  307 + <div class="input-group-prepend option-dropdown-info" id="glassWidthInfo">
308 308 <label class="input-group-text full-width" for="glassWidthSelect">Bredde</label>
309 309 </div>
310 310 <select class="custom-select option-dropdown-selection" id="glassWidthSelect" onchange="updateGlassStretch()">
... ... @@ -389,16 +389,16 @@
389 389  
390 390 <div id="poleMenu">
391 391 <div class="meshControlsButtonsDiv" style="margin-left: 8px;">
392   - <input class="meshControlsButtons" type="image" src="images/menu_pole_rotate_left.png" onclick="rotateMeshLeft()" title="Roter mot venstre" ondragstart="return false;" />
  392 + <input class="meshControlsButtons" id="pole-rot-left" type="image" src="images/menu_pole_rotate_left.png" onclick="rotateMeshLeft()" title="Roter mot venstre" ondragstart="return false;" />
393 393 </div>
394 394 <div class="meshControlsButtonsDiv">
395   - <input class="meshControlsButtons" type="image" src="images/menu_pole_rotate_right.png" onclick="rotateMeshRight()" title="Roter mot høyre" ondragstart="return false;" />
  395 + <input class="meshControlsButtons" id="pole-rot-right" type="image" src="images/menu_pole_rotate_right.png" onclick="rotateMeshRight()" title="Roter mot høyre" ondragstart="return false;" />
396 396 </div>
397 397 <div class="meshControlsButtonsDiv">
398   - <input class="meshControlsButtons" type="image" src="images/menu_pole_delete.png" onclick="deleteMesh()" title="Slett stolpe" ondragstart="return false;" />
  398 + <input class="meshControlsButtons" id="pole-del" type="image" src="images/menu_pole_delete.png" onclick="deleteMesh()" title="Slett stolpe" ondragstart="return false;" />
399 399 </div>
400 400 <div class="meshControlsButtonsDiv">
401   - <input class="meshControlsButtons" type="image" src="images/icons/auto.png" onclick="startAutoGeneration()" value="Auto" title="Utvid rekkverk"/>
  401 + <input class="meshControlsButtons" id="pole-auto" type="image" src="images/icons/auto.png" onclick="startAutoGeneration()" value="Auto" title="Utvid rekkverk"/>
402 402 </div>
403 403 </div>
404 404  
... ... @@ -458,19 +458,196 @@
458 458 </div>
459 459 </div>
460 460  
461   - <div class="init-info hide" id="init-info">
  461 + <!--<div class="init-info hide" id="init-info">
462 462 <div class="init-info-box">
463 463 <div style="margin-top: 10px">Ønsker du en gjennomgang av programmets funksjoner?</div>
464 464 <button class="btn btn-yes" id="btYes" onclick="displayInfo()">Ja</button>
465 465 <button class="btn btn-no" id="btNo" onclick="hidePopup()">Nei</button>
466 466 </div>
467   - </div>
  467 + </div>-->
468 468  
469 469 <div class="info hide" id="info">
470   - <p class="infotext" id="info1">This is an overlay</p>
471   - <p class="infotext hide" id="info2">This is another overlay</p>
472   - <span class="close-info" onclick="closeInfo()">&times;</span>
473   - <input class="btNextTip" id="btNextTip" type="image" src="images/icons/next.png" onclick="nextTip()"/>
  470 +
  471 + <div class="close" onclick="closeInfo()" title="Lukk">&times;</div>
  472 +
  473 + <div class="container">
  474 +
  475 + <!-- Poles -->
  476 + <div class="row element-row" style="margin-top: 50px">
  477 + <div class="col-sm-6">
  478 + <div class="right">
  479 + <img class="img-fluid info-pole-buttons" src="images/poles/end_labeled.png">
  480 + <img class="img-fluid info-pole-buttons" src="images/poles/wall_labeled.png">
  481 + <img class="img-fluid info-pole-buttons" src="images/poles/90_labeled.png">
  482 + <img class="img-fluid info-pole-buttons" src="images/poles/45_labeled.png">
  483 + <img class="img-fluid info-pole-buttons" src="images/poles/180_labeled.png">
  484 + </div>
  485 + </div>
  486 + <div class="col-sm-6">
  487 + <div class="infotext offset20">
  488 + Klikk og dra stolper fra menyen for å plassere de på terrassen
  489 + </div>
  490 + </div>
  491 + </div>
  492 +
  493 + <!-- Glass type -->
  494 + <div class="row element-row">
  495 + <div class="col-sm-6">
  496 + <img class="img-fluid select-img" src="images/icons/type.png">
  497 + </div>
  498 + <div class="col-sm-6">
  499 + <div class="infotext">
  500 + Endre glasstype
  501 + </div>
  502 + </div>
  503 + </div>
  504 +
  505 + <!-- Glass width -->
  506 + <div class="row element-row">
  507 + <div class="col-sm-6">
  508 + <img class="img-fluid select-img" src="images/icons/width.png">
  509 + </div>
  510 + <div class="col-sm-6">
  511 + <div class="infotext">
  512 + Endre glassbredde
  513 + </div>
  514 + </div>
  515 + </div>
  516 +
  517 + <!-- Glass -->
  518 + <div class="row element-row">
  519 + <div class="col-sm-6">
  520 + <div class="glass-row">
  521 + <img class="img-fluid scaled-img" src="images/menu_glass_clear.png">
  522 + <img class="img-fluid scaled-img" src="images/menu_glass_frosted.png">
  523 + <img class="img-fluid scaled-img" src="images/menu_glass_darkened.png">
  524 + </div>
  525 + </div>
  526 + <div class="col-sm-6">
  527 + <div class="infotext offset20" >
  528 + Klikk og dra glass fra menyen for å plassere de på terrassen
  529 + </div>
  530 + </div>
  531 + </div>
  532 +
  533 + <!-- Rotate -->
  534 + <div class="row element-row">
  535 + <div class="col-sm-6">
  536 + <div class="right">
  537 + <img class="img-fluid img" src="images/menu_pole_rotate_left.png">
  538 + <img class="img-fluid img" src="images/menu_pole_rotate_right.png">
  539 + </div>
  540 + </div>
  541 + <div class="col-sm-6">
  542 + <div class="infotext">
  543 + Roter markert stolpe eller glass til venstre/høyre
  544 + </div>
  545 + </div>
  546 + </div>
  547 +
  548 + <!-- Delete -->
  549 + <div class="row element-row">
  550 + <div class="col-sm-6">
  551 + <div class="right">
  552 + <img class="img-fluid img" src="images/menu_pole_delete.png">
  553 + </div>
  554 + </div>
  555 + <div class="col-sm-6">
  556 + <div class="infotext">
  557 + Fjern markert stolpe eller glass fra terrassen
  558 + </div>
  559 + </div>
  560 + </div>
  561 +
  562 + <!-- Auto -->
  563 + <div class="row element-row">
  564 + <div class="col-sm-6">
  565 + <div class="right">
  566 + <img class="img-fluid img" src="images/icons/auto.png">
  567 + </div>
  568 + </div>
  569 + <div class="col-sm-6">
  570 + <div class="infotext">
  571 + Start automatisk generering av rekkverk
  572 + </div>
  573 + </div>
  574 + </div>
  575 +
  576 + <!-- Shopping cart -->
  577 + <div class="row element-row">
  578 + <div class="col-sm-6">
  579 + <div class="right">
  580 + <img class="img-fluid shopping-cart" src="images/icons/shoppingCart.png">
  581 + </div>
  582 + </div>
  583 + <div class="col-sm-6">
  584 + <div class="infotext">
  585 + Åpne handlekurven
  586 + </div>
  587 + </div>
  588 + </div>
  589 +
  590 + <!-- PDF -->
  591 + <div class="row element-row">
  592 + <div class="col-sm-6">
  593 + <div class="right">
  594 + <img class="img-fluid pdf" src="images/icons/pdf_2.png">
  595 + </div>
  596 + </div>
  597 + <div class="col-sm-6">
  598 + <div class="infotext offset15">
  599 + Last ned utstyrslisten som et PDF-dokument
  600 + </div>
  601 + </div>
  602 + </div>
  603 +
  604 + <!-- View -->
  605 + <div class="row element-row">
  606 + <div class="col-sm-6">
  607 + <div class="right">
  608 + <img class="img-fluid perspective" src="images/icons/view_outlined.png">
  609 + </div>
  610 + </div>
  611 + <div class="col-sm-6">
  612 + <div class="infotext offset15">
  613 + Beveg musepekeren over for å velge mellom 2D og 3D-perspektiv
  614 + </div>
  615 + </div>
  616 + </div>
  617 +
  618 + <!-- Help lines -->
  619 + <div class="row element-row">
  620 + <div class="col-sm-6">
  621 + <div class="right">
  622 + <img class="img-fluid ruler" src="images/icons/ruler_2.png">
  623 + </div>
  624 + </div>
  625 + <div class="col-sm-6">
  626 + <div class="infotext offset15">
  627 + Skru av og på hjelpelinjer
  628 + </div>
  629 + </div>
  630 + </div>
  631 +
  632 + </div>
  633 +
  634 + <!-- Module menu --
  635 + <p class="infotext" id="info-close-menu">Klikk her for å skjule/vise menyen</p>
  636 + <p class="infotext" id="info-pole-buttons">Klikk og dra stolper fra menyen<br>for å plassere de på terrrassen</p>
  637 + <p class="infotext" id="info-glass-type">Endre glasstype her</p>
  638 + <p class="infotext" id="info-glass-width">Endre glassbredde her</p>
  639 + <p class="infotext" id="info-glass-button">Klikk og dra glass fra menyen<br>for å plassere de på terrrassen</p>
  640 +
  641 + <!-- Pole tool menu --
  642 + <p class="infotext" id="info-pole-rotate-left">Roter til venstre</p>
  643 + <p class="infotext" id="info-pole-rotate-right">Roter til høyre</p>
  644 + <p class="infotext" id="info-pole-delete">Slett stolpe</p>
  645 + <p class="infotext" id="info-pole-auto">Start automatisk generering av rekkverk</p>
  646 +
  647 + <!-- Glass tool menu --
  648 + <p class="infotext" id="info-glass-menu-type">Endre glasstype</p>
  649 + -->
  650 +
474 651 </div>
475 652  
476 653  
... ...
js/Constants.js
... ... @@ -10,4 +10,17 @@ const GLASS_POLE_OVERLAP = 14.69;
10 10 // Minimum distance from edge allowed to enable auto build
11 11 const MIN_AUTO_DIST = MIN_DIST_FROM_EDGE + 3 / 2 * POLE_BASE_WIDTH + MIN_GLASS_WIDTH - 2 * GLASS_POLE_OVERLAP;
12 12  
13   -const MIN_DISTANCE_POLE_TO_EDGE = 54;
14 13 \ No newline at end of file
  14 +const MIN_DISTANCE_POLE_TO_EDGE = 54;
  15 +
  16 +const OVERLAY_SLIDES = [
  17 + [
  18 + document.getElementById("info-close-menu"), document.getElementById("info-pole-buttons"),
  19 + document.getElementById("info-glass-type"), document.getElementById("info-glass-width"),
  20 + document.getElementById("info-glass-button")
  21 + ],
  22 +
  23 + [
  24 + document.getElementById("info-pole-rotate-left"), document.getElementById("info-pole-rotate-right"),
  25 + document.getElementById("info-pole-delete"), document.getElementById("info-pole-auto")
  26 + ]
  27 +];
15 28 \ No newline at end of file
... ...
js/HTMLGUI.js
... ... @@ -253,13 +253,22 @@ function cancelAutoGen() {
253 253  
254 254 function toggleMenuVisibility() {
255 255 if(menuVisible) {
256   - document.getElementById("moduleMenu").style.right = "-275px";
257   - document.getElementById("moduleMenuToggleButton").style.right = "10px";
  256 + if (isDownscaled) {
  257 + document.getElementById("moduleMenu").style.right = "-230px";
  258 + document.getElementById("moduleMenuToggleButton").style.right = "10px";
  259 + } else {
  260 + document.getElementById("moduleMenu").style.right = "-275px";
  261 + document.getElementById("moduleMenuToggleButton").style.right = "10px";
  262 + }
258 263 document.getElementById("moduleMenuToggleButton").style.transform = "rotate(0deg)";
259 264 }
260 265 else {
  266 + if (isDownscaled) {
  267 + document.getElementById("moduleMenuToggleButton").style.right = "205px";
  268 + } else {
  269 + document.getElementById("moduleMenuToggleButton").style.right = "245px";
  270 + }
261 271 document.getElementById("moduleMenu").style.right = "0";
262   - document.getElementById("moduleMenuToggleButton").style.right = "245px";
263 272 document.getElementById("moduleMenuToggleButton").style.transform = "rotate(180deg)";
264 273 }
265 274 menuVisible = !menuVisible;
... ... @@ -313,24 +322,12 @@ function onAutoGenFinished() {
313 322 displaySolutions(findSolutions(length));
314 323 }
315 324  
316   -function displayInfo() {
317   - document.getElementById("init-info").style.display = "none";
318   - document.getElementById("info").style.display = "inline";
319   - document.getElementById("topButtons").style.zIndex = "31";
320   -}
321   -
322 325 function closeInfo() {
323 326 document.getElementById("info").style.display = "none";
324 327 }
325 328  
326   -function nextTip() {
327   - document.getElementById("info1").style.display = "none";
328   - document.getElementById("info2").style.display = "inline";
329   - document.getElementById("helpLinesButton").style.zIndex = "40";
330   -}
331   -
332   -function disableClicks() {
333   - document.getElementById("moduleMenu").style.pointerEvents = "none";
  329 +function displayInfo() {
  330 + document.getElementById("info").style.display = "inline";
334 331 }
335 332  
336 333 function findSolutions(segmentLength) {
... ... @@ -604,6 +601,60 @@ function initHelpOverlay() {
604 601  
605 602 }
606 603  
  604 +function downscale() {
  605 +
  606 + // Module Menu
  607 + document.getElementById("moduleMenu").style.width = "230px";
  608 + document.getElementById("moduleMenuToggleButton").style.right = menuVisible ? "205px" : "10px";
  609 + document.getElementById("moduleMenuToggleButton").style.height = "15px";
  610 + document.getElementById("glass-type-selection").style.width = "90%";
  611 + document.getElementById("glass-type-selection").style.left = "5%";
  612 + document.getElementById("glass-width-selection").style.width = "90%";
  613 + document.getElementById("glass-width-selection").style.left = "5%";
  614 +
  615 + // Info overlay
  616 + /*document.getElementById("info").style.fontSize = "1em";
  617 + document.getElementById("info-close-menu").style.top = "5px";
  618 + document.getElementById("info-close-menu").style.right = "250px";
  619 + document.getElementById("info-pole-buttons").style.top = "190px";
  620 + document.getElementById("info-pole-buttons").style.right = "250px";
  621 + document.getElementById("info-glass-type").style.top = "445px";
  622 + document.getElementById("info-glass-type").style.right = "250px";
  623 + document.getElementById("info-glass-width").style.top = "495px";
  624 + document.getElementById("info-glass-width").style.right = "250px";
  625 + document.getElementById("info-glass-button").style.top = "585px";
  626 + document.getElementById("info-glass-button").style.right = "250px";*/
  627 +
  628 + isDownscaled = true;
  629 +}
  630 +
  631 +function upscale() {
  632 +
  633 + // Module Menu
  634 + document.getElementById("moduleMenu").style.width = "275px";
  635 + document.getElementById("moduleMenuToggleButton").style.right = menuVisible ? "245px" : "10px";
  636 + document.getElementById("moduleMenuToggleButton").style.height = "20px";
  637 + document.getElementById("glass-type-selection").style.width = "80%";
  638 + document.getElementById("glass-type-selection").style.left = "10%";
  639 + document.getElementById("glass-width-selection").style.width = "80%";
  640 + document.getElementById("glass-width-selection").style.left = "10%";
  641 +
  642 + // Info overlay
  643 + /*document.getElementById("info").style.fontSize = "1.25em";
  644 + document.getElementById("info-close-menu").style.top = "5px";
  645 + document.getElementById("info-close-menu").style.right = "300px";
  646 + document.getElementById("info-pole-buttons").style.top = "215px";
  647 + document.getElementById("info-pole-buttons").style.right = "300px";
  648 + document.getElementById("info-glass-type").style.top = "495px";
  649 + document.getElementById("info-glass-type").style.right = "300px";
  650 + document.getElementById("info-glass-width").style.top = "550px";
  651 + document.getElementById("info-glass-width").style.right = "300px";
  652 + document.getElementById("info-glass-button").style.top = "645px";
  653 + document.getElementById("info-glass-button").style.right = "300px";*/
  654 +
  655 + isDownscaled = false;
  656 +}
  657 +
607 658 const MODULE_PRICES = {
608 659 "wall": 628,
609 660 "end" : 1848,
... ...
js/MeshControls.js
... ... @@ -339,7 +339,6 @@ class MeshControls {
339 339 hideMeshMenu() {
340 340 document.getElementById("poleMenu").style.bottom = "-55px";
341 341 document.getElementById("glassMenu").style.bottom = "-55px";
342   - document.getElementById("toolbar-tip").style.display = "none";
343 342 document.getElementById("autoGenPoleSelect").style.display = "none";
344 343 document.getElementById("moduleMenu").style.pointerEvents = "auto";
345 344 }
... ...
js/Setup.js
... ... @@ -109,7 +109,7 @@ class Setup {
109 109 document.getElementById("setup").style.display = "none";
110 110 document.getElementById("main").style.display = "inline";
111 111 canvas.style.display = "inline";
112   - document.getElementById("init-info").style.display = "inline";
  112 + //document.getElementById("init-info").style.display = "inline";
113 113  
114 114 initCanvas();
115 115 terrace.displayTerrace(inputs);
... ...
js/app.js
... ... @@ -29,6 +29,11 @@ var autoGenEndPole = undefined;
29 29 var autoGenEndPoleType = undefined;
30 30 var isAutoGen = false;
31 31  
  32 +var isDownscaled = false;
  33 +var infoPage = 0;
  34 +var currentText = "";
  35 +var currentElement = undefined;
  36 +
32 37 var timer = 0;
33 38  
34 39 //var layoutSelected = undefined;
... ... @@ -145,6 +150,12 @@ function initCanvas() {
145 150 function resize() {
146 151 scene.getEngine().resize();
147 152 camera.orthographicCamera.resize();
  153 +
  154 + if (window.innerHeight < 750 && !isDownscaled) {
  155 + downscale();
  156 + } else if (window.innerHeight >= 750 && isDownscaled) {
  157 + upscale();
  158 + }
148 159 }
149 160  
150 161 function onPointerDown(event) {
... ...