feat(ui): send progress

feat(ui): cute lil animations 4 smooth commitmsgs

README.md

@@ -77,15 +77,15 @@ This should have also have set up the package installer `gem` and interactive ru
     gem -v
     irb -v
 
-Let's also install our first gem `bundle` which is a package manager that will help us with development.
+Let's also install our first gem `bundler` which is a package manager that will help us with development.
 
-    gem install bundle
+    gem install bundler
 
 ### Editor Setup
 
 Clone this repo and run:
 
-    bundle install
+    bundler install
 
 This will install all the necessary packages for the connector.
 

scratch.rb

@@ -1,59 +0,0 @@
-require "net/http"
-
-require "json"
-
-require "uri"
-
-server = "https://latest.speckle.dev"
-
-token = "1dc2e3330a56371dc9011e5bed406264c9e65dd355"
-
-limit = 20
-streams_list = "
-query User {
-  user {
-    id
-    email
-    name
-    bio
-    company
-    avatar
-    verified
-    profiles
-    role
-    streams(limit: #{limit}) {
-      totalCount
-      cursor
-      items {
-        id
-        name
-        description
-        isPublic
-        createdAt
-        updatedAt
-        collaborators {
-          id
-          name
-          role
-        }
-      }
-    }
-  }
-}
-"
-
-endpoint = URI("#{server}/graphql")
-
-res =
-  ::Net::HTTP.start(endpoint.host, endpoint.port, use_ssl: true) do |http|
-    req = ::Net::HTTP::Post.new(endpoint)
-    req["Content-Type"] = "application/json"
-    req["Authorization"] = "Bearer #{token}"
-    # The body needs to be a JSON string.
-    req.body = ::JSON[{ query: streams_list }]
-    puts(req.body)
-    http.request(req)
-  end
-
-streams = ::JSON.parse(res.body)["data"]["user"]["streams"]["items"]
-puts(streams)

speckle_connector/accounts.rb

@@ -33,22 +33,20 @@ module SpeckleSystems::SpeckleConnector
     end
 
     def self._get_speckle_dir
-      platform = RUBY_PLATFORM.downcase
-
       speckle_dir =
-        if platform =~ (/mingw/) || platform =~ (/win/)
-          # win
-          File.join(Dir.home, "AppData/Roaming/Speckle")
-        elsif platform =~ /linux/
-          # linux
-          File.expand_path("~/.local/share/Speckle")
+        case Sketchup.platform
+        when :platform_win then File.join(Dir.home, "AppData/Roaming/Speckle")
+        when :platform_osx then File.join(Dir.home, ".config", "Speckle")
         else
-          # mac
-          File.expand_path("~/.config/Speckle")
+          nil
         end
+
       return speckle_dir if Dir.exist?(speckle_dir)
 
-      raise(IOError, "No Speckle Directory exists. Please read the guide to get Speckle set up on your machine: \nhttps://speckle.guide/user/manager.html")
+      raise(
+        IOError,
+        "No Speckle Directory exists. Please read the guide to get Speckle set up on your machine: \nhttps://speckle.guide/user/manager.html"
+      )
     end
   end
 end

speckle_connector/converter/to_native.rb

@@ -111,8 +111,10 @@ module SpeckleSystems::SpeckleConnector::ToNative
     is_group = false
 
     definition = component_definition_to_native(block["blockDefinition"])
-
-    transform = transform_to_native(block["transform"], block["units"])
+    transform = transform_to_native(
+      block["transform"].is_a?(Hash) ? block["transform"]["value"] : block["transform"],
+      block["units"]
+    )
     instance =
       if is_group
         entities.add_group(definition.entities.to_a)

speckle_connector/converter/to_speckle.rb

@@ -40,7 +40,6 @@ module SpeckleSystems::SpeckleConnector::ToSpeckle
 
   def component_instance_to_speckle(instance, is_group: false)
     transform = instance.transformation
-    origin = transform.origin
     {
       speckle_type: "Objects.Other.BlockInstance",
       applicationId: instance.guid,
@@ -50,17 +49,19 @@ module SpeckleSystems::SpeckleConnector::ToSpeckle
       name: instance.name,
       renderMaterial: instance.material.nil? ? nil : material_to_speckle(instance.material),
       transform: transform_to_speckle(transform),
-      insertionPoint: speckle_point(origin[0], origin[1], origin[2]),
       "@blockDefinition" => component_definition_to_speckle(instance.definition)
     }
   end
 
   def group_mesh_to_speckle(component_def)
     mat_groups = {}
+    nested_blocks = []
 
