Merge pull request #25 from sukhbir-singh/progress_fixes

Fixed disk wizard plugin

app/assets/stylesheets/disk_wizards.css

@@ -1,23 +1,23 @@
 .panel.panel-default{
-	overflow: hidden;
-	background: white;
+    overflow: hidden;
+    background: white;
 }
 @media(max-width: 768px){
-	#loading_animation{
-		margin-left: 10px;
-		margin-right: 10px;
-	}
+    #loading_animation{
+        margin-left: 10px;
+        margin-right: 10px;
+    }
 }
 #loading_animation{
-	margin-top: 20px;
+    margin-top: 20px;
 }
 #progress_message{
     margin-top: 10px;
     color: #505050;
     display: inline-block;
 }
 .well{
-	width: 75%;
+    width: 75%;
 }
 .panel .nav li.nav-item a.nav-link{
     color: #565656;
@@ -31,23 +31,23 @@
     padding-bottom: 10px;
 }
 .panel .nav li.nav-item.active a.nav-link{
-	color: white;
+    color: white;
 }
 .panel .nav li.nav-item.active{
-	background: #63b6ea;
-	color: white;
+    background: #63b6ea;
+    color: white;
 }
 #devices_data form{
-	width: 100%;
-	margin-left: 30px;
-	margin-right: 30px;
+    width: 100%;
+    margin-left: 30px;
+    margin-right: 30px;
 }
 #next_button{
-	margin-right: 15px;
+    margin-right: 15px;
 }
 #refresh_devices_button{
-	margin-left: 15px;
-	padding: 8px;
+    margin-left: 15px;
+    padding: 8px;
 }
 .panel-title{
     font-size: 1.4rem;
@@ -58,3 +58,17 @@
     margin-right: 15px;
     margin-left: 15px;
 }
+.back-button-wizard{
+    display: inline-block;
+    margin-left: 32px;
+    margin-bottom: 12px;
+    background: lightgrey;
+    color: black;
+}
+.right-button-wizard{
+    height: fit-content;
+    margin-left: 10px;
+}
+#fs_selector{
+    margin: 0 auto;
+}

app/controllers/disk_service_controller.rb

@@ -51,8 +51,9 @@ def operations_progress
   # Expected key:values in @params:
   #   :debug => Integer value(1) if debug mode has selected in fourth step(confirmation), else nil
   def progress
-    debug_mode = params[:debug]
-    self.user_selections = {debug: debug_mode}
+    @debug_mode = params[:debug]
+    #self.user_selections = {debug: debug_mode}
+    render 'disk_wizard/progress'
   end
 
 end

app/controllers/disk_wizard_controller.rb

@@ -148,4 +148,9 @@ def clear_mode
     CommandExecutor.debug_mode = nil
   end
 
+  def progress
+    debug_mode = params[:debug]
+    self.user_selections = {debug: debug_mode}
+  end
+
 end

app/views/disk_wizard/confirmation.html.slim

@@ -6,57 +6,54 @@ javascript:
 .panel-body
   = form_tag(defined?(disk_wizards_engine) ? disk_wizards_engine.process_path : process_path, {method: "POST", id: "confirmation"})
   = hidden_field_tag 'device', user_selections['path']
-  .row
+  .row.mt-2.mb-2
     - "*****************#{user_selections} \n ******** #{@selected_disk}>"
-    .row
-      .col-md-4
-        = pie_chart({"Size: #{number_to_human_size @selected_disk.size}" => (@selected_disk.size)}, \
-            library: {legend: {position: 'bottom'}, \
-            is3D: true, \
-            pieSliceText: 'percentage', \
-            tooltip: {text: 'percentage'}, \
-            chartArea: {width: '100%', height: '78%'}, \
-            slices: [{color: '#A44585'}, {color: '#00B5F0'}] \
-          })
-      .col-md-6.col-md-offset-1
-        br/
-        br/
-        ul.list-group
-          li.list-group-item.list-group-item-info.text-center
-            = @selected_disk.kind_of?(Device) ? @selected_disk.model : @selected_disk.device.model
-          - if user_selections['format']
+    .col-md-4 style="margin: 0 auto;"
+      = pie_chart({"Size: #{number_to_human_size @selected_disk.size}" => (@selected_disk.size)}, \
+          library: {legend: {position: 'bottom'}, \
+          is3D: true, \
+          pieSliceText: 'percentage', \
+          tooltip: {text: 'percentage'}, \
+          chartArea: {width: '100%', height: '78%'}, \
+          slices: [{color: '#A44585'}, {color: '#00B5F0'}] \
+        })
+    .col-md-6.col-md-offset-1 style="margin: 0 auto;padding-top: 26px;"
+      ul.list-group
+        li.list-group-item.list-group-item-info.text-center
+          = @selected_disk.kind_of?(Device) ? @selected_disk.model : @selected_disk.device.model
+        - if user_selections['format']
+          li.list-group-item.text-left
+            span.badge.alert-danger style="font-size:100%;margin-right:5px;"
+              span.glyphicon.glyphicon-ok
+                | Format
+          li.list-group-item.text-left
+            span.badge.alert-info style="font-size:100%;margin-right:5px;" = Partition.FilesystemType.key(user_selections['fs_type'].to_i)
+            | New filesystem Type
+        - user_selections['option'].try(:each) do |option|
+          - if option == '1'
             li.list-group-item.text-left
