mirror of
https://bitbucket.org/skobkin/chrome_point_plus.git
synced 2024-12-28 17:24:20 +00:00
Merged in isqua/chrome_point_plus/simplify_options (pull request #23) Enhance options
This commit is contained in:
Alexey Skobkin
commit
7db44c4715
|
|
@ -1,132 +1,162 @@
|
|||
/* Options page */
|
||||
.pp-options {
|
||||
body
|
||||
{
|
||||
font-family: Arial;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
|
||||
width: 450px;
|
||||
height: 450px;
|
||||
background: #EEE;
|
||||
}
|
||||
|
||||
/* Tabs style */
|
||||
.pp-options .usual {
|
||||
width:450px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.pp-options .usual ul {
|
||||
padding: 0 0 10px 0;
|
||||
margin: 0 0 18px 0;
|
||||
}
|
||||
|
||||
.pp-options .usual li {
|
||||
list-style: none;
|
||||
float: left;
|
||||
}
|
||||
.pp-options .usual ul a {
|
||||
display: block;
|
||||
padding: 6px 10px;
|
||||
text-decoration: none!important;
|
||||
margin: 1px;
|
||||
margin-left: 0;
|
||||
font: 12px Georgia;
|
||||
color: #FFF;
|
||||
background: #C8C8C8;
|
||||
border-radius: 15px 15px 0 0;
|
||||
}
|
||||
.pp-options .usual ul a:hover {
|
||||
color: #FFF;
|
||||
background: #BBB;
|
||||
}
|
||||
.pp-options .usual ul a.selected {
|
||||
margin-bottom: 0;
|
||||
color: #FFF;
|
||||
background: #A5A5A5;
|
||||
cursor: default;
|
||||
}
|
||||
.pp-options .usual div#tabs-content {
|
||||
margin: 0 5px 0 0;
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
background-color: #A5A5A5;
|
||||
border-radius: 0 15px 0 0;
|
||||
|
||||
}
|
||||
.pp-options .usual #panel {
|
||||
background: #B5B5B5;
|
||||
margin: 0 5px 0 0;
|
||||
padding: 10px;
|
||||
border-radius: 0 0 15px 15px;
|
||||
display: flex;
|
||||
}
|
||||
.pp-options .usual #panel button.button {
|
||||
background-color: #C8C8C8;
|
||||
border-radius:15px;
|
||||
border:1px solid #dcdcdc;
|
||||
display:inline-block;
|
||||
cursor:pointer;
|
||||
color:#000;
|
||||
font-family:Arial;
|
||||
font-size:15px;
|
||||
font-weight:bold;
|
||||
padding: 5px 25px;
|
||||
text-decoration:none;
|
||||
text-shadow:0px 1px 0px #ffffff;
|
||||
}
|
||||
.pp-options .usual #panel button.button:hover{
|
||||
background-color:#BBB;
|
||||
}
|
||||
.pp-options .usual #panel button.button:active {
|
||||
position:relative;
|
||||
top:1px;
|
||||
}
|
||||
|
||||
.pp-options .usual div a {
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.pp-options .tab-content {
|
||||
padding: 5px 0 0 5px;
|
||||
a
|
||||
{
|
||||
color: #1abef1;
|
||||
}
|
||||
|
||||
.pp-options .option-node {
|
||||
p
|
||||
{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.tabs-list
|
||||
{
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
|
||||
display: block;
|
||||
margin: 5px 0 5px 15px;
|
||||
|
||||
margin: 0 0 -1px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.pp-options .option-node label {
|
||||
font: 10pt Georgia;
|
||||
color: #FFF;
|
||||
.tabs-item
|
||||
{
|
||||
display: inline-block;
|
||||
|
||||
padding: 7px 15px 3px;
|
||||
|
||||
list-style-type: none;
|
||||
|
||||
text-decoration: none;
|
||||
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.pp-options .tab-content .text {
|
||||
margin-left: 15px;
|
||||
.tabs-item.selected
|
||||
{
|
||||
cursor: default;
|
||||
|
||||
border-color: #dedede;
|
||||
border-bottom-color: #fff;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
/* Disables subcheckboxes if parent disabled */
|
||||
.pp-options .option-node input[type="checkbox"]:not(:checked) ~.option-node {
|
||||
.tabs-content
|
||||
{
|
||||
position: relative;
|
||||
|
||||
height: 345px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
border: 1px solid #dedede;
|
||||
border-radius: 0 0 3px 3px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.tabs-content::before
|
||||
{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
|
||||
height: 20px;
|
||||
|
||||
content: '';
|
||||
|
||||
background-image: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,0) 100%);
|
||||
background-size: 20px 20px;
|
||||
}
|
||||
|
||||
.tabs-content-item
|
||||
{
|
||||
display: none;
|
||||
overflow: auto;
|
||||
|
||||
box-sizing: border-box;
|
||||
max-height: 100%;
|
||||
margin: 0;
|
||||
padding: 10px 15px 5px;
|
||||
|
||||
border: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.tabs-content-item.selected
|
||||
{
|
||||
display: block;
|
||||
}
|
||||
|
||||
input[type='checkbox']
|
||||
{
|
||||
margin-right: 5px;
|
||||
margin-left: 0;
|
||||
|
||||
vertical-align: 1px;
|
||||
}
|
||||
.option-node
|
||||
{
|
||||
display: block;
|
||||
|
||||
padding: 0 0 5px 21px;
|
||||
|
||||
text-indent: -21px;
|
||||
}
|
||||
|
||||
.option-node input[type='checkbox']:not(:checked) ~ .option-node
|
||||
{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.pp-options .option-node input[type="checkbox"]:not(:checked) ~.option-node label {
|
||||
color: #BBB;
|
||||
.option-node input[type='checkbox']:not(:checked) ~ .option-node label
|
||||
{
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* Panel */
|
||||
.pp-options .left, .pp-options .right {
|
||||
width: 50%;
|
||||
.footer
|
||||
{
|
||||
margin: 0;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
||||
.pp-options .left {
|
||||
float: left;
|
||||
.saved
|
||||
{
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
|
||||
margin: -2px 1px 0;
|
||||
padding: 10px 15px;
|
||||
|
||||
transition: all .2s;
|
||||
transform-origin: 50% 0;
|
||||
|
||||
color: #fff;
|
||||
border-top: 1px solid #dedede;
|
||||
border-radius: 0 0 2px 2px;
|
||||
background: #4caf50;
|
||||
}
|
||||
|
||||
.pp-options .right {
|
||||
float: right;
|
||||
}
|
||||
.saved.hidden
|
||||
{
|
||||
transform: scaleY(.5);
|
||||
|
||||
.pp-options #status {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.pp-options #pp-version {
|
||||
margin-top: 6px;
|
||||
text-align: right;
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
$(document).ready(function() {
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Processing all emenents contains data-i18n attribute
|
||||
$('[data-i18n]').each(function() {
|
||||
$(this).html(chrome.i18n.getMessage($(this).data('i18n')));
|
||||
Array.prototype.forEach.call(document.querySelectorAll('[data-i18n]'), function(elem) {
|
||||
elem.innerHTML = chrome.i18n.getMessage(elem.dataset.i18n);
|
||||
});
|
||||
});
|
||||
}, false);
|
||||
|
|
|
|||
|
|
@ -22,26 +22,27 @@ function getVersion() {
|
|||
*/
|
||||
function Options() {
|
||||
this.version = getVersion();
|
||||
this.form = document.querySelector('form');
|
||||
|
||||
this.showVersion();
|
||||
this.restore();
|
||||
|
||||
$('#tabs-content').on('click', 'input', this._onChange.bind(this));
|
||||
this.form.addEventListener('change', this._onChange.bind(this));
|
||||
this.listenTabs();
|
||||
}
|
||||
|
||||
/**
|
||||
* Получает версию настроек. Если она не равна версии приложения, записывает в сторедж плагина настройки из инпутов
|
||||
* и версию приложения.
|
||||
*/
|
||||
Options.prototype.init = function() {
|
||||
Options.prototype.updateOptionsFromFrom = function() {
|
||||
chrome.storage.sync.get('options_version', function(data) {
|
||||
this.logVersion(data.options_version);
|
||||
|
||||
if (data.options_version !== this.version) {
|
||||
console.log('Initializing options...');
|
||||
|
||||
$('#tabs-content input').each(function(index, input) {
|
||||
this.updateOptionFromInput($(input));
|
||||
}.bind(this));
|
||||
Array.prototype.forEach.call(this.form.elements, this.updateOptionFromInput.bind(this));
|
||||
|
||||
chrome.storage.sync.set({
|
||||
options: this.getValues(),
|
||||
|
|
@ -49,7 +50,9 @@ Options.prototype.init = function() {
|
|||
}, function() {
|
||||
console.log('Default options initialized. Version upgraded to %s.', this.version);
|
||||
|
||||
alert(chrome.i18n.getMessage('options_text_new_version'));
|
||||
if ( ! confirm(chrome.i18n.getMessage('options_text_new_version'))) {
|
||||
window.close();
|
||||
}
|
||||
});
|
||||
}
|
||||
}.bind(this));
|
||||
|
|
@ -63,11 +66,7 @@ Options.prototype.save = function() {
|
|||
|
||||
console.log('Saving options: %O', ppOptions);
|
||||
|
||||
// Saving parameters
|
||||
chrome.storage.sync.set({ options: ppOptions }, function() {
|
||||
// Update status to let user know options were saved.
|
||||
$('#status').html(chrome.i18n.getMessage('options_text_saved'));
|
||||
});
|
||||
chrome.storage.sync.set({ options: ppOptions }, this.updateStatus.bind(this));
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -80,26 +79,28 @@ Options.prototype.restore = function() {
|
|||
this._options = data.options || {};
|
||||
|
||||
// Setting options in DOM
|
||||
$.each(this._options, function(key, data) {
|
||||
switch (data.type) {
|
||||
case 'boolean':
|
||||
if (data.value) {
|
||||
$('#' + this.getOptionName(key)).prop('checked', true);
|
||||
}
|
||||
break;
|
||||
Object.keys(this._options).forEach(function(key) {
|
||||
var data = this._options[key],
|
||||
input = this.form.elements[this.getOptionName(key)];
|
||||
|
||||
case 'enum':
|
||||
$('.option-node .option-enum[name="' + this.getOptionName(key) + '"][value="' + data.value + '"]').prop('checked', true);
|
||||
break;
|
||||
if (input) {
|
||||
switch (data.type) {
|
||||
case 'boolean':
|
||||
input.checked = data.value;
|
||||
break;
|
||||
|
||||
default:
|
||||
console.warn('Invalid option "%s" type: %O', key, data);
|
||||
break;
|
||||
case 'enum':
|
||||
input.value = data.value;
|
||||
break;
|
||||
|
||||
default:
|
||||
console.warn('Invalid option "%s" type: %O', key, data);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.showCopyright();
|
||||
this.init();
|
||||
this.updateOptionsFromFrom();
|
||||
}.bind(this));
|
||||
};
|
||||
|
||||
|
|
@ -110,43 +111,45 @@ Options.prototype.getValues = function() {
|
|||
return this._options;
|
||||
};
|
||||
|
||||
/**
|
||||
* @param {Event} event Событие изменения
|
||||
*/
|
||||
Options.prototype._onChange = function(event) {
|
||||
var $input = $(event.target);
|
||||
|
||||
this.updateOptionFromInput($input);
|
||||
|
||||
this.updateOptionFromInput(event.target);
|
||||
this.save();
|
||||
};
|
||||
|
||||
Options.prototype.updateOptionFromInput = function($input) {
|
||||
if (this.isBoolean($input)) {
|
||||
this._options[this.getOptionKey($input.prop('id'))] = {
|
||||
Options.prototype.updateOptionFromInput = function(input) {
|
||||
var key = this.getOptionKey(input.name);
|
||||
|
||||
if (this.isBoolean(input)) {
|
||||
this._options[key] = {
|
||||
type: 'boolean',
|
||||
value: $input.prop('checked')
|
||||
value: input.checked
|
||||
};
|
||||
} else if (this.isEnum($input)) {
|
||||
this._options[this.getOptionKey($input.prop('name'))] = {
|
||||
} else if (this.isEnum(input)) {
|
||||
this._options[key] = {
|
||||
type: 'enum',
|
||||
value: $input.val()
|
||||
value: input.value
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @param {jQuery} $option Элемент опции
|
||||
* @param {HTMLElement} option Элемент опции
|
||||
* @returns {Boolean} Является ли настройка булевой
|
||||
*/
|
||||
Options.prototype.isBoolean = function($option) {
|
||||
return $option.hasClass('option-boolean');
|
||||
Options.prototype.isBoolean = function(option) {
|
||||
return option.getAttribute('type') === 'checkbox';
|
||||
};
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {jQuery} $option Элемент опции
|
||||
* @param {HTMLElement} option Элемент опции
|
||||
* @returns {Boolean} Является ли настройка енумом
|
||||
*/
|
||||
Options.prototype.isEnum = function($option) {
|
||||
return $option.hasClass('option-enum');
|
||||
Options.prototype.isEnum = function(option) {
|
||||
return option.getAttribute('type') === 'radio';
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -174,13 +177,10 @@ Options.prototype.logVersion = function(optionsVersion) {
|
|||
};
|
||||
|
||||
/**
|
||||
* Добавляет копирайт в подвал
|
||||
* Добавляет номер версии в подвал
|
||||
*/
|
||||
Options.prototype.showCopyright = function() {
|
||||
$('#pp-version').html('Point+ ' + this.version
|
||||
+ ' by <a href="https://skobkin-ru.point.im/" target="_blank">@skobkin-ru</a><br>\n'
|
||||
+ '& <a href="https://nokitakaze.point.im/" target="_blank">@NokitaKaze</a>'
|
||||
);
|
||||
Options.prototype.showVersion = function() {
|
||||
document.querySelector('#version').innerHTML = this.version;
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -205,4 +205,38 @@ Options.prototype.checkOldStyle = function() {
|
|||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Показывает плашку про то, что настройки сохранились и надо обновить страницу
|
||||
*/
|
||||
Options.prototype.updateStatus = function() {
|
||||
this.status = this.status || document.querySelector('.saved');
|
||||
|
||||
this.status.classList.remove('hidden');
|
||||
};
|
||||
|
||||
/**
|
||||
* Слушает события на табах
|
||||
*/
|
||||
Options.prototype.listenTabs = function() {
|
||||
var options = this;
|
||||
|
||||
options._selectedItem = document.querySelector('.tabs-item.selected');
|
||||
options._selectedContent = document.querySelector('.tabs-content-item.selected');
|
||||
|
||||
Array.prototype.forEach.call(document.querySelectorAll('.tabs-item'), function(tabItem) {
|
||||
var tabContent = document.querySelector(tabItem.getAttribute('href'));
|
||||
|
||||
tabItem.addEventListener('click', function() {
|
||||
options._selectedItem.classList.remove('selected');
|
||||
options._selectedContent.classList.remove('selected');
|
||||
|
||||
this.classList.add('selected');
|
||||
tabContent.classList.add('selected');
|
||||
|
||||
options._selectedItem = this;
|
||||
options._selectedContent = tabContent;
|
||||
}, false);
|
||||
});
|
||||
};
|
||||
|
||||
new Options();
|
||||
|
|
|
|||
|
|
@ -1,241 +1,299 @@
|
|||
<html>
|
||||
<!DOCTYPE html>
|
||||
<html xmlns="http://www.w3.org/1999/html">
|
||||
<head>
|
||||
<title>Point Plus options</title>
|
||||
|
||||
<link rel="stylesheet" href="css/options.css" type="text/css"/>
|
||||
<script src="vendor/jquery/jquery.min.js"></script>
|
||||
<script src="js/jquery.idTabs.min.js"></script>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="css/options.css" type="text/css">
|
||||
</head>
|
||||
|
||||
<body class="pp-options">
|
||||
<div class="tabs usual">
|
||||
<ul class="idTabs">
|
||||
<li><a href="#media" data-i18n="options_tabs_media"></a></li>
|
||||
<li><a href="#other" data-i18n="options_tabs_other"></a></li>
|
||||
<li><a href="#websocket" data-i18n="options_tabs_websocket"></a></li>
|
||||
<li><a href="#feedback" data-i18n="options_tabs_feedback"></a></li>
|
||||
</ul>
|
||||
<main class="tabs">
|
||||
<nav class="tabs-list">
|
||||
<a class="tabs-item selected" href="#media" data-i18n="options_tabs_media"></a>
|
||||
<a class="tabs-item" href="#other" data-i18n="options_tabs_other"></a>
|
||||
<a class="tabs-item" href="#websocket" data-i18n="options_tabs_websocket"></a>
|
||||
<a class="tabs-item" href="#feedback" data-i18n="options_tabs_feedback"></a>
|
||||
</nav>
|
||||
|
||||
<div id="tabs-content">
|
||||
<div class="tab-content" id="media">
|
||||
<form class="tabs-content">
|
||||
<section class="tabs-content-item selected" id="media">
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-fancybox"><label for="option-fancybox" data-i18n="option_fancybox"></label>
|
||||
<input type="checkbox" name="option-fancybox" id="option-fancybox">
|
||||
<label for="option-fancybox" data-i18n="option_fancybox"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-fancybox-images"><label for="option-fancybox-images" data-i18n="option_fancybox_images"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-fancybox-images">
|
||||
<span data-i18n="option_fancybox_images"></span>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-fancybox-videos"><label for="option-fancybox-videos" data-i18n="option_fancybox_videos"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-fancybox-videos">
|
||||
<span data-i18n="option_fancybox_videos"></span>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-fancybox-posts"><label for="option-fancybox-posts" data-i18n="option_fancybox_posts"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-fancybox-posts">
|
||||
<span data-i18n="option_fancybox_posts"></span>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-fancybox-bind-images-to-one-flow"><label for="option-fancybox-bind-images-to-one-flow" data-i18n="option_fancybox_bind_images_to_one_flow"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-fancybox-bind-images-to-one-flow">
|
||||
<span data-i18n="option_fancybox_bind_images_to_one_flow"></span>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-fancybox-smart-hints"><label for="option-fancybox-smart-hints" data-i18n="option_fancybox_smart_hints"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-fancybox-smart-hints">
|
||||
<span data-i18n="option_fancybox_smart_hints"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-images-load-original"><label for="option-images-load-original" data-i18n="option_images_load_original"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-images-load-original">
|
||||
<span data-i18n="option_images_load_original"></span>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding"><label for="option-embedding" data-i18n="option_embedding"></label>
|
||||
<input type="checkbox" name="option-embedding" id="option-embedding">
|
||||
<label for="option-embedding" data-i18n="option_embedding"></label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-images-load-booru">
|
||||
<span data-i18n="option_images_load_booru"></span>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-images-load-booru"><label for="option-images-load-booru" data-i18n="option_images_load_booru"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-videos-parse-links"><label for="option-videos-parse-links" data-i18n="option_videos_parse_links"></label>
|
||||
<input type="checkbox" name="option-videos-parse-links" id="option-videos-parse-links">
|
||||
<label for="option-videos-parse-links" data-i18n="option_videos_parse_links"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="radio" class="option-enum" name="option-videos-parse-links-type" id="option-videos-parse-webm" value="webm" ><label for="option-videos-parse-webm" data-i18n="option_videos_parse_webm"></label>
|
||||
<input type="radio" class="option-enum" name="option-videos-parse-links-type" id="option-videos-parse-all-links" value="all" checked="checked"><label for="option-videos-parse-all-links" data-i18n="option_videos_parse_all_links"></label>
|
||||
<label>
|
||||
<input type="radio" name="option-videos-parse-links-type" value="webm">
|
||||
<span data-i18n="option_videos_parse_webm"></span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="option-videos-parse-links-type" value="all" checked="checked">
|
||||
<span data-i18n="option_videos_parse_all_links"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-videos-parse-leave-links"><label for="option-videos-parse-leave-links" data-i18n="option_videos_parse_leave_links"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-videos-parse-leave-links">
|
||||
<span data-i18n="option_videos_parse_leave_links"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-audios-parse-links"><label for="option-audios-parse-links" data-i18n="option_audios_parse_links"></label>
|
||||
<input type="checkbox" name="option-audios-parse-links" id="option-audios-parse-links">
|
||||
<label for="option-audios-parse-links" data-i18n="option_audios_parse_links"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-audios-parse-leave-links"><label for="option-audios-parse-leave-links" data-i18n="option_embedding_soundcloud_orig_link"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-audios-parse-leave-links">
|
||||
<span data-i18n="option_embedding_soundcloud_orig_link"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding-soundcloud"><label for="option-embedding-soundcloud" data-i18n="option_embedding_soundcloud"></label>
|
||||
<input type="checkbox" name="option-embedding-soundcloud" id="option-embedding-soundcloud">
|
||||
<label for="option-embedding-soundcloud" data-i18n="option_embedding_soundcloud"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding-soundcloud-orig-link"><label for="option-embedding-soundcloud-orig-link" data-i18n="option_embedding_soundcloud_orig_link"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-embedding-soundcloud-orig-link">
|
||||
<span data-i18n="option_embedding_soundcloud_orig_link"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding-pleercom"><label for="option-embedding-pleercom" data-i18n="option_embedding_pleercom"></label>
|
||||
<input type="checkbox" name="option-embedding-pleercom" id="option-embedding-pleercom">
|
||||
<label for="option-embedding-pleercom" data-i18n="option_embedding_pleercom"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding-pleercom-nokita-server"><label for="option-embedding-pleercom-nokita-server" data-i18n="option_embedding_pleercom_nokita_server"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-embedding-pleercom-nokita-server">
|
||||
<span data-i18n="option_embedding_pleercom_nokita_server"></span>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding-pleercom-orig-link"><label for="option-embedding-pleercom-orig-link" data-i18n="option_embedding_soundcloud_orig_link"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-embedding-pleercom-orig-link">
|
||||
<span data-i18n="option_embedding_soundcloud_orig_link"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding-coubcom"><label for="option-embedding-coubcom" data-i18n="option_embedding_coubcom"></label>
|
||||
<input type="checkbox" name="option-embedding-coubcom" id="option-embedding-coubcom">
|
||||
<label for="option-embedding-coubcom" data-i18n="option_embedding_coubcom"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding-coubcom-orig-link"><label for="option-embedding-coubcom-orig-link" data-i18n="option_embedding_soundcloud_orig_link"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-embedding-coubcom-orig-link">
|
||||
<span data-i18n="option_embedding_soundcloud_orig_link"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-embedding-twitter-tweets">
|
||||
<span data-i18n="option_embedding_twitter_tweets"></label>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" name="option-nsfw" id="option-nsfw">
|
||||
<label for="option-nsfw" data-i18n="option_nsfw"></label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-nsfw-hide-posts">
|
||||
<span data-i18n="option_nsfw_hide_posts"></label>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" name="option-nsfw-blur-posts-images" id="option-nsfw-blur-posts-images">
|
||||
<label for="option-nsfw-blur-posts-images" data-i18n="option_nsfw_blur_posts_images"></label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-nsfw-blur-posts-entire">
|
||||
<span data-i18n="option_nsfw_blur_posts_entire"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-embedding-twitter-tweets"><label for="option-embedding-twitter-tweets" data-i18n="option_embedding_twitter_tweets"></label>
|
||||
<input type="checkbox" name="option-nsfw-blur-comments-images" id="option-nsfw-blur-comments-images">
|
||||
<label for="option-nsfw-blur-comments-images" data-i18n="option_nsfw_blur_comments_images"></label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-nsfw-blur-comments-entire">
|
||||
<span data-i18n="option_nsfw_blur_comments_entire"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="tabs-content-item" id="other">
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-ctrl-enter" disabled="disabled">
|
||||
<span data-i18n="option_ctrl_enter"></span>
|
||||
</label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-fluid-layout">
|
||||
<span data-i18n="option_fluid_layout"></span>
|
||||
</label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-visual-editor-post">
|
||||
<span data-i18n="option_visual_editor_post"></span>
|
||||
</label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-search-with-google">
|
||||
<span data-i18n="option_search_with_google"></span>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" name="option-enlarge-font" id="option-enlarge-font">
|
||||
<label for="option-enlarge-font" data-i18n="option_enlarge_font"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<label>
|
||||
<input type="radio" name="option-enlarge-font-size" value="85" checked="checked"> 0.85 em
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="option-enlarge-font-size" value="100"> 1 em
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="option-enlarge-font-size" value="110"> 1.1 em
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-at-before-username">
|
||||
<span data-i18n="option_at_before_username"></span>
|
||||
</label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-other-hightlight-post-comments">
|
||||
<span data-i18n="option_other_hightlight_post_comments"></span>
|
||||
</label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-other-show-recommendation-count">
|
||||
<span data-i18n="option_other_show_recommendation_count"></span>
|
||||
</label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-other-scroll-space-key">
|
||||
<span data-i18n="option_other_scroll_space_key"></span>
|
||||
</label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-other-comments-nesting-level">
|
||||
<span data-i18n="option_other_comments_nesting_level"></span>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-nsfw"><label for="option-nsfw" data-i18n="option_nsfw"></label>
|
||||
<input type="checkbox" name="option-other-comments-count-refresh" id="option-other-comments-count-refresh">
|
||||
<label for="option-other-comments-count-refresh" data-i18n="option_other_comments_count_refresh"></label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-other-comments-count-refresh-title">
|
||||
<span data-i18n="option_other_comments_count_refresh_title"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-other-comments-user-system">
|
||||
<span data-i18n="option_other_comments_user_system"></span>
|
||||
</label>
|
||||
</section>
|
||||
|
||||
<section class="tabs-content-item" id="websocket">
|
||||
<div class="option-node">
|
||||
<input type="checkbox" name="option-ws" id="option-ws">
|
||||
<label for="option-ws" data-i18n="option_ws"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-nsfw-hide-posts"><label for="option-nsfw-hide-posts" data-i18n="option_nsfw_hide_posts"></label>
|
||||
<input type="checkbox" name="option-ws-comments" id="option-ws-comments">
|
||||
<label for="option-ws-comments" data-i18n="option_ws_comments"></label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-ws-comments-color-fadeout">
|
||||
<span data-i18n="option_ws_comments_color_fadeout"></span>
|
||||
</label>
|
||||
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-ws-comments-notifications">
|
||||
<span data-i18n="option_ws_comments_notifications"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-nsfw-blur-posts-images"><label for="option-nsfw-blur-posts-images" data-i18n="option_nsfw_blur_posts_images"></label>
|
||||
<input type="checkbox" name="option-ws-feeds" id="option-ws-feeds" disabled>
|
||||
<label for="option-ws-feeds" data-i18n="option_ws_feeds"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-nsfw-blur-posts-entire"><label for="option-nsfw-blur-posts-entire" data-i18n="option_nsfw_blur_posts_entire"></label>
|
||||
</div>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-ws-feeds-subscriptions">
|
||||
<span data-i18n="option_ws_feeds_subscriptions"></span>
|
||||
</label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-nsfw-blur-comments-images"><label for="option-nsfw-blur-comments-images" data-i18n="option_nsfw_blur_comments_images"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-nsfw-blur-comments-entire"><label for="option-nsfw-blur-comments-entire" data-i18n="option_nsfw_blur_comments_entire"></label>
|
||||
</div>
|
||||
<label class="option-node">
|
||||
<input type="checkbox" name="option-ws-feeds-blogs">
|
||||
<span data-i18n="option_ws_feeds_blogs"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="tab-content" id="other">
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ctrl-enter" disabled="disabled"><label for="option-ctrl-enter" data-i18n="option_ctrl_enter"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-fluid-layout"><label for="option-fluid-layout" data-i18n="option_fluid_layout"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-visual-editor-post"><label for="option-visual-editor-post" data-i18n="option_visual_editor_post"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-search-with-google"><label for="option-search-with-google" data-i18n="option_search_with_google"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-enlarge-font"><label for="option-enlarge-font" data-i18n="option_enlarge_font"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="radio" class="option-enum" name="option-enlarge-font-size" id="option-enlarge-font-size-85" value="85" checked="checked"><label for="option-enlarge-font-size-85">0.85em</label>
|
||||
<input type="radio" class="option-enum" name="option-enlarge-font-size" id="option-enlarge-font-size-100" value="100"><label for="option-enlarge-font-size-100">1em</label>
|
||||
<input type="radio" class="option-enum" name="option-enlarge-font-size" id="option-enlarge-font-size-110" value="110"><label for="option-enlarge-font-size-110">1.1em</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-at-before-username"><label for="option-at-before-username" data-i18n="option_at_before_username"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-other-hightlight-post-comments"><label for="option-other-hightlight-post-comments" data-i18n="option_other_hightlight_post_comments"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-other-show-recommendation-count"><label for="option-other-show-recommendation-count" data-i18n="option_other_show_recommendation_count"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-other-scroll-space-key"><label for="option-other-scroll-space-key" data-i18n="option_other_scroll_space_key"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-other-comments-nesting-level"><label for="option-other-comments-nesting-level" data-i18n="option_other_comments_nesting_level"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-other-comments-count-refresh"><label for="option-other-comments-count-refresh" data-i18n="option_other_comments_count_refresh"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-other-comments-count-refresh-title"><label for="option-other-comments-count-refresh-title" data-i18n="option_other_comments_count_refresh_title"></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-other-comments-user-system"><label for="option-other-comments-user-system" data-i18n="option_other_comments_user_system"></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tab-content" id="websocket">
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws"><label for="option-ws" data-i18n="option_ws"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-comments"><label for="option-ws-comments" data-i18n="option_ws_comments"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-comments-color-fadeout"><label for="option-ws-comments-color-fadeout" data-i18n="option_ws_comments_color_fadeout"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-comments-notifications"><label for="option-ws-comments-notifications" data-i18n="option_ws_comments_notifications"></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-feeds" disabled><label for="option-ws-feeds" data-i18n="option_ws_feeds"></label>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-feeds-subscriptions"><label for="option-ws-feeds-subscriptions" data-i18n="option_ws_feeds_subscriptions"></label>
|
||||
</div>
|
||||
|
||||
<div class="option-node">
|
||||
<input type="checkbox" class="option-boolean" id="option-ws-feeds-blogs"><label for="option-ws-feeds-blogs" data-i18n="option_ws_feeds_blogs"></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tab-content" id="feedback">
|
||||
<section class="tabs-content-item" id="feedback">
|
||||
<div class="text" data-i18n="options_feedback_text"></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</form>
|
||||
</main>
|
||||
|
||||
<p class="saved hidden" data-i18n="options_text_saved"></p>
|
||||
|
||||
<div id="panel">
|
||||
<div class="left" id="status"></div>
|
||||
|
||||
<div class="right">
|
||||
<div id="pp-version"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer class="footer">
|
||||
<p>Point+ <span id="version"></span> by
|
||||
<a href="https://skobkin-ru.point.im/" target="_blank">@skobkin-ru</a> &
|
||||
<a href="https://nokitakaze.point.im/" target="_blank">@NokitaKaze</a>
|
||||
</p>
|
||||
</footer>
|
||||
|
||||
<script src="js/options.js"></script>
|
||||
<script src="js/i18n.js"></script>
|
||||
|
|
|
|||
Loading…
Reference in a new issue