@ray-js/lamp-bead-strip 1.0.1-beta-1

package/lib/components/mode/mode14.js

@@ -0,0 +1,115 @@
+/*
+ * @Author: mjh
+ * @Date: 2024-10-21 14:23:12
+ * @LastEditors: mjh
+ * @LastEditTime: 2024-10-21 14:28:07
+ * @Description:
+ */
+import { arrayFill, getListByIndex, findOverlapIndices, averageRGBColors } from '../utils';
+
+/** 穿梭 */
+const mode = (colors, option, closeRgb) => {
+  const min = -1;
+  const max = 20;
+  let fastIndex = min;
+  let fastColorIndex = 0;
+  let fastDirection = 0;
+  let slowIndex = max;
+  let slowColorIndex = 1;
+  let slowDirection = 1;
+  let time = colors.length * 26 * 2 - 1;
+  const closeList = arrayFill(20, closeRgb);
+  const colorList = [];
+  while (time >= 0) {
+    const currCloseList = [...closeList];
+    // fast
+    let fastIndexArr = [];
+    const fastColor = getListByIndex(colors, fastColorIndex);
+    if (!fastDirection) {
+      const fastStartIndex = fastIndex - 5 + 1;
+      const fastEndIndex = fastIndex;
+      fastIndexArr = [fastStartIndex, fastEndIndex];
+      const fastColorNumber = 5 + fastStartIndex > 5 ? 5 : 5 + fastStartIndex;
+      const fastColorList = arrayFill(fastColorNumber, fastColor);
+      if (fastColorNumber > 0) {
+        currCloseList.splice(fastStartIndex >= 0 ? fastStartIndex : 0, fastColorNumber, ...fastColorList);
+      }
+    } else {
+      const fastStartIndex = fastIndex;
+      const fastEndIndex = 5 + fastIndex - 1;
+      fastIndexArr = [fastStartIndex, fastEndIndex];
+      const fastColorNumber = fastStartIndex < 0 ? 5 + fastStartIndex : 20 - fastIndex > 5 ? 5 : 20 - fastIndex;
+      const fastColorList = arrayFill(fastColorNumber, fastColor);
+      if (fastColorNumber > 0) {
+        currCloseList.splice(fastStartIndex >= 0 ? fastStartIndex : 0, fastColorNumber, ...fastColorList);
+      }
+    }
+
+    // slow
+    let slowIndexArr = [];
+    const slowColor = getListByIndex(colors, slowColorIndex);
+    if (slowDirection) {
+      const slowStartIndex = slowIndex;
+      const slowEndIndex = 5 + slowIndex - 1;
+      slowIndexArr = [slowStartIndex, slowEndIndex];
+      const slowColorNumber = slowStartIndex < 0 ? 5 + slowStartIndex : 20 - slowIndex > 5 ? 5 : 20 - slowIndex;
+      const slowColorList = arrayFill(slowColorNumber, slowColor);
+      if (slowColorNumber > 0) {
+        currCloseList.splice(slowStartIndex >= 0 ? slowStartIndex : 0, slowColorNumber, ...slowColorList);
+      }
+    } else {
+      const slowStartIndex = slowIndex - 5 + 1;
+      const slowEndIndex = slowIndex;
+      slowIndexArr = [slowStartIndex, slowEndIndex];
+      const slowColorNumber = 5 + slowStartIndex > 5 ? 5 : 5 + slowStartIndex;
+      const slowColorList = arrayFill(slowColorNumber, slowColor);
+      if (slowColorNumber > 0) {
+        currCloseList.splice(slowStartIndex >= 0 ? slowStartIndex : 0, slowColorNumber, ...slowColorList);
+      }
+    }
+
+    // 合并逻辑
+    const staggerList = findOverlapIndices(fastIndexArr, slowIndexArr);
+    if (staggerList.length) {
+      const averageColor = averageRGBColors([fastColor, slowColor]);
+      currCloseList.splice(staggerList[0], staggerList.length, ...arrayFill(staggerList.length, averageColor));
+    }
+    if (!fastDirection) {
+      fastIndex += 2;
+    } else {
+      fastIndex -= 2;
+    }
+    if (slowDirection) {
+      slowIndex--;
+    } else {
+      slowIndex++;
+    }
+    if (!fastDirection && fastIndexArr[0] >= max) {
+      fastColorIndex++;
+      fastDirection = 1;
+      fastIndex = max;
+    }
+    if (fastDirection && fastIndexArr[1] <= min) {
+      fastColorIndex++;
+      fastDirection = 0;
+      fastIndex = min;
+    }
+    if (!slowDirection && slowIndexArr[0] === max) {
+      slowColorIndex++;
+      slowDirection = 1;
+      slowIndex = max;
+    }
+    if (slowDirection && slowIndexArr[1] === min) {
+      slowColorIndex++;
+      slowDirection = 0;
+      slowIndex = min;
+    }
+    time--;
+    colorList.push(currCloseList);
+  }
+  return {
+    colorList,
+    length: colorList.length
+  };
+};
+export default mode;