-              span.badge.alert-danger
-                span.glyphicon.glyphicon-ok
-              | Format
+              span.badge.alert-info style="font-size:100%;margin-right:5px;"
+                | \/var/hda/files/drives/#{user_selections['label'] || @selected_disk.kname}
+              | Mount
+              | Location
+          - else
             li.list-group-item.text-left
-              span.badge.alert-info = Partition.FilesystemType.key(user_selections['fs_type'].to_i)
-              | New filesystem Type
-          - user_selections['option'].try(:each) do |option|
-            - if option == '1'
-              li.list-group-item.text-left
-                span.badge.alert-info
-                  | \/var/hda/files/drives/#{user_selections['label'] || @selected_disk.kname}
-                | Mount
-                | Location
-            - else
-              li.list-group-item.text-left
-                span.badge.alert-warning [Experimental]
-                | Add it to shared stroage pool
-          li.list-group-item.text-left
-            span.badge.alert-info
-              = @selected_disk.path
-            | System name
-          li.list-group-item.text-right
-            a.btn.btn-default style=("float: left") href="#{defined?(disk_wizards_engine) ? disk_wizards_engine.manage_path : manage_path}"
-              span.glyphicon.glyphicon-arrow-left
-              | Back
+              span.badge.alert-warning style="font-size:100%;margin-right:5px;" [Experimental]
+              | Add it to shared stroage pool
+        li.list-group-item.text-left
+          span.badge.alert-info style="font-size:100%;margin-right:5px;"
+            = @selected_disk.path
+          |  System name
+        li.list-group-item.text-right
+          a.btn.btn-default style=("float: left;background: lightgrey;color: black;") href="#{defined?(disk_wizards_engine) ? disk_wizards_engine.manage_path : manage_path}"
+            span.glyphicon.glyphicon-arrow-left
+            | ← Back
 
-            label#debug.text-warning data-placement="left" data-toggle="tooltip" style=("cursor: pointer") title=("No executions takeplace,only list the commands which get executed.")
-              = check_box_tag(:debug, 1, false, class: 'format')
+          label#debug.text-warning data-placement="left" data-toggle="tooltip" style=("cursor: pointer;position: relative;top: 5px;") title=("No executions takeplace,only list the commands which get executed.")
+            = check_box_tag(:debug, 1, false, class: 'format')
+            span style="position: relative;top: -3px;margin-right: 15px;margin-left: 2px;"
               | Debug
 
-            = button_tag(type: "submit", class: "btn btn-success") do
-              | Apply
-              span.glyphicon.glyphicon-ok
-
+          = button_tag(type: "submit", class: "btn btn-success") do
+            | Apply
+            span.glyphicon.glyphicon-ok

app/views/disk_wizard/done.html.slim

@@ -32,15 +32,14 @@ css:
       font-size: large;
   }
 
-.row
-  br/
+.row.p-2.d-inline-block
   - if user_selections['debug']
-    .col-md-10.col-md-offset-1
+    div
       .panel.panel-warning
-        .panel-heading
+        .h4.mt-3
           | Debug Information
           span.glyphicon.glyphicon-info-sign
-        .panel-body.text-left
+        .panel-body.text-left style="font-size: 14px;"
           p.text-muted
             | Note:
           p.text-muted
@@ -49,15 +48,16 @@ css:
             | 2. Pipeline character(|) has encoded as exclamation character(!).
           p.text-muted
             | 3. Order(#) of the commands does matter if you try to execute them manually.
+
         table.table.table-bordered.table-hover
           thead
             tr.active
               th.text-center.text-primary style=("width: 5%;")
-              | #
+                | #
               th.text-center.text-primary style=("width: 20%;") 
-              | Command name
+                | Command name
               th.text-center.text-primary
-              | Parameters
+                | Parameters
 
           tbody
             - count = 0
@@ -108,7 +108,7 @@ css:
           | Get Debug infomation
 
     #fpaste_loading.col-md-8.col-md-offset-2
-      = image_tag "disk_wizard/progress.gif"
+      / = image_tag "disk_wizard/progress.gif"
       p.text-primary
         span.glyphicon.glyphicon-time
         | Please wait.Generating fpaste URL.......

app/views/disk_wizard/error.html.slim

@@ -9,6 +9,7 @@ javascript:
           $('#debug_info').slideDown();
       });
   }
+
   $(function () {
       $('#fpaste_url').tooltip();
       var $loading = $('#fpaste_loading').hide();
@@ -19,6 +20,10 @@ javascript:
       });
   });
 
+  function sendReport(){
+    //
+  }
+
 css:
   /* Fix for conflicts with platform CSS */
 
