Added settings, and button display to control tab, as well as other c…

…hanges
mikedmor · May 9, 2018 · b83012a · b83012a
1 parent 2280427
commit b83012a
Show file tree

Hide file tree

Showing 4 changed files with 91 additions and 32 deletions.
diff --git a/octoprint_multicam/__init__.py b/octoprint_multicam/__init__.py
@@ -1,29 +1,76 @@
 # coding=utf-8
 from __future__ import absolute_import
 import octoprint.plugin
+import octoprint.settings
 
 class MultiCamPlugin(octoprint.plugin.StartupPlugin,
                       octoprint.plugin.TemplatePlugin,
                       octoprint.plugin.SettingsPlugin,
                       octoprint.plugin.AssetPlugin):
 
+    def get_assets(self):
+        return dict(
+            js=["js/multicam.js"],
+            css=["css/multicam.css"]
+        )
+
     def on_after_startup(self):
         self._logger.info("MultiCam Loaded! (more: %s)" % self._settings.get(["multicamStream1"]))
 
     def get_settings_defaults(self):
-        return dict(multicamStream1="")
+        return dict(multicam_profiles=[{'name':'Default','URL':octoprint.settings.settings().get(["webcam","stream"])}])
+
+    def on_settings_save(self, data):
+        old_profiles = self._settings.get(["multicam_profiles"])
+
+        octoprint.plugin.SettingsPlugin.on_settings_save(self, data)
+
+        new_profiles = self._settings.get(["multicam_profiles"])
+        if old_profiles != new_profiles:
+            self._logger.info("profiles changed from {old_profiles} to {new_profiles} reordering tabs.".format(**locals()))
+            flattened_profiles = []
+            for profiles in new_profiles:
+                flattened_profiles.append(profiles["name"])
+            self._settings.global_set(["name","URL"],flattened_profiles)
+            self._plugin_manager.send_plugin_message(self._identifier, dict(reload=True))
 
     def get_template_configs(self):
         return [
             dict(type="settings", custom_bindings=True),
             dict(type="generic", template="multicam.jinja2", custom_bindings=True)
         ]
 
-    def get_assets(self):
+    ##~~ Softwareupdate hook
+    def get_version(self):
+        return self._plugin_version
+
+    def get_update_information(self):
         return dict(
-            js=["js/multicam.js"],
-            css=["css/multicam.css"]
+            multicam=dict(
+                displayName="MultiCam",
+                displayVersion=self._plugin_version,
+
+                # version check: github repository
+                type="github_release",
+                user="mikedmor",
+                repo="OctoPrint_MultiCam",
+                current=self._plugin_version,
+
+                # update method: pip
+                pip="https://github.com/mikedmor/OctoPrint_MultiCam/archive/{target_version}.zip"
+            )
         )
 
 __plugin_name__ = "MultiCam"
