Add feature to set port and path in the host field

css/glowingbear.css

@@ -932,3 +932,7 @@ code {
     color: #444;
     border: 1pt solid #444;
 }
+
+.form-control[disabled] {
+    background-color: #555;
+}

index.html

@@ -104,15 +104,13 @@
                   <div class="input-group">
                     <div class="row no-gutter">
                       <div class="col-sm-9">
-                        <input type="text" class="form-control favorite-font" id="host" ng-model="settings.host" placeholder="Address" autocapitalize="off">
+                        <input type="text" class="form-control favorite-font" id="host" ng-model="settings.host" ng-change="parseHost()" placeholder="Address" autocapitalize="off">
                       </div>
                       <div class="col-sm-3">
-                        <input type="text" class="form-control favorite-font" id="port" ng-model="settings.port" placeholder="Port">
+                        <input type="text" class="form-control favorite-font" id="port" ng-model="settings.port" ng-disabled="portDisabled" placeholder="Port">
                       </div>
                     </div>
                   </div>
-                  <label class="control-label" for="path">WebSocket path</label>
-                  <input type="text" class="form-control favorite-font" id="path" ng-model="settings.path" placeholder="WebSocket path">
                   <label class="control-label" for="password">WeeChat relay password</label>
                   <input type="password" class="form-control favorite-font" id="password" ng-model="password" placeholder="Password">
                   <div class="alert alert-danger" ng-show="passwordError" ng-cloak>
@@ -209,6 +207,10 @@ chown -R <strong>username</strong>:<strong>username</strong> ~<strong>username</
               <p>
               Helpful trigger to automatically repin a buffer (in this instance, <var>irc.freenode.#weechat</var>): <pre><code>/trigger add autopin signal "buffer_opened" "${buffer[${tg_signal_data}].full_name} =~ <var>irc.freenode.#weechat</var>" "" "/command -buffer ${buffer[${tg_signal_data}].full_name} * /buffer set localvar_set_pinned true"</code></pre>
               </p>
+              <h3>Setting path</h3>
+              <p>
+                The path is by default 'weechat'. In case a proxy is used the path can be changed by entering it in the host field. For example <code>your.domain.com:8000/otherpath</code>.
+              </p>
             </div>
           </div>
         </div>

js/glowingbear.js

@@ -657,6 +657,39 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
         window.requestAnimationFrame(scroll);
     };
 
+    $scope.parseHost = function() {
+        //The host field is multi purpose for advanced users
+        //There can be a combination of host, port and path
+        //If host is specified here the dedicated port field is disabled
+
+        let parts;
+
+        //host
+        const regexHost = /^([^:\/]*|\[.*\])$/;
+        const regexHostPort = /^([^:]*|\[.*\]):(\d+)$/;
+        const regexHostPortPath = /^([^:]*|\[.*\]):(\d*)\/(.+)$/;
+        if(parts = regexHost.exec(settings.host))
+        {
+            settings.hostOnly = parts[1];
+            $rootScope.portDisabled = false;
+        }
+        //host:port
+        else if(parts = regexHostPort.exec(settings.host))
+        {
+            settings.hostOnly = parts[1];
+            settings.port = parts[2];
+            $rootScope.portDisabled = true;
+        }
+        //host:port/path
+        else if(parts = regexHostPortPath.exec(settings.host))
+        {
+            settings.hostOnly = parts[1];
+            settings.port = parts[2];
+            settings.path = parts[3];
+            $rootScope.portDisabled = true;
+        }
+
+    };
 
     $scope.connect = function() {
         notifications.requestNotificationPermission();
@@ -666,7 +699,7 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
         $rootScope.bufferBottom = true;
         $scope.connectbutton = 'Connecting';
         $scope.connectbuttonicon = 'glyphicon-refresh glyphicon-spin';
-        connection.connect(settings.host, settings.port, settings.path, $scope.password, settings.ssl);
+        connection.connect(settings.hostOnly, settings.port, settings.path, $scope.password, settings.ssl);
     };
     $scope.disconnect = function() {
         $scope.connectbutton = 'Connect';
@@ -928,13 +961,13 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
     };
 
     $scope.init = function() {
+        $scope.parseHost();
         if (window.location.hash) {
             var rawStr = atob(window.location.hash.substring(1));
             window.location.hash = "";
             var spl = rawStr.split(":");
-            var host = spl[0];
-            var port = parseInt(spl[1]);
-            var path = 'weechat';
+            settings.host = spl[0];
+            settings.port = parseInt(spl[1]);
             var password = spl[2];
             var ssl = spl.length > 3;
             notifications.requestNotificationPermission();
@@ -944,7 +977,8 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
             $rootScope.bufferBottom = true;
             $scope.connectbutton = 'Connecting';
             $scope.connectbuttonicon = 'glyphicon-chevron-right';
-            connection.connect(host, port, path, password, ssl);
+            $scope.parseHost();
+            connection.connect(settings.host, settings.port, settings.path, password, ssl);
         }
     };