正在做etani，ejtile的動畫套件

ejsoon · 帖子由 **ejsoon** » 2025年 10月 27日 01:24

最後一個沒改，然後gemini 2.5pro用完了。
當前代碼：

ejtileani202510270122.7z: (17.26 KiB) 已下载 2 次

ejsoon · 帖子由 **ejsoon** » 2025年 10月 27日 01:39

當點擊<set>中的etaniAVItem被點擊時，如果attr是opacity，則它仍會像<animate>一樣，在0和1之間切換，只有在2秒之內點擊兩次，才會彈出輸入框，輸入它的值。

用繁體中文回答。只需告知所要更改的代碼和位置，以及要替換的內容。代碼的注釋都要是英文。

ejsoon · 帖子由 **ejsoon** » 2025年 10月 27日 01:43

claude ai sonnet4.5

代码：全选

我需要修改 `handleAVItemClick` 函數中處理 opacity 點擊的部分。

**位置：** `handleAVItemClick` 函數，大約在第 971-991 行

**要替換的代碼：**

找到這段代碼：

```javascript
} else if (animateType === 'opacity' && !etaniCol.classList.contains(`deleting-mode-${animateType}`) && !etaniCol.classList.contains(`copying-mode-${animateType}`)) {
    const cloneUseElement = etani_clone.querySelector(`.etdrop use[href="#${useId}"]`);
    if (!cloneUseElement) return;

    const animates = getAnimates(animateType, useId, null, group);
    const animateOpacity = animates[0];
    if (!animateOpacity) return;

    const values = animateOpacity.getAttribute('values').split(';');
    if (itemIndex >= values.length) return;

    if (isDoubleClick) {
        const newValue = prompt("Enter opacity value (0 to 1):", values[itemIndex]);
        if (newValue !== null && !isNaN(newValue) && newValue >= 0 && newValue <= 1) {
            values[itemIndex] = newValue;
            item.textContent = newValue;
            animateOpacity.setAttribute('values', values.join(';'));
            updateEtaniResult();
        }
    } else {
        values[itemIndex] = values[itemIndex] === '0' ? '1' : '0';
        item.textContent = values[itemIndex];
        animateOpacity.setAttribute('values', values.join(';'));
        updateEtaniResult();
    }
}
```

**替換為：**

```javascript
} else if (animateType === 'opacity' && !etaniCol.classList.contains(`deleting-mode-${animateType}`) && !etaniCol.classList.contains(`copying-mode-${animateType}`)) {
    const cloneUseElement = etani_clone.querySelector(`.etdrop use[href="#${useId}"]`);
    if (!cloneUseElement) return;

    const animates = getAnimates(animateType, useId, null, group);
    const animateOpacity = animates[0];
    if (!animateOpacity) return;

    // Check if this is a <set> element
    const isSetElement = animateOpacity.tagName.toLowerCase() === 'set';

    if (isSetElement) {
        // For <set> element, handle 'to' attribute
        const currentTo = animateOpacity.getAttribute('to') || '0';
        
        if (isDoubleClick) {
            const newTo = prompt("Enter 'to' value (e.g., 0, 1, inherit):", currentTo);
            if (newTo !== null) {
                animateOpacity.setAttribute('to', newTo);
                item.textContent = newTo;
                updateEtaniResult();
            }
        } else {
            // Toggle between 0 and 1 for single click
            const newTo = currentTo === '0' ? '1' : '0';
            animateOpacity.setAttribute('to', newTo);
            item.textContent = newTo;
            updateEtaniResult();
        }
    } else {
        // For <animate> element, handle 'values' attribute
        const values = animateOpacity.getAttribute('values').split(';');
        if (itemIndex >= values.length) return;

        if (isDoubleClick) {
            const newValue = prompt("Enter opacity value (0 to 1):", values[itemIndex]);
            if (newValue !== null && !isNaN(newValue) && newValue >= 0 && newValue <= 1) {
                values[itemIndex] = newValue;
                item.textContent = newValue;
                animateOpacity.setAttribute('values', values.join(';'));
                updateEtaniResult();
            }
        } else {
            values[itemIndex] = values[itemIndex] === '0' ? '1' : '0';
            item.textContent = values[itemIndex];
            animateOpacity.setAttribute('values', values.join(';'));
            updateEtaniResult();
        }
    }
}
```

這個修改會：
1. 檢查元素是否為 `<set>` 標籤
2. 如果是 `<set>`：
   - 單次點擊：在 0 和 1 之間切換
   - 雙擊（2秒內）：彈出輸入框讓用戶輸入自定義值
3. 如果是 `<animate>`：保持原有行為

ejsoon · 帖子由 **ejsoon** » 2025年 10月 27日 01:59

代码：全选

        // Add click listener to edit the 'to' value for <set>
        avItemSpan.addEventListener('click', (e) => {
            const currentTo = avItemSpan.textContent;
            const newTo = prompt('Enter "to" value (e.g., 0, 1, inherit):', currentTo);
            
            // Check if newTo is not null (i.e., user didn't press cancel)
            if (newTo !== null) { 
                // Get the <set> element
                const setElement = getAnimates(animateTypeUI, id, null, groupIndex)[0];
                if (setElement) {
                    setElement.setAttribute('to', newTo);
                    avItemSpan.textContent = newTo;
                    updateEtaniResult();
                }
            }
        });

ejsoon · 帖子由 **ejsoon** » 2025年 10月 27日 02:02

代码：全选

改動：

當點擊<set>中的etaniAVItem被點擊時，如果attr是opacity，則它仍會像<animate>一樣，在0和1之間切換，只有在2秒之內點擊兩次，才會彈出輸入框，輸入它的值。

所要更改的代碼是下面這一段：

        // Add click listener to edit the 'to' value for <set>
        avItemSpan.addEventListener('click', (e) => {
            const currentTo = avItemSpan.textContent;
            const newTo = prompt('Enter "to" value (e.g., 0, 1, inherit):', currentTo);
            
            // Check if newTo is not null (i.e., user didn't press cancel)
            if (newTo !== null) { 
                // Get the <set> element
                const setElement = getAnimates(animateTypeUI, id, null, groupIndex)[0];
                if (setElement) {
                    setElement.setAttribute('to', newTo);
                    avItemSpan.textContent = newTo;
                    updateEtaniResult();
                }
            }
        });