@@ -55,44 +60,49 @@ css:
      bottom: 0px;
   }
 
-.alert.alert-danger.fade.in
-  button.close aria-hidden="true" data-dismiss="alert" type="button" 
-    | ×
-  h4 Oh snap! You got an error!
-  .well
-    p.text-primary.text-center
-      = @exception
-      | \.
+  #fpaste_loading{
+     display: inline-block;
+     margin: 0 auto;
+     margin-top: 20px;
+     font-size: 13px;
+  }
 
-  .row.text-center
+div style="background: #f5cece;padding: 15px;"
+  h4 style="color: #f56b6b;" Oh snap! You got an error!
+  p style="font-size: 13px;"
+    = @exception
+    | \.
+
+  .row.text-center.d-inline-block
     button#get_debug_info.btn.btn-warning onclick="getDebugURL();" 
       | Get Debug infomation
-    button#send_crash_report.btn.btn-default onclick="sendReport();" 
+    button#send_crash_report.btn.btn-default.ml-4.mr-4 onclick="sendReport();"
       span.glyphicon.glyphicon-send
       | Send Report to Amahi
-    a.btn.btn-default href="/tab/disks/disk_wizards" type="button" 
+    a.btn.btn-default href="/tab/disks/disk_wizard" type="button"
       | Or try again
 
   .row
     #fpaste_loading.col-md-8.col-md-offset-2
-      = image_tag "disk_wizard/progress.gif"
+      / = image_tag "disk_wizard/progress.gif"
       p.text-primary
         span.glyphicon.glyphicon-time
         | Please wait.Generating fpaste URL.......
-    #debug_info.col-md-10.col-md-offset-1 style=("display: none;") 
-      .panel.panel-default
+
+    #debug_info.col-md-10.col-md-offset-1.mx-auto style=("display: none;")
+      .panel.panel-default.p-2.mt-3
         form.form-inline.text-center role="form" 
-          .form-group.has-success.has-feedback
+          .form-group.has-success.has-feedback.pl-2
             label.control-label for="fpaste_url" 
               | URL:
               span.glyphicon.glyphicon-globe
-            input#fpaste_url.form-control autocomplete="off" data-placement="top" data-toggle="tooltip" onclick="$(this).select();" placeholder=("Generating URL..") style=("width: 500px;") title=("Press Ctrl+c to coppy URL to clipboard") type="text" /
+            input#fpaste_url.form-control autocomplete="off" data-placement="top" data-toggle="tooltip" onclick="$(this).select();" placeholder=("Generating URL..") style=("width: 500px;font-size:14px;") title=("Press Ctrl+C to copy URL to clipboard") type="text" /
             span.glyphicon.glyphicon-ok.form-control-feedback
         .panel-body.text-left
-          p.text-primary
+          p.text-primary.mt-2
             | After generating your paste, copy the generated url above.
           p.text-primary
             | Head over to the Amahi IRC channel, and share your link with one of the helpful folks there.
-          p.text-info
+          span.text-info
             | Good Luck! Thanks for choosing Amahi.
 

app/views/disk_wizard/manage_disk.html.slim

@@ -18,24 +18,24 @@ javascript:
   = hidden_field_tag 'device', user_selections['path']
   .row
     - "*#{user_selections}"
-    .col-md-5.col-md-offset-3.well
+    div style="margin: 10px auto;"
       ul.list-group
         li.list-group-item.list-group-item-success
-          h5 
+          h6
             | What would you like to do?
-        li.list-group-item
+        li.list-group-item style="min-width: 320px;"
           .checkbox
-            = check_box_tag('option[]', 1, !!((user_selections['option'].include? '1') rescue false), class: 'mount_check')
             .alert.alert-info
-              label for="option_"  
+              = check_box_tag('option[]', 1, !!((user_selections['option'].include? '1') rescue false), class: 'mount_check')
+              label for="option_" style="position: relative;top: -3px;"
                 | Mount this drive automatically.
-              #label_input.input-group.input-group-sm style=("#{!!((user_selections['option'].include? '1') rescue false) ? nil : 'display: none'}") 
-                span.input-group-addon
+              #label_input.input-group.input-group-sm.mt-2 style=("#{!!((user_selections['option'].include? '1') rescue false) ? nil : 'display: none'}") 
+                span.input-group-addon.mr-2 style="position: relative;top: 3px;"
                   | Enter a label
                 input#label.form-control name="label" placeholder="Label" style=("margin: auto;") type="text" value=("#{user_selections['label'] || nil}") /
-  .row.text-left
-    = link_to(disk_wizards_engine.file_system_path , class: "btn btn-default") do
+  .row.mt-2
+    = link_to(disk_wizards_engine.file_system_path , class: "btn btn-default back-button-wizard") do
       | ← Back
-    = link_to '#', :onclick => "$('#options').submit()", style: "float: right;", class: "btn btn-success" do
+    = link_to '#', :onclick => "$('#options').submit()", style: "float: right;", class: "btn btn-success right-button-wizard" do
       | Next →