-    component_def.entities.each do |face|
-      next unless face.typename == "Face"
+    component_def.entities.each do |entity|
+      nested_blocks.push(component_instance_to_speckle(entity)) if entity.typename == "ComponentInstance"
+      next unless entity.typename == "Face"
 
+      face = entity
       # convert material
       mat_id = face.material.nil? ? "none" : face.material.entityID
       mat_groups[mat_id] = initialise_group_mesh(face, component_def.bounds) unless mat_groups.key?(mat_id)
@@ -76,29 +77,33 @@ module SpeckleSystems::SpeckleConnector::ToSpeckle
     end
 
     mat_groups.values.map { |group| group.delete(:pt_count) }
-    mat_groups.values
+    mat_groups.values + nested_blocks
   end
 
   def transform_to_speckle(transform)
     t_arr = transform.to_a
-    [
-      t_arr[0],
-      t_arr[4],
-      t_arr[8],
-      length_to_speckle(t_arr[12]),
-      t_arr[1],
-      t_arr[5],
-      t_arr[9],
-      length_to_speckle(t_arr[13]),
-      t_arr[2],
-      t_arr[6],
-      t_arr[10],
-      length_to_speckle(t_arr[14]),
-      t_arr[3],
-      t_arr[7],
-      t_arr[11],
-      t_arr[15]
-    ]
+    {
+      speckle_type: "Objects.Other.Transform",
+      units: @units,
+      value: [
+        t_arr[0],
+        t_arr[4],
+        t_arr[8],
+        length_to_speckle(t_arr[12]),
+        t_arr[1],
+        t_arr[5],
+        t_arr[9],
+        length_to_speckle(t_arr[13]),
+        t_arr[2],
+        t_arr[6],
+        t_arr[10],
+        length_to_speckle(t_arr[14]),
+        t_arr[3],
+        t_arr[7],
+        t_arr[11],
+        t_arr[15]
+      ]
+    }
   end
 
   def initialise_group_mesh(face, bounds)

speckle_connector/dialog.rb

@@ -81,10 +81,12 @@ module SpeckleSystems::SpeckleConnector
   end
 
   def self.init_local_accounts
+    puts("Initialisation of Speckle accounts requested by plugin")
     @dialog.execute_script("loadAccounts(#{Accounts.load_accounts.to_json}, #{Accounts.get_suuid.to_json})")
   end
 
   def self.reload_accounts
+    puts("Reload of Speckle accounts requested by plugin")
     @dialog.execute_script("loadAccounts(#{Accounts.load_accounts.to_json})")
   end
 end

ui/package-lock.json

