-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathoptions.html
135 lines (125 loc) · 6.19 KB
/
options.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="bootstrap.min.css">
<link rel="stylesheet" href="content.css">
<title>Фильтр для Глобальной Авантюры</title>
<style>
#inputFlags {
max-width: 5em;
}
@media (max-width: 575.98px) {
form .btn-primary {
width: 100%;
}
}
</style>
</head>
<body>
<div class="container">
<div class="row py-3">
<div class="col">
<h3 class="text-center">Фильтр для Глобальной Авантюры</h3>
</div>
</div>
<div class="row">
<div class="col text-right">
<a id="exportButton" class="btn btn-secondary" href="download" download="filters.json">Экспортировать</a>
</div>
<div class="col">
<input type="file" name="import" id="importInput" class="d-none" accept=".json">
<button type="button" id="importButton" class="btn btn-secondary">Импортировать</button>
</div>
</div>
<div class="row py-3">
<div class="col">
<ul class="nav nav-tabs" id="tabsNav">
<il class="nav-item"><a href="#tabsContent" class="nav-link active" role="tab" data-target="tabFilters">Фильтры</a></il>
<li class="nav-item"><a href="#tabsContent" class="nav-link" role="tab" data-target="tabHelp">Справка</a></li>
</ul>
</div>
</div>
<div class="row">
<div class="col">
<div class="tab-content" id="tabsContent">
<div class="tab-pane fade show active" id="tabFilters" role="tabpanel">
<div class="row">
<div class="col">
<div class="card mb-4">
<h5 class="card-header text-center">Добавить фильтр</h5>
<div class="card-body">
<form>
<fieldset id="fieldsetFilter" disabled="disabled">
<div class="form-group">
<input class="form-control d-inline-block w-100" type="text" name="regexp" id="inputFilter">
<input class="form-control d-none" type="text" name="flags" id="inputFlags" placeholder="Флаги">
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="type" id="radioPhrase" value="phrase" checked>
<label class="form-check-label" for="radioPhrase">Фраза</label>
</div>
<div class="form-check">
<input class="form-check-input" type="radio" name="type" id="radioRegexp" value="regexp">
<label class="form-check-label" for="radioRegexp">Регулярное выражение</label>
</div>
<div class="form-group text-center mt-3">
<button id="buttonAddFilter" class="btn btn-primary" title="Добавить">Добавить</button>
</div>
</fieldset>
</form>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="card">
<h5 class="card-header text-center">Фильтры</h5>
<ul id="filtersList" class="list-group list-group-flush">
<li class="list-group-item"></li>
</ul>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="tabHelp" role="tabpanel">
<div class="row">
<div class="col">
<h4>Фильтры</h4>
<p>
При загрузке страницы расширение проверяет тело каждого сообщения на наличие в тексте совпадений с фильтрами и скрывает сообщения,
в которых совпадения найдены. Фильтр может быть двух видов:
</p>
<ul>
<li>Фраза - это строка, конретный набор символов в конкретном порядке, которые должны содержаться в сообщении.
Регистр при этом не учитывается т.е. прописные буквы равны строчным.</li>
<li><a href="https://ru.wikipedia.org/wiki/Регулярные_выражения#Синтаксис" target="_blank">Регулярное выражение</a>, совместимое с JavaScript.</li>
</ul>
<h4>Треды</h4>
<p>
Ответы на сообщения принадлежат конкретным тредам, что позволяет избавиться от флуда и оффтопиков просто скрыв нужные треды.
Что бы скрыть тред нужно нажать кнопку <strong>Скрывать тред</strong> <span class="fg-btn fg-btni-hide-thread"> </span>,
она сразу исчезнет, но изменения вступят в силу только при переходе на другую страницу или перезагрузке текущей.
Для достижения обратного эффекта нужно нажать <strong>Показывать тред</strong> <span class="fg-btn fg-btni-show-thread"> </span>.
Если сообщение принадлежит скрытому треду, то оно будет скрыто не зависимо от содержания.
</p>
<h4>Общее</h4>
<p>
У всех скрытых сообщений будет добавлена кнопка <strong>Показать сообщение</strong>
<span class="fg-btn fg-btni-show-message"> </span>, нажав на которую можно раскрыть сообщение.
</p>
<h4>Сохранение / Загрузка настроек</h4>
<p>Используйте кнопку <strong>Экспортировать</strong>, что бы сохранить фильтры в файл.</p>
<p>Используйте кнопку <strong>Импортировать</strong>, что бы загрузить фильтры из файла.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="options.js"></script>
</body>
</html>