From 56139e218d7bf2dd5b3d7210f13707d62db73f77 Mon Sep 17 00:00:00 2001
From: michivonah <info@michivonah.ch>
Date: Sun, 17 Nov 2024 21:29:24 +0100
Subject: [PATCH] fix wrong file names #5 & wording improvements, work on
 better screenshot positioning

---
 chrome/background.js |  9 ++++++---
 chrome/content.js    | 12 ++++++------
 chrome/manifest.json |  2 +-
 3 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/chrome/background.js b/chrome/background.js
index ca23490..f66e562 100644
--- a/chrome/background.js
+++ b/chrome/background.js
@@ -31,8 +31,8 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
         case "saveStep":
             try{
                 const step = {
-                    "label":message.stepLabel,
-                    "description":"Short description of the step",
+                    "label":`Click "${message.stepLabel}"`,
+                    "description":`Here you can write anything you need to know about when clicking on "${message.stepLabel}".`,
                     "action":message.triggerName,
                     "element":message.stepElement,
                     "image":message.image,
@@ -48,7 +48,10 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
             try{
                 let filename = "guide.json";
                 chrome.storage.local.get(["guideTitle", "exportFilename"], (data) => {
-                    if(data.guideTitle) guide.title = `Guide: ${data.guideTitle}`;
+                    if(data.guideTitle){
+                        guide.title = `Guide: ${data.guideTitle}`;
+                        guide.description = `A step by step guide about how to use ${data.guideTitle}.`;
+                    }
                     if(data.exportFilename) filename = `guide-${data.exportFilename}.json`;
                     guide.steps = steps;
                     return sendResponse({ success: true, guide: guide, filename: filename });
diff --git a/chrome/content.js b/chrome/content.js
index 2bfb56c..b522cc0 100644
--- a/chrome/content.js
+++ b/chrome/content.js
@@ -6,7 +6,7 @@ const domainFormatted = window.location.host.replace(/\./g, "-");
 
 // set guide title
 chrome.storage.local.get("guideTitle", (data) => {
-    if(!data.guideTitle){
+    if(!data.guideTitle || data.guideTitle != pageTitle){
         try{
             chrome.storage.local.set({ guideTitle: pageTitle });
             chrome.storage.local.set({ exportFilename: domainFormatted });
@@ -48,7 +48,7 @@ document.addEventListener('click', function(){
                     const pixelPadding = 150;
                     const dpr = window.devicePixelRatio || 1;
 
-                    let parentElement = element.parentNode.parentNode || element.parentNode || element;
+                    let parentElement = element.parentNode || element; // element.parentNode.parentNode || 
 
                     parentElement.scrollIntoView({ behavior: "smooth", block: "center", inline: "center" });
 
@@ -56,8 +56,8 @@ document.addEventListener('click', function(){
                     const viewportWidth = window.innerWidth;
                     const viewportHeight = window.innerHeight;
 
-                    const croppedWidth = Math.min((parentRect.width + pixelPadding) * dpr, viewportWidth * dpr);
-                    const croppedHeight = Math.min((parentRect.height + pixelPadding) * dpr, viewportHeight * dpr);
+                    const croppedWidth = (parentRect.width + pixelPadding) * dpr;
+                    const croppedHeight = (parentRect.height + pixelPadding) * dpr;
 
                     const viewportX = Math.max((parentRect.left - pixelPadding / 2) * dpr, 0);
                     const viewportY = Math.max((parentRect.top - pixelPadding / 2) * dpr, 0);
@@ -77,8 +77,8 @@ document.addEventListener('click', function(){
                     // calculate coordinates of the clicked element
                     const elementStartX = Math.max((rect.left - (parentRect.left - pixelPadding / 2)), 0);
                     const elementStartY = Math.max((rect.top - (parentRect.top - pixelPadding / 2)), 0);
-                    const elementEndX = elementStartX + rect.width;
-                    const elementEndY = elementStartY + rect.height;
+                    const elementEndX = elementStartX + rect.width;// + (pixelPadding / 2);
+                    const elementEndY = elementStartY + rect.height;// + (pixelPadding / 2);
     
                     const croppedDataUrl = canvas.toDataURL("image/jpeg");
                     chrome.runtime.sendMessage({
diff --git a/chrome/manifest.json b/chrome/manifest.json
index fd82dc2..ba542de 100644
--- a/chrome/manifest.json
+++ b/chrome/manifest.json
@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "Cl1ck Gu1de",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "A browser add-on which records the steps clicked on a page and generates a easy to understand guide from it.",
   "permissions": ["scripting", "activeTab", "downloads", "tabs", "storage"],
   "host_permissions": ["<all_urls>"],