-__plugin_implementation__ = MultiCamPlugin()
+
+def __plugin_load__():
+    global __plugin_implementation__
+    __plugin_implementation__ = MultiCamPlugin()
+
+    global __plugin_hooks__
+    __plugin_hooks__ = {
+        "octoprint.plugin.softwareupdate.check_config": __plugin_implementation__.get_update_information
+    }
+
+
+
diff --git a/octoprint_multicam/static/js/multicam.js b/octoprint_multicam/static/js/multicam.js
@@ -4,48 +4,59 @@ $(function() {
 
         var camViewPort = $('#webcam_image');
 
+        var currentStream = ""; //camViewPort.attr('src').substr(0, camViewPort.attr('src').indexOf('?'));
+
         self.settings = parameters[0];
 
         self.multicam_profiles = ko.observableArray();
 
-        self.addMultiCamProfile = function() {
-            self.multicam_profiles.push({name: "Webcam "+self.multicam_profiles().length, URL: "http://"});
+        self.onBeforeBinding = function() {
+            self.multicam_profiles(self.settings.settings.plugins.multicam.multicam_profiles());
         };
 
-        self.removeMultiCamProfile = function(profile) {
-            self.multicam_profiles.remove(profile);
+        self.onEventSettingsUpdated = function(payload) {
+            self.multicam_profiles(self.settings.settings.plugins.multicam.multicam_profiles());
         };
 
-        //self.currentStream = ko.observable();
+        self.addMultiCamProfile = function() {
+            //console.log("Adding New profile for Webcam "+self.multicam_profiles().length);
+            self.settings.settings.plugins.multicam.multicam_profiles.push({name: ko.observable('Webcam '+self.multicam_profiles().length), URL: ko.observable('http://')});
+            //console.log("Updating local multicam_profiles variable");
+            self.multicam_profiles(self.settings.settings.plugins.multicam.multicam_profiles());
+        };
 
-        //self.newStream = ko.observable();
+        self.removeMultiCamProfile = function(profile) {
+            //console.log("Removing profile");
+            self.settings.settings.plugins.multicam.multicam_profiles.remove(profile);
+            //console.log("Updating local multicam_profiles variable");
+            self.multicam_profiles(self.settings.settings.plugins.multicam.multicam_profiles());
+        };
 
-        //self.goToUrl = function() {
-        //    self.currentStream(self.newStream());
-        //};
+        //TODO: get binding working with: enable: $parent.currentLoaded(URL)
+        self.currentLoaded = function(URL) {
+            return URL != currentStream;
+        }.bind(MultiCamViewModel);
 
-        self.loadWebcam = function() {
-            console.log("Changing stream to: "+self.settings.settings.plugins.multicam.multicamStream2());
-            camViewPort.attr('src',self.settings.settings.plugins.multicam.multicamStream2());
+        self.loadWebcam = function(profile, event) {
+            console.log("CurrentStream:"+currentStream);
+            console.log("Changing stream to: "+ko.toJS(profile).URL);
+            camViewPort.attr('src',ko.toJS(profile).URL);
+            currentStream = ko.toJS(profile).URL;
         };
 
-        //self.onBeforeBinding = function() {
-        //    self.newStream(self.settings.settings.plugins.multicam.multicamStream1());
-        //    self.goToUrl();
-        //};
-
         self.onAfterBinding = function() {
             var camControl = $('#camControl');
             var container = $('#control-jog-general');
 
             // Inserts the control after the general settings under Control Tab
             camControl.insertAfter(container);
-        }
+        };
+
     }
 
     OCTOPRINT_VIEWMODELS.push([
         MultiCamViewModel,
         ["settingsViewModel", "controlViewModel"],
-        ["#camControl"]
+        ["#settings_plugin_multicam_form","#camControl"]
     ]);
 });
diff --git a/octoprint_multicam/templates/multicam.jinja2 b/octoprint_multicam/templates/multicam.jinja2
@@ -1,9 +1,8 @@
-<!-- ko allowBindings: false -->
+<!-- ko allowBindings: true -->
 <div class="jog-panel" id="camControl">
     <h1>Webcams</h1>
-    <div>
-        <button class="btn btn-block control-box" data-bind="click: loadWebcam" disabled>Webcam 1</button>
-        <button class="btn btn-block control-box" data-bind="click: loadWebcam">Webcam 2</button>
+    <div data-bind="foreach: settings.settings.plugins.multicam.multicam_profiles">
+        <button class="btn btn-block control-box" data-bind="click: $parent.loadWebcam, text: name">Default (before bind)</button>
     </div>
 </div>
 <!-- /ko -->
diff --git a/octoprint_multicam/templates/multicam_settings.jinja2 b/octoprint_multicam/templates/multicam_settings.jinja2
@@ -1,10 +1,11 @@
-<form class="form-horizontal">
+<!-- ko allowBindings: true -->
+<form id="settings_plugin_multicam_form" class="form-horizontal">
     <h3>{{ _('Multicam Profiles') }}</h3>
     <div class="row-fluid">
         <div class="span5"><h4>{{ _('Name') }}</h4></div>
         <div class="span5"><h4>{{ _('URL') }}</h4></div>
     </div>
-    <div data-bind="foreach: multicam_profiles">
+    <div data-bind="foreach: settings.settings.plugins.multicam.multicam_profiles">
         <div class="row-fluid" style="margin-bottom: 5px">
             <div class="span5">
                 <input type="text" class="span12 text-right" data-bind="value: name">
@@ -13,13 +14,14 @@
                 <input type="text" class="span12 text-right" data-bind="value: URL">
             </div>
             <div class="span2">
-                <a title="Remove Webcam" class="btn btn-danger" data-bind="click: $parent.removeMultiCamProfile"><i class="fa fa-trash-o"></i></a>
+                <button title="Remove Webcam" class="btn btn-danger" data-bind="click: $parent.removeMultiCamProfile"><i class="fa fa-trash-o"></i></button>
             </div>
         </div>
     </div>
     <div class="row-fluid">
         <div class="offset10 span2">
-            <a title="Add Webcam" class="btn btn-primary" data-bind="click: addMultiCamProfile"><i class="fa fa-plus"></i></a>
+            <button title="Add Webcam" class="btn btn-primary" data-bind="click: addMultiCamProfile"><i class="fa fa-plus"></i></button>
         </div>
     </div>
 </form>
+<!-- /ko -->