用繁體中文回答。只需告知所要更改的代碼和位置，以及要替換的內容。代碼的注釋都要是英文。

代码：全选

我需要修改 `<set>` 元素中 `etaniAVItem` 的點擊事件處理器，使其行為與 `<animate>` 的 opacity 一致：單擊在 0 和 1 之間切換，雙擊（2秒內）彈出輸入框。

## 要修改的位置

在 `etaniAppendAnimate` 函數中，大約在第 **2557-2571 行**，找到這段代碼：

```javascript
// Add click listener to edit the 'to' value for <set>
avItemSpan.addEventListener('click', (e) => {
    const currentTo = avItemSpan.textContent;
    const newTo = prompt('Enter "to" value (e.g., 0, 1, inherit):', currentTo);
    
    // Check if newTo is not null (i.e., user didn't press cancel)
    if (newTo !== null) { 
        // Get the <set> element
        const setElement = getAnimates(animateTypeUI, id, null, groupIndex)[0];
        if (setElement) {
            setElement.setAttribute('to', newTo);
            avItemSpan.textContent = newTo;
            updateEtaniResult();
        }
    }
});
```

## 替換為以下代碼

```javascript
// Add click listener to toggle 0/1 on single click, edit on double click for <set>
avItemSpan.addEventListener('click', (e) => {
    const setElement = getAnimates(animateTypeUI, id, null, groupIndex)[0];
    if (!setElement) return;

    const currentTime = Date.now();
    const isDoubleClick = (avItemSpan === lastClickedItem && (currentTime - lastClickTime) < 2000);

    lastClickTime = currentTime;
    lastClickedItem = avItemSpan;

    if (isDoubleClick) {
        // Double click: prompt for custom value
        const currentTo = avItemSpan.textContent;
        const newTo = prompt('Enter "to" value (0 to 1 or inherit):', currentTo);
        
        if (newTo !== null) {
            setElement.setAttribute('to', newTo);
            avItemSpan.textContent = newTo;
            updateEtaniResult();
        }
    } else {
        // Single click: toggle between 0 and 1
        const currentTo = avItemSpan.textContent;
        const newTo = (currentTo === '0') ? '1' : '0';
        setElement.setAttribute('to', newTo);
        avItemSpan.textContent = newTo;
        updateEtaniResult();
    }
});
```

## 說明

這段新代碼：
1. 使用全域變數 `lastClickTime` 和 `lastClickedItem` 來偵測雙擊
2. 單擊時：在 '0' 和 '1' 之間切換 `to` 屬性值
3. 雙擊時（2秒內）：彈出輸入框讓使用者輸入自訂值
4. 行為與 opacity 的 `<animate>` 完全一致（參考第 1145-1164 行的實作）

ejsoon · 帖子由 **ejsoon** » 2025年 10月 27日 02:05

代码：全选

好的，我重新分析代碼。

## 要修改的位置

在 `etaniAppendAnimate` 函數中，大約在第 **2557-2571 行**，找到這段代碼：

```javascript
// Add click listener to edit the 'to' value for <set>
avItemSpan.addEventListener('click', (e) => {
    const currentTo = avItemSpan.textContent;
    const newTo = prompt('Enter "to" value (e.g., 0, 1, inherit):', currentTo);
    
    // Check if newTo is not null (i.e., user didn't press cancel)
    if (newTo !== null) { 
        // Get the <set> element
        const setElement = getAnimates(animateTypeUI, id, null, groupIndex)[0];
        if (setElement) {
            setElement.setAttribute('to', newTo);
            avItemSpan.textContent = newTo;
            updateEtaniResult();
        }
    }
});
```

## 替換為以下代碼

```javascript
// Add click listener to toggle 0/1 on single click, edit on double click for <set>
avItemSpan.addEventListener('click', (e) => {
    const currentTime = Date.now();
    const isDoubleClick = (avItemSpan === lastClickedItem && (currentTime - lastClickTime) < 2000);

    lastClickTime = currentTime;
    lastClickedItem = avItemSpan;

    const setElement = getAnimates(animateTypeUI, id, null, groupIndex)[0];
    if (!setElement) return;

    const currentTo = setElement.getAttribute('to') || '0';

    if (isDoubleClick) {
        // Double click: show prompt for custom value input
        const newTo = prompt('Enter "to" value (0 to 1):', currentTo);
        if (newTo !== null && !isNaN(newTo) && newTo >= 0 && newTo <= 1) {
            setElement.setAttribute('to', newTo);
            avItemSpan.textContent = newTo;
            updateEtaniResult();
        }
    } else {
        // Single click: toggle between 0 and 1
        const newTo = currentTo === '0' ? '1' : '0';
        setElement.setAttribute('to', newTo);
        avItemSpan.textContent = newTo;
        updateEtaniResult();
    }
});
```

## 說明

這個新實作：
1. 先檢測是否為雙擊（2秒內點擊同一個元素兩次）
2. **單擊**：直接在 '0' 和 '1' 之間切換
3. **雙擊**：彈出輸入框，允許輸入 0-1 之間的任意數值
4. 從 `<set>` 元素的 `to` 屬性讀取當前值，確保數據同步

ejsoon · 帖子由 **ejsoon** » 2025年 10月 27日 03:33

改動：

更改getAnimates函式，其參數animateType實際上指的是attributeName。

而正確的animateType應該指的是<animate>、<animateTransform>、<animateMotion>、<set>這四種標籤的名稱。

用繁體中文回答。只需告知所要更改的代碼和位置，以及要替換的內容。代碼的注釋都要是英文。

代码：全选

我來幫你分析需要修改的地方。

## 需要修改的函數：`getAnimates`

**位置：** 第 1825-1847 行

