Merge pull request #14 from dkanada/addserver

Reimplement page to add server

CONTRIBUTORS.md

@@ -9,6 +9,7 @@
  - [bfayers](https://github.com/bfayers)
  - [Bond_009](https://github.com/Bond-009)
  - [AnthonyLavado](https://github.com/anthonylavado)
+ - [dkanada](https://github.com/dkanada)
  - [sparky8251](https://github.com/sparky8251)
  - [LeoVerto](https://github.com/LeoVerto)
  - [cvium](https://github.com/cvium)

src/addserver.html

@@ -0,0 +1,22 @@
+<div data-role="page" class="page standalonePage">
+    <div class="padded-left padded-right padded-bottom-page">
+        <form class="manualServerForm" style="margin: 0 auto;">
+            <h1 style="text-align: left;">${HeaderConnectToServer}</h1>
+            <div class="inputContainer">
+                <input is="emby-input" type="text" id="txtServerHost" required="required" label="${LabelServerHost}" />
+                <div class="fieldDescription" style="text-align: left;">${LabelServerHostHelp}</div>
+            </div>
+            <br />
+            <div class="inputContainer">
+                <input is="emby-input" type="number" id="txtServerPort" step="1" min="0" value="8096" label="${LabelServerPort}" />
+            </div>
+            <br />
+            <button is="emby-button" type="submit" class="raised button-submit block">
+                <span>${ButtonConnect}</span>
+            </button>
+            <button is="emby-button" type="button" class="raised button-cancel block btnCancelManualServer">
+                <span>${ButtonCancel}</span>
+            </button>
+        </form>
+    </div>
+</div>

src/bower_components/emby-webcomponents/router.js

@@ -14,9 +14,6 @@ define(['loading', 'globalize', 'events', 'viewManager', 'layoutManager', 'skinM
         showWelcome: function () {
             show('/startup/welcome.html');
         },
-        showConnectLogin: function () {
-            show('/startup/connectlogin.html');
-        },
         showSettings: function () {
             show('/settings/settings.html');
         },
@@ -271,14 +268,8 @@ define(['loading', 'globalize', 'events', 'viewManager', 'layoutManager', 'skinM
 
                 // Bounce to the login screen, but not if a password entry fails, obviously
                 if (!isCurrentAllowed) {
-
                     showForcedLogoutMessage(globalize.translate('sharedcomponents#AccessRestrictedTryAgainLater'));
-
+                    appRouter.showLocalLogin(apiClient.serverId());
-                    if (connectionManager.isLoggedIntoConnect()) {
-                        appRouter.showConnectLogin();
-                    } else {
-                        appRouter.showLocalLogin(apiClient.serverId());
-                    }
                 }
 
             }
@@ -565,7 +556,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'layoutManager', 'skinM
             return;
         }
 
-        // This must result in a call to either 
+        // This must result in a call to either
         // skinManager.loadUserSkin();
         // Logout
         // Or exit app

src/scripts/addserver.js

@@ -0,0 +1,65 @@
+define(["appSettings", "loading", "browser", "emby-linkbutton"], function(appSettings, loading, browser) {
+    "use strict";
+
+    function handleConnectionResult(page, result) {
+        loading.hide();
+        switch (result.State) {
+            case "SignedIn":
+                var apiClient = result.ApiClient;
+                Dashboard.onServerChanged(apiClient.getCurrentUserId(), apiClient.accessToken(), apiClient), Dashboard.navigate("home.html");
+                break;
+            case "ServerSignIn":
+                Dashboard.navigate("login.html?serverid=" + result.Servers[0].Id, false, "none");
+                break;
+            case "ServerSelection":
+                Dashboard.navigate("selectserver.html", false, "none");
+                break;
+            case "ServerUpdateNeeded":
+                Dashboard.alert({
+                    message: Globalize.translate("ServerUpdateNeeded", '<a href="https://github.com/jellyfin/jellyfin">https://github.com/jellyfin/jellyfin</a>')
+                });
+                break;
+            case "Unavailable":
+                Dashboard.alert({
+                    message: Globalize.translate("MessageUnableToConnectToServer"),
+                    title: Globalize.translate("HeaderConnectionFailure")
+                });
+        }
+    }
+
+    function submitManualServer(page) {
+        var host = page.querySelector("#txtServerHost").value;
+        var port = page.querySelector("#txtServerPort").value;
+        if (port) {
+            host += ":" + port;
+        }
+
+        loading.show();
+        ConnectionManager.connectToAddress(host, {
+            enableAutoLogin: appSettings.enableAutoLogin()
+        }).then(function(result) {
+            handleConnectionResult(page, result);
+        }, function() {
+            handleConnectionResult(page, {
+                State: "Unavailable"
+            });
+        });
+    }
+
+    return function(view, params) {
+        view.querySelector(".manualServerForm").addEventListener("submit", onManualServerSubmit);
+        view.querySelector(".btnCancelManualServer").addEventListener("click", goBack);
+
+        function onManualServerSubmit(e) {
+            submitManualServer(view);
+            e.preventDefault();
+            return false;
+        }
+
+        function goBack() {
+            require(["appRouter"], function(appRouter) {
+                appRouter.back();
+            });
+        }
+    }
+});

src/scripts/connectlogin.js

@@ -1,168 +0,0 @@
-define(["appSettings", "loading", "browser", "emby-linkbutton"], function(appSettings, loading, browser) {
-    "use strict";
-
-    function login(page, username, password) {
-        loading.show(), appSettings.enableAutoLogin(!0), ConnectionManager.loginToConnect(username, password).then(function() {
-            loading.hide(), Dashboard.navigate("selectserver.html")
-        }, function() {
-            loading.hide(), Dashboard.alert({
-                message: Globalize.translate("MessageInvalidUser"),
-                title: Globalize.translate("HeaderLoginFailure")
-            }), page.querySelector("#txtManualPassword").value = ""
-        })
-    }
-
-    function handleConnectionResult(page, result) {
-        switch (loading.hide(), result.State) {
-            case "SignedIn":
-                var apiClient = result.ApiClient;
-                Dashboard.onServerChanged(apiClient.getCurrentUserId(), apiClient.accessToken(), apiClient), Dashboard.navigate("home.html");
-                break;
-            case "ServerSignIn":
-                Dashboard.navigate("login.html?serverid=" + result.Servers[0].Id, !1, "none");
-                break;
-            case "ServerSelection":
-                Dashboard.navigate("selectserver.html", !1, "none");
-                break;
-            case "ConnectSignIn":
-                loadMode(page, "welcome");
-                break;
-            case "ServerUpdateNeeded":
-                Dashboard.alert({
-                    message: Globalize.translate("ServerUpdateNeeded", '<a href="https://github.com/jellyfin/jellyfin">https://github.com/jellyfin/jellyfin</a>')
-                });
-                break;
-            case "Unavailable":
-                Dashboard.alert({
-                    message: Globalize.translate("MessageUnableToConnectToServer"),
-                    title: Globalize.translate("HeaderConnectionFailure")
-                })
-        }
-    }
-
-    function loadAppConnection(page) {
-        loading.show(), ConnectionManager.connect({
-            enableAutoLogin: appSettings.enableAutoLogin()
-        }).then(function(result) {
-            handleConnectionResult(page, result)
-        })
-    }
-
-    function loadPage(page, params) {
-        var mode = params.mode || "auto";
-        if ("auto" == mode) {
-            if (AppInfo.isNativeApp) return void loadAppConnection(page);
-            mode = "connect"
-        }
-        loadMode(page, mode)
-    }
-
-    function loadMode(page, mode) {
-        "welcome" == mode ? (page.querySelector(".connectLoginForm").classList.add("hide"), page.querySelector(".welcomeContainer").classList.remove("hide"), page.querySelector(".manualServerForm").classList.add("hide"), page.querySelector(".signupForm").classList.add("hide")) : "connect" == mode ? (page.querySelector(".connectLoginForm").classList.remove("hide"), page.querySelector(".welcomeContainer").classList.add("hide"), page.querySelector(".manualServerForm").classList.add("hide"), page.querySelector(".signupForm").classList.add("hide")) : "manualserver" == mode ? (page.querySelector(".manualServerForm").classList.remove("hide"), page.querySelector(".connectLoginForm").classList.add("hide"), page.querySelector(".welcomeContainer").classList.add("hide"), page.querySelector(".signupForm").classList.add("hide")) : "signup" == mode && (page.querySelector(".manualServerForm").classList.add("hide"), page.querySelector(".connectLoginForm").classList.add("hide"), page.querySelector(".welcomeContainer").classList.add("hide"), page.querySelector(".signupForm").classList.remove("hide"), initSignup(page))
-    }
-
-    function skip() {
-        Dashboard.navigate("selectserver.html")
-    }
-
-    function requireCaptcha() {
-        return !AppInfo.isNativeApp && 0 == window.location.href.toLowerCase().indexOf("https")
-    }
-
-    function supportInAppSignup() {
-        return AppInfo.isNativeApp || 0 == window.location.href.toLowerCase().indexOf("https")
-    }
-
-    function initSignup(page) {
-        supportInAppSignup() && requireCaptcha() && require(["https://www.google.com/recaptcha/api.js?render=explicit"], function() {
-            setTimeout(function() {
-                var recaptchaContainer = page.querySelector(".recaptchaContainer");
-                greWidgetId = grecaptcha.render(recaptchaContainer, {
-                    sitekey: "6Le2LAgTAAAAAK06Wvttt_yUnbISTy6q3Azqp9po",
-                    theme: "dark"
-                })
-            }, 100)
-        })
-    }
-
-    function submitManualServer(page) {
-        var host = page.querySelector("#txtServerHost").value,
-            port = page.querySelector("#txtServerPort").value;
-        port && (host += ":" + port), loading.show(), ConnectionManager.connectToAddress(host, {
-            enableAutoLogin: appSettings.enableAutoLogin()
-        }).then(function(result) {
-            handleConnectionResult(page, result)
-        }, function() {
-            handleConnectionResult(page, {
-                State: "Unavailable"
-            })
-        })
-    }
-
-    function submit(page) {
-        login(page, page.querySelector("#txtManualName").value, page.querySelector("#txtManualPassword").value)
-    }
-    var greWidgetId;
-    return function(view, params) {
-        function onSubmit(e) {
-            return submit(view), e.preventDefault(), !1
-        }
-
-        function onManualServerSubmit(e) {
-            return submitManualServer(view), e.preventDefault(), !1
-        }
-
-        function onSignupFormSubmit(e) {
-            if (!supportInAppSignup()) return e.preventDefault(), !1;
-            var page = view,
-                greResponse = greWidgetId ? grecaptcha.getResponse(greWidgetId) : null;
-            return ConnectionManager.signupForConnect({
-                email: page.querySelector("#txtSignupEmail", page).value,
-                username: page.querySelector("#txtSignupUsername", page).value,
-                password: page.querySelector("#txtSignupPassword", page).value,
-                passwordConfirm: page.querySelector("#txtSignupPasswordConfirm", page).value,
-                grecaptcha: greResponse
-            }).then(function(result) {
-                var msg = result.Validated ? Globalize.translate("MessageThankYouForConnectSignUpNoValidation") : Globalize.translate("MessageThankYouForConnectSignUp");
-                Dashboard.alert({
-                    message: msg,
-                    callback: function() {
-                        Dashboard.navigate("connectlogin.html?mode=welcome")
-                    }
-                })
-            }, function(result) {
-                "passwordmatch" == result.errorCode ? Dashboard.alert({
-                    message: Globalize.translate("ErrorMessagePasswordNotMatchConfirm")
-                }) : "USERNAME_IN_USE" == result.errorCode ? Dashboard.alert({
-                    message: Globalize.translate("ErrorMessageUsernameInUse")
-                }) : "EMAIL_IN_USE" == result.errorCode ? Dashboard.alert({
-                    message: Globalize.translate("ErrorMessageEmailInUse")
-                }) : Dashboard.alert({
-                    message: Globalize.translate("DefaultErrorMessage")
-                })
-            }), e.preventDefault(), !1
-        }
-
-        function goBack() {
-            require(["appRouter"], function(appRouter) {
-                appRouter.back()
-            })
-        }
-        view.querySelector(".btnSkipConnect").addEventListener("click", skip), view.querySelector(".connectLoginForm").addEventListener("submit", onSubmit), view.querySelector(".manualServerForm").addEventListener("submit", onManualServerSubmit), view.querySelector(".signupForm").addEventListener("submit", onSignupFormSubmit), view.querySelector(".btnSignupForConnect").addEventListener("click", function(e) {
-            if (supportInAppSignup()) return e.preventDefault(), e.stopPropagation(), Dashboard.navigate("connectlogin.html?mode=signup"), !1
-        }), view.querySelector(".btnCancelSignup").addEventListener("click", goBack), view.querySelector(".btnCancelManualServer").addEventListener("click", goBack), view.querySelector(".btnWelcomeNext").addEventListener("click", function() {
-            Dashboard.navigate("connectlogin.html?mode=connect")
-        });
-        var terms = view.querySelector(".terms");
-        //FIXME: Link below directs to "jellyfin.media/terms" which is a non existant URL
-        terms.innerHTML = Globalize.translate("LoginDisclaimer") + "<div style='margin-top:5px;'><a is='emby-linkbutton' class='button-link' href='http://jellyfin.media/terms' target='_blank'>" + Globalize.translate("TermsOfUse") + "</a></div>", AppInfo.isNativeApp ? (terms.classList.add("hide"), view.querySelector(".tvAppInfo").classList.add("hide")) : (terms.classList.remove("hide"), view.querySelector(".tvAppInfo").classList.remove("hide")), view.addEventListener("viewbeforeshow", function() {
-            var page = this;
-            if (page.querySelector("#txtSignupEmail").value = "", page.querySelector("#txtSignupUsername").value = "", page.querySelector("#txtSignupPassword").value = "", page.querySelector("#txtSignupPasswordConfirm").value = "", browser.safari && AppInfo.isNativeApp) page.querySelector(".embyIntroDownloadMessage").innerHTML = Globalize.translate("EmbyIntroDownloadMessageWithoutLink");
-            else {
-                page.querySelector(".embyIntroDownloadMessage").innerHTML = Globalize.translate("EmbyIntroDownloadMessage", '<a is="emby-linkbutton" class="button-link" href="https://github.com/jellyfin/jellyfin" target="_blank">http://jellyfin.media</a>')
-            }
-        }), view.addEventListener("viewshow", function() {
-            loadPage(view, params)
-        })
-    }
-});

src/scripts/site.js

@@ -375,12 +375,12 @@ var Dashboard = {
             autoFocus: !1,
             roles: "admin"
         }), defineRoute({
-            path: "/connectlogin.html",
+            path: "/addserver.html",
             dependencies: ["emby-button", "emby-input"],
             autoFocus: !1,
             anonymous: !0,
             startup: !0,
-            controller: "scripts/connectlogin"
+            controller: "scripts/addserver"
         }), defineRoute({
             path: "/dashboard.html",
             dependencies: [],

src/selectserver.html

@@ -13,7 +13,7 @@
     </div>
 
     <div class="padded-top padded-left padded-right flex flex-shrink-zero justify-content-center verticalSection flex-wrap-wrap" style="margin-left:auto;margin-right:auto;">
-        <a is="emby-linkbutton" href="connectlogin.html?mode=manualserver" class="raised block cancel btnAddServer flex-shrink-zero" style="margin: .25em;">
+        <a is="emby-linkbutton" href="addserver.html" class="raised block cancel btnAddServer flex-shrink-zero" style="margin: .25em;">
             <span>${ButtonAddServer}</span>
         </a>
         <button is="emby-button" type="button" class="raised block cancel btnOffline hide flex-shrink-zero" style="margin: .25em;">