Preview: Selective downloads for receive-only folders

gui/default/assets/css/overrides.css

@@ -341,6 +341,24 @@ ul.three-columns li, ul.two-columns li {
     z-index: 980;
 }
 
+/*
+ * Folder Basic Ignores Tree tweaks
+ */
+
+#folderGlobalTree-container {
+    overflow-y: scroll;
+    resize: vertical;
+    /* Limit height to prevent vertical screen overflow. */
+    max-height: calc(100vh - 390px);
+    /* Always fit at least one folder with dropdown open. */
+    min-height: 136px;
+}
+
+/* Ignore fixed height when manually resized. */
+#folderGlobalTree-container[style*="height"] {
+    max-height: none;
+}
+
 /*
  * Restore Versions tweaks
  */

gui/default/assets/css/tree.css

@@ -10,6 +10,11 @@
 .fancytree-container {
     cursor: pointer;
     width: 100%;
+	list-style-type: none;
+}
+
+.fancytree-container ul {
+	list-style-type: none;
 }
 
 .fancytree-hide {
@@ -33,10 +38,15 @@
 .fancytree-expander,
 .fancytree-icon {
     margin-top: 4px;
+    margin-left: 10px;
     vertical-align: top;
     width: 16px;
 }
 
+.fancytree-helper-indeterminate-cb:before {
+  content: "\f14a";
+}
+
 .fancytree-childcounter {
     background: #777;
     border-radius: 10px;

gui/default/fancyTreeGlobalDataWorker.js

@@ -0,0 +1,66 @@
+const generatedByTreeSelector = "// Generated by tree selector";
+
+var ignores = [];
+var invalidPattern = false;
+
+// To prevent running multiple jobs at once.
+// When new job starts old one cancel itself.
+var latestReqId = 0;
+
+self.onmessage = function (msg) {
+	console.log("fancyTreeGlobalDataWorker | start", "data", msg.data)
+	const newReqId = Date.now();
+	latestReqId = newReqId;
+
+	// Just cancellation message.
+	if (!msg.data?.data) {
+		console.log("fancyTreeGlobalDataWorker | cancel requested")
+		return;
+	}
+
+	ignores = msg.data.ignorePatterns;
+	if (ignores[0] !== generatedByTreeSelector) {
+		invalidPattern = true;
+		ignores = [];
+	} else {
+		ignores = ignores.slice(1, -1)
+	}
+	self.postMessage({
+		data: formatGlobalTreeNodes(msg.data.data, "", newReqId),
+		invalidPattern: invalidPattern
+	});
+	inProgress = false;
+	console.log("fancyTreeGlobalDataWorker | finished");
+}
+
+function formatGlobalTreeNodes(data, parentKey, reqId, parentIgnored = true) {
+	if (reqId != latestReqId) {
+		console.log("fancyTreeGlobalDataWorker | cancelled", reqId)
+		return null;
+	}
+
+	var result = [];
+	// console.log("formatGlobalTreeNodes(worker)", "data", data, "parentKey", parentKey, "parentIgnored", parentIgnored)
+	data.forEach(function(node) {
+		const isFolder = node.type == "FILE_INFO_TYPE_DIRECTORY";
+		const key = parentKey + "/" + node.name;
+		const found = ignores.find(function (ignoreKey) {
+			return key == ignoreKey.slice(1);
+		});
+
+		const ignored = parentIgnored && !found;
+		result.push({
+			children: isFolder && node.children?.length > 0 ? formatGlobalTreeNodes(node.children, key, reqId, ignored) : [],
+			key: key,
+			title: node.name,
+			folder: isFolder,
+			selected: !ignored
+		});
+		if (reqId != latestReqId) {
+			console.log("fancyTreeGlobalDataWorker | cancelled", reqId)
+			return null;
+		}
+	});
+
+	return result;
+}

gui/default/index.html

@@ -510,6 +510,12 @@ <h4 class="panel-title">
                           <a href="" ng-click="showLocalChanged(folder.id, folder.type)">{{model[folder.id].receiveOnlyTotalItems | alwaysNumber | localeNumber}} <span translate>items</span>, ~{{model[folder.id].receiveOnlyChangedBytes | binary}}B</a>
                         </td>
                       </tr>
+                      <tr ng-if="hasLocalIgnored(folder)">
+                        <th><span class="fas fa-fw fa-exclamation-circle"></span>&nbsp;<span translate>Ignored items</span></th>
+                        <td class="text-right">
+                          <a href="" ng-click="showLocalIgnored(folder.id, folder.type)">{{model[folder.id].localIgnoredTotalItems | alwaysNumber | localeNumber}} <span translate>items</span>, ~{{model[folder.id].localIgnoredBytes | binary}}B</a>
+                        </td>
+                      </tr>
                       <tr>
                         <th><span class="fas fa-fw fa-folder"></span>&nbsp;<span translate>Folder Type</span></th>
                         <td class="text-right">
@@ -1040,6 +1046,7 @@ <h4 class="panel-title">
   <ng-include src="'syncthing/transfer/failedFilesModalView.html'"></ng-include>
   <ng-include src="'syncthing/transfer/remoteNeededFilesModalView.html'"></ng-include>
   <ng-include src="'syncthing/transfer/localChangedFilesModalView.html'"></ng-include>
+  <ng-include src="'syncthing/transfer/localIgnoredFilesModalView.html'"></ng-include>
   <ng-include src="'syncthing/core/upgradeModalView.html'"></ng-include>
   <ng-include src="'syncthing/core/majorUpgradeModalView.html'"></ng-include>
   <ng-include src="'syncthing/core/aboutModalView.html'"></ng-include>