**原代碼：**
```javascript
// Get animate elements for the specific useId, type, and group
function getAnimates(animateType, useId, attrType = null, group = 0) {
    const cloneUseElement = etani_clone.querySelector(`.etdrop use[href="#${useId}"]`);
    if (!cloneUseElement) return [];

    if (animateType === 'transform') {
        const allAnimates = cloneUseElement.querySelectorAll('animateTransform');
        const groupAnimates = Array.from(allAnimates).slice(group * 3, group * 3 + 3);
        if (attrType === 'id') {
            return groupAnimates.filter(anim => anim.getAttribute('type').toLowerCase() === 'rotate');
        } else {
            return groupAnimates;
        }
    } else {
        const allAnimates = cloneUseElement.querySelectorAll(`animate[attributeName="${animateType}"]`);
        return [allAnimates[group]] || [];
    }
}
```

**替換為：**
```javascript
// Get animate elements for the specific useId, tagName (animateType), attributeName, and group
// animateType: 'animate', 'animateTransform', 'animateMotion', 'set'
// attributeName: 'transform', 'opacity', etc.
function getAnimates(animateType, useId, attributeName = null, attrType = null, group = 0) {
    const cloneUseElement = etani_clone.querySelector(`.etdrop use[href="#${useId}"]`);
    if (!cloneUseElement) return [];

    if (animateType === 'animateTransform') {
        const allAnimates = cloneUseElement.querySelectorAll('animateTransform');
        const groupAnimates = Array.from(allAnimates).slice(group * 3, group * 3 + 3);
        if (attrType === 'id') {
            return groupAnimates.filter(anim => anim.getAttribute('type').toLowerCase() === 'rotate');
        } else {
            return groupAnimates;
        }
    } else if (animateType === 'animate' || animateType === 'set') {
        // For animate and set, filter by attributeName if provided
        let selector = animateType;
        if (attributeName) {
            selector = `${animateType}[attributeName="${attributeName}"]`;
        }
        const allAnimates = cloneUseElement.querySelectorAll(selector);
        return [allAnimates[group]] || [];
    } else if (animateType === 'animateMotion') {
        const allAnimates = cloneUseElement.querySelectorAll('animateMotion');
        return [allAnimates[group]] || [];
    } else {
        return [];
    }
}
```

## 需要更新所有調用 `getAnimates` 的地方

由於參數順序和意義改變，需要更新所有調用此函數的地方。主要影響的地方：

1. **第 756 行附近** - `handleAVAddClick` 函數中
2. **第 969 行附近** - `handleAVItemClick` 函數中（多處）
3. **第 1464 行附近** - `handleValueCtrlUpClick` 函數中
4. **第 1802 行附近** - `handleConfirm` 函數中
5. **第 1819 行附近** - `handleDelete` 函數中
6. **第 2258 行附近** - `durSpan` 點擊事件中
7. **第 2356 行附近** - `frSpan` 點擊事件中
8. **第 2433 行附近** - `avItemSpan` 點擊事件中（for set）

**建議的調用方式更新：**
- 原本：`getAnimates('transform', useId, null, group)`
- 改為：`getAnimates('animateTransform', useId, 'transform', null, group)`

- 原本：`getAnimates('opacity', useId, null, group)`
- 改為：`getAnimates('animate', useId, 'opacity', null, group)`

- 原本：`getAnimates(animateType, useId, attrName, group)`（在 handleConfirm 中）
- 改為：`getAnimates(determineTagName(animateType, attrName), useId, attrName, attrName, group)`

你需要在每個調用處根據上下文判斷正確的 `animateType`（標籤名）和 `attributeName`（屬性名）。

ejsoon · 帖子由 **ejsoon** » 2025年 10月 27日 11:44

需要重做！

ejsoon · 帖子由 **ejsoon** » 2025年 10月 27日 15:26

做一個js，功能描述如下：

在window.addEventListener(onload)之時，在div#etmainouter的下方增加
div.etaniouter>button#etaniStart{start ejtile animate}

當按下etaniStart時，在etaniouter內部的最後增加：

div.etaniinner>(div.etaniCtrl+div.etaniCol+div.etaniResult)

etaniStart的innerHTML也會變成{close ejtile animate}。當再次點擊時，div.etaniinner會被銷毀，etaniStart的innerHTML也會恢復為{start ejtile animate}。

所有html元素的增加，都要用createElement，appendChild的方式增加。

只需要提供js，用繁體中文回答。代碼的注釋都要是英文。

代码：全选

以下是符合您描述的 JavaScript 代碼：

```javascript
window.addEventListener('load', function() {
    // Get the etmainouter element
    var etmainouter = document.getElementById('etmainouter');
    if (!etmainouter) return; // Exit if etmainouter not found

    // Create etaniouter div
    var etaniouter = document.createElement('div');
    etaniouter.className = 'etaniouter';

    // Create etaniStart button
    var etaniStart = document.createElement('button');
    etaniStart.id = 'etaniStart';
    etaniStart.innerHTML = 'start ejtile animate';

    // Append button to etaniouter
    etaniouter.appendChild(etaniStart);

    // Insert etaniouter after etmainouter
    etmainouter.parentNode.insertBefore(etaniouter, etmainouter.nextSibling);

    // Add click event listener to etaniStart
    etaniStart.addEventListener('click', function() {
        // Check if etaniinner already exists
        var etaniinner = etaniouter.querySelector('.etaniinner');
        if (etaniinner) {
            // Remove etaniinner
            etaniouter.removeChild(etaniinner);
            // Restore button text
            etaniStart.innerHTML = 'start ejtile animate';
        } else {
            // Create etaniinner div
            etaniinner = document.createElement('div');
            etaniinner.className = 'etaniinner';

            // Create etaniCtrl div
            var etaniCtrl = document.createElement('div');
            etaniCtrl.className = 'etaniCtrl';
            etaniinner.appendChild(etaniCtrl);

            // Create etaniCol div
            var etaniCol = document.createElement('div');
            etaniCol.className = 'etaniCol';
            etaniinner.appendChild(etaniCol);

            // Create etaniResult div
            var etaniResult = document.createElement('div');
            etaniResult.className = 'etaniResult';
            etaniinner.appendChild(etaniResult);

            // Append etaniinner to etaniouter
            etaniouter.appendChild(etaniinner);

            // Change button text
            etaniStart.innerHTML = 'close ejtile animate';
        }
    });
});
```

ejsoon · 帖子由 **ejsoon** » 2025年 10月 27日 16:13

寫一個函式，往etaniCtrl增加以下HTML結構：

代码：全选

