-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
267 lines (256 loc) · 12.7 KB
/
index.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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
<!DOCTYPE html>
<html lang="vi-VI">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Sonako Test Helper</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/index.css" rel="stylesheet">
<link rel="shortcut icon" href="favicon.ico">
</head>
<body>
<!-- Navbar-->
<nav class="navbar navbar-inverse text-center hidden-xs">
<ul class="nav navbar-nav nav-justified">
<li class="nav-item">
<a href="#test-maker">Tạo bài test</a>
</li>
<li class="nav-item">
<a href="#test-content">Làm bài</a>
</li>
<li class="nav-item">
<a href="#test-saver">Lưu bài</a>
</li>
<li class="nav-item">
<a href="#test-loader">Mở bài</a>
</li>
</ul>
</nav>
<div class="container-fluid">
<!-- Introduction banner -->
<div class="jumbotron text-center" id="intro">
<h1>Hỗ trợ tạo bài test Sonako</h1>
<a href="http://sonako.wikia.com/wiki/Sonako_Light_Novel">
<img src="img/logo.svg" class="media-object center-block" style="max-width: 30%; min-width: 300px;">
</a>
<p>
Webapp này sinh ra với mục đích giúp các bạn dễ dàng tạo và thực hiện bài test tuyển quân của Sonako.
</p>
<p>Chi tiết về thể lệ tuyển quân, xin xem tại
<a href="https://docs.google.com/document/d/1D-O3jBRr88aRgI2b6U1IwE7YTOIpS4kdeJ0PjMNi7-o/edit?usp=sharing">đây</a>.
</p>
<p>
Bạn có thể lưu trang web này về (ctrl+S) và mở ở chế độ offline. Mọi chức năng đều sẽ hoạt động bình thường.
</p>
<p>
Chương trình còn trong giai đoạn phát triển. Mọi ý kiến đóng góp hay vấn đề xuất hiện khi sử dụng webapp này, xin báo cáo
trong group Sonako với cặp hashtag
<em>#snktest #snktesthelper</em> hoặc gửi lên
<a href="http://sonako.wikia.com/wiki/Message_Wall:Perfectstrong">tường của mình</a>. Vui lòng ghi rõ bạn sử dụng trình duyệt nào, phiên bản mấy, lỗi ở chức năng nào, các
bước dẫn tới lỗi.
</p>
</div>
<!-- Test maker -->
<div class="panel panel-primary" id="test-maker">
<div class="panel-heading">
<h2>Tạo bài test</h2>
</div>
<div class="panel-body">
<div class="text-info well user-guide">
<p>
Bạn nhập thông tin bản thân và nội dung bạn muốn dịch.
</p>
<ul>
<li>
<b>Nickname trên Sonako:</b> Nếu bạn chưa tạo tài khoản trên wikia thì vui lòng đăng ký ở đây
<a href="https://www.wikia.com/register">https://www.wikia.com/register</a>.
</li>
<li>
<b>Lần test thứ:</b> Nếu đây là lần đầu tiên bạn làm bài test tuyển quân thì hãy nhập
<b>1</b>. Lưu ý, nếu bạn thi lại thì phải chờ ít nhất
<em>2 tháng</em> sau khi có kết quả từ lần trước.
</li>
<li>
<b>Tiêu đề truyện:</b> Hãy nhập tên tiếng Anh hoặc romanji của bộ truyện bạn chọn làm bài thi.
</li>
<li>
<b>Văn bản nguồn:</b> Bạn sao chép và dán đoạn văn bản nguồn mà bạn đã chọn. Dung lượng
<b>3000 - 4000 từ</b> (nếu là tiếng Anh, các ngôn ngữ khác thì sẽ có giải đáp cụ thể hơn trong group
của Sonako). Bạn có thể dán kèm theo tiêu đề của chương truyện.
</li>
</ul>
<p>
Một khi đã nhập xong thông tin, hãy ấn nút
<b>tạo test</b> và kéo xuống mục
<a href="#test-content">làm bài</a> để bắt tay vào dịch.
</p>
</div>
<form id="input-text">
<div class="form-group">
<label for="nickname">Nickname trên Sonako:</label>
<input type="text" class="form-control" id="nickname" required>
</div>
<div class="form-group">
<label for="attempt">Lần test thứ:</label>
<input type="number" class="form-control" id="attempt" min="1" step="1" required>
</div>
<div class="form-group">
<label for="title">Tiêu đề truyện:</label>
<input type="text" class="form-control" id="title" required>
</div>
<div class="form-group">
<label for="fulltext">Văn bản nguồn:</label>
<textarea class="form-control" id="fulltext" rows="10" required></textarea>
</div>
<div class="extra-param">
<div class="checkbox">
<label>
<input type="checkbox" id="remove-blank-line">Tự động xóa dòng trống.
</label>
</div>
</div>
<button type="submit" class="btn btn-primary">Tạo test</button>
</form>
<div role="status">
</div>
</div>
</div>
<!-- Test content -->
<div class="panel panel-primary" id="test-content">
<div class="panel-heading">
<h2>Làm bài</h2>
<button class="btn btn-danger btn-right" id="test-clear">Xóa bài làm hiện tại</button>
</div>
<div class="panel-body">
<div class="text-info well user-guide">
<p>
Sau khi
<a href="#test-maker">tạo bài test</a> hoặc
<a href="#test-loader">mở bài test</a> (bạn chỉ có thể mở bài test đã được lưu bằng chức năng
<a href="#test-saver">lưu bài</a>), bài làm của bạn sẽ hiện ra ở đây.
</p>
<p>
Sử dụng dấu
<b>+</b> để thêm một dòng trống mới ngay sau dòng hiện tại.
</p>
<p>
Sử dụng dấu
<b>x</b> để xóa dòng hiện tại.
</p>
<p>
Ấn nút
<b>
<a href="#test-clear">xóa bài làm hiện tại</a>
</b> để xóa kết quả bạn đã tạo hoặc mở.
</p>
</div>
<div role="status" class="text-warning">
<p>
<span class="glyphicon glyphicon-warning-sign"></span>
Không có bài test nào đang mở. Hãy
<a href="#test-maker">tạo bài test</a> hoặc
<a href="#test-loader">mở bài</a>.
</p>
</div>
<div id="metadata"></div>
<div id="table-test"></div>
</div>
</div>
<!-- Test saver -->
<div class="panel panel-primary" id="test-saver">
<div class="panel-heading">
<h2>Lưu bài</h2>
</div>
<div class="panel-body">
<div class="text-info well user-guide">
<p>
Bạn có thể lưu bài đã làm xong để đem đi nộp hoặc bài đang làm dở để lần sau mở ra lại làm tiếp. Nếu muốn nộp thì nên nộp
dạng doc, docx hoặc Google Doc.
</p>
<ul>
<li>
<b>Lưu dạng .html:</b> Bài làm sẽ được lưu thành một trang web offline. Ban có thể mở file bằng
bất kỳ trình duyệt nào, MS Word, hoặc Google Doc.
</li>
<li>
<b>Lưu dạng .doc:</b> Bài làm sẽ được lưu thành một file doc.
</li>
<li>
<b>Lưu vào trình duyệt:</b> Bài làm sẽ được ghi vào bộ nhớ của trình duyệt.
<span class="text-warning">Lưu ý: bạn lưu ở trình duyệt nào thì chỉ có trình duyệt ấy mới mở lại được.</span>
</li>
</ul>
</div>
<div class="options">
<button class="btn btn-primary" id="save-html">Lưu dạng .html</button>
<button class="btn btn-primary" id="save-doc">Lưu dạng .doc</button>
<button class="btn btn-primary" id="save-browser">Lưu vào trình duyệt</button>
</div>
<div role="status"></div>
</div>
</div>
<!-- Test loader -->
<div class="panel panel-primary" id="test-loader">
<div class="panel-heading">
<h2>Mở bài</h2>
</div>
<div class="panel-body">
<div class="text-info well user-guide">
<p>
Tại đây, bạn có thể mở những gì bạn đã lưu.
</p>
<ul>
<li>
<b>Mở .html:</b> Mở file html bạn đã tạo bằng chức năng
<a href="#save-html">lưu dạng .html</a>.
</li>
<li>
<b>Mở từ trình duyệt:</b> Mở kết quả bạn đã lưu vào trình duyệt.
<span class="text-warning">Lưu ý: bạn lưu ở trình duyệt nào thì chỉ có trình duyệt ấy mới mở lại được.</span>
</li>
</ul>
</div>
<div class="options">
<button class="btn btn-primary" id="open-html">Mở .html</button>
<!-- <button class="btn btn-primary" id="open-doc">Mở .doc</button> -->
<button class="btn btn-primary" id="open-browser">Mở từ trình duyệt</button>
</div>
<div class="extra-param">
<div class="checkbox">
<label>
<input type="checkbox" id="remove-blank-line">Tự động xóa dòng trống.
</label>
</div>
</div>
<div role="status"></div>
</div>
</div>
</div>
<!-- Footer -->
<footer class="page-footer">
<div class="container-fluid text-center">
<p class="text-muted">Version 0.1.0 (3/2018)</p>
<p>License:
<a href="LICENSE">MIT</a>
</p>
<p>© 2018 Copyright:
<a href="http://sonako.wikia.com/wiki/User:Perfectstrong">perfectstrong</a>
</p>
<p></p>
<a href="https://github.com/perfectstrong/SnkTestHelper">
<img src="githubicon32.png">
</a>
</p>
</div>
</footer>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/autosize.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/index.js"></script>
</body>
</html>