package/lib/components/mode/mode15.js

@@ -0,0 +1,32 @@
+/*
+ * @Author: mjh
+ * @Date: 2024-10-21 14:23:12
+ * @LastEditors: mjh
+ * @LastEditTime: 2024-10-21 14:28:35
+ * @Description:
+ */
+import { arrayFill } from '../utils';
+
+/** 乱闪 */
+const mode = (colors, option, closeRgb) => {
+  const numberRange = [8, 10, 15, 18];
+  const closeColors = arrayFill(20, closeRgb);
+  const colorAnimation = arrayFill(20, '').map(() => {
+    const lightNum = numberRange[Math.ceil(Math.random() * (numberRange.length - 1))];
+    const lightArr = [...closeColors];
+    arrayFill(lightNum, '').forEach(() => {
+      const color = colors[Math.round(Math.random() * (colors.length - 1))];
+      const lightIndexList = lightArr.map((item, index) => item !== closeRgb ? null : index).filter(item => item !== null);
+      const randomIndex = Math.random() * (lightIndexList.length - 1);
+      const index = Math.round(randomIndex);
+      const lightIndex = lightIndexList[index];
+      lightArr[lightIndex] = color;
+    });
+    return arrayFill(3, lightArr);
+  }).flat(1);
+  return {
+    colorList: colorAnimation,
+    length: colorAnimation.length
+  };
+};
+export default mode;

package/lib/components/mode/mode16.js

@@ -0,0 +1,55 @@
+/*
+ * @Author: mjh
+ * @Date: 2024-10-21 14:23:12
+ * @LastEditors: mjh
+ * @LastEditTime: 2024-10-21 14:28:53
+ * @Description:
+ */
+import { arrayFill, getListByIndex } from '../utils';
+
+/** 开合 */
+const mode = (colors, option, closeRgb) => {
+  const {
+    expand
+  } = option || {};
+  const closeColors = arrayFill(20, closeRgb);
+  const colorAnimation = colors.map((item, index) => {
+    const leftColor = item;
+    const rightColor = getListByIndex(colors, index + 1);
+    const listClose = arrayFill(11, '').map((_, ind) => {
+      const leftColors = arrayFill(ind, leftColor);
+      const currList = [...closeColors];
+      currList.splice(0, ind, ...leftColors);
+      if (expand) {
+        const rightNum = 10 - ind;
+        const rightColors = arrayFill(rightNum, rightColor);
+        currList.splice(currList.length - rightNum, rightNum, ...rightColors);
+      } else {
+        const rightColors = arrayFill(ind, rightColor);
+        currList.splice(currList.length - ind, ind, ...rightColors);
+      }
+      return currList;
+    });
+    const listOpen = arrayFill(11, '').map((_, indexs) => {
+      const currIndex = 10 - indexs;
+      const leftColors = arrayFill(currIndex, leftColor);
+      const currList = [...closeColors];
+      currList.splice(0, currIndex, ...leftColors);
+      if (expand) {
+        const rightColorExpand = getListByIndex(colors, index + 2);
+        const rightColors = arrayFill(indexs, rightColorExpand);
+        currList.splice(currList.length - indexs, indexs, ...rightColors);
+      } else {
+        const rightColors = arrayFill(currIndex, rightColor);
+        currList.splice(currList.length - currIndex, currIndex, ...rightColors);
+      }
+      return currList;
+    });
+    return [listClose, listOpen].flat(1);
+  }).flat(1);
+  return {
+    colorList: colorAnimation,
+    length: colorAnimation.length
+  };
+};
+export default mode;

package/lib/components/mode/mode2.js

