-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex_beta.html
235 lines (213 loc) · 11 KB
/
index_beta.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
<!DOCTYPE html>
<html>
<head>
<title>FixedLayout Epub3.js</title>
<meta charset="utf-8">
<!-- Bootstrap4のJS読み込み -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
<!-- Bootstrap4のCSS読み込み -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<!-- 追加した部分 -->
<script type="text/javascript" src="js/jszip.min.js"></script>
<script type="text/javascript" src="js/FileSaver.js"></script>
<script type="text/javascript" src="js/uuid.js"></script>
<script type="text/javascript" src="js/ejs.min.js"></script>
<script type="text/javascript" src="js/fxlepub_beta.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/natsort@latest/index.min.js"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-93342586-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'UA-93342586-1');
</script>
</head>
<body>
<style>
body {
background-color: #5bc0de;
}
.container {
max-width: 960px;
}
</style>
<div class="container bg-light">
<h3 class="alert alert-success">本の形式</h3>
<div class="row">
<div class="form-group col-md-6 mb-3">
<p class="control-label "><b>本の綴じ方向</b></p>
<label class="badge badge-primary">ページ方向</label>
<label class="checkbox-inline"><input type="radio" name="radio" id="binding-rtl" value="radio1" checked="">右から左</label>
<label class="checkbox-inline"><input type="radio" name="radio" id="binding-ltr" value="radio2">左から右</label>
</div>
<div class="form-group col-md-6 mb-3">
<p class="control-label"><b>パネルビュー</b></p>
<label class="badge badge-primary">拡大したときの移動方向</label>
<label class="checkbox-inline"><input type="radio" name="radio2" id="panel-h" value="radio3" checked="">漫画（通常）</label>
<label class="checkbox-inline"><input type="radio" name="radio2" id="panel-v" value="radio4">四コマ</label>
</div>
</div>
<h3 class="alert alert-success">本の情報の入力</h3>
<div class="form-group row">
<div class="col-md-6 mb-3">
<label class="badge badge-primary">表題</label>
<input type="text" class="form-control " id="title" placeholder="タイトル名">
</div>
<div class="col-md-6 mb-3">
<label class="badge badge-primary">表題（カタカナ）</label>
<input type="text" class="form-control " id="title_kana" placeholder="タイトル名カナ">
</div>
<div class="col-md-6 mb-3">
<label class="badge badge-primary">著者１</label>
<input type="text" class="form-control" id="creator1" placeholder="著者名１">
</div>
<div class="col-md-6 mb-3">
<label class="badge badge-primary">著者１（カタカナ）</label>
<input type="text" class="form-control" id="creator1_kana" placeholder="著者名１カナ">
</div>
<div class="col-md-6 mb-3">
<label class="badge badge-primary">著者２(任意)</label>
<input type="text" class="form-control" id="creator2" placeholder="著者名２(任意)">
</div>
<div class="col-md-6 mb-3">
<label class="badge badge-primary">著者２(任意)（カタカナ）</label>
<input type="text" class="form-control" id="creator2_kana" placeholder="著者名２(任意)カナ">
</div>
<div class="col-md-6 mb-3">
<label class="badge badge-primary">出版社</label>
<input type="text" class="form-control" id="publisher" placeholder="出版社名">
</div>
<div class="col-md-6 mb-3">
<label class="badge badge-primary">出版社（カタカナ）</label>
<input type="text" class="form-control" id="publisher_kana" placeholder="出版社名カナ">
</div>
<!-- 多言語対応-->
<div class="col-md-6 mb-3">
<label class="badge badge-primary">言語選択</label>
<select class="form-control" id="LangSelect">
<option value="zh">中国語</option>
<option value="en">英語</option>
<option value="es">スペイン語</option>
<option value="ar">アラビア語</option>
<option value="pt">ポルトガル語</option>
<option value="ru">ロシア語</option>
<option value="de">ドイツ語</option>
<option value="fr">フランス語</option>
<option value="it">イタリア語</option>
<option value="nl">オランダ語</option>
<option value="ca">カタルーニャ</option>
<option value="hr">クロアチア語</option>
<option value="cs">チェコ語</option>
<option value="da">デンマーク語</option>
<option value="fi">フィンランド語</option>
<option value="el">ギリシャ語</option>
<option value="he">ヘブライ語</option>
<option value="hu">ハンガリー語</option>
<option value="id">インドネシア語</option>
<option value="ko">韓国・朝鮮語</option>
<option value="ms">マレー語</option>
<option value="no">ノルウェー語</option>
<option value="pl">ポーランド語</option>
<option value="ro">ルーマニア語</option>
<option value="sk">スロバキア語</option>
<option value="th">タイ語</option>
<option value="tr">トルコ語</option>
<option value="uk">ウクライナ語</option>
<option value="vi">ベトナム語</option>
<option selected value="ja">日本語</option>
</select>
</div>
<!-- 多言語対応-->
</div>
<div class="col-md-6 mb-3">
<label class="badge badge-primary">表紙画像</label>
<input type="file" id="coverfile" name="coverfile" accept="image/png,image/jpeg">
<output id="coverthumb"></output>
</div>
<div class="col-md-6 mb-3">
<label class="badge badge-primary">画像の横幅</label>
<input type="number" class="form-control" id="imgwidth" min="1" value="800" placeholder="800" readonly>
<label class="badge badge-primary">画像の高さ</label>
<input type="number" class="form-control" id="imgheight" min="1" value="1200" placeholder="1200" readonly>
</div>
<style type="text/css">
.nondisplayFrame {
display: none;
}
</style>
<style>
.thumb {
height: 75px;
border: 1px solid #000;
margin: 10px 5px 0 0;
}
</style>
<div class="mb-3">
<label class="badge badge-primary">本文ファイルの読み込み</label>
<input type="file" id="files" name="files[]" multiple="multiple" accept="image/png,image/jpeg">
<output id="list"></output>
</div>
<div class="col-md-6 mb-3">
<label class="badge badge-primary">画像の整列</label>
<button type=button id="sort">名前順に整列</button>
</div>
<h3 class="alert alert-success">目次の編集</h3>
<div id="menu-group">
<label class="badge badge-primary">目次の選択</label>
<form class="form-inline">
<div class="form-group">
<label class="sr-only" for="InputSelect">選択</label>
<select class="form-control" id="InputSelect">
<option>Cover</option>
</select>
</div>
<div class="form-group">
<label class="sr-only">目次の書換</label>
<input type="text" class="form-control" id="covertext" value="表紙" placeholder="目次タイトル">
</div>
</form>
<form class="form-inline" name="formNav">
<div class="form-group">
<label class="sr-only" for="InputSelect">選択</label>
<select class="form-control" id="InputSelect2" name="selectNav">
<option>本文の選択</option>
</select>
</div>
<div class="form-group">
<label class="sr-only">目次の書換</label>
<input type="text" class="form-control" id="navtext1" name="editNav" value="目次" placeholder="目次タイトル">
</div>
</form>
</div>
<!--目次の追加や削除-->
<button type="submit" class="btn btn-warning" id="addmenu">追加</button>
<button type="submit" class="btn btn-warning" id="removeselect">削除</button>
<h3 class="alert alert-success">ファイルの出力</h3>
<button id="demo" class="btn btn-primary">保存</button>
<h3 class="alert alert-success">EPUBビュワー</h3>
<label class="badge badge-primary">クリックしドラッグアンドドロップでEPUBを確認する</label><br>
<a class="btn btn-info" href="bib/i/index.html" target="_blank">EPUBビュワーBiB/i（ビビ）</a>
<span id="status"></span>
<!-- モーダルの設定です -->
<div class="modal fade" id="imagemodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">プレビュー</h4>
</div>
<div class="modal-body">
<img src="" id="imagepreview" class="img-responsive">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div><!-- /modal -->
</div>
</body>
</html>