update

node_modules/browser-sync-ui/lib/plugins/sync-options/sync-options.client.js

@@ -0,0 +1,94 @@
+(function (angular) {
+
+    const SECTION_NAME = "sync-options";
+
+    angular
+        .module("BrowserSync")
+        .controller("SyncOptionsController", [
+            "Socket",
+            "options",
+            "pagesConfig",
+            SyncOptionsController
+        ]);
+
+    /**
+     * @param Socket
+     * @param options
+     * @param pagesConfig
+     * @constructor
+     */
+    function SyncOptionsController(Socket, options, pagesConfig) {
+
+        var ctrl = this;
+        ctrl.options = options.bs;
+        ctrl.section = pagesConfig[SECTION_NAME];
+
+        ctrl.setMany = function (value) {
+            Socket.uiEvent({
+                namespace: SECTION_NAME,
+                event: "setMany",
+                data: {
+                    value: value
+                }
+            });
+            ctrl.syncItems = ctrl.syncItems.map(function (item) {
+                item.value = value;
+                return item;
+            });
+        };
+
+        /**
+         * Toggle Options
+         * @param item
+         */
+        ctrl.toggleSyncItem = function (item) {
+            Socket.uiEvent({
+                namespace: SECTION_NAME,
+                event: "set",
+                data: {
+                    path:  item.path,
+                    value: item.value
+                }
+            });
+        };
+
+        ctrl.syncItems = [];
+
+        var taglines = {
+            clicks:  "Mirror clicks across devices",
+            scroll:  "Mirror scroll position across devices",
+            "ghostMode.submit":  "Form Submissions will be synced",
+            "ghostMode.inputs":  "Text inputs (including text-areas) will be synced",
+            "ghostMode.toggles": "Radio + Checkboxes changes will be synced",
+            codeSync:            "Reload or Inject files they change"
+        };
+
+        // If watching files, add the code-sync toggle
+        ctrl.syncItems.push(addItem("codeSync", ["codeSync"], ctrl.options.codeSync, taglines["codeSync"]));
+
+        Object.keys(ctrl.options.ghostMode).forEach(function (item) {
+            if (item !== "forms" && item !== "location") {
+                ctrl.syncItems.push(addItem(item, ["ghostMode", item], ctrl.options.ghostMode[item], taglines[item]));
+            }
+        });
+
+        Object.keys(ctrl.options.ghostMode.forms).forEach(function (item) {
+            ctrl.syncItems.push(addItem("Forms: " + item, ["ghostMode", "forms", item], ctrl.options.ghostMode["forms"][item], taglines["ghostMode." + item]));
+        });
+
+        function addItem (item, path, value, tagline) {
+            return {
+                value: value,
+                name: item,
+                path: path,
+                title: ucfirst(item),
+                tagline: tagline
+            };
+        }
+    }
+
+    function ucfirst (string) {
+        return string.charAt(0).toUpperCase() + string.slice(1);
+    }
+
+})(angular);