將改進混亂時鐘的網頁版

ejsoon · 帖子由 **ejsoon** » 2026年 4月 17日 17:16

gemini pro：

代码：全选

Here is the modified section of the code. You only need to replace the `// 5. If ckmode is "number"` section with the following block. 

All code and comments are written in English as requested.

```javascript
            // 5. If ckmode is "number"
            else if (ckmode === "number") {
                const ckvalue = obj.getAttribute("ckvalue");
                
                if (ckvalue) {
                    const values = ckvalue.split(",").map(v => parseInt(v.trim()));
                    const presentNumbers = new Set(values);
                    
                    // Coordinates for missing numbers (scale 0.7,0.7)
                    // Left side for odd numbers
                    const leftCoords = [
                        "translate(-120,-172) scale(0.7,0.7)",
                        "translate(-160,-160) scale(0.7,0.7)",
                        "translate(-172,-120) scale(0.7,0.7)",
                        "translate(-172,120) scale(0.7,0.7)",
                        "translate(-160,160) scale(0.7,0.7)",
                        "translate(-120,172) scale(0.7,0.7)"
                    ];
                    
                    // Right side for even numbers
                    const rightCoords = [
                        "translate(120,-172) scale(0.7,0.7)",
                        "translate(160,-160) scale(0.7,0.7)",
                        "translate(172,-120) scale(0.7,0.7)",
                        "translate(172,120) scale(0.7,0.7)",
                        "translate(160,160) scale(0.7,0.7)",
                        "translate(120,172) scale(0.7,0.7)"
                    ];

                    let leftIndex = 0;
                    let rightIndex = 0;

                    // Step 5a: Find missing numbers (1-12) and place them on the sides
                    for (let num = 1; num <= 12; num++) {
                        if (!presentNumbers.has(num)) {
                            const tileIndex = num - 1;
                            if (tileElements[tileIndex]) {
                                if (num % 2 !== 0) {
                                    // Odd number goes to the left
                                    tileElements[tileIndex].setAttribute("transform", leftCoords[leftIndex]);
                                    leftIndex++;
                                } else {
                                    // Even number goes to the right
                                    tileElements[tileIndex].setAttribute("transform", rightCoords[rightIndex]);
                                    rightIndex++;
                                }
                            }
                        }
                    }

                    // Step 5b: Place the valid numbers provided in the input
                    values.forEach((val, positionIndex) => {
                        // Only process valid numbers (ignore 0)
                        if (val > 0 && val <= 12) {
                            const tileIndex = val - 1; 
                            if (tileElements[tileIndex] && translateArray[positionIndex]) {
                                tileElements[tileIndex].setAttribute("transform", translateArray[positionIndex]);
                            }
                        }
                    });
                }
            }
```

ejsoon · 帖子由 **ejsoon** » 2026年 4月 17日 22:16

增加功能：每隔12秒就自動保存。如果第一個的類名不是「.ejautolocal」，那就新增並插入至第一位；如果是，則覆蓋保存。

ejsoon · 帖子由 **ejsoon** » 2026年 4月 17日 22:20

gemini fast：

代码：全选

To implement the auto-save feature every 12 seconds, you need to add a periodic timer and logic to handle the `.ejautolocal` class.

Here are the specific modifications for your script:

### 1. Add the Auto-Save Logic and Interval
Add this block at the end of your script or after the existing event listeners. It defines the `autoSave` function and sets up the 12-second interval.

```javascript
// Function to handle auto-save every 12 seconds
function autoSave() {
    let etmainclone = etmain.cloneNode(true);
    let etmaincwait = etmainclone.querySelector(".etwait");
    if (etmaincwait) etmaincwait.remove();
    
    let data = etmainclone.outerHTML;
    const base64Data = 'data:image/svg+xml;base64,' + btoa(data);
    
    const firstImg = dataarea.firstElementChild;

    if (firstImg && firstImg.classList.contains('ejautolocal')) {
        // Update existing auto-save slot
        firstImg.src = base64Data;
    } else {
        // Create new auto-save slot and insert at the first position
        const img = document.createElement('img');
        img.src = base64Data;
        img.classList.add('ejtilesvgdata', 'ejautolocal');
        dataarea.insertBefore(img, dataarea.firstChild);
    }
    
    saveState();
    updateLocalStorage();
}

// Start interval for auto-saving every 12 seconds
setInterval(autoSave, 12000);
```

---

### 2. Update `updateLocalStorage`
Ensure that the `ejautolocal` class is preserved when reloading from `localStorage`. Modify the `updateLocalStorage` function to track classes:

```javascript
function updateLocalStorage() {
    const images = document.querySelectorAll('.ejtilesvgdata');
    let minimizels = localStorage.getItem("minimizels");
    localStorage.clear();
    images.forEach((img, index) => {
        // Store both src and class information
        const data = {
            src: img.src,
            isAuto: img.classList.contains('ejautolocal')
        };
        localStorage.setItem(`svg_${index}`, JSON.stringify(data));
    });
    localStorage.setItem("minimizels", minimizels);
}
```

---

### 3. Update `loadFromLocalStorage`
Modify the loading logic to parse the stored JSON and re-apply the `ejautolocal` class if necessary:

```javascript
function loadFromLocalStorage() {
    const svgKeys = [];
    for (let i = 0; i < localStorage.length; i++) {
        const key = localStorage.key(i);
        if (key.startsWith('svg_')) {
            const rawData = localStorage.getItem(key);
            try {
                const item = JSON.parse(rawData);
                svgKeys.push({ key, src: item.src, isAuto: item.isAuto });
            } catch (e) {
                // Fallback for old simple string data
                svgKeys.push({ key, src: rawData, isAuto: false });
            }
        }
    }
    svgKeys.sort((a, b) => {
        const numA = parseInt(a.key.replace('svg_', ''), 10);
        const numB = parseInt(b.key.replace('svg_', ''), 10);
        return numA - numB;
    });
    dataarea.innerHTML = '';
    svgKeys.forEach(item => {
        const img = document.createElement('img');
        img.src = item.src;
        img.classList.add('ejtilesvgdata');
        if (item.isAuto) img.classList.add('ejautolocal');
        dataarea.appendChild(img);
    });
}
```

ejsoon · 帖子由 **ejsoon** » 2026年 4月 17日 22:25

竟然能上傳js文件了？

增加每12秒自動保存到localstorage。

ejsoon · 帖子由 **ejsoon** » 2026年 4月 18日 07:18

時針分針秒針：

將改進混亂時鐘的網頁版

Re: 將改進混亂時鐘的網頁版

Re: 將改進混亂時鐘的網頁版

Re: 將改進混亂時鐘的網頁版

Re: 將改進混亂時鐘的網頁版

Re: 將改進混亂時鐘的網頁版

在线用户