Fixed some Bug

- Now the scroll function works properly;
- Edited the content of the footer;

content.js

@@ -10,6 +10,8 @@ var verifiedElements = [];
 $(window).on("load", () => {
 	console.log("Esecuzione Content Script");
 
+	// createDB();
+
 	chrome.runtime.sendMessage({
 		message: "content__retrieve",
 		payload: "textComparison",
@@ -40,8 +42,9 @@ $(window).on("load", () => {
 		}
 		if (request.message.includes("scrollTo")) {
 			pos = request.payload;
-			console.log(verifiedElements[pos]);
-			verifiedElements[pos].scrollIntoView();
+			if (pos > 0) {
+				verifiedElements[pos - 1].scrollIntoView();
+			}
 		}
 	});
 

main.html

@@ -38,7 +38,8 @@ <h6 class="title">Dark Pattern<br />Identifier</h6>
 					<div class="list__index"># out of #</div>
 					<a href="" id="list__inc"> > </a>
 				</div>
-				<a href="" id="DP_Type" onclick="event.preventDefault();">Type</a>
+				<p id="DP_Type">Hidden Information</p>
+				<!-- <a href="" id="DP_Type" onclick="event.preventDefault();">Type</a> -->
 				<div class="CUR__WSContainer center">
 					<hr class="solid" />
 					<p id="CUR__Website" class="center">https://example.com/</p>
@@ -49,9 +50,10 @@ <h6 class="title">Dark Pattern<br />Identifier</h6>
 		<div class="footer">
 			<!-- TODO Modificare contenuto footer -->
 			<p class="footer__text center">
-				Lorem Ipsum is simply dummy text of the printing and typesetting
-				industry. Lorem Ipsum has been the industry's standard dummy text ever
-				since the 1500s, when an unknown printer took a galley of type and
+				Dark Pattern Identifier is an Extension created by Carmine Calabrese and
+				Mario Lezzi that identifies Dark pattern within a Web Page. The
+				extension is developed to identifies two type of dark pattern: "Hidden
+				Information" and "Bait and Switch".
 			</p>
 		</div>
 

popup.js

@@ -10,13 +10,15 @@ const listContent = $(".list__index");
 const listDecrement = $("#list__dec");
 const listIncrement = $("#list__inc");
 const switchStatus = $("#switch__status");
+const darkPattern_Type = $("#DP_Type");
+const currentWebsite = $("#CUR__Website");
 
 let currentIndex = 1;
 let maxIndex = 1;
 
 //Retrieving all the elements of DB at the start
 retrieveAllDatabase();
-testPrint();
+updateTextList();
 
 //Updating Database when switch change status
 switchStatus.on("change", () => {
@@ -64,18 +66,9 @@ chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
 	}
 });
 
-//Update Current Site URL
-chrome.tabs.query({ active: true, lastFocusedWindow: true }, (tabs) => {
-	let url = tabs[0].url;
-	var page = url.substring(0, url.indexOf("/", 9) + 1);
-	console.log(url);
-	console.log(page);
-	$("#CUR__Website").text(page);
-});
-
 // Functions for the list management
 function updateCounterList(numDarkPatternIdentified) {
-	if (numDarkPatternIdentified > 0) {
+	if (numDarkPatternIdentified >= 0) {
 		maxIndex = numDarkPatternIdentified;
 		currentIndex = 0;
 		updateTextList();
@@ -88,7 +81,7 @@ function nextItemList() {
 	//Send a message to content to change focus
 	if (switchStatus.is(":checked")) {
 		if (currentIndex + 1 > maxIndex) {
-			currentIndex = 1;
+			currentIndex = 0;
 		} else {
 			currentIndex = currentIndex + 1;
 		}
@@ -106,7 +99,7 @@ function previousItemList() {
 	//Click (<): Change Focus on the object
 	//Send a message to content to change focus
 	if (switchStatus.is(":checked")) {
-		if (currentIndex - 1 <= 0) {
+		if (currentIndex - 1 < 0) {
 			currentIndex = maxIndex;
 		} else {
 			currentIndex = currentIndex - 1;
@@ -123,8 +116,20 @@ function updateTextList() {
 	if (switchStatus.is(":checked")) {
 		let newString = currentIndex + " out of " + maxIndex;
 		listContent.text(newString);
+		darkPattern_Type.text("Hidden Information");
+
+		//Update Current Site URL
+		chrome.tabs.query({ active: true, lastFocusedWindow: true }, (tabs) => {
+			let url = tabs[0].url;
+			var page = url.substring(0, url.indexOf("/", 9) + 1);
+			console.log(url);
+			console.log(page);
+			currentWebsite.text(page);
+		});
 	} else {
 		listContent.text("Activate Switch to track DP");
+		darkPattern_Type.text(" ");
+		currentWebsite.text("...");
 	}
 }
 

style.css

@@ -108,9 +108,9 @@ body{
 
 /* FOOTER SECTION */
 .footer{
-    border: 2px solid purple;
+    /* border: 2px solid purple; */
     height: 20%;
-    margin-top: 1em;
+    margin-top: 1.4em;
 }
 
 .footer__text{