diff --git a/packages/dui3/components/header/NavBar.vue b/packages/dui3/components/header/NavBar.vue index bd5f0ac92..097e23e17 100644 --- a/packages/dui3/components/header/NavBar.vue +++ b/packages/dui3/components/header/NavBar.vue @@ -14,10 +14,15 @@ class="hidden md:inline-block" /> --> + + Show Dev Tools + - + diff --git a/packages/dui3/lib/accounts/composables/setup.ts b/packages/dui3/lib/accounts/composables/setup.ts index 275dc4757..3bf7aa86a 100644 --- a/packages/dui3/lib/accounts/composables/setup.ts +++ b/packages/dui3/lib/accounts/composables/setup.ts @@ -5,7 +5,9 @@ import { resolveClientConfig } from '~/lib/core/configs/apollo' import { Account } from '~/types' export type DUIAccount = { + /** account info coming from the host app */ accountInfo: Account + /** the graphql client; a bit superflous */ client: ApolloClient } diff --git a/packages/dui3/plugins/00.bindings.ts b/packages/dui3/plugins/00.bindings.ts new file mode 100644 index 000000000..57b409f7f --- /dev/null +++ b/packages/dui3/plugins/00.bindings.ts @@ -0,0 +1,43 @@ +import { ICefSharp, IWebViev, WebUiBindingType, MockedBindings } from '~/types' + +declare let CefSharp: ICefSharp +declare let chrome: IWebViev +declare let WebUIBinding: WebUiBindingType + +export default defineNuxtPlugin(async () => { + let bindings: WebUiBindingType | undefined = undefined + + try { + if (!CefSharp) throw new Error('No global CefSharp object found.') + await CefSharp.BindObjectAsync('WebUIBinding') + console.info('Bound WebUIBinding object for CefSharp.') + bindings = WebUIBinding + } catch (e) { + console.warn('Failed to bind CefSharp.') + console.warn(e) + } + + try { + if (!chrome.webview) throw new Error('No global Webview2 object found.') + bindings = chrome.webview.hostObjects.WebUIBinding + console.info('Bound WebUIBinding object for Webview2.') + const res = await bindings.sayHi('Test') + console.log(res) + } catch (e) { + console.warn('Failed to bind Webview2.') + console.warn(e) + } + + // TODO: continue falling back for things like sketchup, rhino mac (which would use shitty url hacking scheme stuff) + + if (!bindings) { + console.warn('No bindings found - falling back to mocked bindings.') + bindings = MockedBindings + } + + return { + provide: { + bindings + } + } +}) diff --git a/packages/dui3/plugins/00.cefPlugin.ts b/packages/dui3/plugins/00.cefPlugin.ts index adf676f38..2f852fa86 100644 --- a/packages/dui3/plugins/00.cefPlugin.ts +++ b/packages/dui3/plugins/00.cefPlugin.ts @@ -1,26 +1,23 @@ -import { ICefSharp, WebUiBindingType, MockedBindings } from '~/types' +// import { ICefSharp, WebUiBindingType, MockedBindings } from '~/types' -declare let CefSharp: ICefSharp -declare let WebUIBinding: WebUiBindingType +// declare let CefSharp: ICefSharp +// declare let WebUIBinding: WebUiBindingType export default defineNuxtPlugin(async () => { - let bindings: WebUiBindingType - - try { - if (!CefSharp) throw new Error('No global CefSharp object found.') - await CefSharp.BindObjectAsync('WebUIBinding') - console.info('Bound WebUIBinding object for CefSharp.') - bindings = WebUIBinding - } catch (e) { - console.error('Failed to bind CefSharp, will use mocked bindings.') - console.error(e) - - bindings = MockedBindings - } - - return { - provide: { - bindings - } - } + // let bindings: WebUiBindingType + // try { + // if (!CefSharp) throw new Error('No global CefSharp object found.') + // await CefSharp.BindObjectAsync('WebUIBinding') + // console.info('Bound WebUIBinding object for CefSharp.') + // bindings = WebUIBinding + // } catch (e) { + // console.error('Failed to bind CefSharp, will use mocked bindings.') + // console.error(e) + // bindings = MockedBindings + // } + // return { + // provide: { + // bindings + // } + // } }) diff --git a/packages/dui3/plugins/apollo.ts b/packages/dui3/plugins/apollo.ts index ddf4dcd77..8f9a7dfb0 100644 --- a/packages/dui3/plugins/apollo.ts +++ b/packages/dui3/plugins/apollo.ts @@ -2,32 +2,39 @@ // import { ApolloClients } from '@vue/apollo-composable' // import { resolveClientConfig } from '~/lib/core/configs/apollo' -export default defineNuxtPlugin((nuxtApp) => { - /** - * TODO: You can use `window` here to get credentials for all of the clients - * we need from the parent connectors. The following is just an example - */ - // const { $bindings } = useNuxtApp() - // const apolloClients = { - // latest: new ApolloClient( - // // Imagine endpoint & token is resolved from window or something - // resolveClientConfig({ - // httpEndpoint: 'https://latest.speckle.systems/graphql', - // authToken: () => null - // }) - // ), - // xyz: new ApolloClient( - // // Imagine endpoint & token is resolved from window or something - // resolveClientConfig({ - // httpEndpoint: 'https://speckle.xyz/graphql', - // authToken: () => null - // }) - // ) - // } - // nuxtApp.vueApp.provide(ApolloClients, apolloClients) - // return { - // provide: { - // apolloClients - // } - // } +export default defineNuxtPlugin(() => { + // Note: as accounts can be refreshed at runtime, i tried as an experiment + // moving them to a composable (/lib/accounts/composables/setup.ts) }) + +// export default defineNuxtPlugin((nuxtApp) => { +// /** +// * TODO: You can use `window` here to get credentials for all of the clients +// * we need from the parent connectors. The following is just an example +// */ +// const { $bindings } = useNuxtApp() + +// const apolloClients = { +// latest: new ApolloClient( +// // Imagine endpoint & token is resolved from window or something +// resolveClientConfig({ +// httpEndpoint: 'https://latest.speckle.systems/graphql', +// authToken: () => null +// }) +// ), +// xyz: new ApolloClient( +// // Imagine endpoint & token is resolved from window or something +// resolveClientConfig({ +// httpEndpoint: 'https://speckle.xyz/graphql', +// authToken: () => null +// }) +// ) +// } + +// nuxtApp.vueApp.provide(ApolloClients, apolloClients) +// return { +// provide: { +// apolloClients +// } +// } +// }) diff --git a/packages/dui3/types/index.ts b/packages/dui3/types/index.ts index b637d3f75..6569247e7 100644 --- a/packages/dui3/types/index.ts +++ b/packages/dui3/types/index.ts @@ -21,10 +21,19 @@ export interface ICefSharp { BindObjectAsync: (arg: string) => Promise } +export interface IWebViev { + webview: { + hostObjects: { + WebUIBinding: WebUiBindingType + } + } +} + export type WebUiBindingType = { getAccounts: () => Promise sayHi: (name: string) => Promise getSourceAppName: () => Promise + openDevTools: () => Promise } export const MockedBindings: WebUiBindingType = { @@ -36,5 +45,8 @@ export const MockedBindings: WebUiBindingType = { }, async getSourceAppName() { return 'Mocked App' + }, + async openDevTools() { + console.log('Open it yourself. I am just a set of mocked bindings!!!') } }