Use grid instead of three-column (fixes #2130)

gui/index.html

@@ -511,15 +511,12 @@
   <script src="syncthing/core/binaryFilter.js"></script>
   <script src="syncthing/core/durationFilter.js"></script>
   <script src="syncthing/core/eventService.js"></script>
-  <script src="syncthing/core/filterStabilize.js"></script>
-  <script src="syncthing/core/groupFilter.js"></script>
   <script src="syncthing/core/httpErrorDialogDirective.js"></script>
   <script src="syncthing/core/identiconDirective.js"></script>
   <script src="syncthing/core/languageSelectDirective.js"></script>
   <script src="syncthing/core/lastErrorComponentFilter.js"></script>
   <script src="syncthing/core/localeService.js"></script>
   <script src="syncthing/core/majorUpgradeModalDirective.js"></script>
-  <script src="syncthing/core/memoize.js"></script>
   <script src="syncthing/core/modalDirective.js"></script>
   <script src="syncthing/core/naturalFilter.js"></script>
   <script src="syncthing/core/networkErrorDialogDirective.js"></script>

gui/syncthing/core/filterStabilize.js

@@ -1,27 +0,0 @@
-/**
- * m59peacemaker's filterStabilize
- *
- * See https://github.com/m59peacemaker/angular-pmkr-components/tree/master/src/filterStabilize
- * Released under the MIT license
- */
-angular.module('syncthing.core')
-    .factory('pmkr.filterStabilize', [
-        'pmkr.memoize',
-        function(memoize) {
-            function service(fn) {
-                function filter() {
-                    var args = [].slice.call(arguments);
-                    // always pass a copy of the args so that the original input can't be modified
-                    args = angular.copy(args);
-                    // return the `fn` return value or input reference (makes `fn` return optional)
-                    var filtered = fn.apply(this, args) || args[0];
-                    return filtered;
-                }
-
-                var memoized = memoize(filter);
-                return memoized;
-
-            }
-            return service;
-        }
-    ]);

gui/syncthing/core/groupFilter.js

@@ -1,25 +0,0 @@
-/**
- * Groups input in chunks of the specified size
- *
- * E.g. [1, 2, 3, 4, 5] with groupSize = 3 => [[1, 2, 3], [4, 5]]
- * Uses pmkr.memoize to avoid infdig, see 'Johnny Hauser's "Filter Stablize" Solution'
- * here: http://sobrepere.com/blog/2014/10/14/creating-groupby-filter-angularjs/
- */
-angular.module('syncthing.core')
-    .filter('group', [
-        'pmkr.filterStabilize',
-        function (stabilize) {
-            return stabilize(function(items, groupSize) {
-                var groups = [];
-                var inner;
-                for (var i = 0; i < items.length; i++) {
-                    if (i % groupSize === 0) {
-                        inner = [];
-                        groups.push(inner);
-                    }
-                    inner.push(items[i]);
-                }
-                return groups;
-            });
-        }
-    ]);

gui/syncthing/core/memoize.js

@@ -1,28 +0,0 @@
-/**
- * m59peacemaker's memoize
- *
- * See https://github.com/m59peacemaker/angular-pmkr-components/tree/master/src/memoize
- * Released under the MIT license
- */
-angular.module('syncthing.core')
-    .factory('pmkr.memoize', [
-        function() {
-            function service() {
-                return memoizeFactory.apply(this, arguments);
-            }
-            function memoizeFactory(fn) {
-                var cache = {};
-                function memoized() {
-                    var args = [].slice.call(arguments);
-                    var key = JSON.stringify(args);
-                    if (cache.hasOwnProperty(key)) {
-                        return cache[key];
-                    }
-                    cache[key] = fn.apply(this, arguments);
-                    return cache[key];
-                }
-                return memoized;
-            }
-            return service;
-        }
-    ]);

gui/syncthing/device/editDeviceModalView.html

@@ -54,8 +54,9 @@
               <div class="form-group">
                 <label translate for="folders">Share Folders With Device</label>
                 <p translate class="help-block">Select the folders to share with this device.</p>
-                <div class="three-columns">
-                  <div class="checkbox" ng-repeat="folder in folderList()">
+                <div class="row">
+                  <div class="col-md-4" ng-repeat="folder in folderList()">
+                    <div class="checkbox">
                       <label>
                         <input type="checkbox" ng-model="currentDevice.selectedFolders[folder.id]"> {{folder.id}}
                       </label>
@@ -64,6 +65,7 @@
                 </div>
               </div>
             </div>
+          </div>
 
         </form>
       </div>

gui/syncthing/folder/editFolderModalView.html

@@ -138,8 +138,9 @@
               <div class="form-group">
                 <label translate for="devices">Share With Devices</label>
                 <p translate class="help-block">Select the devices to share this folder with.</p>
-                <div class="three-columns">
-                  <div class="checkbox" ng-repeat="device in otherDevices()">
+                <div class="row">
+                  <div class="col-md-4" ng-repeat="device in otherDevices()">
+                    <div class="checkbox">
                       <label>
                         <input type="checkbox" ng-model="currentFolder.selectedDevices[device.deviceID]"> {{deviceName(device)}}
                       </label>
@@ -148,6 +149,7 @@
                 </div>
               </div>
             </div>
+          </div>
 
         </form>
         <div translate ng-show="!editingExisting">When adding a new folder, keep in mind that the Folder ID is used to tie folders together between devices. They are case sensitive and must match exactly between all devices.</div>