<div class="etaniCtrl">
	<div class="etaniContent">
		<a class="etaniContentHTML" href="javascript:;">HTML</a>
	</div>
	<div class="etaniUpdate">
		<a class="etaniUpdateTiles" href="javascript:;">update</a>
		<a class="etaniCenter" href="javascript:;">Center</a>
	</div>
	<div class="etaniFilter">
		<span class="etaniFilterTiles active">tiles</span>
		<span class="etaniFilterMoving">moving</span>
		<span class="etaniFilterBoard">board</span>
	</div>
	<div class="etaniMode">
		<span class="etaniModeRepeat active">repeat</span>
		<span class="etaniModeFreeze">freeze</span>
		<span class="etaniModeMixed">mixed</span>
	</div>
	<div class="etaniAllAppend">
		<a class="etaniAllAppendTransform" href="javascript:;">transform</a>
		<a class="etaniAllAppendOpacity" href="javascript:;">opacity</a>
	</div>
	<div class="etaniValue">
		<a class="etaniValueIncrease" href="javascript:;">increase</a>
	</div>
</div>

當在etaniFilter中的span點擊時，會切換active。
當在etaniMode中的span點擊時，會切換active。
只需要提供js，用繁體中文回答。代碼的注釋都要是英文。

代码：全选

以下是符合您描述的 JavaScript 函式：

```javascript
function addEtaniCtrlElements() {
    // Get the etaniCtrl element
    var etaniCtrl = document.querySelector('.etaniCtrl');
    if (!etaniCtrl) return; // Exit if etaniCtrl not found

    // Clear existing content if any
    etaniCtrl.innerHTML = '';

    // Create etaniContent div
    var etaniContent = document.createElement('div');
    etaniContent.className = 'etaniContent';

    // Create etaniContentHTML a
    var etaniContentHTML = document.createElement('a');
    etaniContentHTML.className = 'etaniContentHTML';
    etaniContentHTML.href = 'javascript:;';
    etaniContentHTML.innerHTML = 'HTML';
    etaniContent.appendChild(etaniContentHTML);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniContent);

    // Create etaniUpdate div
    var etaniUpdate = document.createElement('div');
    etaniUpdate.className = 'etaniUpdate';

    // Create etaniUpdateTiles a
    var etaniUpdateTiles = document.createElement('a');
    etaniUpdateTiles.className = 'etaniUpdateTiles';
    etaniUpdateTiles.href = 'javascript:;';
    etaniUpdateTiles.innerHTML = 'update';
    etaniUpdate.appendChild(etaniUpdateTiles);

    // Create etaniCenter a
    var etaniCenter = document.createElement('a');
    etaniCenter.className = 'etaniCenter';
    etaniCenter.href = 'javascript:;';
    etaniCenter.innerHTML = 'Center';
    etaniUpdate.appendChild(etaniCenter);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniUpdate);

    // Create etaniFilter div
    var etaniFilter = document.createElement('div');
    etaniFilter.className = 'etaniFilter';

    // Create etaniFilterTiles span
    var etaniFilterTiles = document.createElement('span');
    etaniFilterTiles.className = 'etaniFilterTiles active';
    etaniFilterTiles.innerHTML = 'tiles';
    etaniFilter.appendChild(etaniFilterTiles);

    // Create etaniFilterMoving span
    var etaniFilterMoving = document.createElement('span');
    etaniFilterMoving.className = 'etaniFilterMoving';
    etaniFilterMoving.innerHTML = 'moving';
    etaniFilter.appendChild(etaniFilterMoving);

    // Create etaniFilterBoard span
    var etaniFilterBoard = document.createElement('span');
    etaniFilterBoard.className = 'etaniFilterBoard';
    etaniFilterBoard.innerHTML = 'board';
    etaniFilter.appendChild(etaniFilterBoard);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniFilter);

    // Add click event listeners for etaniFilter spans
    var filterSpans = etaniFilter.querySelectorAll('span');
    filterSpans.forEach(function(span) {
        span.addEventListener('click', function() {
            // Remove active from all spans in etaniFilter
            filterSpans.forEach(function(s) { s.classList.remove('active'); });
            // Add active to clicked span
            this.classList.add('active');
        });
    });

    // Create etaniMode div
    var etaniMode = document.createElement('div');
    etaniMode.className = 'etaniMode';

    // Create etaniModeRepeat span
    var etaniModeRepeat = document.createElement('span');
    etaniModeRepeat.className = 'etaniModeRepeat active';
    etaniModeRepeat.innerHTML = 'repeat';
    etaniMode.appendChild(etaniModeRepeat);

    // Create etaniModeFreeze span
    var etaniModeFreeze = document.createElement('span');
    etaniModeFreeze.className = 'etaniModeFreeze';
    etaniModeFreeze.innerHTML = 'freeze';
    etaniMode.appendChild(etaniModeFreeze);

    // Create etaniModeMixed span
    var etaniModeMixed = document.createElement('span');
    etaniModeMixed.className = 'etaniModeMixed';
    etaniModeMixed.innerHTML = 'mixed';
    etaniMode.appendChild(etaniModeMixed);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniMode);

    // Add click event listeners for etaniMode spans
    var modeSpans = etaniMode.querySelectorAll('span');
    modeSpans.forEach(function(span) {
        span.addEventListener('click', function() {
            // Remove active from all spans in etaniMode
            modeSpans.forEach(function(s) { s.classList.remove('active'); });
            // Add active to clicked span
            this.classList.add('active');
        });
    });

    // Create etaniAllAppend div
    var etaniAllAppend = document.createElement('div');
    etaniAllAppend.className = 'etaniAllAppend';

    // Create etaniAllAppendTransform a
    var etaniAllAppendTransform = document.createElement('a');
    etaniAllAppendTransform.className = 'etaniAllAppendTransform';
    etaniAllAppendTransform.href = 'javascript:;';
    etaniAllAppendTransform.innerHTML = 'transform';
    etaniAllAppend.appendChild(etaniAllAppendTransform);

    // Create etaniAllAppendOpacity a
    var etaniAllAppendOpacity = document.createElement('a');
    etaniAllAppendOpacity.className = 'etaniAllAppendOpacity';
    etaniAllAppendOpacity.href = 'javascript:;';
    etaniAllAppendOpacity.innerHTML = 'opacity';
    etaniAllAppend.appendChild(etaniAllAppendOpacity);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniAllAppend);

    // Create etaniValue div
    var etaniValue = document.createElement('div');
    etaniValue.className = 'etaniValue';

    // Create etaniValueIncrease a
    var etaniValueIncrease = document.createElement('a');
    etaniValueIncrease.className = 'etaniValueIncrease';
    etaniValueIncrease.href = 'javascript:;';
    etaniValueIncrease.innerHTML = 'increase';
    etaniValue.appendChild(etaniValueIncrease);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniValue);
}
```

