merge, fix conflicts

CropperBlazor · Aug 3, 2024 · 35e4c7c · 35e4c7c
2 parents ef68b63 + 5535452
commit 35e4c7c
Show file tree

Hide file tree

Showing 9 changed files with 479 additions and 464 deletions.
diff --git a/.github/linters/.stylelintrc.json b/.github/linters/.stylelintrc.json
@@ -17,4 +17,4 @@
     ],
     "media-feature-range-notation": "prefix"
   }
-}
+}
diff --git a/src/Cropper.Blazor/Client/wwwroot/helper.js b/src/Cropper.Blazor/Client/wwwroot/helper.js
@@ -1,53 +1,62 @@
 window.downloadFromUrl = (options) => {
-    const anchorElement = document.createElement('a');
-    anchorElement.href = options.url;
-    anchorElement.download = options.fileName ?? '';
-    anchorElement.click();
-    anchorElement.remove();
+  const anchorElement = document.createElement("a");
+  anchorElement.href = options.url;
+  anchorElement.download = options.fileName ?? "";
+  anchorElement.click();
+  anchorElement.remove();
 };
 
 window.getPolygonImage = (sourceCanvas, path) => {
-    const canvas = document.createElement('canvas');
-    const context = canvas.getContext('2d');
-    const width = sourceCanvas.width,
-        height = sourceCanvas.height;
-
-    canvas.width = width;
-    canvas.height = height;
-    context.imageSmoothingEnabled = true;
-
-    context.beginPath();
-    context.moveTo(path[0] * width / 100, path[1] * height / 100);
-    context.fillStyle = "rgba(255, 255, 255, 0)";
-
-    for (let i = 2; i < path.length; i += 2) {
-        context.lineTo(path[i] * width / 100, path[i + 1] * height / 100);
-    }
-
-    context.closePath();
-    context.clip();
-    context.fill();
-    context.globalCompositeOperation = 'lighter';
-    context.drawImage(sourceCanvas, 0, 0, width, height);
-
-    return canvas.toDataURL("image/png", 1);
-}
+  const canvas = document.createElement("canvas");
+  const context = canvas.getContext("2d");
+  const width = sourceCanvas.width,
+    height = sourceCanvas.height;
+
+  canvas.width = width;
+  canvas.height = height;
+  context.imageSmoothingEnabled = true;
+
+  context.beginPath();
+  context.moveTo((path[0] * width) / 100, (path[1] * height) / 100);
+  context.fillStyle = "rgba(255, 255, 255, 0)";
+
+  for (let i = 2; i < path.length; i += 2) {
+    context.lineTo((path[i] * width) / 100, (path[i + 1] * height) / 100);
+  }
+
+  context.closePath();
+  context.clip();
+  context.fill();
+  context.globalCompositeOperation = "lighter";
+  context.drawImage(sourceCanvas, 0, 0, width, height);
+
+  return canvas.toDataURL("image/png", 1);
+};
 
 window.getEllipseImage = (sourceCanvas) => {
-    const createdCanvas = document.createElement('canvas');
-    const contextCanvas = createdCanvas.getContext('2d');
-    const widthCanvas = sourceCanvas.width,
-        heightCanvas = sourceCanvas.height;
-
-    createdCanvas.width = widthCanvas;
-    createdCanvas.height = heightCanvas;
-    contextCanvas.imageSmoothingEnabled = true;
-
-    contextCanvas.drawImage(sourceCanvas, 0, 0, widthCanvas, heightCanvas);
-    contextCanvas.globalCompositeOperation = 'destination-in';
-    contextCanvas.beginPath();
-    contextCanvas.ellipse(widthCanvas / 2, heightCanvas / 2, widthCanvas / 2, heightCanvas / 2, 0 * Math.PI, 0, 180 * Math.PI, true);
-    contextCanvas.fill();
-
-    return createdCanvas.toDataURL("image/png", 1);
-}
+  const createdCanvas = document.createElement("canvas");
+  const contextCanvas = createdCanvas.getContext("2d");
+  const widthCanvas = sourceCanvas.width,
+    heightCanvas = sourceCanvas.height;
+
+  createdCanvas.width = widthCanvas;
+  createdCanvas.height = heightCanvas;
+  contextCanvas.imageSmoothingEnabled = true;
+
+  contextCanvas.drawImage(sourceCanvas, 0, 0, widthCanvas, heightCanvas);
+  contextCanvas.globalCompositeOperation = "destination-in";
+  contextCanvas.beginPath();
+  contextCanvas.ellipse(
+    widthCanvas / 2,
+    heightCanvas / 2,
+    widthCanvas / 2,
+    heightCanvas / 2,
+    0 * Math.PI,
+    0,
+    180 * Math.PI,
+    true,
+  );
+  contextCanvas.fill();
+
+  return createdCanvas.toDataURL("image/png", 1);
+};
diff --git a/src/Cropper.Blazor/Client/wwwroot/jsObjectModule.js b/src/Cropper.Blazor/Client/wwwroot/jsObjectModule.js
@@ -1,33 +1,33 @@
 class JsObject {
-    getPropertyList(path) {
-        let res = path.replace('[', '.').replace(']', '').split('.');
+  getPropertyList(path) {
+    let res = path.replace("[", ".").replace("]", "").split(".");
 
-        if (res[0] === "") { // if we pass "[0].id" we want to return [0,'id']
-            res.shift();
-        }
-
-        return res;
+    if (res[0] === "") {
+      // if we pass "[0].id" we want to return [0,'id']
+      res.shift();
     }
 
-    getInstanceProperty(instance, propertyPath) {
-
-        if (propertyPath === '') {
-            return instance;
-        }
+    return res;
+  }
 
-        let currentProperty = instance;
-        let splitProperty = this.getPropertyList(propertyPath);
+  getInstanceProperty(instance, propertyPath) {
+    if (propertyPath === "") {
+      return instance;
+    }
 
-        for (let i = 0; i < splitProperty.length; i++) {
-            if (splitProperty[i] in currentProperty) {
-                currentProperty = currentProperty[splitProperty[i]];
-            } else {
-                return null;
-            }
-        }
+    let currentProperty = instance;
+    let splitProperty = this.getPropertyList(propertyPath);
 
-        return currentProperty;
+    for (let i = 0; i < splitProperty.length; i++) {
+      if (splitProperty[i] in currentProperty) {
+        currentProperty = currentProperty[splitProperty[i]];
+      } else {
+        return null;
+      }
     }
+
+    return currentProperty;
+  }
 }
 
 window.jsObject = new JsObject();
diff --git a/src/Cropper.Blazor/Client/wwwroot/overrideCropperJsInteropModule.js b/src/Cropper.Blazor/Client/wwwroot/overrideCropperJsInteropModule.js
@@ -1,15 +1,16 @@
 window.overrideOnZoomCropperEvent = (minZoomRatio, maxZoomRatio) => {
-    window.cropper.onZoom = function (imageObject, event, correlationId) {
-        const jSEventData = this.getJSEventData(event, correlationId);
+  window.cropper.onZoom = function (imageObject, event, correlationId) {
+    const jSEventData = this.getJSEventData(event, correlationId);
 
-        const isApplyPreventZoomMinRatio = (minZoomRatio != null) && (minZoomRatio > event.detail.ratio);
-        const isApplyPreventZoomMaxRatio = (maxZoomRatio != null) && (event.detail.ratio > maxZoomRatio);
+    const isApplyPreventZoomMinRatio =
+      minZoomRatio != null && minZoomRatio > event.detail.ratio;
+    const isApplyPreventZoomMaxRatio =
+      maxZoomRatio != null && event.detail.ratio > maxZoomRatio;
 
-        if (isApplyPreventZoomMinRatio || isApplyPreventZoomMaxRatio) {
-            event.preventDefault();
-        }
-        else {
-            imageObject.invokeMethodAsync('CropperIsZoomed', jSEventData);
-        }
-    };
+    if (isApplyPreventZoomMinRatio || isApplyPreventZoomMaxRatio) {
+      event.preventDefault();
+    } else {
+      imageObject.invokeMethodAsync("CropperIsZoomed", jSEventData);
+    }
+  };
 };
diff --git a/src/Cropper.Blazor/Client/wwwroot/resizeWindowEventListener.js b/src/Cropper.Blazor/Client/wwwroot/resizeWindowEventListener.js
@@ -1,19 +1,23 @@
-let timer
-window.addEventListener('resize', () => {
-    if (!Object.hasOwn(this, 'cropper') || cropper == null || cropper.cropperInstances == null) {
-        return;
-    }
-    let keys = Object.keys(cropper.cropperInstances);
-    clearTimeout(timer);
-    if (keys.length > 0) {
-        keys.forEach((key) => {
-            cropper.cropperInstances[key].disable();
-        });
-        timer = setTimeout(() => {
-            let keys = Object.keys(cropper.cropperInstances);
-            keys.forEach((key) => {
-                cropper.cropperInstances[key].enable();
-            });
-        }, 100);
-    }
-})
+let timer;
+window.addEventListener("resize", () => {
+  if (
+    !Object.hasOwn(this, "cropper") ||
+    cropper == null ||
+    cropper.cropperInstances == null
+  ) {
+    return;
+  }
+  let keys = Object.keys(cropper.cropperInstances);
+  clearTimeout(timer);
+  if (keys.length > 0) {
+    keys.forEach((key) => {
+      cropper.cropperInstances[key].disable();
+    });
+    timer = setTimeout(() => {
+      let keys = Object.keys(cropper.cropperInstances);
+      keys.forEach((key) => {
+        cropper.cropperInstances[key].enable();
+      });
+    }, 100);
+  }
+});
diff --git a/src/Cropper.Blazor/Client/wwwroot/service-worker.js b/src/Cropper.Blazor/Client/wwwroot/service-worker.js
@@ -1,5 +1,4 @@
 // In development, always fetch from the network and do not enable offline support.
 // This is because caching would make development more difficult (changes would not
 // be reflected on the first load after each change).
-self.addEventListener('fetch', () => {
-});
+self.addEventListener("fetch", () => {});
diff --git a/src/Cropper.Blazor/Client/wwwroot/service-worker.published.js b/src/Cropper.Blazor/Client/wwwroot/service-worker.published.js
@@ -1,75 +1,89 @@
 // Caution! Be sure you understand the caveats before publishing an application with
 // offline support. See https://aka.ms/blazor-offline-considerations
 
-self.importScripts('./service-worker-assets.js');
-self.addEventListener('install', event => {
-    event.waitUntil(
-        Promise.all([
-            onInstall(),
-            self.skipWaiting(),
-        ])
-    );
+self.importScripts("./service-worker-assets.js");
+self.addEventListener("install", (event) => {
+  event.waitUntil(Promise.all([onInstall(), self.skipWaiting()]));
 });
-self.addEventListener('activate', event => {
-    event.waitUntil(
-        Promise.all(
-            [
-                onActivate(),
-                self.clients.claim(),
-                self.skipWaiting(),
-            ]
-        )
-            .catch(
-                (err) => {
-                    event.skipWaiting();
-                }
-            )
-    );
+self.addEventListener("activate", (event) => {
+  event.waitUntil(
+    Promise.all([onActivate(), self.clients.claim(), self.skipWaiting()]).catch(
+      (err) => {
+        event.skipWaiting();
+      },
+    ),
+  );
 });
-self.addEventListener('fetch', event => event.respondWith(onFetch(event)));
+self.addEventListener("fetch", (event) => event.respondWith(onFetch(event)));
 
-const cacheNamePrefix = 'offline-cache-';
+const cacheNamePrefix = "offline-cache-";
 const cacheName = `${cacheNamePrefix}${self.assetsManifest.version}`;
-const offlineAssetsInclude = [/\.dll$/, /\.pdb$/, /\.wasm/, /\.html/, /\.js$/, /\.json$/, /\.css$/, /\.woff$/, /\.png$/, /\.jpe?g$/, /\.gif$/, /\.ico$/, /\.blat$/, /\.dat$/];
+const offlineAssetsInclude = [
+  /\.dll$/,
+  /\.pdb$/,
+  /\.wasm/,
+  /\.html/,
+  /\.js$/,
+  /\.json$/,
+  /\.css$/,
+  /\.woff$/,
+  /\.png$/,
+  /\.jpe?g$/,
+  /\.gif$/,
+  /\.ico$/,
+  /\.blat$/,
+  /\.dat$/,
+];
 const offlineAssetsExclude = [/^service-worker\.js$/];
 
 async function onInstall(event) {
-    console.info('Service worker: Install');
+  console.info("Service worker: Install");
 
-    // Fetch and cache all matching items from the assets manifest
-    const assetsRequests = self.assetsManifest.assets
-        .filter(asset => offlineAssetsInclude.some(pattern => pattern.test(asset.url)))
-        .filter(asset => !offlineAssetsExclude.some(pattern => pattern.test(asset.url)))
-        .map(asset => new Request(asset.url, { integrity: asset.hash, cache: 'no-cache' }));
+  // Fetch and cache all matching items from the assets manifest
+  const assetsRequests = self.assetsManifest.assets
+    .filter((asset) =>
+      offlineAssetsInclude.some((pattern) => pattern.test(asset.url)),
+    )
+    .filter(
+      (asset) =>
+        !offlineAssetsExclude.some((pattern) => pattern.test(asset.url)),
+    )
+    .map(
+      (asset) =>
+        new Request(asset.url, { integrity: asset.hash, cache: "no-cache" }),
+    );
 
-    await caches.open(cacheName)
-        .then(cache => cache.addAll(assetsRequests))
-        .then(() => {
-            return self.skipWaiting();
-        });
+  await caches
+    .open(cacheName)
+    .then((cache) => cache.addAll(assetsRequests))
+    .then(() => {
+      return self.skipWaiting();
+    });
 }
 
 async function onActivate(event) {
-    console.info('Service worker: Activate');
+  console.info("Service worker: Activate");
 
-    // Delete unused caches
-    const cacheKeys = await caches.keys();
-    await Promise.all(cacheKeys
-        .filter(key => key.startsWith(cacheNamePrefix) && key !== cacheName)
-        .map(key => caches.delete(key)));
+  // Delete unused caches
+  const cacheKeys = await caches.keys();
+  await Promise.all(
+    cacheKeys
+      .filter((key) => key.startsWith(cacheNamePrefix) && key !== cacheName)
+      .map((key) => caches.delete(key)),
+  );
 }
 
 async function onFetch(event) {
-    let cachedResponse = null;
-    if (event.request.method === 'GET') {
-        // For all navigation requests, try to serve index.html from cache
-        // If you need some URLs to be server-rendered, edit the following check to exclude those URLs
-        const shouldServeIndexHtml = event.request.mode === 'navigate';
+  let cachedResponse = null;
+  if (event.request.method === "GET") {
+    // For all navigation requests, try to serve index.html from cache
+    // If you need some URLs to be server-rendered, edit the following check to exclude those URLs
+    const shouldServeIndexHtml = event.request.mode === "navigate";
 
-        const request = shouldServeIndexHtml ? 'index.html' : event.request;
-        const cache = await caches.open(cacheName);
-        cachedResponse = await cache.match(request);
-    }
+    const request = shouldServeIndexHtml ? "index.html" : event.request;
+    const cache = await caches.open(cacheName);
+    cachedResponse = await cache.match(request);
+  }
 
-    return cachedResponse || fetch(event.request);
+  return cachedResponse || fetch(event.request);
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -17,4 +17,4 @@ @@
         ],
         "media-feature-range-notation": "prefix"
       }
-    }
+    }