feat(storidge): add snapshot creation on volume details

app/docker/views/volumes/edit/volume.html

@@ -52,6 +52,13 @@
   </div>
 </div>
 
+<div class="row" ng-if="isCioDriver">
+  <div class="col-sm-12">
+    <storidge-snapshot-creation volume-id="storidgeVolume.Name">
+    </storidge-snapshot-creation>
+  </div>
+</div>
+
 <div class="row" ng-if="isCioDriver">
   <div class="col-sm-12">
     <storidge-snapshots-datatable

app/extensions/storidge/components/snapshot-creation/storidgeSnapshotCreation.html

@@ -0,0 +1,23 @@
+<rd-widget>
+  <rd-widget-header icon="fa-plus" title-text="Create snapshot">
+  </rd-widget-header>
+  <rd-widget-body>
+    <form class="form-horizontal">
+      <div class="form-group">
+        <label for="comment" class="col-sm-3 col-lg-2 control-label text-left">Comment</label>
+        <div class="col-sm-9 col-lg-10">
+          <input type="text" class="form-control" id="comment" ng-model="$ctrl.formValues.Comment">
+        </div>
+      </div>
+      <div class="form-group">
+        <div class="col-sm-12">
+          <button type="button" class="btn btn-primary btn-sm" ng-disabled="$ctrl.state.actionInProgress || !$ctrl.formValues.Comment"
+            ng-click="$ctrl.createSnapshot()" button-spinner="$ctrl.state.actionInProgress">
+            <span ng-hide="$ctrl.state.actionInProgress">Create snapshot</span>
+            <span ng-show="$ctrl.state.actionInProgress">Creating snapshot...</span>
+          </button>
+        </div>
+      </div>
+    </form>
+  </rd-widget-body>
+</rd-widget>

app/extensions/storidge/components/snapshot-creation/storidgeSnapshotCreation.js

@@ -0,0 +1,7 @@
+angular.module('portainer.docker').component('storidgeSnapshotCreation', {
+  templateUrl: 'app/extensions/storidge/components/snapshot-creation/storidgeSnapshotCreation.html',
+  controller: 'StoridgeSnapshotCreationController',
+  bindings: {
+    volumeId: '<'
+  }
+});

app/extensions/storidge/components/snapshot-creation/storidgeSnapshotCreationController.js

@@ -0,0 +1,26 @@
+angular.module('portainer.docker')
+.controller('StoridgeSnapshotCreationController', ['StoridgeSnapshotService', 'Notifications',
+function (StoridgeSnapshotService, Notifications) {
+  var ctrl = this;
+
+  this.formValues = {};
+  this.state = {
+    actionInProgress: false
+  };
+
+  this.createSnapshot = function () {
+    ctrl.state.actionInProgress = true;
+    StoridgeSnapshotService.create(ctrl.volumeId, ctrl.formValues.Comment)
+      .then(function success() {
+        Notifications.success('Success', 'Snapshot successfully created');
+        $state.reload();
+      })
+      .catch(function error(err) {
+        Notifications.error('Failure', err, 'Unable to create snapshot');
+      })
+      .finally(function final() {
+        ctrl.state.actionInProgress = false;
+      });
+  };
+
+}]);

app/extensions/storidge/components/volume-storidge-info/volumeStoridgeInfoController.js

@@ -98,7 +98,4 @@ function ($state, StoridgeVolumeService, Notifications) {
     });
   };
 
-  this.$onInit = function() {
-  };
-
 }]);

app/extensions/storidge/services/snapshotService.js

@@ -41,9 +41,9 @@ angular.module('extension.storidge')
     return deferred.promise;
   }
   
-  function create(volumeId) {
+  function create(volumeId, comment) {
     var deferred = $q.defer();
-    Storidge.createSnapshot({id: volumeId}).$promise
+    Storidge.createSnapshot({id: volumeId, comment: comment}).$promise
     .then(function success(data) {
       deferred.resolve(data);
     })