-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
248 lines (231 loc) · 12.4 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
<!DOCTYPE html>
<html lang="ja">
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--OGP -->
<meta property="og:title" content="漫画のEPUB作成サイト" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://kyukyunyorituryo.github.io/FixedEpub3JS/" />
<meta property="og:image" content="https://kyukyunyorituryo.github.io/FixedEpub3JS/twittercard.jpg" />
<meta property="og:site_name" content="FixedLayout Epub3.js" />
<meta property="og:description" content="kobo、bookwalker、Kindle、iBooks向けの漫画のEPUB作成サイト" />
<!--Twitterカード -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@99nyorituryo">
<meta name="twitter:creator" content="@99nyorituryo">
<meta name="twitter:title" content="漫画のEPUB作成サイト">
<meta name="twitter:description" content="kobo、bookwalker、Kindle、iBooks向けの漫画のEPUB作成サイト">
<meta name="twitter:image:src" content="https://kyukyunyorituryo.github.io/FixedEpub3JS/twittercard.jpg">
<link rel="shortcut icon" href="favicon.ico" type="image/vnd.microsoft.icon" />
<link rel="icon" href="favicon.ico" type="image/vnd.microsoft.icon" />
<title>FixedLayout Epub3.js</title>
<!-- BootstrapのCSS読み込み -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- 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>
<!-- jQuery読み込み -->
<script defer
src="https://code.jquery.com/jquery-1.12.4.min.js"
integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
crossorigin="anonymous"></script>
<!-- BootstrapのJS読み込み -->
<script defer src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<!-- 追加した部分 -->
<script defer type="text/javascript" src="js/jszip.min.js"></script>
<script defer type="text/javascript" src="js/FileSaver.js"></script>
<script defer type="text/javascript" src="js/uuid.js"></script>
<script defer type="text/javascript" src="js/FixedEpub3.js"></script>
<script defer type="text/javascript" src="js/vkbeautify.js"></script>
<script defer type="text/javascript" src="js/share.js"></script>
<script defer type="text/javascript" src="https://cdn.jsdelivr.net/npm/natsort@latest/index.min.js"></script>
</head>
<body >
<!-- ナビゲーション -->
<nav class="navbar navbar-default">
<div class="container-fluid ">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbarEexample">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="https://kyukyunyorituryo.github.io/">Topページ</a>
</div>
<div class="collapse navbar-collapse" id="navbarEexample">
<ul class="nav navbar-nav">
<li ><a href="./about.html">使い方</a></li>
<li><a href="http://99nyorituryo.hatenablog.com/">作者ブログ</a></li>
<li ><a href="http://99nyorituryo.hatenablog.com/archive/category/Fixed%20Layout%20EPUB3">関連する記事</a></li>
<li><a href="https://github.com/kyukyunyorituryo/FixedEpub3JS">GitHub</a></li>
<li><a href="https://kyukyunyorituryo.github.io/FixedEpub3JS/en/">English version</a></li>
<li><a href="https://kyukyunyorituryo.github.io/FixedEpub3JS/index_beta.html">beta version</a></li>
</ul>
</div>
</div>
</nav>
<div class=" col-sm-2"></div>
<div id="bg"class="container bg-info col-sm-7">
<h2>漫画のEPUB３作成ツール</h2>
<!-- snsボタン -->
<div>
<ul class="list-group list-inline">
<li>
<div class="sns_icon facebook_back"><a href="" target="_blank" title="Facebookでシェア"><img src="images/FB-f-Logo__blue_100.png" alt="facebook" width="50" height="50"></a></div>
</li>
<li>
<div class="sns_icon twitter_back"><a href="" target="_blank" title="Twitterでシェア"><img src="images/Twitter_Social.svg" alt="twitter" width="50" height="50"></a></div>
</li>
<li>
<div class="sns_icon hatena_back"><a href="" target="_blank" title="はてなブックマークに登録"><img src="images/hatenabookmark-logomark.svg" alt="はてなブックマーク" width="50" height="50"></a></div>
</li>
<li>
<div class="sns_icon line_back"><a href="" target="_blank" title="LINEに送る"><img src="images/line-share.png" alt="LINE" width="50" height="50"></a></div>
</li>
</ul>
</div>
<h3>本の形式</h3>
<div class="form-group ">
<p class="control-label"><b>本の綴じ方向</b></p>
<label class="label label-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 ">
<p class="control-label"><b>パネルビュー</b></p>
<label class="label label-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>
<h3>本の情報の入力</h3>
<div class="form-group ">
<label class="label label-primary">表題</label>
<input type="text" class="form-control " id="title"placeholder="タイトル名">
<label class="label label-primary">著者１</label>
<input type="text" class="form-control" id="author1" placeholder="著者名１">
<label class="label label-primary">著者２(任意)</label>
<input type="text" class="form-control" id="author2" placeholder="著者名２(任意)">
<!-- 多言語対応-->
<label class="label label-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>
<!-- 多言語対応-->
<label class="label label-primary">表紙画像</label>
<input type="file" id="coverfile" name="coverfile" accept="image/png,image/jpeg">
<output id="coverthumb"></output>
<label class="label label-primary">画像の横幅</label>
<input type="number" class="form-control" id="imgwidth" min="1" value="800"placeholder="800">
<label class="label label-primary">画像の高さ</label>
<input type="number" class="form-control" id="imgheight" min="1" value="1200"placeholder="1200">
</div>
<style>
.thumb {
height: 75px;
border: 1px solid #000;
margin: 10px 5px 0 0;
}
</style>
<div >
<label class="label label-primary">本文ファイルの読み込み</label>
<input type="file" id="files" name="files[]" multiple="multiple" accept="image/png,image/jpeg">
<output id="list"></output>
<label class="label label-primary">画像の整列</label>
<div ><button type=button id="sort">名前順に整列</button></div>
</div>
<h3>目次の編集</h3>
<div id="menu-group">
<label class="label label-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-default" id="addmenu" >追加</button>
<button type="submit" class="btn btn-default" id="removeselect" >削除</button>
<h3>ファイルの出力</h3>
<button id="demo" class="btn btn-primary">保存</button>
<h3>EPUBビュワー</h3>
<label class="label label-primary" >クリックしドラッグアンドドロップでEPUBを確認する</label></br>
<a class="btn btn-info" href="Bibi/bibi/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 -->
<p></p>
<div><iframe src="https://hatenablog-parts.com/embed?url=https://kyukyunyorituryo.github.io/kindle_sale/" title="kindleセールチェック" class="embed-card embed-webcard" scrolling="no" frameborder="0" loading="lazy"></iframe></div>
</div>
</body>
</html>