`;
document.body.appendChild(this.container);
}
bindEvents() {
// 最小化/展开按钮
const minimizeBtn = this.container.querySelector('#minimizeBtn');
minimizeBtn.addEventListener('click', () => this.toggleMinimize());
// 开关
const enableSwitch = this.container.querySelector('#enableSwitch');
enableSwitch.addEventListener('change', (e) => {
this.settings.isEnabled = e.target.checked;
this.saveSettings();
if (e.target.checked) {
this.start();
} else {
this.stop();
}
});
// 输入框
const intervalInput = this.container.querySelector('#intervalInput');
intervalInput.addEventListener('change', (e) => {
this.settings.refreshInterval = parseInt(e.target.value) || 30;
this.saveSettings();
if (this.isActive) {
this.restart();
}
});
const maxRunsInput = this.container.querySelector('#maxRunsInput');
maxRunsInput.addEventListener('change', (e) => {
this.settings.maxRuns = parseInt(e.target.value) || 0;
this.saveSettings();
});
// 标签页选择
const tabOptions = this.container.querySelectorAll('input[name="targetTab"]');
tabOptions.forEach(option => {
option.addEventListener('change', (e) => {
this.settings.targetTab = e.target.value;
this.saveSettings();
// 更新选中状态
this.container.querySelectorAll('.tab-option').forEach(tab => {
tab.classList.remove('selected');
});
e.target.closest('.tab-option').classList.add('selected');
});
});
// 按钮
this.container.querySelector('#startBtn').addEventListener('click', () => this.start());
this.container.querySelector('#stopBtn').addEventListener('click', () => this.stop());
this.container.querySelector('#resetBtn').addEventListener('click', () => this.reset());
// 键盘快捷键
document.addEventListener('keydown', (e) => {
if (e.ctrlKey && e.shiftKey && e.key === 'R') {
e.preventDefault();
this.toggle();
}
});
}
toggleMinimize() {
this.isMinimized = !this.isMinimized;
GM_setValue('isMinimized', this.isMinimized);
this.container.classList.toggle('minimized', this.isMinimized);
const minimizeBtn = this.container.querySelector('#minimizeBtn .material-icons');
minimizeBtn.textContent = this.isMinimized ? 'expand_more' : 'remove';
}
makeDraggable() {
const header = this.container.querySelector('.refresh-header');
let isDragging = false;
let startX, startY, startLeft, startTop;
header.addEventListener('mousedown', (e) => {
if (e.target.closest('.toggle-btn')) return;
isDragging = true;
startX = e.clientX;
startY = e.clientY;
const rect = this.container.getBoundingClientRect();
startLeft = rect.left;
startTop = rect.top;
document.addEventListener('mousemove', handleMouseMove);
document.addEventListener('mouseup', handleMouseUp);
e.preventDefault();
});
const handleMouseMove = (e) => {
if (!isDragging) return;
const newLeft = startLeft + (e.clientX - startX);
const newTop = startTop + (e.clientY - startY);
this.container.style.left = Math.max(0, Math.min(window.innerWidth - this.container.offsetWidth, newLeft)) + 'px';
this.container.style.top = Math.max(0, Math.min(window.innerHeight - this.container.offsetHeight, newTop)) + 'px';
this.container.style.right = 'auto';
};
const handleMouseUp = () => {
isDragging = false;
document.removeEventListener('mousemove', handleMouseMove);
document.removeEventListener('mouseup', handleMouseUp);
};
}
start() {
if (this.isActive) return;
this.isActive = true;
this.currentCount = 0;
this.settings.isEnabled = true;
this.saveSettings();
const enableSwitch = this.container.querySelector('#enableSwitch');
enableSwitch.checked = true;
this.scheduleNextRefresh();
this.updateUI();
}
stop() {
this.isActive = false;
this.settings.isEnabled = false;
this.saveSettings();
const enableSwitch = this.container.querySelector('#enableSwitch');
enableSwitch.checked = false;
if (this.interval) {
clearTimeout(this.interval);
this.interval = null;
}
this.updateUI();
}
restart() {
this.stop();
setTimeout(() => this.start(), 100);
}
reset() {
this.stop();
this.currentCount = 0;
this.updateUI();
}
toggle() {
if (this.isActive) {
this.stop();
} else {
this.start();
}
}
scheduleNextRefresh() {
if (!this.isActive) return;
const intervalMs = this.settings.refreshInterval * 1000;
let timeLeft = intervalMs;
// 更新进度条
const updateProgress = () => {
if (!this.isActive) return;
const progress = ((intervalMs - timeLeft) / intervalMs) * 100;
const progressFill = this.container.querySelector('#progressFill');
if (progressFill) {
progressFill.style.width = progress + '%';
}
timeLeft -= 100;
if (timeLeft > 0) {
setTimeout(updateProgress, 100);
}
};
updateProgress();
this.interval = setTimeout(() => {
this.performRefresh();
}, intervalMs);
}
performRefresh() {
if (!this.isActive) return;
this.currentCount++;
if (this.settings.targetTab === 'current') {
window.location.reload();
} else if (this.settings.targetTab === 'all') {
// 对于所有标签页模式，我们刷新当前页面
// 注意：由于安全限制，用户脚本无法直接操作其他标签页
window.location.reload();
}
// 检查是否达到最大运行次数
if (this.settings.maxRuns > 0 && this.currentCount >= this.settings.maxRuns) {
this.stop();
return;
}
// 继续下一次刷新
this.scheduleNextRefresh();
this.updateUI();
}
updateUI() {
const statusInfo = this.container.querySelector('#statusInfo');
const startBtn = this.container.querySelector('#startBtn');
const stopBtn = this.container.querySelector('#stopBtn');
const progressFill = this.container.querySelector('#progressFill');
if (this.isActive) {
const maxText = this.settings.maxRuns > 0 ? ` / ${this.settings.maxRuns}` : '';
statusInfo.innerHTML = `
状态：运行中 | 已刷新：${this.currentCount}${maxText} 次 | 间隔：${this.settings.refreshInterval}秒