apexify.js 5.1.1 → 5.2.0

package/lib/Canvas/utils/General/imageCompression.ts

@@ -1,316 +0,0 @@
-import sharp from 'sharp';
-import path from 'path';
-import { CompressionOptions, PaletteOptions } from '../types';
-
-/**
- * Compresses an image with quality control
- * @param image - Image source (path, URL, or Buffer)
- * @param options - Compression options
- * @returns Compressed image buffer
- */
-export async function compressImage(
-  image: string | Buffer,
-  options: CompressionOptions = {}
-): Promise<Buffer> {
-  const {
-    quality = 90,
-    format = 'jpeg',
-    maxWidth,
-    maxHeight,
-    progressive = false
-  } = options;
-
-  let sharpImage: sharp.Sharp;
-
-  if (Buffer.isBuffer(image)) {
-    sharpImage = sharp(image);
-  } else if (typeof image === 'string' && image.startsWith('http')) {
-    const response = await fetch(image);
-    const buffer = await response.arrayBuffer();
-    sharpImage = sharp(Buffer.from(buffer));
-  } else {
-    const imagePath = path.join(process.cwd(), image);
-    sharpImage = sharp(imagePath);
-  }
-
-  // Resize if needed
-  if (maxWidth || maxHeight) {
-    sharpImage = sharpImage.resize(maxWidth, maxHeight, {
-      fit: 'inside',
-      withoutEnlargement: true
-    });
-  }
-
-  // Convert and compress
-  switch (format) {
-    case 'jpeg':
-      return await sharpImage
-        .jpeg({ quality, progressive })
-        .toBuffer();
-        
-    case 'webp':
-      return await sharpImage
-        .webp({ quality })
-        .toBuffer();
-        
-    case 'avif':
-      return await sharpImage
-        .avif({ quality })
-        .toBuffer();
-        
-    default:
-      return await sharpImage
-        .jpeg({ quality, progressive })
-        .toBuffer();
-  }
-}
-
-/**
- * Extracts color palette from an image
- * @param image - Image source (path, URL, or Buffer)
- * @param options - Palette extraction options
- * @returns Array of colors with percentages
- */
-export async function extractPalette(
-  image: string | Buffer,
-  options: PaletteOptions = {}
-): Promise<Array<{ color: string; percentage: number }>> {
-  const {
-    count = 10,
-    method = 'kmeans',
-    format = 'hex'
-  } = options;
-
-  let sharpImage: sharp.Sharp;
-
-  if (Buffer.isBuffer(image)) {
-    sharpImage = sharp(image);
-  } else if (typeof image === 'string' && image.startsWith('http')) {
-    const response = await fetch(image);
-    const buffer = await response.arrayBuffer();
-    sharpImage = sharp(Buffer.from(buffer));
-  } else {
-    const imagePath = path.join(process.cwd(), image);
-    sharpImage = sharp(imagePath);
-  }
-
-  // Resize for faster processing
-  const { data, info } = await sharpImage
-    .resize(200, 200, { fit: 'inside' })
-    .raw()
-    .toBuffer({ resolveWithObject: true });
-
-  const pixels: Array<{ r: number; g: number; b: number }> = [];
-  for (let i = 0; i < data.length; i += info.channels) {
-    pixels.push({
-      r: data[i],
-      g: data[i + 1],
-      b: data[i + 2]
-    });
-  }
-
-  // Extract colors based on method
-  let colors: Array<{ r: number; g: number; b: number; count: number }> = [];
-
-  if (method === 'median-cut') {
-    colors = medianCut(pixels, count);
-  } else if (method === 'octree') {
-    colors = octreeQuantization(pixels, count);
-  } else {
-    // kmeans (default)
-    colors = kmeansClustering(pixels, count);
-  }
-
-  // Convert to requested format and calculate percentages
-  const totalPixels = pixels.length;
-  const palette = colors.map(color => {
-    let colorString: string;
-    
-    if (format === 'hex') {
-      colorString = `#${[color.r, color.g, color.b].map(c => 
-        c.toString(16).padStart(2, '0')
-      ).join('')}`;
-    } else if (format === 'rgb') {
-      colorString = `rgb(${color.r}, ${color.g}, ${color.b})`;
-    } else {
-      // hsl
-      const hsl = rgbToHsl(color.r, color.g, color.b);
-      colorString = `hsl(${hsl.h}, ${hsl.s}%, ${hsl.l}%)`;
-    }
-
-    return {
-      color: colorString,
-      percentage: (color.count / totalPixels) * 100
-    };
-  });
-
-  // Sort by percentage descending
-  return palette.sort((a, b) => b.percentage - a.percentage);
-}
-
-/**
- * K-means clustering for color extraction
- */
-function kmeansClustering(
-  pixels: Array<{ r: number; g: number; b: number }>,
-  k: number
-): Array<{ r: number; g: number; b: number; count: number }> {
-  // Initialize centroids randomly
-  const centroids: Array<{ r: number; g: number; b: number }> = [];
-  for (let i = 0; i < k; i++) {
-    const randomPixel = pixels[Math.floor(Math.random() * pixels.length)];
-    centroids.push({ r: randomPixel.r, g: randomPixel.g, b: randomPixel.b });
-  }
-
-  // Iterate
-  for (let iter = 0; iter < 10; iter++) {
-    const clusters: Array<Array<{ r: number; g: number; b: number }>> = 
-      new Array(k).fill(null).map(() => []);
-
-    // Assign pixels to nearest centroid
-    for (const pixel of pixels) {
-      let minDist = Infinity;
-      let nearestCluster = 0;
-      
-      for (let i = 0; i < centroids.length; i++) {
-        const dist = Math.sqrt(
-          Math.pow(pixel.r - centroids[i].r, 2) +
-          Math.pow(pixel.g - centroids[i].g, 2) +
-          Math.pow(pixel.b - centroids[i].b, 2)
-        );
-        if (dist < minDist) {
-          minDist = dist;
-          nearestCluster = i;
-        }
-      }
-      clusters[nearestCluster].push(pixel);
-    }
-
-    // Update centroids
-    for (let i = 0; i < k; i++) {
-      if (clusters[i].length > 0) {
-        const avgR = clusters[i].reduce((sum, p) => sum + p.r, 0) / clusters[i].length;
-        const avgG = clusters[i].reduce((sum, p) => sum + p.g, 0) / clusters[i].length;
-        const avgB = clusters[i].reduce((sum, p) => sum + p.b, 0) / clusters[i].length;
-        centroids[i] = { r: Math.round(avgR), g: Math.round(avgG), b: Math.round(avgB) };
-      }
-    }
-  }
-
-  // Count pixels in each cluster
-  const counts: number[] = new Array(k).fill(0);
-  for (const pixel of pixels) {
-    let minDist = Infinity;
-    let nearestCluster = 0;
-    
-    for (let i = 0; i < centroids.length; i++) {
-      const dist = Math.sqrt(
-        Math.pow(pixel.r - centroids[i].r, 2) +
-        Math.pow(pixel.g - centroids[i].g, 2) +
-        Math.pow(pixel.b - centroids[i].b, 2)
-      );
-      if (dist < minDist) {
-        minDist = dist;
-        nearestCluster = i;
-      }
-    }
-    counts[nearestCluster]++;
-  }
-
-  return centroids.map((centroid, i) => ({
-    ...centroid,
-    count: counts[i]
-  })).filter(c => c.count > 0);
-}
-
-/**
- * Median cut algorithm for color extraction
- */
-function medianCut(
-  pixels: Array<{ r: number; g: number; b: number }>,
-  count: number
-): Array<{ r: number; g: number; b: number; count: number }> {
-  // Simplified median cut - divide color space
-  const buckets: Array<Array<{ r: number; g: number; b: number }>> = [pixels];
-  
-  while (buckets.length < count && buckets.length < 8) {
-    const largestBucket = buckets.reduce((max, bucket, i) => 
-      bucket.length > buckets[max].length ? i : max, 0
-    );
-    
-    const bucket = buckets[largestBucket];
-    if (bucket.length <= 1) break;
-    
-    // Find color channel with largest range
-    const ranges = {
-      r: Math.max(...bucket.map(p => p.r)) - Math.min(...bucket.map(p => p.r)),
-      g: Math.max(...bucket.map(p => p.g)) - Math.min(...bucket.map(p => p.g)),
-      b: Math.max(...bucket.map(p => p.b)) - Math.min(...bucket.map(p => p.b))
-    };
-    
-    const channel = ranges.r > ranges.g && ranges.r > ranges.b ? 'r' :
-                   ranges.g > ranges.b ? 'g' : 'b';
-    
-    // Sort by channel and split at median
-    bucket.sort((a, b) => a[channel] - b[channel]);
-    const median = Math.floor(bucket.length / 2);
-    
-    buckets.splice(largestBucket, 1, bucket.slice(0, median), bucket.slice(median));
-  }
-
-  // Calculate average color for each bucket
-  return buckets.map(bucket => {
-    const avgR = Math.round(bucket.reduce((sum, p) => sum + p.r, 0) / bucket.length);
-    const avgG = Math.round(bucket.reduce((sum, p) => sum + p.g, 0) / bucket.length);
-    const avgB = Math.round(bucket.reduce((sum, p) => sum + p.b, 0) / bucket.length);
-    return {
-      r: avgR,
-      g: avgG,
-      b: avgB,
-      count: bucket.length
-    };
-  });
-}
-
-/**
- * Octree quantization (simplified)
- */
-function octreeQuantization(
-  pixels: Array<{ r: number; g: number; b: number }>,
-  count: number
-): Array<{ r: number; g: number; b: number; count: number }> {
-  // Simplified octree - use kmeans as fallback
-  return kmeansClustering(pixels, count);
-}
-
-/**
- * Converts RGB to HSL
- */
-function rgbToHsl(r: number, g: number, b: number): { h: number; s: number; l: number } {
-  r /= 255;
-  g /= 255;
-  b /= 255;
-
-  const max = Math.max(r, g, b);
-  const min = Math.min(r, g, b);
-  let h = 0, s = 0;
-  const l = (max + min) / 2;
-
-  if (max !== min) {
-    const d = max - min;
-    s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
-    
-    switch (max) {
-      case r: h = ((g - b) / d + (g < b ? 6 : 0)) / 6; break;
-      case g: h = ((b - r) / d + 2) / 6; break;
-      case b: h = ((r - g) / d + 4) / 6; break;
-    }
-  }
-
-  return {
-    h: Math.round(h * 360),
-    s: Math.round(s * 100),
-    l: Math.round(l * 100)
-  };
-}
-

