make unsplash image fit the screen size

Author: gauthamzz

manifest.json

@@ -1,6 +1,6 @@
   {
     "name": "Pelican Facebook",
-    "version": "1.0.1",
+    "version": "1.4.0",
     "manifest_version": 2,
     "description": "Minimal and Focused versison of Facebook!",
     "icons": {
@@ -10,10 +10,7 @@
     },
     "permissions": [
       "tabs",
-      "http://*.google.com/*",
-      "storage",
-      "unlimitedStorage",
-      "contextMenus"
+      "storage"
     ],
     "background": {
       "scripts": [
@@ -38,6 +35,5 @@
           "js/on-off-switch-onload.js"
         ]
       }
-    ],
-    "content_security_policy": "script-src 'self' https://www.google.com https://checkout.google.com; object-src 'self'"
+    ]
   }

style_facebook.js

@@ -2,12 +2,11 @@ let a = 1;
 let k = 1;
 
 var userData = [];
-setInterval(function () {
+setInterval(function() {
   updateBackgroundSettings();
 }, 1000);
 
-
-window.onresize = function () {
+window.onresize = function() {
   autoWidth();
 };
 autoWidth();
@@ -17,81 +16,79 @@ function autoWidth() {
   }
 }
 
-
 function updateBackgroundSettings() {
   if ($("body").hasClass("UIPage_LoggedOut")) return;
-  chrome.extension.sendMessage({ method: "get_vars" }, function (response) {
+  chrome.extension.sendMessage({ method: "get_vars" }, function(response) {
     userData = response.variables.split("~~~");
 
     // Focus Mode
 
-    chrome.storage.local.get(/* String or Array */["onoffswitch"], function (
+    chrome.storage.local.get(/* String or Array */ ["onoffswitch"], function(
       items
     ) {
       if (items.onoffswitch === "true") {
-
         $("._5pcb._dp7._4j3f").css("display", "none");
         $("._2t-f").css("display", "none");
         $(".bottomContent").css("color", "white");
-        $('.home_right_column').css("display", "none");
+        $(".home_right_column").css("display", "none");
 
-        $('.uiFutureSideNav').css("display", "none");
-        $('._64b').css("display", "none");
-        //Display Quotes begin 
+        $(".uiFutureSideNav").css("display", "none");
+        $("._64b").css("display", "none");
+        //Display Quotes begin
         if (a === 1) {
           let quote = "Be yourself; everyone else is already taken.";
           let author = " Oscar Wilde";
-          $(function () {
+          $(function() {
             if (k === 1) {
               var baseUrl = "https://talaikis.com/api/quotes/random/";
               $.ajax({
                 url: baseUrl,
-                type: 'GET',
-                dataType: 'json',
-                success: function (res) {
+                type: "GET",
+                dataType: "json",
+                success: function(res) {
                   // console.log(res.quote);
                   // console.log(res.author);
                   quote = res.quote;
                   author = res.author;
-
+                  // let height =   $(window).height();
+                  // console.log(height)
+                  // let width =   $(window).height();
 
                   $("body").css("overflow", "hidden");
                   $("#contentArea").css("z-index", "200");
 
-                  $('#bottomContent').html("\
-                    <table >  \<tr>\<td></td>\
-          <td rowspan=2><img src='https://source.unsplash.com/random/1500x800/?nature,night' \
-          style='margin-left:-300px;margin-top:-180px;z-index:-1;\
-\
+                  $("#bottomContent").html(
+                    "\
+                    <table >  <tr><td></td>\
+          <td rowspan=2><img src='https://source.unsplash.com/random/" +
+                      screen.width +"x" +screen.height +
+                      "/?nature,night' \
+          style='margin-top:-180px;margin-left:-350px;z-index:-1;\
           '></td> \
         </tr >  \
                     <tr>\
           <td colspan=2 > <p style='margin-top:-400px;font-size:36px; \
           font-weight:900;text-transform:uppercase;color:white ; \
           line-height:55px;margin-left:-200px;max-width:800px;\
-          word-wrap:break-word;'>"+ quote + "</p></td>\
+          word-wrap:break-word;'>" +
+                      quote +
+                      "</p></td>\
         </tr>  \
-      </table > ")
-
-
-
+      </table > "
+                  );
                 }
               });
               k = 2;
-
             }
 
             //Disaply quotes end
             a = 2;
-
           });
         }
-      }
-      else if (items.onoffswitch === "false") {
-
+      } else if (items.onoffswitch === "false") {
         $("._5pcb._dp7._4j3f").css("display", "inline");
         $("._2t-f").css("display", "inline");
-        $('._2s25').css('color', 'white');
+        $("._2s25").css("color", "white");
         if (a === 2) {
           location.reload();
           a = 1;
@@ -101,28 +98,21 @@ function updateBackgroundSettings() {
 
     //minimal mode
 
-    chrome.storage.local.get(/* String or Array */["statusicon"], function (
+    chrome.storage.local.get(/* String or Array */ ["statusicon"], function(
       items
     ) {
       if (items.statusicon === "true") {
-        $('.home_right_column').css("display", "none");
+        $(".home_right_column").css("display", "none");
 
-        $('.fixed_elem').css("display", "none");
-        $('._64b').css("display", "none");
+        $(".fixed_elem").css("display", "none");
+        $("._64b").css("display", "none");
 
         updateBackgroundSettings();
-
-      }
-      else if (items.statusicon === "false") {
-
+      } else if (items.statusicon === "false") {
         //when its not minimal mode (didnt decide what to do here )
       }
     });
-
-
   });
 }
 
-
-
-updateBackgroundSettings();
+updateBackgroundSettings();