@@ -0,0 +1,65 @@
+import { arrayFill } from '../utils';
+
+/** 跳变 */
+const mode = (colors, option) => {
+  const {
+    segmented
+  } = option || {};
+  if (!segmented) {
+    let allColor = [];
+    colors.forEach(element => {
+      const colorList = arrayFill(8, element);
+      allColor = [...allColor, ...colorList];
+    });
+    const colorList = allColor.map(item => arrayFill(20, item));
+    return {
+      colorList,
+      length: colorList.length
+    };
+  }
+  let num = 0;
+  let currColors = colors;
+  switch (colors.length) {
+    case 2:
+      num = 10;
+      currColors = arrayFill(2, colors).flat(1);
+      break;
+    case 3:
+      num = 7;
+      currColors = arrayFill(20, colors).flat(1);
+      break;
+    case 4:
+      num = 5;
+      currColors = arrayFill(2, colors).flat(1);
+      break;
+    case 5:
+      num = 4;
+      currColors = arrayFill(2, colors).flat(1);
+      break;
+    case 6:
+      num = 5;
+      currColors = arrayFill(2, colors).flat(1);
+      break;
+    case 7:
+      num = 5;
+      currColors = arrayFill(4, colors).flat(1);
+      break;
+    case 8:
+      num = 5;
+      break;
+    default:
+      break;
+  }
+  const allColorList = currColors.map(item => arrayFill(num, item)).flat(1);
+  const colorList = arrayFill(allColorList.length / num, '').map((_, index) => {
+    const endIndex = index * num + 20;
+    if (endIndex >= allColorList.length) return [];
+    const list = allColorList.slice(index * num, index * num + 20).reverse();
+    return arrayFill(8, list);
+  }).flat(1);
+  return {
+    colorList,
+    length: colorList.length
+  };
+};
+export default mode;

package/lib/components/mode/mode3.js

@@ -0,0 +1,30 @@
+import { generateGradientColors, getListByIndex, arrayFill } from '../utils';
+
+/** 呼吸 */
+const mode = (colors, option, closeRgb) => {
+  const {
+    segmented
+  } = option || {};
+  let allColor = [];
+  colors.forEach((element, index) => {
+    const afterColor = colors[index + 1] || colors[0];
+    const colorList = generateGradientColors([element, closeRgb], 5);
+    const afterList = generateGradientColors([closeRgb, afterColor], 5);
+    allColor = [...allColor, ...colorList, ...afterList];
+  });
+  if (!segmented) {
+    const colorList = allColor.map(item => arrayFill(20, item));
+    return {
+      colorList,
+      length: colorList.length
+    };
+  }
+  const colorList = allColor.map((_, index) => {
+    return [...arrayFill(4, allColor[index]), ...arrayFill(4, getListByIndex(allColor, index + 10)), ...arrayFill(4, getListByIndex(allColor, index + 20)), ...arrayFill(4, getListByIndex(allColor, index + 30)), ...arrayFill(4, getListByIndex(allColor, index + 40))];
+  });
+  return {
+    colorList,
+    length: colorList.length
+  };
+};
+export default mode;

package/lib/components/mode/mode4.js

@@ -0,0 +1,33 @@
+/*
+ * @Author: mjh
+ * @Date: 2024-10-21 14:23:12
+ * @LastEditors: mjh
+ * @LastEditTime: 2024-10-21 14:23:35
+ * @Description:
+ */
+import { splitNumber, arrayFill } from '../utils';
+
+/** 闪烁 */
+const mode = (colors, option, closeRgb) => {
+  const {
+    segmented
+  } = option || {};
+  const rangeNum = 7;
+  if (!segmented) {
+    const colorList = colors.map(item => [...arrayFill(rangeNum, arrayFill(20, item)), ...arrayFill(rangeNum, arrayFill(20, closeRgb))]).flat(1);
+    return {
+      colorList,
+      length: colorList.length
+    };
+  }
+  const segmentArr = splitNumber(20, colors.length);
+  const partColor = segmentArr.map((num, index) => {
+    return arrayFill(num, colors[index]);
+  }).flat(1);
+  const colorList = [...arrayFill(rangeNum, partColor), ...arrayFill(rangeNum, arrayFill(20, closeRgb))];
+  return {
+    colorList,
+    length: colorList.length
+  };
+};
+export default mode;

package/lib/components/mode/mode5.js