package/lib/Canvas/utils/General/imageStitching.ts

@@ -1,252 +0,0 @@
-import { createCanvas, loadImage, SKRSContext2D, Image } from '@napi-rs/canvas';
-import path from 'path';
-import fs from 'fs';
-import { StitchOptions, CollageLayout } from '../types';
-
-/**
- * Stitches multiple images together
- * @param images - Array of image sources
- * @param options - Stitching options
- * @returns Stitched image buffer
- */
-export async function stitchImages(
-  images: Array<string | Buffer>,
-  options: StitchOptions = {}
-): Promise<Buffer> {
-  if (!images || images.length === 0) {
-    throw new Error('stitchImages: images array is required');
-  }
-
-  const {
-    direction = 'horizontal',
-    overlap = 0,
-    blend = false,
-    spacing = 0
-  } = options;
-
-  // Load all images
-  const loadedImages: Image[] = [];
-  for (const imgSource of images) {
-    let img: Image;
-    if (Buffer.isBuffer(imgSource)) {
-      img = await loadImage(imgSource);
-    } else if (imgSource.startsWith('http')) {
-      img = await loadImage(imgSource);
-    } else {
-      const imgPath = path.join(process.cwd(), imgSource);
-      img = await loadImage(fs.readFileSync(imgPath));
-    }
-    loadedImages.push(img);
-  }
-
-  if (loadedImages.length === 0) {
-    throw new Error('stitchImages: No valid images loaded');
-  }
-
-  // Calculate canvas dimensions
-  let canvasWidth = 0;
-  let canvasHeight = 0;
-  let maxWidth = 0;
-  let maxHeight = 0;
-
-  for (const img of loadedImages) {
-    maxWidth = Math.max(maxWidth, img.width);
-    maxHeight = Math.max(maxHeight, img.height);
-  }
-
-  if (direction === 'horizontal') {
-    canvasWidth = loadedImages.reduce((sum, img) => sum + img.width, 0);
-    canvasWidth -= overlap * (loadedImages.length - 1);
-    canvasWidth += spacing * (loadedImages.length - 1);
-    canvasHeight = maxHeight;
-  } else if (direction === 'vertical') {
-    canvasWidth = maxWidth;
-    canvasHeight = loadedImages.reduce((sum, img) => sum + img.height, 0);
-    canvasHeight -= overlap * (loadedImages.length - 1);
-    canvasHeight += spacing * (loadedImages.length - 1);
-  } else if (direction === 'grid') {
-    const cols = Math.ceil(Math.sqrt(loadedImages.length));
-    const rows = Math.ceil(loadedImages.length / cols);
-    canvasWidth = maxWidth * cols + spacing * (cols - 1);
-    canvasHeight = maxHeight * rows + spacing * (rows - 1);
-  }
-
-  // Create canvas
-  const canvas = createCanvas(canvasWidth, canvasHeight);
-  const ctx = canvas.getContext('2d') as SKRSContext2D;
-  if (!ctx) throw new Error("Unable to get 2D context");
-
-  // Draw images
-  let currentX = 0;
-  let currentY = 0;
-
-  for (let i = 0; i < loadedImages.length; i++) {
-    const img = loadedImages[i];
-    
-    if (direction === 'horizontal') {
-      if (i > 0) {
-        currentX -= overlap;
-        currentX += spacing;
-      }
-      ctx.drawImage(img, currentX, 0, img.width, img.height);
-      currentX += img.width;
-    } else if (direction === 'vertical') {
-      if (i > 0) {
-        currentY -= overlap;
-        currentY += spacing;
-      }
-      ctx.drawImage(img, 0, currentY, img.width, img.height);
-      currentY += img.height;
-    } else if (direction === 'grid') {
-      const cols = Math.ceil(Math.sqrt(loadedImages.length));
-      const col = i % cols;
-      const row = Math.floor(i / cols);
-      const x = col * (maxWidth + spacing);
-      const y = row * (maxHeight + spacing);
-      ctx.drawImage(img, x, y, img.width, img.height);
-    }
-
-    // Apply blending if enabled and not first image
-    if (blend && i > 0 && overlap > 0) {
-      ctx.globalCompositeOperation = 'multiply';
-      ctx.globalAlpha = 0.5;
-      if (direction === 'horizontal') {
-        ctx.drawImage(img, currentX - img.width - spacing + overlap, 0, img.width, img.height);
-      } else if (direction === 'vertical') {
-        ctx.drawImage(img, 0, currentY - img.height - spacing + overlap, img.width, img.height);
-      }
-      ctx.globalAlpha = 1;
-      ctx.globalCompositeOperation = 'source-over';
-    }
-  }
-
-  return canvas.toBuffer('image/png');
-}
-
-/**
- * Creates an image collage
- * @param images - Array of image sources with optional dimensions
- * @param layout - Collage layout configuration
- * @returns Collage image buffer
- */
-export async function createCollage(
-  images: Array<{ source: string | Buffer; width?: number; height?: number }>,
-  layout: CollageLayout
-): Promise<Buffer> {
-  if (!images || images.length === 0) {
-    throw new Error('createCollage: images array is required');
-  }
-
-  const {
-    type = 'grid',
-    columns = 3,
-    rows = 3,
-    spacing = 10,
-    background = '#ffffff',
-    borderRadius = 0
-  } = layout;
-
-  // Load all images
-  const loadedImages: Array<{ image: Image; width: number; height: number }> = [];
-  for (const imgConfig of images) {
-    let img: Image;
-    if (Buffer.isBuffer(imgConfig.source)) {
-      img = await loadImage(imgConfig.source);
-    } else if (typeof imgConfig.source === 'string' && imgConfig.source.startsWith('http')) {
-      img = await loadImage(imgConfig.source);
-    } else {
-      const imgPath = path.join(process.cwd(), imgConfig.source as string);
-      img = await loadImage(fs.readFileSync(imgPath));
-    }
-    
-    loadedImages.push({
-      image: img,
-      width: imgConfig.width || img.width,
-      height: imgConfig.height || img.height
-    });
-  }
-
-  // Calculate canvas dimensions
-  let canvasWidth = 0;
-  let canvasHeight = 0;
-
-  if (type === 'grid') {
-    const cellWidth = Math.max(...loadedImages.map(img => img.width));
-    const cellHeight = Math.max(...loadedImages.map(img => img.height));
-    canvasWidth = cellWidth * columns + spacing * (columns - 1);
-    canvasHeight = cellHeight * rows + spacing * (rows - 1);
-  } else if (type === 'masonry') {
-    // Masonry layout - columns with varying heights
-    const colWidths: number[] = new Array(columns).fill(0);
-    const colHeights: number[] = new Array(columns).fill(0);
-    
-    for (let i = 0; i < loadedImages.length; i++) {
-      const col = i % columns;
-      colWidths[col] = Math.max(colWidths[col], loadedImages[i].width);
-      colHeights[col] += loadedImages[i].height + (i >= columns ? spacing : 0);
-    }
-    
-    canvasWidth = Math.max(...colWidths) * columns + spacing * (columns - 1);
-    canvasHeight = Math.max(...colHeights);
-  } else if (type === 'carousel') {
-    // Horizontal carousel
-    canvasWidth = loadedImages.reduce((sum, img) => sum + img.width, 0) + spacing * (loadedImages.length - 1);
-    canvasHeight = Math.max(...loadedImages.map(img => img.height));
-  } else {
-    // Custom - use provided dimensions or calculate
-    canvasWidth = 800;
-    canvasHeight = 600;
-  }
-
-  // Create canvas
-  const canvas = createCanvas(canvasWidth, canvasHeight);
-  const ctx = canvas.getContext('2d') as SKRSContext2D;
-  if (!ctx) throw new Error("Unable to get 2D context");
-
-  // Draw background
-  ctx.fillStyle = background;
-  ctx.fillRect(0, 0, canvasWidth, canvasHeight);
-
-  // Draw images
-  let currentX = 0;
-  let currentY = 0;
-  const colHeights: number[] = new Array(columns).fill(0);
-
-  for (let i = 0; i < loadedImages.length; i++) {
-    const imgData = loadedImages[i];
-    
-    if (type === 'grid') {
-      const col = i % columns;
-      const row = Math.floor(i / columns);
-      const cellWidth = Math.max(...loadedImages.map(img => img.width));
-      const cellHeight = Math.max(...loadedImages.map(img => img.height));
-      currentX = col * (cellWidth + spacing);
-      currentY = row * (cellHeight + spacing);
-    } else if (type === 'masonry') {
-      const col = i % columns;
-      currentX = col * (Math.max(...loadedImages.map(img => img.width)) + spacing);
-      currentY = colHeights[col];
-      colHeights[col] += imgData.height + spacing;
-    } else if (type === 'carousel') {
-      if (i > 0) currentX += spacing;
-      currentY = (canvasHeight - imgData.height) / 2;
-    }
-
-    // Apply border radius if specified
-    if (borderRadius > 0) {
-      ctx.save();
-      ctx.beginPath();
-      ctx.roundRect(currentX, currentY, imgData.width, imgData.height, borderRadius);
-      ctx.clip();
-    }
-
-    ctx.drawImage(imgData.image, currentX, currentY, imgData.width, imgData.height);
-
-    if (borderRadius > 0) {
-      ctx.restore();
-    }
-  }
-
-  return canvas.toBuffer('image/png');
-}
-