Add feature to select binding IPs (marcelGoerentz#30)

* Add functions to update, cancel and close button and finalize the feature. Update note texts

* Add update button

* Fix bug where only ; will be shown when no IP has been selected

Author: marcelGoerentz

html/lang/en.json

@@ -461,10 +461,10 @@
       "title": "Omit port",
       "description": "By activating this checkbox the m3u file will not contain the port in the url"
     },
-    "listeningIp" :
+    "bindingIPs" :
     {
-      "title": "Listening IPs",
-      "description": "Enter the listening IPs seprated by an ';' for example: 127.0.0.1;192.168.2.1<br>Changing this option will exit the program! You need to restart it if you didn't configured a restart!"
+      "title": "Binding IP(s)",
+      "description": "By clicking on the input a dialogue will open where you can select the IP(s)<br>Please note that these are also the DVR IPs<br>Changing this option and saving the settings will exit the program!<br>You need to restart it if you didn't configured an automatical restart!"
     },
     "forceHttps":
     {
@@ -474,7 +474,7 @@
     "useHttps":
     {
       "title": "Use HTTPS",
-      "description": "Enable HTTPS protocol for Threadfin, HTTPS Port needs to be set, otherwise the 443 will be used!"
+      "description": "Enable HTTPS protocol for Threadfin, HTTPS Port needs to be set, otherwise the 443 will be used!<br>Also make sure that server.crt and server.key are placed in the config folder!<br>The key file needs to be unencrypted!"
     },
     "forceClientHttps":
     {
@@ -484,7 +484,7 @@
     "threadfinDomain":
     {
       "title": "Threadfin Domain",
-      "description": "When not empty, this will rewrite the URLs in the new m3u to a FQDN.<br>Do NOT include http (ex: somedomain.com)</br>"
+      "description": "When not empty, this will rewrite the URLs in the new m3u to a FQDN.<br>It will also rewrite the shown DVR IP in the server info dialogue<br>Do NOT include http (ex: somedomain.com)</br>"
     },
     "enableNonAscii":
     {

src/info.go

@@ -84,7 +84,7 @@ func ShowSystemInfo() {
 	println("---")
 
 	fmt.Println("Network")
-	fmt.Printf("Listening IPs:            %s\n", Settings.ListeningIp)
+	fmt.Printf("Binding IP(s):            %s\n", Settings.BindingIPs)
 	fmt.Printf("Threadfin Domain:         %s\n", Settings.ThreadfinDomain)
 	fmt.Printf("Use Https:                %t\n", Settings.UseHttps)
 	fmt.Printf("Fort Https to upstream:   %t\n", Settings.ForceHttpsToUpstream)

src/struct-system.go

@@ -324,7 +324,7 @@ type SettingsStruct struct {
 	ThreadfinAutoUpdate       bool                  `json:"ThreadfinAutoUpdate"`
 	StoreBufferInRAM          bool                  `json:"storeBufferInRAM"`
 	OmitPorts                 bool                  `json:"omitPorts"`
-	ListeningIp               string                `json:"listeningIp"`
+	BindingIPs                string                `json:"bindingIPs"`
 	ForceHttpsToUpstream      bool                  `json:"forceHttps"`
 	UseHttps                  bool                  `json:"useHttps"`
 	ForceClientHttps          bool                  `json:"forceClientHttps"`

src/struct-webserver.go

@@ -48,7 +48,7 @@ type RequestStruct struct {
 		SchemeXML                *string   `json:"scheme.xml,omitempty"`
 		StoreBufferInRAM         *bool     `json:"storeBufferInRAM,omitempty"`
 		OmitPorts                *bool     `json:"omitPorts,omitempty"`
-		ListeningIp              *string   `json:"listeningIp,omitempty"`
+		BindingIPs               *string   `json:"bindingIPs,omitempty"`
 		ForceHttpsToUpstream     *bool     `json:"forceHttps,omitempty"`
 		UseHttps                 *bool     `json:"useHttps,omitempty"`
 		ForceClientHttps         *bool     `json:"forceClientHttps"`

src/system.go

@@ -150,7 +150,7 @@ func loadSettings() (settings SettingsStruct, err error) {
 	defaults["ssdp"] = true
 	defaults["storeBufferInRAM"] = true
 	defaults["omitPorts"] = false
-	defaults["listeningIp"]= ""
+	defaults["bindingIPs"]= ""
 	defaults["forceHttps"] = false
 	defaults["useHttps"] = false
 	defaults["threadfinDomain"] = ""

src/webUI.go

@@ -46,8 +46,8 @@ func StartWebserver() (err error) {
 	regexIpV4, _ := regexp.Compile(`(?:\d{1,3}\.){3}\d{1,3}`)
 	regexIpV6, _ := regexp.Compile(`(?:[A-Fa-f0-9]{0,4}:){3,7}[a-fA-F0-9]{1,4}`)
 	var customIps []string
-	var customIpsV4 = regexIpV4.FindAllString(Settings.ListeningIp, -1)
-	var customIpsV6 = regexIpV6.FindAllString(Settings.ListeningIp, -1)
+	var customIpsV4 = regexIpV4.FindAllString(Settings.BindingIPs, -1)
+	var customIpsV6 = regexIpV6.FindAllString(Settings.BindingIPs, -1)
 	if customIpsV4 != nil || customIpsV6 != nil {
 		customIps=make([]string, len(customIpsV4)+ len(customIpsV6))
 		copy(customIps, customIpsV4)
@@ -56,6 +56,7 @@ func StartWebserver() (err error) {
 
 	if customIps != nil {
 		for _, address := range customIps {
+			showInfo("DVR IP:" + address + ":" + Settings.Port)
 			showHighlight(fmt.Sprintf("Web Interface:%s://%s:%s/web/", System.ServerProtocol, address, Settings.Port))
 			if Settings.UseHttps {
 				go func(address string) {
@@ -76,10 +77,12 @@ func StartWebserver() (err error) {
 		}
 	} else {
 		for _, ip := range System.IPAddressesV4 {
+			showInfo("DVR IP:" + ip + ":" + Settings.Port)
 			showHighlight(fmt.Sprintf("Web Interface:%s://%s:%s/web/", System.ServerProtocol, ip, Settings.Port))
 		}
 
 		for _, ip := range System.IPAddressesV6 {
+			showInfo("DVR IP:" + ip + ":" + Settings.Port)
 			showHighlight(fmt.Sprintf("Web Interface:%s://%s:%s/web/", System.ServerProtocol, ip, Settings.Port))
 		}
 		if Settings.UseHttps {
@@ -559,7 +562,7 @@ func WS(w http.ResponseWriter, r *http.Request) {
 			showInfo("WEB:Saving settings")
 			var authenticationUpdate = Settings.AuthenticationWEB
 			var previousStoreBufferInRAM = Settings.StoreBufferInRAM
-			var previousListeningIP = Settings.ListeningIp
+			var previousBindingIPs = Settings.BindingIPs
 			var previousUseHttps = Settings.UseHttps
 			response.Settings, err = updateServerSettings(request)
 			if err == nil {
@@ -574,7 +577,7 @@ func WS(w http.ResponseWriter, r *http.Request) {
 					initBufferVFS(Settings.StoreBufferInRAM)
 				}
 
-				if Settings.ListeningIp != previousListeningIP  || Settings.UseHttps != previousUseHttps {
+				if Settings.BindingIPs != previousBindingIPs  || Settings.UseHttps != previousUseHttps {
 					showInfo("WEB:Restart program since listening IP option has been changed!")
 					os.Exit(0)
 				}

src/webserver.go

@@ -42,13 +42,13 @@ var GitHub = GitHubStruct{Branch: "Main", User: "marcelGoerentz", Repo: "Threadf
 const Name = "Threadfin"
 
 // Version : Version, die Build Nummer wird in der main func geparst.
-const Version = "1.4.0-beta"
+const Version = "1.4.1-beta"
 
 // DBVersion : Datanbank Version
 const DBVersion = "0.5.0"
 
 // APIVersion : API Version
-const APIVersion = "1.4.0-beta"
+const APIVersion = "1.4.1-beta"
 
 var homeDirectory = fmt.Sprintf("%s%s.%s%s", src.GetUserHomeDirectory(), string(os.PathSeparator), strings.ToLower(Name), string(os.PathSeparator))
 var samplePath = fmt.Sprintf("%spath%sto%sthreadfin%s", string(os.PathSeparator), string(os.PathSeparator), string(os.PathSeparator), string(os.PathSeparator))

threadfin.go

@@ -47,7 +47,7 @@ menuItems.push(new MainMenuItem("logout", "{{.mainMenu.item.logout}}", "logout.p
 var settingsCategory = new Array()
 settingsCategory.push(new SettingsCategoryItem("{{.settings.category.general}}", "ThreadfinAutoUpdate,ssdp,tuner,epgSource,epgCategories,epgCategoriesColors,dummy,dummyChannel,ignoreFilters,api"))
 settingsCategory.push(new SettingsCategoryItem("{{.settings.category.files}}", "update,files.update,temp.path,cache.images,omitPorts,xepg.replace.missing.images,xepg.replace.channel.title,enableNonAscii"))
-settingsCategory.push(new SettingsCategoryItem("{{.settings.category.network}}", "listeningIp,threadfinDomain,useHttps,forceClientHttps,forceHttps"))
+settingsCategory.push(new SettingsCategoryItem("{{.settings.category.network}}", "bindingIPs,threadfinDomain,useHttps,forceClientHttps,forceHttps"))
 settingsCategory.push(new SettingsCategoryItem("{{.settings.category.streaming}}", "buffer,udpxy,buffer.size.kb,storeBufferInRAM,buffer.timeout,user.agent,ffmpeg.path,ffmpeg.options,vlc.path,vlc.options"))
 settingsCategory.push(new SettingsCategoryItem("{{.settings.category.backup}}", "backup.path,backup.keep"))
 settingsCategory.push(new SettingsCategoryItem("{{.settings.category.authentication}}", "authentication.web,authentication.pms,authentication.m3u,authentication.xml,authentication.api"))

ts/base_ts.ts

@@ -1098,59 +1098,82 @@ function PageReady() {
   return
 }
 
+var checkboxesInitialState: boolean[] = []
+
 async function setCheckboxes() {
-  var content: PopupContent = new PopupContent()
-  var table = document.getElementById("checkboxTable")
+  const content: PopupContent = new PopupContent()
+  const table = document.getElementById("checkboxTable")
   await new Promise(f => setTimeout(f, 1000));
   if ("clientInfo" in SERVER) {
-    let listeningIp: string = SERVER['settings']['listeningIp']
-    var listeningIpArray = listeningIp.split(";")
-    let systemnIPs: Array<string> = SERVER["clientInfo"]["systemIPs"]
+    const bindingIPs: string = SERVER['settings']['bindingIPs']
+    const bindingIPspArray = bindingIPs.split(";")
+    const systemnIPs: Array<string> = SERVER["clientInfo"]["systemIPs"]
     systemnIPs.forEach((ipAddress, index) => {
       if (!ipAddress.includes('169.254')) {
-        var tr = document.createElement('tr')
-        var tdLeft = document.createElement('td')
-        var tdRight = document.createElement('td') 
-
-        var checkbox = content.createCheckbox(ipAddress, 'ipCheckbox' + index)
-        checkbox.checked = false
-        listeningIpArray.forEach(element => {
-          if (element === ipAddress) {
-            checkbox.checked = true
-            return;
-          }
-        });
-        var label = document.createElement("label")
+        const tr = document.createElement('tr')
+        const tdLeft = document.createElement('td')
+        const tdRight = document.createElement('td') 
+
+        const checkbox = content.createCheckbox(ipAddress, 'ipCheckbox' + index)
+        checkbox.checked = bindingIPspArray.includes(ipAddress)
+
+        const label = document.createElement("label")
         label.setAttribute("for", "ipCheckbox" + index)
         label.innerHTML = ipAddress
+
         tdLeft.appendChild(checkbox)
         tdRight.appendChild(label)
         tr.appendChild(tdLeft)
         tr.appendChild(tdRight)
         table.appendChild(tr)
       }
     });
-    var checkbox_container = document.getElementById("checkbox_container")
-    var input = content.createInput("button", "buttonSave", "{{.button.save}}")
-    input.setAttribute("onclick", 'javascript: saveBindingIPs()')
-    input.setAttribute('data-bs-target', '#ip_selection')
-    input.setAttribute("data-bs-toggle" , "modal")
-    checkbox_container.appendChild(input)
+
+    const checkbox_container = document.getElementById("checkbox_container");
+    const saveButton = createButton(content, "buttonUpdate", "{{.button.update}}", 'javsrcipt: updateBindingIPs()');
+    const cancelButton = createButton(content, "buttonCancel", "{{.button.cancel}}");
+    checkbox_container.appendChild(saveButton);
+    checkbox_container.appendChild(cancelButton);
+    
+    const checkboxes = checkbox_container.querySelectorAll('input[type="checkbox"]');
+    checkboxesInitialState = Array.from(checkboxes).map(checkbox => (checkbox as HTMLInputElement).checked);
+    const ipSelection = document.getElementById('ip_selection');
+    const closeButton = ipSelection.querySelector('button.btn-close')
+    closeButton.addEventListener('click', () => resetCheckboxes(checkboxes, checkboxesInitialState))
+    cancelButton.addEventListener('click', () => resetCheckboxes(checkboxes, checkboxesInitialState))
   }
 }
 
-function saveBindingIPs() {
-  var checkboxTable = document.getElementById('checkboxTable')
-  var checkboxList = checkboxTable.querySelectorAll('input')
-  var listeningIPs: string[] = []
-  checkboxList.forEach(checkbox => {
-    if (checkbox.checked) {
-      listeningIPs.push(checkbox.name)
-    }
-  });
-  var listeningIp = document.getElementById('listeningIp')
-  listeningIp.setAttribute('value', listeningIPs.join(';') + ";")
-  listeningIp.setAttribute('class', 'changed')
+function createButton(content: PopupContent, id: string, text: string, onClick?: string): HTMLInputElement {
+  const button = content.createInput("button", id, text);
+  if (onClick) {
+    button.setAttribute("onclick", onClick);
+  }
+  button.setAttribute('data-bs-target', '#ip_selection');
+  button.setAttribute("data-bs-toggle", "modal");
+  return button;
+}
+
+function resetCheckboxes(checkboxes: NodeListOf<Element>, initialStates: boolean[]) {
+  checkboxes.forEach((checkbox, index) => {
+    (checkbox as HTMLInputElement).checked = initialStates[index]
+  })
+}
+
+function updateBindingIPs() {
+  const checkboxTable = document.getElementById('checkboxTable');
+  const checkboxList = checkboxTable.querySelectorAll('input[type="checkbox"]');
+  var bindingIPs: string[] = Array.from(checkboxList)
+    .filter(checkbox => (checkbox as HTMLInputElement).checked)
+    .map(checkbox => (checkbox as HTMLInputElement).name);
+  const bindingIPsElement = document.getElementById('bindingIPs');
+  if (bindingIPs.length === 0) {
+    bindingIPsElement.setAttribute('value', '')
+  } else {
+    bindingIPsElement.setAttribute('value', bindingIPs.join(';') + ";");
+  }
+  bindingIPsElement.setAttribute('class', 'changed');
+  checkboxesInitialState = Array.from(checkboxList).map(checkbox => (checkbox as HTMLInputElement).checked);
 }
 
 function createLayout() {

ts/menu_ts.ts

@@ -145,14 +145,13 @@ class SettingsCategory {
         setting.appendChild(tdRight)
         break
 
-      case "listeningIp":
+      case "bindingIPs":
         var tdLeft = document.createElement("TD")
-        tdLeft.innerHTML = "{{.settings.listeningIp.title}}" + ":"
+        tdLeft.innerHTML = "{{.settings.bindingIPs.title}}" + ":"
         var tdRight = document.createElement("TD")
-        var input = content.createInput("text", "listeningIp", data)
+        var input = content.createInput("text", "bindingIPs", data)
         input.setAttribute("id", settingsKey)
-        input.setAttribute("placeholder", "{{.settings.listeningIp.placeholder}}")
-        input.setAttribute("onchange", "javascript: this.className = 'changed'")
+        input.setAttribute("placeholder", "{{.settings.bindingIPs.placeholder}}")
         input.setAttribute('data-bs-target', '#ip_selection')
         input.setAttribute("data-bs-toggle" , "modal")
         tdRight.appendChild(input)
@@ -654,8 +653,8 @@ class SettingsCategory {
         text = "{{.settings.ThreadfinAutoUpdate.description}}"
         break
 
-      case "listeningIp":
-        text = "{{.settings.listeningIp.description}}"
+      case "bindingIPs":
+        text = "{{.settings.bindingIPs.description}}"
         break
 
       case "backup.keep":