ejsoon · 帖子由 **ejsoon** » 2025年 10月 28日 01:33

代码：全选

<div class="etaniItem" data-id="tile10">
	<div class="etaniItemLeft">
		<div class="etaniItemImageOuter">
			<img class="etaniItemImage">
		</div>
		<div class="etaniItemId">
			<span class="etaniItemName">tile10</span>
			<img width="12" height="12" class="etaniItemplus"></img>
		</div>
	</div>
	<div class="etaniItemRight"></div>
</div>

ejsoon · 帖子由 **ejsoon** » 2025年 10月 28日 01:48

寫一個函式listEtaniItems()，功能描述如下：

一，從etani中拿到所有的「.etdrop>use」，再從etani中拿到「#etanidrop」，再從etani中拿到「.etdrop>.etboard」中所有含有id的元素，把它們加到數組etaniElementArray中。

二，循環etaniElementArray的每一項，往etaniCol加入以下HTML結構：

<div class="etaniItem" data-id="tile10">
<div class="etaniItemLeft">
<div class="etaniItemImageOuter">
<img class="etaniItemImage">
</div>
<div class="etaniItemId">
<span class="etaniItemName">tile10</span>
<img width="12" height="12" class="etaniItemplus"></img>
</div>
</div>
<div class="etaniItemRight"></div>
</div>

data-id和etaniItemName，「.etdrop>use」是它的href屬性（去掉#），「#etanidrop」是「board」，「.etdrop>.etboard 含有id的元素」就是它的id。

三，
當.etaniFilterTiles.active時，顯示「.etdrop>use」，其它隱藏。

當.etaniFilterMoving.active時，每隔一秒就檢查頁面中是否存在#etmain>.etdrop>use.moving，如果存在，拿到它的href=#id屬性，再去顯示這個對應的「.etdrop>use」，其它隱藏。

當「.etaniFilterMoving.active」時，顯示「#etanidrop」和「.etdrop>.etboard 含有id的元素」，其它隱藏。

只需要提供js，用繁體中文回答。代碼的注釋都要是英文。

代码：全选

以下是符合您描述的 JavaScript 函式：

```javascript
function listEtaniItems() {
    // Get the etaniCol element
    var etaniCol = document.querySelector('.etaniCol');
    if (!etaniCol) return; // Exit if etaniCol not found

    // Clear existing content in etaniCol
    etaniCol.innerHTML = '';

    // Collect elements into etaniElementArray
    var uses = document.querySelectorAll('.etdrop > use');
    var etanidrop = document.getElementById('etanidrop');
    var boardElements = document.querySelectorAll('.etdrop > .etboard [id]');
    var etaniElementArray = [...uses, etanidrop, ...boardElements];

    // Loop through etaniElementArray to create etaniItem elements
    etaniElementArray.forEach(function(element) {
        if (!element) return; // Skip if element is null

        // Determine itemId and dataType
        var itemId;
        var dataType;
        if (element.tagName === 'USE') {
            itemId = element.getAttribute('href').slice(1);
            dataType = 'tile';
        } else if (element.id === 'etanidrop') {
            itemId = 'board';
            dataType = 'board';
        } else {
            itemId = element.id;
            dataType = 'board';
        }

        // Create etaniItem div
        var etaniItem = document.createElement('div');
        etaniItem.className = 'etaniItem';
        etaniItem.dataset.id = itemId;
        etaniItem.dataset.type = dataType;

        // Create etaniItemLeft div
        var etaniItemLeft = document.createElement('div');
        etaniItemLeft.className = 'etaniItemLeft';
        etaniItem.appendChild(etaniItemLeft);

        // Create etaniItemImageOuter div
        var etaniItemImageOuter = document.createElement('div');
        etaniItemImageOuter.className = 'etaniItemImageOuter';
        etaniItemLeft.appendChild(etaniItemImageOuter);

        // Create etaniItemImage img
        var etaniItemImage = document.createElement('img');
        etaniItemImage.className = 'etaniItemImage';
        etaniItemImageOuter.appendChild(etaniItemImage);

        // Create etaniItemId div
        var etaniItemId = document.createElement('div');
        etaniItemId.className = 'etaniItemId';
        etaniItemLeft.appendChild(etaniItemId);

        // Create etaniItemName span
        var etaniItemName = document.createElement('span');
        etaniItemName.className = 'etaniItemName';
        etaniItemName.innerHTML = itemId;
        etaniItemId.appendChild(etaniItemName);

        // Create etaniItemplus img
        var etaniItemplus = document.createElement('img');
        etaniItemplus.width = 12;
        etaniItemplus.height = 12;
        etaniItemplus.className = 'etaniItemplus';
        etaniItemId.appendChild(etaniItemplus);

        // Create etaniItemRight div
        var etaniItemRight = document.createElement('div');
        etaniItemRight.className = 'etaniItemRight';
        etaniItem.appendChild(etaniItemRight);

        // Append etaniItem to etaniCol
        etaniCol.appendChild(etaniItem);
    });

    // Define updateVisibility function
    function updateVisibility() {
        var active = document.querySelector('.etaniFilter .active');
        if (!active) return;

        var activeClass = active.classList[0]; // e.g., 'etaniFilterTiles'
        var items = document.querySelectorAll('.etaniItem');
        items.forEach(function(item) {
            item.style.display = 'none';
        });

        if (activeClass === 'etaniFilterTiles') {
            document.querySelectorAll('.etaniItem[data-type="tile"]').forEach(function(item) {
                item.style.display = 'block';
            });
        } else if (activeClass === 'etaniFilterBoard') {
            document.querySelectorAll('.etaniItem[data-type="board"]').forEach(function(item) {
                item.style.display = 'block';
            });
        } else if (activeClass === 'etaniFilterMoving') {
            document.querySelectorAll('.etaniItem[data-type="board"]').forEach(function(item) {
                item.style.display = 'block';
            });
            // Tiles visibility handled by interval
        }
    }

    // Define updateMovingTiles function
    var intervalId = null;
    function updateMovingTiles() {
        var movingUse = document.querySelector('#etmain > .etdrop > use.moving');
        var tiles = document.querySelectorAll('.etaniItem[data-type="tile"]');
        tiles.forEach(function(t) {
            t.style.display = 'none';
        });
        if (movingUse) {
            var id = movingUse.getAttribute('href').slice(1);
            var item = document.querySelector('.etaniItem[data-id="' + id + '"]');
            if (item) {
                item.style.display = 'block';
            }
        }
    }

    // Add click event listeners to etaniFilter spans
    var filterSpans = document.querySelectorAll('.etaniFilter span');
    filterSpans.forEach(function(span) {
        span.addEventListener('click', function() {
            // Update visibility after filter change
            updateVisibility();

            var active = document.querySelector('.etaniFilter .active');
            if (active && active.classList[0] === 'etaniFilterMoving') {
                if (intervalId) clearInterval(intervalId);
                intervalId = setInterval(updateMovingTiles, 1000);
                // Call immediately
                updateMovingTiles();
            } else {
                if (intervalId) clearInterval(intervalId);
                intervalId = null;
            }
        });
    });

    // Initial update
    updateVisibility();
}
```

