diff --git a/frontend/src/views/files/Preview.vue b/frontend/src/views/files/Preview.vue index 8c70ed8b..4ac6a8b6 100644 --- a/frontend/src/views/files/Preview.vue +++ b/frontend/src/views/files/Preview.vue @@ -7,6 +7,16 @@ {{ name }} + @@ -151,6 +166,7 @@ import throttle from "lodash.throttle"; import HeaderBar from "@/components/header/HeaderBar"; import Action from "@/components/header/Action"; import ExtendedImage from "@/components/files/ExtendedImage"; +import {EXIF} from 'exif-js'; const mediaTypes = ["image", "video", "audio", "blob"]; @@ -175,6 +191,8 @@ export default { autoPlay: false, previousRaw: "", nextRaw: "", + address:'none', + showLocation: false, }; }, computed: { @@ -216,16 +234,69 @@ export default { this.updatePreview(); this.toggleNavigation(); }, + raw: function () { + this.address='none'; + this.getImgLocation(); + }, }, async mounted() { window.addEventListener("keydown", this.key); this.listing = this.oldReq.items; this.updatePreview(); + this.getImgLocation(); }, beforeDestroy() { window.removeEventListener("keydown", this.key); }, methods: { + switchShowLocation(){ + this.showLocation=!this.showLocation; + }, + getImgLocation(){ + this.$nextTick(() => { + if(this.req.type == 'image'){ + let _this = this + EXIF.getData(this.$refs.container,function(){ + const imgLon = EXIF.getTag(this, 'GPSLongitude') + const imgLat = EXIF.getTag(this, 'GPSLatitude') + let lon, lat + if(imgLon && imgLat){ + if(EXIF.getTag(this, 'GPSLongitudeRef')=="E") { + lon = (imgLon[0] + imgLon[1]/60 + imgLon[2]/60/60).toFixed(7); + } else { + lon = -(imgLon[0] + imgLon[1]/60 + imgLon[2]/60/60).toFixed(7); + } + if(EXIF.getTag(this, 'GPSLatitudeRef')=="N") { + lat = (imgLat[0] + imgLat[1]/60 + imgLat[2]/60/60).toFixed(7); + } else { + lat = -(imgLat[0] + imgLat[1]/60 + imgLat[2]/60/60).toFixed(7); + } + + fetch(`https://nominatim.openstreetmap.org/reverse?format=json&lat=${lat}&lon=${lon}&zoom=18&addressdetails=0`) + .then((response) => { + if (response.status === 200) { + return response.json() + } else { + return {} + } + }) + .then((data) => { + if(data.display_name.length==0){ + _this.address = 'none' + } else { + _this.address = data.display_name + } + }) + } else { + _this.address = 'none' + } + }) + } else { + this.address = 'none' + } + }) + }, + deleteFile() { this.$store.commit("showHover", { prompt: "delete", @@ -363,3 +434,17 @@ export default { }, }; +