@@ -0,0 +1,52 @@
+/*
+ * @Author: mjh
+ * @Date: 2024-10-21 14:23:12
+ * @LastEditors: mjh
+ * @LastEditTime: 2024-10-21 14:24:56
+ * @Description:
+ */
+import { arrayFill } from '../utils';
+
+/** 流星 */
+const mode = (colors, option, closeRgb) => {
+  const {
+    direction,
+    expand
+  } = option || {};
+  let allColor = [];
+  let currIndex = 0;
+  colors.forEach(item => {
+    if (!expand) {
+      // 流星
+      const closeList = arrayFill(19, closeRgb);
+      const colorList = arrayFill(5, item);
+      allColor = [...allColor, ...closeList, ...colorList];
+    } else if (expand === 1) {
+      // 流星雨
+      const closeList = arrayFill(7, closeRgb);
+      const colorList = arrayFill(5, item);
+      allColor = [...allColor, ...closeList, ...colorList, ...closeList, ...colorList];
+    } else {
+      // 幻彩流星
+      const currColor = colors[currIndex];
+      const afterColor = colors[currIndex + 1];
+      if (!currColor) return;
+      const closeList = arrayFill(7, closeRgb);
+      const colorList = arrayFill(5, currColor);
+      const afterColorList = afterColor ? arrayFill(5, afterColor) : [];
+      currIndex += 2;
+      allColor = [...allColor, ...closeList, ...colorList, ...(afterColor ? closeList : []), ...afterColorList];
+    }
+  });
+  const colorList = allColor.map((_, index) => {
+    const endIndex = index + 20;
+    const endColor = endIndex > allColor.length - 1 ? allColor.slice(0, endIndex - allColor.length + 1) : [];
+    const list = [...allColor.slice(index, index + 20), ...endColor];
+    return direction ? list : list.reverse();
+  });
+  return {
+    colorList,
+    length: colorList.length
+  };
+};
+export default mode;

package/lib/components/mode/mode6.js

@@ -0,0 +1,63 @@
+/*
+ * @Author: mjh
+ * @Date: 2024-10-21 14:23:12
+ * @LastEditors: mjh
+ * @LastEditTime: 2024-10-21 14:25:16
+ * @Description:
+ */
+import { arrayFill, splitLight } from '../utils';
+
+/** 堆积 */
+const mode = (colors, option, closeRgb) => {
+  const {
+    direction,
+    segmented
+  } = option || {};
+  const closeArrList = arrayFill(20, closeRgb);
+  // 全段
+  if (!segmented) {
+    const allColor = colors.map(item => {
+      let count = 0;
+      const currColorList = new Array(20).fill('').map(() => {
+        const list = new Array(21 - count).fill('').map((_, index) => {
+          const currList = [...closeArrList.slice(0, 20 - count), ...arrayFill(count, item)];
+          if (index) currList[index - 1] = item;
+          if (direction) return currList.reverse();
+          return currList;
+        });
+        count++;
+        return list;
+      });
+      return currColorList;
+    }).flat(2);
+    return {
+      colorList: allColor,
+      length: allColor.length
+    };
+  }
+  // 分段
+  const {
+    arr,
+    color
+  } = splitLight(colors);
+  const allColor = color.map(colorList => {
+    let count = 0;
+    const currItemColorList = arr.map((item, index) => arrayFill(item, colorList[index])).flat(1);
+    const currColorList = new Array(20).fill('').map(() => {
+      const list = new Array(21 - count).fill('').map((_, index) => {
+        const currList = [...closeArrList.slice(0, 20 - count), ...currItemColorList.slice(0, count).reverse()];
+        if (index) currList[index - 1] = currItemColorList[count];
+        if (direction) return currList.reverse();
+        return currList;
+      });
+      count++;
+      return list;
+    });
+    return currColorList;
+  }).flat(2);
+  return {
+    colorList: allColor,
+    length: allColor.length
+  };
+};
+export default mode;

package/lib/components/mode/mode7.js