ejsoon · 帖子由 **ejsoon** » 2025年 10月 28日 03:39

當前結果：

代码：全选

// Global variable to hold the SVG clone and ensure state is maintained
let etani = null;
let intervalMoving = null;

// Add dynamic CSS styles to the document
function addEtaniStyles() {
    if (document.getElementById('dynamic-et-styles')) {
        return;
    }

    const styleSheet = document.createElement('style');
    styleSheet.id = 'dynamic-et-styles'; 
    styleSheet.textContent = `
.etaniinner {
  margin-top: 10px;
}
.etaniCtrl {
  margin-bottom: 10px;
  clear: both;
  padding: 5px;
  border: 1px solid #c0c0c0;
  text-align: center;
}
.etaniCtrl > div {
  display: inline-block;
  vertical-align: top;
  padding: 5px;
  border: 1px solid #ccc;
  margin: 0 5px 5px 5px;
  text-align: left;
}
.etaniCtrl > div > a, .etaniCtrl > div > span {
  display: inline-block;
  text-decoration: none;
  padding: 2px 8px;
  font-size: 14px;
  margin: 0 2px;
  cursor: pointer;
  user-select: none;
}
.etaniCtrl > div > span {
  border: 1px solid #888;
  background-color: #eee;
  color: #333;
}
.etaniCtrl > div > span.active {
  background-color: #008CBA;
  color: white;
  border-color: #008CBA;
}
.etaniContentHTML {
  border: 1px solid #db3a32;
  color: #db3a32;
}
.etaniUpdateTiles {
  border: 1px solid #008CBA;
  color: #008CBA;
}
.etaniCenter {
  border: 1px solid green;
  color: green;
}
.etaniAllAppendTransform {
  border: 1px solid #2e36b9;
  color: #2e36b9;
}
.etaniAllAppendOpacity {
  border: 1px solid #b68942;
  color: #b68942;
}
.etaniValueIncrease {
  border: 1px solid purple;
  color: purple;
}
    `;

    document.head.appendChild(styleSheet);
}

