https://speakworldlanguages.github.io/progress_chart/js_for_the_bilingual_return_button.js

1"use strict";
2// Code written by Manheart Earthman=B. A. Bilgekılınç Topraksoy=土本 智一勇夫剛志
3// This file MAY NOT BE MODIFIED WITHOUT CONSENT i.e. OFFICIAL AUTHORIZATION
4
5const leftText1 = document.getElementById('leftText1pID'); const rightText1 = document.getElementById('rightText1pID');
6
7if (needHitoicJapaneseFonts) {
8  leftText1.classList.add("toUseWBR_withCJK","cjkLineHeightAndLetterSpacing"); // See css_for_every_single_html
9  rightText1.classList.add("toUseWBR_withCJK","cjkLineHeightAndLetterSpacing"); // See css_for_every_single_html
10}
11
12// According to ChatGPT: If a fetch() is fired before window load happens it will not prevent the window load from firing even if it takes way too long to get the file
13let leftTextWithoutInteraction = "…";
14const filePathForLeftTextWithoutInteraction = "/user_interface/text/"+userInterfaceLanguage+"/0-you_are_learning_"+parent.langCodeForTeachingFilePaths.substr(0,2)+".txt";
15fetch(filePathForLeftTextWithoutInteraction,myHeaders).then(function(response){return response.text();}).then(function(contentOfTheTxtFile){
16  leftTextWithoutInteraction = contentOfTheTxtFile;
17  leftText1.innerHTML = leftTextWithoutInteraction;
18});// See js_for_every_single_html.js for the headers thingy.
19
20let rightTextWithoutInteraction = "…";
21const filePathForRightTextWithoutInteraction = "/user_interface/text/"+parent.langCodeForTeachingFilePaths.substr(0,2)+"/0-you_are_learning_"+parent.langCodeForTeachingFilePaths.substr(0,2)+".txt";
22fetch(filePathForRightTextWithoutInteraction,myHeaders).then(function(response){return response.text();}).then(function(contentOfTheTxtFile){
23  rightTextWithoutInteraction = contentOfTheTxtFile;
24  rightText1.innerHTML = rightTextWithoutInteraction;
25});
26
27let leftTextUponInteraction = "︙";
28const filePathForLeftTextUponInteraction = "/user_interface/text/"+userInterfaceLanguage+"/0-learn_another_language.txt";
29fetch(filePathForLeftTextUponInteraction,myHeaders).then(function(response){return response.text();}).then(function(contentOfTheTxtFile){ leftTextUponInteraction = contentOfTheTxtFile; });
30
31let rightTextUponInteraction = "︙";
32const filePathForRightTextUponInteraction = "/user_interface/text/"+parent.langCodeForTeachingFilePaths.substr(0,2)+"/0-learn_another_language.txt";
33fetch(filePathForRightTextUponInteraction,myHeaders).then(function(response){return response.text();}).then(function(contentOfTheTxtFile){ rightTextUponInteraction = contentOfTheTxtFile; });
34
35let sleepAdviceA = "😴"; // Sleepy face icon
36let sleepAdviceB = "🛏 ☾️"; // Bed icon and crescent html
37const filePathForsleepAdviceA = "/user_interface/text/"+userInterfaceLanguage+"/0-author_gives_sleep_advice.txt";
38const filePathForsleepAdviceB = "/user_interface/text/"+parent.langCodeForTeachingFilePaths.substr(0,2)+"/0-author_gives_sleep_advice.txt";
39fetch(filePathForsleepAdviceA,myHeaders).then(function(response){return response.text();}).then(function(contentOfTheTxtFile){ sleepAdviceA = contentOfTheTxtFile; });
40fetch(filePathForsleepAdviceB,myHeaders).then(function(response){return response.text();}).then(function(contentOfTheTxtFile){ sleepAdviceB = contentOfTheTxtFile; });
41
42if (deviceDetector.isMobile) {
43  /*MOBILES*/
44  leftText1.parentNode.addEventListener("touchend",eitherTouch1F,{once:true});
45  rightText1.parentNode.addEventListener("touchend",eitherTouch1F,{once:true});
46  function eitherTouch1F() {
47    leftText1.parentNode.classList.add("bilingualLongButtonMouseEnter");   leftText1.innerHTML = leftTextUponInteraction;
48    rightText1.parentNode.classList.add("bilingualLongButtonMouseEnter");  rightText1.innerHTML = rightTextUponInteraction;
49    // Get ready for second touch
50    leftText1.parentNode.addEventListener("touchend",eitherTouch2F); // Don't use [once:true] because confirm box may be cancelled
51    rightText1.parentNode.addEventListener("touchend",eitherTouch2F); // Don't use [once:true] because confirm box may be cancelled
52  }
53  function eitherTouch2F() {
54    setTimeout(function () { goBackToWelcomeScreenLanguageSelection();  }, 75); // Confirm box must not block touchend in preventTouchConflictWithTheSlidingNavMenu
55  }
56
57} else {
58  /*DESKTOPS*/
59  document.getElementById('containerID').addEventListener("mouseenter",eitherHoverF); // Parent of parent
60  function eitherHoverF() {
61    leftText1.parentNode.classList.add("bilingualLongButtonMouseEnter");   leftText1.innerHTML = leftTextUponInteraction;
62    rightText1.parentNode.classList.add("bilingualLongButtonMouseEnter");  rightText1.innerHTML = rightTextUponInteraction;
63  }
64  document.getElementById('containerID').addEventListener("mouseleave",eitherUnhoverF);
65  function eitherUnhoverF() {
66    leftText1.parentNode.classList.remove("bilingualLongButtonMouseEnter");   leftText1.innerHTML = leftTextWithoutInteraction;
67    rightText1.parentNode.classList.remove("bilingualLongButtonMouseEnter");  rightText1.innerHTML = rightTextWithoutInteraction;
68  }
69  leftText1.parentNode.addEventListener("mousedown",eitherClickF,{once:true});
70  rightText1.parentNode.addEventListener("mousedown",eitherClickF,{once:true});
71  function eitherClickF() {
72    goBackToWelcomeScreenLanguageSelection();
73  }
74}
75
76// 700ms "everyThingFadesToBlack" css class must exist at parent level » NOT in this document's css
77// So it exists in css_for_preloader_and_orbiting_circles
78// ALSO SEE handleFadingAndNavigation in progress.js and js_for_the_parent_all_browsers_all_devices
79function goBackToWelcomeScreenLanguageSelection() {
80  /* Remove THE HOME ceramic nav button */
81  if (parent.containerDivOfTheNavigationMenu.contains(parent.clickToGoToMainMenuDiv)) { // Guarantee that the app won't break
82    parent.containerDivOfTheNavigationMenu.removeChild(parent.clickToGoToMainMenuDiv); // TESTED: It works. ,,, also see we_are_working_for_new_levels
83  }
84  // ---
85  function proceedWithOrWithoutConfirmBox() {
86    parent.ayFreym.classList.add("everyThingFadesToBlack"); // 700ms this css class must exist at parent level » NOT in this document's css
87    setTimeout(function() {
88      parent.ayFreym.classList.remove("everyThingFadesToBlack"); // Just this once do it without a fade in; a jump in with remove() will be enough or is even better?
89      ////TURNS OUT WE DON'T NEED: parent.itIsCertainlyNotTheNativeGoBackButtonThatIsNavigating = true; // See blank.html & js_for_the_sliding_navigation_menu
90
91      parent.ayFreym.src = "/user_interface/blank.html";
92      parent.document.getElementsByTagName('MAIN')[0].style.left = "0p

92x"; // Was hidden with 8000px
93
94      // DON'T NEED this because it is handled by blank.html » parent.makeTheNavMenuComeUpOnMobiles(); // Note that, the function checks if the menu was up already,,, so it's safe to call
95      // Sliding nav menu will be fixed (i.e. it won't move) on welcome screen as there are no touch listeners on parent.window i.e. swipes only work on the iframe window
96    },1111);
97  }
98  // ---
99  if (!isApple) { // Android and Windows
100    if (confirm(sleepAdviceA+"\n\n"+sleepAdviceB)) { // INSTEAD OF: alert(sleepAdviceA+"\n\n"+sleepAdviceB);
101      proceedWithOrWithoutConfirmBox();
102    } else {
103      // confirm box was canceled » User changed his/her mind and wants to stay
104    }
105  } else {
106    // Avoid all alert and confirm boxes on Apple because it mutes and unmutes and keeps toggling the sound ON&OFF
107    proceedWithOrWithoutConfirmBox(); // Feels nice enough when fires without any delay, so no setTimeouts here
108  }
109} // END OF goBackToWelcomeScreenLanguageSelection