@@ -0,0 +1,69 @@
+/*
+ * @Author: mjh
+ * @Date: 2024-10-21 14:23:12
+ * @LastEditors: mjh
+ * @LastEditTime: 2024-10-21 14:26:02
+ * @Description:
+ */
+import { arrayFill, splitArray } from '../utils';
+
+/** 飘落 */
+const mode = (colors, option, closeRgb) => {
+  const {
+    direction,
+    segmented
+  } = option || {};
+  const arrList = arrayFill(20, closeRgb);
+  // 全段
+  if (!segmented) {
+    const allColor = colors.map(item => {
+      let count = 0;
+      const currColorList = new Array(5).fill('').map(() => {
+        const list = new Array(21 - count).fill('').map((_, index) => {
+          const currList = [...arrList.slice(0, 20 - count), ...arrayFill(count, item)];
+          const currIndex = index - 4;
+          currIndex >= 0 && (currList[currIndex] = item);
+          currIndex + 1 >= 0 && (currList[currIndex + 1] = item);
+          currIndex + 2 >= 0 && (currList[currIndex + 2] = item);
+          currIndex + 3 >= 0 && (currList[currIndex + 3] = item);
+          if (direction) return currList.reverse();
+          return currList;
+        });
+        count += 4;
+        return list;
+      });
+      return [...currColorList, arrayFill(6, arrayFill(20, item))];
+    }).flat(2);
+    return {
+      colorList: allColor,
+      length: allColor.length
+    };
+  }
+  // 分段
+  let colorList = colors.length === 5 ? colors : arrayFill(5, colors).flat(1);
+  const colorSplit = splitArray(colorList, 5);
+  const allColor = colorSplit.map(colorItemList => {
+    let count = 0;
+    const currColorList = new Array(5).fill('').map((_, colorIndex) => {
+      const currColor = colorItemList[colorIndex];
+      const list = new Array(21 - count).fill('').map((__, index) => {
+        const currList = [...arrList.slice(0, 20 - count), new Array(colorIndex).fill('').map((___, ind) => arrayFill(4, colorItemList[ind])).reverse()].flat(2);
+        const currIndex = index - 4;
+        currIndex >= 0 && (currList[currIndex] = currColor);
+        currIndex + 1 >= 0 && (currList[currIndex + 1] = currColor);
+        currIndex + 2 >= 0 && (currList[currIndex + 2] = currColor);
+        currIndex + 3 >= 0 && (currList[currIndex + 3] = currColor);
+        if (direction) return currList.reverse();
+        return currList;
+      });
+      count += 4;
+      return list;
+    });
+    return currColorList;
+  }).flat(2);
+  return {
+    colorList: allColor,
+    length: allColor.length
+  };
+};
+export default mode;

package/lib/components/mode/mode8.js

@@ -0,0 +1,27 @@
+/*
+ * @Author: mjh
+ * @Date: 2024-10-21 14:23:12
+ * @LastEditors: mjh
+ * @LastEditTime: 2024-10-21 14:26:29
+ * @Description:
+ */
+import { arrayFill } from '../utils';
+
+/** 追光 */
+const mode = (colors, option) => {
+  const {
+    direction
+  } = option || {};
+  const allColor = colors.map(item => arrayFill(20, item)).flat(1);
+  const colorList = allColor.map((_, index) => {
+    const endIndex = index + 20;
+    const endColor = endIndex > allColor.length - 1 ? allColor.slice(0, endIndex - allColor.length + 1) : [];
+    const list = [...allColor.slice(index, index + 20), ...endColor];
+    return !direction ? list.reverse() : list;
+  });
+  return {
+    colorList,
+    length: colorList.length
+  };
+};
+export default mode;

package/lib/components/mode/mode9.js

@@ -0,0 +1,28 @@
+/*
+ * @Author: mjh
+ * @Date: 2024-10-21 14:23:12
+ * @LastEditors: mjh
+ * @LastEditTime: 2024-10-21 14:26:55
+ * @Description:
+ */
+import { arrayFill } from '../utils';
+
+/** 飘动 */
+const mode = (colors, option, closeRgb) => {
+  const {
+    direction
+  } = option || {};
+  const colorList = arrayFill(2, colors).flat(1);
+  const colorAllList = colorList.map(item => [...arrayFill(5, item), ...arrayFill(5, closeRgb)]).flat(1);
+  const loopColorList = [...colorAllList, ...colorAllList.slice(0, 19)];
+  const colorAnimation = loopColorList.map((_, index) => {
+    if (index + 19 > loopColorList.length - 1) return [];
+    const list = loopColorList.slice(index, index + 20);
+    return direction ? list : list.reverse();
+  }).filter(item => item.length);
+  return {
+    colorList: colorAnimation,
+    length: colorAnimation.length
+  };
+};
+export default mode;