1.5.1

- Fix duplicated monkey on login page
- Add physical `Enter` button to login page on mobile devices

CHANGELOG.md

@@ -4,6 +4,8 @@
 
 - Fix `--no-web` arg
 - Fix `tglog_level` config option of module `Tester`
+- Fix duplicated monkey on login page
+- Add physical `Enter` button to login page on mobile devices
 - Add `--proxy-pass` arg
 - Add `utils.invite_inline_bot` method
 - Add `invite_bot` method to `utils.asset_channel`

web-resources/root.jinja2

@@ -33,7 +33,8 @@
   <div id="monkey"></div>
   <div id="monkey-close"></div>
   <span class="code-caption">Enter the code you recieved from Telegram</span>
-  <input type="text" class="code-input" inputmode="numeric" autocomplete="off">
+  <input type="text" class="code-input" autocomplete="off">
+  <div class="enter">Enter</div>
 </div>
 <div class="wrapper">
   <div class="blur main finish_block">

web-resources/static/base.css

@@ -596,7 +596,44 @@ label {
     text-align: center;
 }
 
-#monkey, #monkey-close {
+@media screen and (max-width: 736px) {
+    .auth-code-form {
+        width: 100%;
+        height: 100%;
+    }
+}
+
+.enter {
+    padding: 5px 10px;
+    border: 1px solid #dc137b;
+    color: #dc137b;
+    font-size: 30px;
+    border-radius: 8px;
+    width: 50%;
+    margin-left: 25%;
+    margin-top: 10px;
+    box-sizing: border-box;
+    transition: all .15s ease;
+    display: none;
+}
+
+@media screen and (max-width: 736px) {
+    .enter {
+        display: block;
+    }
+}
+
+.enter.tgcode {
+    display: none;
+}
+
+.enter:active {
+    background: #dc137b;
+    color: #fff;
+}
+
+#monkey,
+#monkey-close {
     height: 200px;
     margin-top: 30px;
 }
@@ -624,4 +661,4 @@ label {
     font-size: 26px;
     color: #fefefe;
     padding-top: 50px;
-}
+}

web-resources/static/root.js

@@ -116,7 +116,7 @@ function tg_code() {
             if (!response.ok) {
                 if (response.status == 401) {
                     $(".auth-code-form").hide().fadeIn(300, () => {
-                        $("#monkey-close").html();
+                        $("#monkey-close").html("");
                         anim = bodymovin.loadAnimation({
                             container: document.getElementById("monkey-close"),
                             renderer: "canvas",
@@ -134,6 +134,9 @@ function tg_code() {
                         })
                     });
                     $(".code-input").removeAttr("disabled");
+                    $(".code-input").attr("inputmode", "text");
+                    if($(".enter").hasClass("tgcode"))
+                        $(".enter").removeClass("tgcode");
                     $(".code-caption").html("Enter your Telegram 2FA password, then press <span style='color: #dc137b;'>Enter</span>");
                     cnt_btn.setAttribute("current-step", "2fa");
                     $("#monkey").hide();
@@ -271,7 +274,7 @@ function process_next() {
                     });
                 } else {
                     $(".auth-code-form").hide().fadeIn(300, () => {
-                        $("#monkey").html();
+                        $("#monkey").html("");
                         anim2 = bodymovin.loadAnimation({
                             container: document.getElementById("monkey"),
                             renderer: "canvas",
@@ -289,6 +292,7 @@ function process_next() {
                         })
                     });
                     $(".code-input").removeAttr("disabled");
+                    $(".enter").addClass("tgcode");
                     $(".code-caption").text("Enter the code you recieved in Telegram");
                     cnt_btn.setAttribute("current-step", "code");
                     _current_block = "code";
@@ -382,4 +386,14 @@ $(".code-input").on("keyup", (e) => {
         $(".code-input").val("");
         tg_code();
     }
-});
+});
+
+$(".enter").on("click", () => {
+    if (_current_block == "2fa") {
+        let _2fa = $(".code-input").val();
+        _2fa_pass = _2fa;
+        $(".code-input").attr("disabled", "true");
+        $(".code-input").val("");
+        tg_code();
+    }
+});