refactor: Add comments & optimize code
parent
2966a8162f
commit
83491ce28c
|
@ -1,4 +1,5 @@
|
|||
let isRead = localStorage.getItem('readChecked') !== 'false';
|
||||
// initialize from localStorage
|
||||
let isRead = localStorage.getItem('readChecked') !== 'false'; // default to true
|
||||
let isChoose = localStorage.getItem('chooseChecked') !== 'false';
|
||||
|
||||
function getWord() {
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
let isHighlight = localStorage.getItem('highlightChecked') !== 'false';
|
||||
let isHighlight = localStorage.getItem('highlightChecked') !== 'false'; // default to true
|
||||
|
||||
function cancelBtnHandler() {
|
||||
cancelHighlighting();
|
||||
|
|
|
@ -54,18 +54,20 @@
|
|||
{% endfor %}
|
||||
{% endif %}
|
||||
<script type="text/javascript">
|
||||
window.onload = function() {
|
||||
document.getElementById('article').value = localStorage.getItem('article') || '';
|
||||
}
|
||||
document.getElementById('article').addEventListener('input', saveArticle);
|
||||
// IIFE, avoid polluting the global scope
|
||||
(function() {
|
||||
const articleInput = document.querySelector('#article');
|
||||
articleInput.value = localStorage.getItem('article') || '';
|
||||
|
||||
function saveArticle() {
|
||||
localStorage.setItem('article', document.getElementById('article').value);
|
||||
}
|
||||
articleInput.addEventListener('input', function() {
|
||||
localStorage.setItem('article', articleInput.value);
|
||||
});
|
||||
|
||||
function clearArticle() {
|
||||
localStorage.removeItem('article');
|
||||
}
|
||||
window.clearArticle = function() {
|
||||
localStorage.removeItem('article');
|
||||
articleInput.value = '';
|
||||
};
|
||||
})();
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
|
|
@ -117,7 +117,7 @@
|
|||
<div class="sliderValue">
|
||||
<span id="rangeValue">1×</span>
|
||||
</div>
|
||||
<input type="range" id="rangeComponent" min="0.5" max="2" value="1" step="0.25" onchange="saveRangeValue()" />
|
||||
<input type="range" id="rangeComponent" min="0.5" max="2" value="1" step="0.25" />
|
||||
</div>
|
||||
</div>
|
||||
<p><b>收集生词吧</b> (可以在正文中划词,也可以复制黏贴)</p>
|
||||
|
@ -174,40 +174,53 @@
|
|||
{% endif %}
|
||||
<script type="text/javascript">
|
||||
window.onload = function () { // 页面加载时执行
|
||||
const highlightChecked = localStorage.getItem('highlightChecked') !== 'false';
|
||||
const readChecked = localStorage.getItem('readChecked') !== 'false';
|
||||
const chooseChecked = localStorage.getItem('chooseChecked') !== 'false';
|
||||
const rangeValue = localStorage.getItem('rangeValue') || '1';
|
||||
const selectedWords = localStorage.getItem('selectedWords') || '';
|
||||
const settings = {
|
||||
// initialize settings from localStorage
|
||||
highlightChecked: localStorage.getItem('highlightChecked') !== 'false', // localStorage stores strings, default to true. same below
|
||||
readChecked: localStorage.getItem('readChecked') !== 'false',
|
||||
chooseChecked: localStorage.getItem('chooseChecked') !== 'false',
|
||||
rangeValue: localStorage.getItem('rangeValue') || '1',
|
||||
selectedWords: localStorage.getItem('selectedWords') || ''
|
||||
};
|
||||
|
||||
document.getElementById('highlightCheckbox').checked = highlightChecked;
|
||||
document.getElementById('readCheckbox').checked = readChecked;
|
||||
document.getElementById('chooseCheckbox').checked = chooseChecked;
|
||||
document.getElementById('rangeComponent').value = rangeValue;
|
||||
document.getElementById('rangeValue').innerHTML = rangeValue + 'x';
|
||||
document.getElementById('selected-words').value = selectedWords;
|
||||
const elements = {
|
||||
highlightCheckbox: document.querySelector('#highlightCheckbox'),
|
||||
readCheckbox: document.querySelector('#readCheckbox'),
|
||||
chooseCheckbox: document.querySelector('#chooseCheckbox'),
|
||||
rangeComponent: document.querySelector('#rangeComponent'),
|
||||
rangeValueDisplay: document.querySelector('#rangeValue'),
|
||||
selectedWordsInput: document.querySelector('#selected-words')
|
||||
};
|
||||
// 应用设置到页面元素
|
||||
elements.highlightCheckbox.checked = settings.highlightChecked;
|
||||
elements.readCheckbox.checked = settings.readChecked;
|
||||
elements.chooseCheckbox.checked = settings.chooseChecked;
|
||||
elements.rangeComponent.value = settings.rangeValue;
|
||||
elements.rangeValueDisplay.textContent = `${settings.rangeValue}x`;
|
||||
elements.selectedWordsInput.value = settings.selectedWords;
|
||||
|
||||
// 刷新页面或进入页面时判断,若不是首篇文章,则上一篇按钮可见
|
||||
if(sessionStorage.getItem('pre_page_button')!="display" && sessionStorage.getItem('pre_page_button')){
|
||||
if (sessionStorage.getItem('pre_page_button') !== 'display' && sessionStorage.getItem('pre_page_button')) {
|
||||
$('#load_pre_article').show();
|
||||
}
|
||||
};
|
||||
document.getElementById('selected-words').addEventListener('input', saveSelectedWords);
|
||||
|
||||
function saveSelectedWords() {
|
||||
let selectedWordsTextarea = document.getElementById('selected-words');
|
||||
localStorage.setItem('selectedWords', selectedWordsTextarea.value);
|
||||
}
|
||||
// 事件监听器
|
||||
elements.selectedWordsInput.addEventListener('input', () => {
|
||||
localStorage.setItem('selectedWords', elements.selectedWordsInput.value);
|
||||
});
|
||||
|
||||
elements.rangeComponent.addEventListener('input', () => {
|
||||
const rangeValue = elements.rangeComponent.value;
|
||||
elements.rangeValueDisplay.textContent = `${rangeValue}x`;
|
||||
localStorage.setItem('rangeValue', rangeValue);
|
||||
});
|
||||
};
|
||||
|
||||
function clearSelectedWords() {
|
||||
localStorage.removeItem('selectedWords');
|
||||
document.querySelector('#selected-words').value = '';
|
||||
}
|
||||
|
||||
function saveRangeValue() {
|
||||
const rangeValue = document.getElementById('rangeComponent').value;
|
||||
document.getElementById('rangeValue').textContent = rangeValue;
|
||||
localStorage.setItem('rangeValue', rangeValue);
|
||||
}
|
||||
|
||||
function load_next_article(){
|
||||
$.ajax({
|
||||
|
|
Loading…
Reference in New Issue