image-loader-spinner - npm Package Compare versions

Comparing version 1.1.2 to 1.1.3

dist/index.js

@@ -28,3 +28,3 @@ "use strict";
 var firstInit = true;
-var imageDefaultSize = 50;
+var imageDefaultSize = 100;
 var MutationObserver = window.MutationObserver || window.WebKitMutationObserver;
@@ -94,13 +94,7 @@ var observer = new MutationObserver((mutations) => {
     const spinner_container = document.createElement("div");
-    spinner_container.style.width = spinner_container_size + defaultUnit.toString();
-    spinner_container.style.height = spinner_container_size + defaultUnit.toString();
-    let spinner_size = { width: spinner_container.clientWidth / 2, height: spinner_container.clientHeight / 2 };
-    if (spinner_size.width > spinner_size.height)
-      spinner_size = { width: spinner_container.clientHeight / 2, height: spinner_container.clientHeight / 2 };
-    else
-      spinner_size = { width: spinner_container.clientWidth / 2, height: spinner_container.clientWidth / 2 };
+    spinner_container.classList.add("spinner_container");
+    spinner_container.style.width = spinner_container_size.width + defaultUnit.width;
+    spinner_container.style.height = spinner_container_size.height + defaultUnit.height;
     const spinner = document.createElement("div");
     spinner.classList.add("spinner");
-    spinner.style.width = spinner_size + "px";
-    spinner.style.height = spinner_size + "px";
     spinner_container.appendChild(spinner);
@@ -115,2 +109,9 @@ if (image.style.display == "none")
     parentElement.insertBefore(spinner_container, image);
+    let spinner_size = { width: spinner_container.clientWidth / 2, height: spinner_container.clientHeight / 2 };
+    if (spinner_size.width > spinner_size.height)
+      spinner_size = { width: spinner_container.clientHeight / 2, height: spinner_container.clientHeight / 2 };
+    else
+      spinner_size = { width: spinner_container.clientWidth / 2, height: spinner_container.clientWidth / 2 };
+    spinner.style.width = spinner_size.width + "px";
+    spinner.style.height = spinner_size.height + "px";
     image.addEventListener("load", imageLoaded);
@@ -117,0 +118,0 @@ image.addEventListener("error", imageError);

package.json

 {
   "name": "image-loader-spinner",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "description": "Use a spinner until your images are completely loaded in the DOM",
@@ -5,0 +5,0 @@ "main": "./dist/index.js",

README.md

@@ -18,3 +18,3 @@
 // first argument is an default image src error (default is null)
-// second argument is the default size of loading container in pixel (default is 50)
+// second argument is the default size of loading container in pixel (default is 100)
 ImageLoader('assets/images/errorLoad.png', 150);
@@ -65,3 +65,3 @@ ```
         <div class="insideDiv">
-            <img src="assets/images/image.png" spinner="true" widthSize="50px" heightSize="200px" /> <!-- Show spinner container with widthSize 50px, heightSize 200px -->
+            <img src="assets/images/image.png" spinner="true" widthSize="50%" heightSize="200px" /> <!-- Show spinner container with widthSize 50px, heightSize 200px -->
         </div>
@@ -68,0 +68,0 @@ </body>

No alert changes

Improved metrics

Total package byte prevSize

34509

increased by1.18%

Lines of code

280

increased by0.72%

No dependency changes