Creating your own app part 2

RickTitulaer · 14 July 2021 15:16

Hi Speckle team,

Part 1 of creating your own app is amazing! Thanks for that!

When is the part 2 coming for the app development guide?

Especially the web viewer + fetching data when clicking on elements. I have seen the documentation on this, but how to link it with part 1 would be amazing if there is some guidance!

Thanks! Best Rick

teocomi · 14 July 2021 19:11

Hey Rick, glad you’ve found it useful!
Alan, who has created that tutorial, is on holiday for a couple of weeks, so you might have to wait a bit for part 2!

In the meantime, I can suggest having a look at the current frontend code that has such functionality:

github.com

specklesystems/speckle-server/blob/82d67f1d9635bb0649793805928218a714fc2b7b/packages/frontend/src/components/Renderer.vue#L164

    
      
            Full screen
          </v-tooltip>
          <v-tooltip top>
            <template #activator="{ on, attrs }">
              <v-btn v-bind="attrs" small @click="showHelp = !showHelp" v-on="on">
                <v-icon small>mdi-help</v-icon>
              </v-btn>
            </template>
            Show viewer help
          </v-tooltip>
          <v-dialog v-model="showObjectDetails" width="500">
            <v-card>
              <v-card-title>Selection Details</v-card-title>
              <v-sheet>
                <div v-if="selectedObjects.length !== 0">
                  <object-simple-viewer
                    v-for="(obj, ind) in selectedObjects"
                    :key="obj.id + ind"
                    :value="obj"
                    :stream-id="$route.params.streamId"
                    :key-name="`Selected Object ${ind + 1}`"

AlanRynne · 14 July 2021 19:18

Yess! Vacation time!!

Anyway, we also made a demo on the AEC Tech hackathon last weekend, and I built a super simple app that uses our viewer package and has the selection and double click events set so you can have a look at that too meanwhile!

You can find the code here: GitHub - specklesystems/aec-tech-presentation
And the live demo app here: Speckle Web Starter
The demo stream we used for this is: Speckle
You’ll have to paste it’s id (ab58d88a61) and you’ll also need a token (you can create it on your profile page in the speckle web app).

It’s an oddly specific demo app, but it should give you a good idea of whats going on. Hope it helps!

RickTitulaer · 30 July 2021 11:17

Thanks @AlanRynne and @teocomi !

Is there also somewhere an example of how to color the speckle objects? (like in v1)

dimitrie · 30 July 2021 11:20

We’re revamping our tutorials and site, but here you go:

The color by automatically in the viewer is not yet in v2 unfortunately

RickTitulaer · 30 July 2021 11:25

WOW! Nice Dimitrie!

But this is v2 right?

dimitrie · 30 July 2021 11:32

Yes! A mesh with vertex colours from grasshopper!

RickTitulaer · 30 July 2021 12:01

Does it only work for meshes? Not for lines?

dimitrie · 30 July 2021 12:10

I’m afraid yes, lines won’t work

RickTitulaer · 30 July 2021 12:45

No problem! I will find another way haha!

And is there a way to toggle on or off layers of geometry? (so that I don’t reinvent the wheel )

Thanks for the links anyways!

RickTitulaer · 18 August 2021 07:45

Hi Dimitrie. Hope you are well!

Is there a way to toggle geometry or layers on/off?

i.e. Sending multiple results, but then being able to toggle between them?

AlanRynne · 18 August 2021 07:50

Hey @RickTitulaer!

Sorry your last comment must have “fallen through the cracks” and it was left unanswered.

I guess you mean being able to receive several different commits from the viewer and then alternate between them?

As far as I am aware (please @dimitrie correct me if I am wrong), there is currently no exposed way of doing this, although it is already on our list of tasks to tackle.

In our AEC Tech presentation demo, we did something similar, but in that case we were fully reloading the entire scene on every change (which is a bit of overkill…)

I cannot give you a timeline for when this will be added to the viewer, but my hope is that it will be soon. It’s been needing some love for a while.

RickTitulaer · 18 August 2021 07:54

Hi Alan! Thanks for that quick response!

That is exactly what I meant (in poor wordings)! This would be an awesome feature! That love would fit really well there! haha

Yea I saw the AEC demo, and tried/used different bits and pieces, but it feels like something everyone could benefit from.

AlanRynne · 18 August 2021 08:00

I agree! It’s definitely coming, along with being able to color objects by category and other fancy stuff! We’ll keep you posted!

RickTitulaer · 18 August 2021 08:02

Awesome! Thanks Alan!

RickTitulaer · 9 September 2021 15:01

Hi Alan!

Hope you are well!

Did ‘soon’ already happen? . Any timeline for us?

Best Rick

AlanRynne · 9 September 2021 15:09

Hi Rick!!

You haven’t missed anything! We (I) haven’t gotten around to doing so yet… can’t believe it’s been 20+ days already!

Part II is still pending the Viewer improvements, which I think we started this week. Once that is set, I’ll get going on writing it.

I’m also working on another nice Speckle app, which is not going to be a tutorial (at least initially) so it won’t be considered “Part II” but would have much of the functionality I wanted to cover in that guide. I’ll be sure to ping you on this thread once we release it

RickTitulaer · 9 September 2021 15:22

Awesome! Very eager to implement part II!