// Append ctrl elements to etaniCtrl
function addEtaniCtrlElements() {
    // Get the etaniCtrl element
    const etaniCtrl = document.querySelector('.etaniCtrl');
    if (!etaniCtrl) return; // Exit if etaniCtrl not found

    // Clear existing content if any
    etaniCtrl.innerHTML = '';

    // Create etaniContent div
    const etaniContent = document.createElement('div');
    etaniContent.className = 'etaniContent';

    // Create etaniContentHTML a
    const etaniContentHTML = document.createElement('a');
    etaniContentHTML.className = 'etaniContentHTML';
    etaniContentHTML.href = 'javascript:;';
    etaniContentHTML.innerHTML = 'HTML';
    etaniContent.appendChild(etaniContentHTML);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniContent);

    // Create etaniUpdate div
    const etaniUpdate = document.createElement('div');
    etaniUpdate.className = 'etaniUpdate';

    // Create etaniUpdateTiles a
    const etaniUpdateTiles = document.createElement('a');
    etaniUpdateTiles.className = 'etaniUpdateTiles';
    etaniUpdateTiles.href = 'javascript:;';
    etaniUpdateTiles.innerHTML = 'update';
    etaniUpdate.appendChild(etaniUpdateTiles);

    // Create etaniCenter a
    const etaniCenter = document.createElement('a');
    etaniCenter.className = 'etaniCenter';
    etaniCenter.href = 'javascript:;';
    etaniCenter.innerHTML = 'Center';
    etaniUpdate.appendChild(etaniCenter);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniUpdate);

    // Create etaniFilter div
    const etaniFilter = document.createElement('div');
    etaniFilter.className = 'etaniFilter';

    // Create etaniFilterTiles span
    const etaniFilterTiles = document.createElement('span');
    etaniFilterTiles.className = 'etaniFilterTiles active';
    etaniFilterTiles.innerHTML = 'tiles';
    etaniFilter.appendChild(etaniFilterTiles);

    // Create etaniFilterMoving span
    const etaniFilterMoving = document.createElement('span');
    etaniFilterMoving.className = 'etaniFilterMoving';
    etaniFilterMoving.innerHTML = 'moving';
    etaniFilter.appendChild(etaniFilterMoving);

    // Create etaniFilterBoard span
    const etaniFilterBoard = document.createElement('span');
    etaniFilterBoard.className = 'etaniFilterBoard';
    etaniFilterBoard.innerHTML = 'board';
    etaniFilter.appendChild(etaniFilterBoard);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniFilter);

    // Add click event listeners for etaniFilter spans
    const filterSpans = etaniFilter.querySelectorAll('span');
    filterSpans.forEach(function(span) {
        span.addEventListener('click', function() {
            // Remove active from all spans in etaniFilter
            filterSpans.forEach(function(s) { s.classList.remove('active'); });
            // Add active to clicked span
            this.classList.add('active');
            // Update visibility after filter change
            updateVisibility();

            const active = document.querySelector('.etaniFilter .active');
            if (active && active.classList[0] === 'etaniFilterMoving') {
                if (intervalMoving) clearInterval(intervalMoving);
                intervalMoving = setInterval(updateMovingTiles, 1000);
                // Call immediately
                updateMovingTiles();
            } else {
                if (intervalMoving) clearInterval(intervalMoving);
                intervalMoving = null;
            }
        });
    });

    // Create etaniMode div
    const etaniMode = document.createElement('div');
    etaniMode.className = 'etaniMode';

    // Create etaniModeRepeat span
    const etaniModeRepeat = document.createElement('span');
    etaniModeRepeat.className = 'etaniModeRepeat active';
    etaniModeRepeat.innerHTML = 'repeat';
    etaniMode.appendChild(etaniModeRepeat);

    // Create etaniModeFreeze span
    const etaniModeFreeze = document.createElement('span');
    etaniModeFreeze.className = 'etaniModeFreeze';
    etaniModeFreeze.innerHTML = 'freeze';
    etaniMode.appendChild(etaniModeFreeze);

    // Create etaniModeMixed span
    const etaniModeMixed = document.createElement('span');
    etaniModeMixed.className = 'etaniModeMixed';
    etaniModeMixed.innerHTML = 'mixed';
    etaniMode.appendChild(etaniModeMixed);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniMode);

    // Add click event listeners for etaniMode spans
    const modeSpans = etaniMode.querySelectorAll('span');
    modeSpans.forEach(function(span) {
        span.addEventListener('click', function() {
            // Remove active from all spans in etaniMode
            modeSpans.forEach(function(s) { s.classList.remove('active'); });
            // Add active to clicked span
            this.classList.add('active');
        });
    });

    // Create etaniAllAppend div
    const etaniAllAppend = document.createElement('div');
    etaniAllAppend.className = 'etaniAllAppend';

    // Create etaniAllAppendTransform a
    const etaniAllAppendTransform = document.createElement('a');
    etaniAllAppendTransform.className = 'etaniAllAppendTransform';
    etaniAllAppendTransform.href = 'javascript:;';
    etaniAllAppendTransform.innerHTML = 'transform';
    etaniAllAppend.appendChild(etaniAllAppendTransform);

    // Create etaniAllAppendOpacity a
    const etaniAllAppendOpacity = document.createElement('a');
    etaniAllAppendOpacity.className = 'etaniAllAppendOpacity';
    etaniAllAppendOpacity.href = 'javascript:;';
    etaniAllAppendOpacity.innerHTML = 'opacity';
    etaniAllAppend.appendChild(etaniAllAppendOpacity);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniAllAppend);

    // Create etaniValue div
    const etaniValue = document.createElement('div');
    etaniValue.className = 'etaniValue';

    // Create etaniValueIncrease a
    const etaniValueIncrease = document.createElement('a');
    etaniValueIncrease.className = 'etaniValueIncrease';
    etaniValueIncrease.href = 'javascript:;';
    etaniValueIncrease.innerHTML = 'increase';
    etaniValue.appendChild(etaniValueIncrease);

    // Append to etaniCtrl
    etaniCtrl.appendChild(etaniValue);
}

// Define updateMovingTiles function
function updateMovingTiles() {
    const movingUse = document.querySelector('#etmain > .etdrop > use.tilemoving');
    const items = document.querySelectorAll('.etaniItem');
    items.forEach(function(item) {
        item.style.display = 'none';
    });
    if (movingUse) {
        const id = movingUse.getAttribute('href').slice(1);
        const item = document.querySelector('.etaniItem[data-id="' + id + '"]');
        if (item) {
            item.style.display = 'block';
        }
    }
}

// list Etani elements
function listEtaniItems() {
    // Get the etaniCol element
    let etaniCol = document.querySelector('.etaniCol');
    if (!etaniCol) return; // Exit if etaniCol not found

    // Clear existing content in etaniCol
    etaniCol.innerHTML = '';

    // Collect elements into etaniElementArray
    let uses = etani.querySelectorAll('.etdrop > use');
    let etanidrop = etani.getElementById('etanidrop');
    let boardElements = etani.querySelectorAll('.etdrop > .etboard [id]');
    let etaniElementArray = [...uses, etanidrop, ...boardElements];

    // Loop through etaniElementArray to create etaniItem elements
    etaniElementArray.forEach(function(element) {
        if (!element) return; // Skip if element is null

        // Determine itemId and dataType
        let itemId;
        let dataType;
        if (element.tagName === 'use') {
            itemId = element.getAttribute('href').slice(1);
            dataType = 'tile';
        } else if (element.id === 'etanidrop') {
            itemId = 'board';
            dataType = 'board';
        } else {
            itemId = element.id;
            dataType = 'board';
        }

        // Create etaniItem div
        const etaniItem = document.createElement('div');
        etaniItem.className = 'etaniItem';
        etaniItem.dataset.id = itemId;
        etaniItem.dataset.type = dataType;

        // Create etaniItemLeft div
        const etaniItemLeft = document.createElement('div');
        etaniItemLeft.className = 'etaniItemLeft';
        etaniItem.appendChild(etaniItemLeft);

        // Create etaniItemImageOuter div
        const etaniItemImageOuter = document.createElement('div');
        etaniItemImageOuter.className = 'etaniItemImageOuter';
        etaniItemLeft.appendChild(etaniItemImageOuter);

        // Create etaniItemImage img
        const etaniItemImage = document.createElement('img');
        etaniItemImage.className = 'etaniItemImage';
        etaniItemImageOuter.appendChild(etaniItemImage);

        // Create etaniItemId div
        const etaniItemId = document.createElement('div');
        etaniItemId.className = 'etaniItemId';
        etaniItemLeft.appendChild(etaniItemId);

        // Create etaniItemName span
        const etaniItemName = document.createElement('span');
        etaniItemName.className = 'etaniItemName';
        etaniItemName.innerHTML = itemId;
        etaniItemId.appendChild(etaniItemName);

        // Create etaniItemplus img
        const etaniItemplus = document.createElement('img');
        etaniItemplus.width = 12;
        etaniItemplus.height = 12;
        etaniItemplus.className = 'etaniItemplus';
        etaniItemId.appendChild(etaniItemplus);

        // Create etaniItemRight div
        const etaniItemRight = document.createElement('div');
        etaniItemRight.className = 'etaniItemRight';
        etaniItem.appendChild(etaniItemRight);

        // Append etaniItem to etaniCol
        etaniCol.appendChild(etaniItem);
    });
}

