summaryrefslogtreecommitdiff
path: root/plugins/vue/plugin.js
diff options
context:
space:
mode:
Diffstat (limited to 'plugins/vue/plugin.js')
-rw-r--r--plugins/vue/plugin.js76
1 files changed, 0 insertions, 76 deletions
diff --git a/plugins/vue/plugin.js b/plugins/vue/plugin.js
deleted file mode 100644
index f04098e..0000000
--- a/plugins/vue/plugin.js
+++ /dev/null
@@ -1,76 +0,0 @@
-import { ref, reactive } from 'vue'
-import Graffiti from '../../graffiti.js'
-
-export default {
- install(app, options) {
-
- const graffitiURL = options && 'url' in options?
- options.url : 'https://graffiti.garden'
-
- // Initialize graffiti with reactive entries
- const graffiti = new Graffiti(graffitiURL, ()=>reactive({}))
-
- // Create a reactive variable that
- // tracks connection state
- const connectionState = ref(false)
- ;(function waitForState(state) {
- graffiti.connectionState(state).then(()=> {
- connectionState.value = state
- waitForState(!state)
- })})(true)
- Object.defineProperty(app.config.globalProperties, "$graffitiConnected", {
- get: ()=> connectionState.value
- })
-
- // Latch on to the graffiti ID
- // when the connection state first becomes true
- let myID = null
- Object.defineProperty(app.config.globalProperties, "$graffitiMyID", {
- get: ()=> {
- if (connectionState.value) myID = graffiti.myID
- return myID
- }
- })
-
- // Add static functions
- for (const key of ['toggleLogIn', 'update', 'myTags', 'objectByKey']) {
- const vueKey = '$graffiti' + key.charAt(0).toUpperCase() + key.slice(1)
- app.config.globalProperties[vueKey] = graffiti[key].bind(graffiti)
- }
-
- // A component for subscribing and
- // unsubscribing to tags that returns
- // a reactive array of the results
- app.component('GraffitiObjects', {
-
- props: ['tags'],
-
- watch: {
- tags: {
- async handler(newTags, oldTags=[]) {
- // Subscribe to the new tags
- await graffiti.subscribe(...newTags)
- // Unsubscribe to the existing tags
- await graffiti.unsubscribe(...oldTags)
- },
- immediate: true,
- deep: true
- }
- },
-
- // Handle unmounting too
- unmount() {
- graffiti.unsubscribe(this.tags)
- },
-
- computed: {
- objects() {
- return graffiti.objects(...this.tags)
- }
- },
-
- template: '<slot :objects="objects"></slot>'
- })
-
- }
-}