13nin.com/gzip.html at master · sakitibi/13nin.com · GitHub

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
<!doctype html>
<html lang="ja">
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1" />
		<title>pako gzip / ungzip フォーム</title>
		<link rel="stylesheet" href="/elibrary-api/css/457b9ec1-de6e-5f41-f1e4-6e246c83c895.min.css"/>
	</head>
	<body>
		<h1>gzip&ungzipフォーム</h1>
		<p class="muted">テキストを圧縮してBase64 表示
			<br/>ダウンロード、またはgzipファイルを読み込んで展開できます
		</p>
		<div class="panel">
			<label for="inputText">入力テキスト（圧縮する）</label>
			<textarea id="inputText" placeholder="ここに圧縮したいテキストを入れてください">Hello Hello Hello — Hello Hello Hello</textarea>
			<div class="row" style="margin-top:8px">
				<div class="col controls">
					<button id="btnGzip">gzip 圧縮 → Base64 表示</button>
					<button id="btnGzipDownload">gzip 圧縮 → .gz ダウンロード</button>
					<label style="align-self:center;" class="small muted">圧縮レベル:</label>
					<select id="level">
						<option value="6">6 (デフォルト)</option>
						<option value="1">1 (速い, 圧縮低)</option>
						<option value="9">9 (遅い, 圧縮高)</option>
					</select>
				</div>
				<div class="col">
					<div class="small">入力サイズ:
						<span id="inputSize">0</span>bytes
					</div>
					<div class="small">圧縮サイズ:
						<span id="compressedSize">-</span>
					</div>
				</div>
			</div>
			<div style="margin-top:12px">
				<label for="outBase64">圧縮結果（Base64）</label>
				<textarea id="outBase64" placeholder="ここに Base64 が出ます" readonly></textarea>
			</div>
		</div>
		<div class="panel">
			<label for="gzipFile">gzipファイルを読み込む（展開する）</label>
			<input type="file" id="gzipFile"/>
			<div class="row" style="margin-top:8px">
				<button id="btnUngzipFile">読み込んだgzipを展開</button>
				<button id="btnUngzipFileAndDownload">読み込んだgzipを展開して
					<br/>元データをダウンロード
				</button>
				<button id="btnUngzipFromBase64">Base64 から展開</button>
			</div>
			<div style="margin-top:12px">
				<label for="outText">展開結果（テキスト）</label>
				<textarea id="outText" readonly placeholder="ここに展開したテキストが表示されます"></textarea>
			</div>
		</div>
		<div class="panel small">
			<strong>注意</strong>
			<ul>
				<li>13nin利用規約が適応されます、</li>
				<li>規約に違反している内容は削除します</li>
			</ul>
		</div>
		<!-- pako を CDN で読み込む -->
		<script src="https://cdn.jsdelivr.net/npm/pako@2.1.0/dist/pako.min.js"></script>
		<script src="/elibrary-api/js/ace5d2ff-b122-28d5-ff7d-eb238d1db552.min.js"></script>
	</body>
</html>