// Define updateVisibility function
function updateVisibility() {
    const active = document.querySelector('.etaniFilter .active');
    if (!active) return;

    const activeClass = active.classList[0]; // e.g., 'etaniFilterTiles'
    const items = document.querySelectorAll('.etaniItem');
    items.forEach(function(item) {
        item.style.display = 'none';
    });

    if (activeClass === 'etaniFilterTiles') {
        document.querySelectorAll('.etaniItem[data-type="tile"]').forEach(function(item) {
            item.style.display = 'block';
        });
    } else if (activeClass === 'etaniFilterBoard') {
        document.querySelectorAll('.etaniItem[data-type="board"]').forEach(function(item) {
            item.style.display = 'block';
        });
    } else if (activeClass === 'etaniFilterMoving') {
        document.querySelectorAll('.etaniItem[data-type="board"]').forEach(function(item) {
            item.style.display = 'block';
        });
        // Tiles visibility handled by interval
    }
}

function etaniStartClick() {
    const etaniouter = document.querySelector('.etaniouter');

    const originalSvg = document.getElementById('etmain');
    if (!originalSvg) {
        console.error('SVG with ID "etmain" not found.');
        return;
    }
    etani = originalSvg.cloneNode(true);
    const etwaitElement = etani.querySelector('.etwait');
    if (etwaitElement) {
        etwaitElement.remove();
    }
    etani.id = 'etani';
    const etdropClone = etani.querySelector('.etdrop');
    if (etdropClone) {
        etdropClone.id = 'etanidrop';
    }

    // Check if etaniinner already exists
    let etaniinner = etaniouter.querySelector('.etaniinner');
    if (etaniinner) {
        // Remove etaniinner
        etaniouter.removeChild(etaniinner);
        // Restore button text
        etaniStart.innerHTML = 'start ejtile animate';
    } else {
        // Create etaniinner div
        etaniinner = document.createElement('div');
        etaniinner.className = 'etaniinner';

        // Create etaniCtrl div
        const etaniCtrl = document.createElement('div');
        etaniCtrl.className = 'etaniCtrl';
        etaniinner.appendChild(etaniCtrl);

        // Create etaniCol div
        const etaniCol = document.createElement('div');
        etaniCol.className = 'etaniCol';
        etaniinner.appendChild(etaniCol);

        // Create etaniResult div
        const etaniResult = document.createElement('div');
        etaniResult.className = 'etaniResult';
        etaniinner.appendChild(etaniResult);

        // Append etaniinner to etaniouter
        etaniouter.appendChild(etaniinner);

        // Change button text
        etaniStart.innerHTML = 'close ejtile animate';

        // Append ctrl elements to etaniCtrl
        addEtaniCtrlElements();

        // list etani elements
        listEtaniItems();

        // update etani elements display by etaniFilter
        updateVisibility();
    }
}

// Initialize the animation control panel on window load
window.addEventListener('load', function() {
    // Get the etmainouter element
    const etmainouter = document.getElementById('etmainouter');
    if (!etmainouter) return; // Exit if etmainouter not found

    // insert dynamic style
    addEtaniStyles();

    // Create etaniouter div
    const etaniouter = document.createElement('div');
    etaniouter.className = 'etaniouter';

    // Create etaniStart button
    const etaniStart = document.createElement('button');
    etaniStart.id = 'etaniStart';
    etaniStart.innerHTML = 'start ejtile animate';

    // Append button to etaniouter
    etaniouter.appendChild(etaniStart);

    // Insert etaniouter after etmainouter
    etmainouter.parentNode.insertBefore(etaniouter, etmainouter.nextSibling);

    // Add click event listener to etaniStart
    etaniStart.addEventListener('click', etaniStartClick);
});

ejsoon · 帖子由 **ejsoon** » 2025年 10月 28日 10:09

做一個js函式，輸入一個字符串，以此為種子，輸出一個六位的十六進制數，再在它前面加上#。比如結果為「#dac677」。

代码：全选

function generateHexColor(seed) {
  let hash = 0;
  for (let i = 0; i < seed.length; i++) {
    hash = seed.charCodeAt(i) + ((hash << 5) - hash);
  }
  let color = (hash & 0x00FFFFFF).toString(16).toUpperCase();
  while (color.length < 6) {
    color = '0' + color;
  }
  return '#' + color;
}

ejsoon · 帖子由 **ejsoon** » 2025年 10月 28日 10:24

代码：全选

<div class="etaniWindow">
	<div class="etaniAppendRow">
		<strong>id: <span class="etaniAppendId">tile10</span></strong>
	</div>
	<div class="etaniAppendRow">
		<a class="etaniAppendTransform" href="javascript:;">Transform</a>
		<a class="etaniAppendMotion" href="javascript:;">Motion</a>
		<span class="etaniAppendSet">Set</span>
	</div>
	<div class="etaniAppendRow">
		<a class="etaniAppendOpacity" href="javascript:;">Opacity</a>
		<a class="etaniAppendWriting" href="javascript:;">Writing</a>
	</div>
	<div class="etaniAppendRow">
		<a class="etaniAppendFill" href="javascript:;">Fill</a>
		<a class="etaniAppendStroke" href="javascript:;">Stroke</a>
		<a class="etaniAppendWidth" href="javascript:;">Width</a>
	</div>
	<div class="etaniAppendRow">
		<label>specify: </label>
		<input type="text" class="etaniAppendSpecify">
	</div>
	<div class="etaniAppendRow">
		<button>Confirm</button>
		<button>Cancel</button>
	</div>
</div>

正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

Re: 正在做etani，ejtile的動畫套件

在线用户