@@ -5,6 +5,7 @@
   "requires": true,
   "packages": {
     "": {
+      "name": "ui",
       "version": "0.1.0",
       "dependencies": {
         "@speckle/objectloader": "^2.1.1",

ui/src/App.vue

@@ -96,6 +96,7 @@ import userQuery from './graphql/user.gql'
 import { onLogin } from './vue-apollo'
 
 global.loadAccounts = function (accounts, suuid) {
+  console.log('>>> SpeckleSketchup: Loading accounts', accounts, `suuid: ${suuid}`)
   localStorage.setItem('localAccounts', JSON.stringify(accounts))
   if (suuid) {
     localStorage.setItem('suuid', suuid)

ui/src/components/StreamCard.vue

@@ -15,14 +15,12 @@
           <v-card-text class="transparent elevation-0 mt-0 pt-0" dense>
             <div class="text-caption">
               Updated
-              <timeago :datetime="stream.updatedAt" />
+              <timeago class="mr-1" :datetime="stream.updatedAt" />
+              |
+              <v-icon class="ml-1" small>mdi-account-key-outline</v-icon>
+              {{ stream.role.split(':')[1] }}
             </div>
             <v-toolbar-title>
-              <v-chip v-if="stream.role" small class="mr-1">
-                <v-icon small left>mdi-account-key-outline</v-icon>
-                {{ stream.role.split(':')[1] }}
-              </v-chip>
-
               <v-menu offset-y>
                 <template #activator="{ on, attrs }">
                   <v-chip v-if="stream.branches" small v-bind="attrs" class="mr-1" v-on="on">
@@ -150,13 +148,28 @@
           </v-tooltip>
         </v-col>
       </v-row>
-      <v-progress-linear
-        v-if="(loadingSend || loadingReceive) && loadingStage"
-        height="14"
-        indeterminate
-      >
-        <div class="text-caption">{{ loadingStage }}</div>
-      </v-progress-linear>
+      <transition name="expand">
+        <v-card-text v-if="hover && !$apollo.loading" class="mt-0 pt-0">
+          <transition name="fade">
+            <v-text-field
+              v-model="commitMessage"
+              class="small-text-field"
+              hide-details
+              dense
+              flat
+              label="Commit Message"
+              placeholder="Write your commit message here"
+            ></v-text-field>
+          </transition>
+        </v-card-text>
+        <v-progress-linear
+          v-if="(loadingSend || loadingReceive) && loadingStage"
+          height="14"
+          indeterminate
+        >
+          <div class="text-caption">{{ loadingStage }}</div>
+        </v-progress-linear>
+      </transition>
     </v-card>
   </v-hover>
 </template>
@@ -195,7 +208,8 @@ export default {
       loadingReceive: false,
       loadingStage: null,
       branchName: 'main',
-      commitId: 'latest'
+      commitId: 'latest',
+      commitMessage: null
     }
   },
   apollo: {
@@ -278,19 +292,19 @@ export default {
   },
   mounted() {
     bus.$on(`sketchup-objects-${this.streamId}`, async (objects) => {
-      console.log('received objects from sketchup', objects)
+      console.log('>>> SpeckleSketchUp: Received objects from sketchup')
 
       await this.createCommit(objects)
     })
     bus.$on(`sketchup-received-${this.streamId}`, () => {
-      console.log('finished receiving in sketchup', this.streamId)
+      console.log('>>> SpeckleSketchUp: Finished receiving in sketchup', this.streamId)
       this.loadingReceive = false
       this.loadingStage = null
     })
     bus.$on(`sketchup-fail-${this.streamId}`, () => {
       this.$matomo && this.$matomo.setCustomUrl(`http://connectors/SketchUp/stream/fail`)
       this.$matomo && this.$matomo.trackPageView(`stream/fail`)
-      console.log('sketchup operation failed', this.streamId)
+      console.log('>>> SpeckleSketchUp: operation failed', this.streamId)
       this.loadingReceive = this.loadingSend = false
       this.loadingStage = null
     })
@@ -361,7 +375,7 @@ export default {
       this.$matomo && this.$matomo.setCustomUrl(`http://connectors/SketchUp/send`)
       this.$matomo && this.$matomo.trackPageView(`send`)
       sketchup.send_selection(this.streamId)
-      console.log('request for data sent to sketchup')
+      console.log('>>> SpeckleSketchUp: Objects requested from SketchUp')
       await this.sleep(2000)
     },
     async createCommit(objects) {
@@ -379,16 +393,21 @@ export default {
         this.loadingStage = 'uploading'
         this.loadingSend = true
         let batches = s.batchObjects()
+        const totBatches = batches.length
+        console.log(`>>> SpeckleSketchUp: ${totBatches} batches ready for sending`)
+        let batchesSent = 0
         for (const batch of batches) {
           let res = await this.sendBatch(batch)
           if (res.status !== 201) throw `Upload request failed: ${res}`
+          batchesSent++
+          this.loadingStage = `uploading: ${Math.round((batchesSent / totBatches) * 100)}%`
         }
 
         let commit = {
           streamId: this.streamId,
           branchName: this.branchName,
           objectId: hash,
-          message: 'sent from sketchup',
+          message: this.commitMessage ?? 'sent from sketchup',
           sourceApplication: 'sketchup',
           totalChildrenCount: s.objects[hash].totalChildrenCount
         }
@@ -402,7 +421,7 @@ export default {
             commit: commit
           }
         })
-        console.log('sent to stream: ' + this.streamId, commit)
+        console.log('>>> SpeckleSketchUp: Sent to stream: ' + this.streamId, commit)
 
         this.loadingSend = false
         this.loadingStage = null
@@ -427,7 +446,39 @@ export default {
 }
 </script>
 
-<style>
+<style scoped>
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.2s ease-in;
+}
+.fade-enter,
+.fade-leave-to {
+  opacity: 0;
+}
+
+.expand-enter-active {
+  transition: all 0.2s ease;
+  max-height: 1200px;
+  overflow: hidden;
+}
+.expand-leave-active {
+  transition: all 0.3s ease;
+  max-height: 1200px;
+  overflow: hidden;
+}
+.expand-enter,
+.expand-leave-to {
+  max-height: 0;
+  opacity: 0;
+}
+
+.v-text-field >>> input {
+  font-size: 0.9em;
+}
+.v-text-field >>> label {
+  font-size: 0.9em;
+}
+
 .btn-fix:focus::before {
   opacity: 0 !important;
 }