30 |
38 |
39 |
40 |
41 |
--------------------------------------------------------------------------------
/deploy.js:
--------------------------------------------------------------------------------
1 | const zipFolder = require("zip-folder");
2 | const fs = require("fs");
3 |
4 | let folder = "dist";
5 | let zipName = "photosint.zip";
6 |
7 | // credentials and IDs from gitlab-ci.yml file (your appropriate config file)
8 | let REFRESH_TOKEN = process.env.REFRESH_TOKEN;
9 | let EXTENSION_ID = process.env.EXTENSION_ID;
10 | let CLIENT_SECRET = process.env.CLIENT_SECRET;
11 | let CLIENT_ID = process.env.CLIENT_ID;
12 |
13 | const webStore = require("chrome-webstore-upload")({
14 | extensionId: EXTENSION_ID,
15 | clientId: CLIENT_ID,
16 | clientSecret: CLIENT_SECRET,
17 | refreshToken: REFRESH_TOKEN,
18 | });
19 |
20 | // zipping the output folder
21 | zipFolder(folder, zipName, function (err) {
22 | if (err) {
23 | console.log("oh no!", err);
24 | process.exit(1);
25 | } else {
26 | console.log(`Successfully Zipped ${folder} and saved as ${zipName}`);
27 | uploadZip(); // on successful zipping, call upload
28 | }
29 | });
30 |
31 | function uploadZip() {
32 | // creating file stream to upload
33 | const extensionSource = fs.createReadStream(`./${zipName}`);
34 |
35 | // upload the zip to webstore
36 | webStore
37 | .uploadExisting(extensionSource)
38 | .then((res) => {
39 | console.log("Successfully uploaded the ZIP");
40 |
41 | // publish the uploaded zip
42 | webStore
43 | .publish()
44 | .then((res) => {
45 | console.log("Successfully published the newer version");
46 | })
47 | .catch((error) => {
48 | console.log(`Error while publishing uploaded extension: ${error}`);
49 | process.exit(1);
50 | });
51 | })
52 | .catch((error) => {
53 | console.log(`Error while uploading ZIP: ${error}`);
54 | process.exit(1);
55 | });
56 | }
57 |
--------------------------------------------------------------------------------
/src/libs/enter-view.min.js:
--------------------------------------------------------------------------------
1 | "use strict";!function(e){"function"==typeof define&&define.amd?define(e):"undefined"!=typeof module&&module.exports?module.exports=e():window.enterView=e.call(this)}(function(){var e=function(e){function n(){E=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.msRequestAnimationFrame||function(e){return setTimeout(e,1e3/60)}}function t(){if(y&&"number"==typeof y){var e=Math.min(Math.max(0,y),1);return F-e*F}return F}function o(){var e=document.documentElement.clientHeight,n=window.innerHeight||0;F=Math.max(e,n)}function r(){L=!1;var e=t();M=M.filter(function(n){var t=n.getBoundingClientRect(),o=t.top,r=t.bottom,i=t.height,s=o
31 |
37 |
32 |
36 |
33 | Photos with EXIF found: 0
34 |
35 |
11 |
`;
29 |
30 | div.innerHTML = card;
31 | return div.firstChild;
32 | }
33 |
34 | export function addMap(imgUrl, exif) {
35 | if (exif["GPSLongitude"]) {
36 | const lat = convertDMSToDD(
37 | exif["GPSLatitude"][0],
38 | exif["GPSLatitude"][1],
39 | exif["GPSLatitude"][2],
40 | exif["GPSLatitudeRef"]
41 | );
42 | const long = convertDMSToDD(
43 | exif["GPSLongitude"][0],
44 | exif["GPSLongitude"][1],
45 | exif["GPSLongitude"][2],
46 | exif["GPSLongitudeRef"]
47 | );
48 | // console.log("GPS", lat, long);
49 | const mapElements = document.querySelectorAll(".map");
50 | for (const mapElement of mapElements) {
51 | const id = mapElement.attributes.getNamedItem("id").value;
52 |
53 | if (id == "map-" + getImageId(imgUrl)) {
54 | mapElement.style = "display: block;";
55 | const mymap = L.map(id).setView([lat, long], 7);
56 | L.tileLayer(
57 | "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}",
58 | {
59 | foo: "bar",
60 | attribution:
61 | '© OpenStreetMap contributors',
62 | }
63 | ).addTo(mymap);
64 |
65 | const marker = L.marker([lat, long]).addTo(mymap);
66 | }
67 | }
68 | }
69 | }
70 |
71 | export function convertDMSToDD(degrees, minutes, seconds, direction) {
72 | var dd = degrees + minutes / 60 + seconds / (60 * 60);
73 |
74 | if (direction == "S" || direction == "W") {
75 | dd = dd * -1;
76 | } // Don't do anything for N or E
77 | return dd;
78 | }
79 |
80 | export function getDomain(url) {
81 | let hostname;
82 | if (url.indexOf("://") > -1) {
83 | hostname = url.split("/")[2];
84 | } else {
85 | hostname = url.split("/")[0];
86 | }
87 | hostname = hostname.split(":")[0];
88 | hostname = hostname.split("?")[0];
89 |
90 | return hostname;
91 | }
92 |
93 | export function getFilename(url) {
94 | try {
95 | const parts = url.split("/");
96 |
97 | if (parts.length > 0) {
98 | const last = parts[parts.length - 1];
99 | return last.split("?")[0];
100 | } else {
101 | return url;
102 | }
103 | } catch (e) {
104 | console.warn(e);
105 | }
106 | }
107 |
108 | export function getImageId(imgUrl) {
109 | return btoa(imgUrl);
110 | }
111 |
112 | export function appendCard(url, exif) {
113 | var card = createCardNode(url, exif);
114 | document.getElementById("images").appendChild(card);
115 | addMap(url, exif);
116 | }
117 |
118 | export function onScan() {
119 | // console.log("scaning...");
120 | const request = { command: "fetchImages" };
121 |
122 | // Send message to content script (dom-watcher):
123 | chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
124 | chrome.tabs.sendMessage(tabs[0].id, request, function (images) {
125 | // console.log("popup got images:", images);
126 | appendImages(images);
127 | });
128 | });
129 | }
130 |
131 | export function appendImages(_images) {
132 | if (_images) {
133 | _images
134 | .filter((i) => {
135 | if (urls.indexOf(i.url) === -1) {
136 | urls.push(i.url);
137 | console.log(
138 | "array",
139 | JSON.parse(JSON.stringify(urls)),
140 | JSON.parse(JSON.stringify(_images))
141 | );
142 | return i;
143 | }
144 | })
145 | .forEach((i) => {
146 | appendCard(i.url, i.metadata);
147 | updateCount();
148 | });
149 | }
150 | }
151 |
152 | export function updateCount() {
153 | document.getElementById("count").innerHTML = urls.length;
154 | }
155 |
156 | /**
157 | * Check for updates every 2 seconds
158 | */
159 | //TODO: find more effective alternative
160 | export function watcher() {
161 | onScan();
162 | setInterval(onScan, 2000);
163 | }
164 | watcher();
165 |
--------------------------------------------------------------------------------
/src/content.js:
--------------------------------------------------------------------------------
1 | class EventEmitter {
2 | constructor() {
3 | this.callbacks = {};
4 | }
5 |
6 | on(event, cb) {
7 | if (!this.callbacks[event]) this.callbacks[event] = [];
8 | this.callbacks[event].push(cb);
9 | }
10 |
11 | emit(event, data) {
12 | let cbs = this.callbacks[event];
13 | if (cbs) {
14 | cbs.forEach((cb) => cb(data));
15 | }
16 | }
17 | }
18 | const target = new EventEmitter();
19 |
20 | // The body node will be observed for mutations
21 | const body = document.getElementsByTagName("body")[0];
22 |
23 | let images = [];
24 |
25 | // Options for the observer (which mutations to observe)
26 | const config = { attributes: true, childList: true, subtree: true };
27 |
28 | // Create an observer instance linked to the callback export function
29 | const observer = new MutationObserver(mutationCallback);
30 |
31 | /**
32 | * Callback export function to execute when mutations are observed
33 | */
34 | export function mutationCallback(mutationsList, observer) {
35 | let shouldCheck = false;
36 |
37 | for (let mutation of mutationsList) {
38 | if (mutation.type === "childList") {
39 | var newElement = mutation.target;
40 | var newImages = newElement.getElementsByTagName("img");
41 | if (newImages.length > 0) {
42 | shouldCheck = true;
43 | break;
44 | }
45 | } else if (mutation.type === "attributes") {
46 | if (
47 | mutation.target.tagName === "IMG" &&
48 | mutation.attributeName === "src"
49 | ) {
50 | checkImage(mutation.target).then(addImage);
51 | }
52 | }
53 | }
54 |
55 | if (shouldCheck) {
56 | scanImages();
57 | shouldCheck = false;
58 | }
59 | }
60 |
61 | /**
62 | * Add image to image urls array
63 | */
64 | export function addImage(image) {
65 | images.push(image);
66 | updateIconNotification();
67 | }
68 |
69 | /**
70 | * Removes duplicate urls from images array
71 | * @returns
72 | */
73 | export function removeDuplicateImages() {
74 | const urls = [];
75 |
76 | return images.filter((i) => {
77 | if (urls.indexOf(i.url) == -1) {
78 | urls.push(i.url);
79 | return i;
80 | }
81 | });
82 | }
83 |
84 | /**
85 | * Send message to background to update notification count
86 | */
87 | export function updateIconNotification() {
88 | let count = removeDuplicateImages().length;
89 | chrome.runtime.sendMessage({ count: String(count) }, function (response) {
90 | // console.log("response from background:", response);
91 | });
92 | }
93 |
94 | /**
95 | * Event that fires when all images are loaded
96 | */
97 | export function eventImagesLoaded() {
98 | return Promise.all(
99 | Array.from(document.images)
100 | .filter((img) => !img.complete)
101 | .map(
102 | (img) =>
103 | new Promise((resolve) => {
104 | img.onload = img.onerror = resolve;
105 | })
106 | )
107 | );
108 | }
109 |
110 | /**
111 | * Handle html image nodes
112 | */
113 | export function scanImages() {
114 | const nodes = document.getElementsByTagName("img");
115 | if (
116 | NodeList.prototype.isPrototypeOf(nodes) ||
117 | HTMLCollection.prototype.isPrototypeOf(nodes)
118 | ) {
119 | for (let image of nodes) {
120 | target.emit("image-found", { node: image });
121 | }
122 | } else if (HTMLElement.prototype.isPrototypeOf(nodes)) {
123 | target.emit("image-found", { node: nodes });
124 | }
125 | }
126 |
127 | export function checkImages(nodes) {
128 | return new Promise((resolve, reject) => {
129 | // console.log("checking nodes", nodes.length);
130 | if (
131 | NodeList.prototype.isPrototypeOf(nodes) ||
132 | HTMLCollection.prototype.isPrototypeOf(nodes)
133 | ) {
134 | // console.log("checking nodes", nodes.length);
135 | for (let image of nodes) {
136 | // extractAndShowExifData(image);
137 | // console.log(image.alt, image.src);
138 | // if (image.src == 'https://s.nbst.gr/files/1/2019/07/2170889-353x221.jpg') {
139 | // console.log('GIANNAKOPOULOS');
140 | // }
141 | checkImage(image).then(resolve);
142 |
143 | // loading(image)
144 | }
145 | } else if (HTMLElement.prototype.isPrototypeOf(nodes)) {
146 | checkImage(nodes).then(resolve);
147 | }
148 | });
149 | }
150 |
151 | export function checkImage(image) {
152 | return new Promise((resolve, reject) => {
153 | if (!image.complete) {
154 | image.addEventListener("load", function () {
155 | // extractAndShowExifData(this);
156 | });
157 | } else {
158 | extractExifData(image).then(resolve);
159 | }
160 | });
161 | }
162 |
163 | export function extractExifData(image) {
164 | // check image if not already has exif
165 | // if (!image.classList.contains('exif_metadata')) {
166 | return new Promise((resolve, reject) => {
167 | try {
168 | EXIF.getData(
169 | image,
170 | function () {
171 | var metadata = EXIF.getAllTags(image);
172 |
173 | if (!isEmpty(metadata)) {
174 | //NOTE: this css is for testing
175 | image.classList.add("exif_metadata");
176 |
177 | if (hasGPSMetadata(metadata)) {
178 | //NOTE: this css is for testing
179 | image.classList.add("gps_metadata");
180 | }
181 |
182 | // TODO: Convert to readable string
183 | // if (metadata["UserComment"]) {
184 | // }
185 |
186 | resolve({ url: image.src, metadata: metadata });
187 | } else {
188 | image.classList.add("no_exif_metadata");
189 | }
190 | },
191 | function (err) {
192 | // console.warn("Exif get data error:", err);
193 | reject(err);
194 | }
195 | );
196 | } catch (e) {
197 | // console.warn("Exif get data error:", e);
198 | reject(e);
199 | }
200 | });
201 |
202 | // }
203 | }
204 |
205 | export function hasGPSMetadata(metadata) {
206 | return (
207 | metadata.hasOwnProperty("GPSAltitude") ||
208 | metadata.hasOwnProperty("GPSAltitudeRef") ||
209 | metadata.hasOwnProperty("GPSDateStamp") ||
210 | metadata.hasOwnProperty("GPSImgDirection") ||
211 | metadata.hasOwnProperty("GPSImgDirectionRef") ||
212 | metadata.hasOwnProperty("GPSInfoIFDPointer") ||
213 | metadata.hasOwnProperty("GPSLatitude") ||
214 | metadata.hasOwnProperty("GPSLatitudeRef") ||
215 | metadata.hasOwnProperty("GPSLongitude") ||
216 | metadata.hasOwnProperty("GPSLongitudeRef") ||
217 | metadata.hasOwnProperty("GPSTimeStamp") ||
218 | metadata.hasOwnProperty("GPSPosition")
219 | );
220 | }
221 |
222 | export function hasCameraMetadata(metadata) {
223 | return metadata.hasOwnProperty("Make") || metadata.hasOwnProperty("Model");
224 | }
225 |
226 | export function hasDateMetadata(metadata) {
227 | return (
228 | metadata.hasOwnProperty("DateTime") ||
229 | metadata.hasOwnProperty("DateTimeDigitized") ||
230 | metadata.hasOwnProperty("DateTimeOriginal")
231 | );
232 | }
233 |
234 | export function hasCopyrightMetadata(metadata) {
235 | return metadata.hasOwnProperty("Copyright");
236 | }
237 |
238 | export function isEmpty(obj) {
239 | return Object.keys(obj).length === 0 && obj.constructor === Object;
240 | }
241 |
242 | /**
243 | * Get requests for images from popup
244 | */
245 | chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
246 | // console.log("got message from popup", request, sender);
247 | scanImages();
248 | sendResponse(images);
249 |
250 | // Note: Returning true is required here!
251 | // ref: http://stackoverflow.com/questions/20077487/chrome-extension-message-passing-response-not-sent
252 | return true;
253 | });
254 |
255 | /**
256 | * Check images when they enter veiwport
257 | */
258 | document.getElementsByTagName("body")[0].addEventListener("load", function () {
259 | enterView({
260 | selector: "img",
261 | enter: function (el) {
262 | // console.log("IMAGE ENTERED");
263 | checkImage(el).then(addImage);
264 | },
265 | exit: function (el) {
266 | // console.log("IMAGE LEFT");
267 | },
268 | });
269 |
270 | /**
271 | * When image with found, check for EXIF and extract, notify background
272 | */
273 |
274 | /**
275 | * After all images are loaded, update notification count
276 | */
277 | eventImagesLoaded().then(() => {
278 | updateIconNotification();
279 | });
280 | });
281 |
282 | target.on("image-found", (event) => {
283 | // console.log("event", event);
284 | checkImage(event.node).then((image) => {
285 | images.push(image);
286 | images = removeDuplicateImages();
287 | updateIconNotification();
288 | });
289 | });
290 |
291 | /**
292 | * observe body for changes (api calls, lazy load)
293 | */
294 | observer.observe(body, config);
295 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | GNU GENERAL PUBLIC LICENSE
2 | Version 3, 29 June 2007
3 |
4 | Copyright (C) 2007 Free Software Foundation, Inc.
12 |
13 | 
14 |
15 |
14 |
16 |
17 |
18 |
19 |
| Domain | ${domain} |
| Filename | ${filename} |
| ${key || ""} | ${JSON.stringify( 23 | exif[key] 24 | )} |