Skip to content

Commit f037f4d

Browse files
positivecrashpositivecrash
authored
Merge pull request #163 from zirreal/master
fixed bookmarks + added copy button
2 parents 9b156b5 + 4aa23e3 commit f037f4d

File tree

4 files changed

+215
-86
lines changed

4 files changed

+215
-86
lines changed

‎package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,8 @@
1010
},
1111
"dependencies": {
1212
"@chainsafe/libp2p-noise": "^13.0.1",
13-
"@fortawesome/fontawesome-svg-core": "^6.2.0",
14-
"@fortawesome/free-solid-svg-icons": "^6.2.0",
13+
"@fortawesome/fontawesome-svg-core": "^6.7.2",
14+
"@fortawesome/free-solid-svg-icons": "^6.7.2",
1515
"@fortawesome/vue-fontawesome": "^3.0.1",
1616
"@kyvg/vue3-notification": "^2.9.1",
1717
"@libp2p/bootstrap": "^9.0.6",

‎src/components/sensor/Bookmark.vue

Lines changed: 70 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,19 @@
11
<template>
22
<form class="flexline" @submit.prevent="addbookmark">
3-
<input type="text" v-model="bookmarkname" :placeholder="$t('sensorpopup.bookmarkplaceholder')" @input="IsBookmarked = false" />
4-
<button :class="buttonclasses" :disabled="IsBookmarked" :area-label="$t('sensorpopup.bookmarkbutton')">
5-
<template v-if="!IsBookmarked"><font-awesome-icon icon="fa-solid fa-bookmark" /></template>
3+
<input
4+
type="text"
5+
v-model="bookmarkname"
6+
:placeholder="$t('sensorpopup.bookmarkplaceholder')"
7+
@input="IsBookmarked = false"
8+
/>
9+
<button
10+
:class="buttonclasses"
11+
:disabled="IsBookmarked"
12+
:area-label="$t('sensorpopup.bookmarkbutton')"
13+
>
14+
<template v-if="!IsBookmarked"
15+
><font-awesome-icon icon="fa-solid fa-bookmark"
16+
/></template>
617
<template v-else><font-awesome-icon icon="fa-solid fa-check" /></template>
718
</button>
819
</form>
@@ -13,7 +24,7 @@ import { useStore } from "@/store";
1324
import { IDBgettable, IDBworkflow } from "../../idb";
1425
1526
export default {
16-
props: ["address", "link", "geo"],
27+
props: ["address", "link", "geo", "id"],
1728
1829
data() {
1930
return {
@@ -33,77 +44,93 @@ export default {
3344
[`button-green`]: this.IsBookmarked,
3445
// [`flexline`]: true,
3546
};
36-
}
47+
},
3748
},
3849
3950
methods: {
40-
4151
async findbookmark() {
42-
const bookmarks = await IDBgettable(this.store.idbBookmarkDbname, this.store.idbBookmarkVDbver, this.store.idbBookmarkVDbtable)
43-
return bookmarks.find(bookmark => bookmark.address === this.$props.address)
52+
const bookmarks = await IDBgettable(
53+
this.store.idbBookmarkDbname,
54+
this.store.idbBookmarkVDbver,
55+
this.store.idbBookmarkVDbtable
56+
);
57+
return bookmarks.find((bookmark) => bookmark.id === this.$props.id);
4458
},
4559
4660
async addbookmark() {
47-
4861
const bookmark = await this.findbookmark();
4962
50-
if(bookmark) {
51-
if(this.bookmarkid) {
52-
53-
IDBworkflow(this.store.idbBookmarkDbname, this.store.idbBookmarkVDbver, this.store.idbBookmarkVDbtable, 'readwrite', store => {
54-
const request = store.get(this.bookmarkid);
55-
56-
request.addEventListener('error', e => {
57-
console.log(e)
58-
})
63+
if (bookmark) {
64+
if (this.bookmarkid) {
65+
IDBworkflow(
66+
this.store.idbBookmarkDbname,
67+
this.store.idbBookmarkVDbver,
68+
this.store.idbBookmarkVDbtable,
69+
"readwrite",
70+
(store) => {
71+
const request = store.get(this.bookmarkid);
72+
73+
request.addEventListener("error", (e) => {
74+
console.log(e);
75+
});
5976
60-
request.addEventListener('success', e => {
61-
const data = e.target.result;
62-
data.customName = this.bookmarkname;
63-
const requestUpdate = store.put(data);
77+
request.addEventListener("success", (e) => {
78+
const data = e.target.result;
79+
data.customName = this.bookmarkname;
80+
const requestUpdate = store.put(data);
6481
65-
requestUpdate.addEventListener('error', e => {
66-
console.log(e)
67-
})
82+
requestUpdate.addEventListener("error", (e) => {
83+
console.log(e);
84+
});
6885
69-
requestUpdate.addEventListener('success', e => {
70-
this.IsBookmarked = true
71-
})
72-
})
73-
})
86+
requestUpdate.addEventListener("success", (e) => {
87+
this.IsBookmarked = true;
88+
});
89+
});
90+
}
91+
);
7492
}
7593
} else {
76-
IDBworkflow(this.store.idbBookmarkDbname, this.store.idbBookmarkVDbver, this.store.idbBookmarkVDbtable, 'readwrite', store => {
94+
IDBworkflow(
95+
this.store.idbBookmarkDbname,
96+
this.store.idbBookmarkVDbver,
97+
this.store.idbBookmarkVDbtable,
98+
"readwrite",
99+
(store) => {
77100
store.add({
78101
customName: this.bookmarkname,
102+
id: this.$props.id,
79103
address: this.$props.address,
80104
link: this.$props.link,
81-
geo: JSON.stringify(this.$props.geo)
105+
geo: JSON.stringify(this.$props.geo),
82106
});
83107
this.IsBookmarked = true;
84-
})
85-
}
108+
}
109+
);
110+
}
86111
87-
const bc = new BroadcastChannel(this.store.idbWatcherBroadcast)
88-
bc.postMessage(this.store.idbBookmarkVDbtable)
89-
bc.close()
112+
const bc = new BroadcastChannel(this.store.idbWatcherBroadcast);
113+
bc.postMessage(this.store.idbBookmarkVDbtable);
114+
bc.close();
90115
},
91116
},
92117
93118
async mounted() {
94119
const bookmark = await this.findbookmark();
95-
if(bookmark) {
120+
if (bookmark) {
96121
this.IsBookmarked = true;
97122
this.bookmarkid = bookmark.id;
98123
this.bookmarkname = bookmark.customName;
99124
}
100-
}
101-
}
125+
126+
console.log(this.$props);
127+
},
128+
};
102129
</script>
103130

104131
<style scoped>
105132
button {
106-
padding-right: calc(var(--app-inputpadding)*2);
107-
padding-left: calc(var(--app-inputpadding)*2);
133+
padding-right: calc(var(--app-inputpadding) * 2);
134+
padding-left: calc(var(--app-inputpadding) * 2);
108135
}
109-
</style>
136+
</style>

0 commit comments

Comments
 (0)