From c747c0a7116da74a7da087bec7d5bdae07c9f2a4 Mon Sep 17 00:00:00 2001
From: ElegantMonkey <ramonzitosdesorte@hotmail.com>
Date: Wed, 24 May 2017 12:27:51 -0300
Subject: [PATCH] Fix filelist folder show/hide logic

It only toggled the "hidden" attributes of the childs, however if
you closed a subfolder, then closed the parent folder, all childs of the
parent would be toggled, leaving the subfolder that we closed open.

Now the state is stored on the data-filelist-open attribute, and the
hidden state is set based on it.
---
 templates/view.html | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/templates/view.html b/templates/view.html
index aa0aa629..c6358b1a 100644
--- a/templates/view.html
+++ b/templates/view.html
@@ -46,7 +46,7 @@
   <p class="torrent-hr" id="filelist-control" onclick="javascript:toggleFilelist()" data-filelist-open="true">{{call $.T "files"}}</p>
   {{ if gt (len .FileList) 0 }}
   {{/* how do i concat lol */}}
-  {{ $folderFormat := `<tr class='childs-of-{{.ParentIdentifier}} tr-filelist tr-folder' onclick="javascript:toggleFolder('childs-of-{{.Identifier}}')"><td><span class='folder-icon' style='margin-left: calc({{.NestLevel}}*2rem);'></span>{{.FolderName}}</td><td>{{ fileSize .TotalSize .Data.T }}</td></tr>` }}
+  {{ $folderFormat := `<tr id="{{.Identifier}}" class='childs-of-{{.ParentIdentifier}} tr-filelist tr-folder' onclick="javascript:toggleFolder('{{.Identifier}}')" data-filelist-open="true"><td><span class='folder-icon' style='margin-left: calc({{.NestLevel}}*2rem);'></span>{{.FolderName}}</td><td>{{ fileSize .TotalSize .Data.T }}</td></tr>` }}
   {{ $fileFormat := `<tr class='childs-of-{{.ParentIdentifier}} tr-filelist'><td><span class="file-icon" style='margin-left: calc({{.NestLevel}}*2rem);'></span>{{.Filename}}</td><td>{{ fileSize .Filesize .Data.T }}</td>` }}
     <script>
 	function toggleFilelist() {
@@ -58,11 +58,16 @@
 	}
 
     function toggleFolder(folder) {
-        var rows = document.querySelectorAll("*[class^='" + folder + "']")
+        var folderNode = document.getElementById(folder)
+        var isOpen = folderNode.getAttribute("data-filelist-open") == "true" ? true : false
+        var rows = document.querySelectorAll("*[class^='childs-of-" + folder + "']")
         for (var i = 0; i < rows.length; i++) {
             var row = rows[i]
-			row.hidden = !row.hidden
+            // If it's open (true), will hide, if not, will show.
+			row.hidden = isOpen
         }
+
+        folderNode.setAttribute("data-filelist-open", !isOpen ? "true" : "false")
     }
     </script>
     <div class="torrent-info-box" id="filelist">