Change Web Application design
Change Web Application design and translation a little.
This commit is contained in:
vitaliylag
parent
7708c7e75a
commit
30bd9be55e
BIN
assets/favicon.ico
Normal file
BIN
assets/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
assets/img/example2-zip.png
Normal file
BIN
assets/img/example2-zip.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
BIN
assets/img/flags/GB.png
Normal file
BIN
assets/img/flags/GB.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
assets/img/flags/JP.png
Normal file
BIN
assets/img/flags/JP.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 626 B |
BIN
assets/img/flags/RU.png
Normal file
BIN
assets/img/flags/RU.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 520 B |
BIN
assets/img/flags/US.png
Normal file
BIN
assets/img/flags/US.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 765 B |
15
assets/img/flags/license.txt
Normal file
15
assets/img/flags/license.txt
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
Flag icons are downloaded from here: https://www.gosquared.com/download/pixels/flags.zip
|
||||
|
||||
|
||||
|
||||
Text from LICENSE.txt file (MIT license, GPL-compatible):
|
||||
|
||||
|
||||
|
||||
Copyright (c) 2013 Go Squared Ltd. http://www.gosquared.com/
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
|
|
@ -1,65 +1,71 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>waifu2x</title>
|
||||
<link href="style.css" rel="stylesheet" type="text/css">
|
||||
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
|
||||
<script type="text/javascript" src="ui.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>waifu2x</h1>
|
||||
<div class="header">
|
||||
<div class="github-banner">
|
||||
<img class="github-banner-image" src="https://camo.githubusercontent.com/a6677b08c955af8400f44c6298f40e7d19cc5b2d/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f677261795f3664366436642e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png">
|
||||
<a class="github-banner-link" href="https://github.com/nagadomi/waifu2x" target="_blank"></a>
|
||||
</div>
|
||||
<a href="index.html">en</a>/<a href="index.ja.html">ja</a>/<a href="index.ru.html">ru</a>
|
||||
</div>
|
||||
<div class="about">
|
||||
<div>Single-Image Super-Resolution for Anime-Style Art using Deep Convolutional Neural Networks. And it supports photo. <a href="https://raw.githubusercontent.com/nagadomi/waifu2x/master/images/slide.png" target="_blank">about</a>.</div>
|
||||
</div>
|
||||
<form action="/api" method="POST" enctype="multipart/form-data" target="_blank">
|
||||
<fieldset>
|
||||
<legend>Image</legend>
|
||||
<div>
|
||||
URL: <input id="url" type="text" name="url" style="width:400px"> or
|
||||
</div>
|
||||
<div>
|
||||
FILE: <input id="file" type="file" name="file">
|
||||
</div>
|
||||
<div class="help">
|
||||
Limits: Size: 2MB, Noise Reduction: 2560x2560px, Upscaling: 1280x1280px
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Style</legend>
|
||||
<label><input type="radio" name="style" value="art" checked>Art</label>
|
||||
<label><input type="radio" name="style" value="photo">Photo</label>
|
||||
</fieldset>
|
||||
<fieldset class="noise-field">
|
||||
<legend>Noise Reduction (expect JPEG Artifact)</legend>
|
||||
<label><input type="radio" name="noise" value="0"> None</label>
|
||||
<label><input type="radio" name="noise" value="1" checked="checked"> Medium</label>
|
||||
<label><input type="radio" name="noise" value="2"> High</label>
|
||||
<div class="help">
|
||||
When using 2x scaling, we never recommend to use high level of noise reduction, it almost always makes image worse, it makes sense for only some rare cases when image had really bad quality from the beginning.
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Upscaling</legend>
|
||||
<label><input type="radio" name="scale" value="0" checked="checked"> None</label>
|
||||
<label><input type="radio" name="scale" value="1"> 1.6x</label>
|
||||
<label><input type="radio" name="scale" value="2"> 2x</label>
|
||||
</fieldset>
|
||||
<input type="submit" class="button"/><br>
|
||||
<input type="submit" name="download" value="Download" class="button"/>
|
||||
</form>
|
||||
<div class="help">
|
||||
<ul class="padding-left">
|
||||
<li>If you are using Firefox, Please press the CTRL+S key to save image. "Save Image" option doesn't work.
|
||||
</ul>
|
||||
</div>
|
||||
</body>
|
||||
<html lang="en-us">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<meta charset="utf-8">
|
||||
<title>waifu2x</title>
|
||||
<link rel="shortcut icon" href="favicon.ico"/>
|
||||
<link href="style.css" rel="stylesheet" type="text/css">
|
||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
|
||||
<script type="text/javascript" src="ui.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="mainTitle"><!--
|
||||
--><div class="mainTitle-text">waifu2x</div><!--
|
||||
--><a href="index.html" class="flagLink first"><img src="img/flags/US.png" class="chooseLang"></a><!--
|
||||
--><a href="index.ja.html" class="flagLink"><img src="img/flags/JP.png" class="chooseLang"></a><!--
|
||||
--><a href="index.ru.html" class="flagLink"><img src="img/flags/RU.png" class="chooseLang"></a><!--
|
||||
--></div>
|
||||
<p>Single-Image Super-Resolution for Anime-Style Art using Deep Convolutional Neural Networks. And it supports photo.</p>
|
||||
<p class="margin1 linksBox"><a href="https://raw.githubusercontent.com/nagadomi/waifu2x/master/images/slide.png" class="blueLink" target="_blank">Show full demonstration</a> | <a href="https://github.com/nagadomi/waifu2x" class="blueLink" target="_blank">Go to GitHub</a></p>
|
||||
<img src="img/example2-zip.png" class="example">
|
||||
|
||||
<div class="secondTitle">Convert image:</div>
|
||||
|
||||
<form action="/api" method="POST" enctype="multipart/form-data" target="_blank">
|
||||
<div class="optionBox first">
|
||||
<div class="option-left">Image choosing:</div>
|
||||
<div class="option-right">
|
||||
<input type="text" id="url" name="url" placeholder="Type URL">
|
||||
<div class="option-right-small">Or choose a file: <input type="file" id="file" name="file"></div>
|
||||
</div>
|
||||
<div class="option-hint">Limits: Size: 3MB, Noise Reduction: 2560x2560px, Upscaling: 1280x1280px.</div>
|
||||
</div>
|
||||
|
||||
<div class="optionBox">
|
||||
<div class="option-left">Style:</div>
|
||||
<div class="option-right">
|
||||
<label><input type="radio" name="style" class="radio fisrt" value="art" checked><span class="r-text">Artwork</span></label>
|
||||
<label><input type="radio" name="style" class="radio" value="photo"><span class="r-text">Photo</span></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="optionBox">
|
||||
<div class="option-left">Noise Reduction:<div class="option-left-small">(expect JPEG artifact)</div></div>
|
||||
<div class="option-right">
|
||||
<label><input type="radio" name="noise" class="radio fisrt" value="0"><span class="r-text">None</span></label>
|
||||
<label><input type="radio" name="noise" class="radio" value="1" checked><span class="r-text">Medium</span></label>
|
||||
<label><input type="radio" name="noise" class="radio" value="2"><span class="r-text">High</span></label>
|
||||
<label><input type="radio" name="noise" class="radio" value="3"><span class="r-text">Super (tmp)</span></label>
|
||||
</div>
|
||||
<div class="option-hint">You need use noise reduction if image actually has noise or it may cause opposite effect.</div>
|
||||
</div>
|
||||
|
||||
<div class="optionBox">
|
||||
<div class="option-left">Upscaling:<div class="option-left-small"></div></div>
|
||||
<div class="option-right">
|
||||
<label><input type="radio" name="scale" class="radio fisrt" value="0" checked><span class="r-text">None</span></label>
|
||||
<label><input type="radio" name="scale" class="radio" value="1"><span class="r-text">1.6x</span></label>
|
||||
<label><input type="radio" name="scale" class="radio" value="2"><span class="r-text">2x</span></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input type="submit" class="button" value="Convert">
|
||||
<input type="submit" name="download" value="Download" class="button">
|
||||
|
||||
<div class="bottomHint">If you are using Firefox, Please press the CTRL+S key to save image. "Save Image" option doesn't work.</div>
|
||||
<!--<div class="bottomHint">This website uses Google Analytics to help us improve the website content.</div>-->
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,63 +1,71 @@
|
|||
<!DOCTYPE html>
|
||||
<!DOCTYPE html>
|
||||
<html lang="ja">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link href="style.css" rel="stylesheet" type="text/css">
|
||||
<title>waifu2x</title>
|
||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
|
||||
<script type="text/javascript" src="ui.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>waifu2x</h1>
|
||||
<div class="header">
|
||||
<div class="github-banner">
|
||||
<img class="github-banner-image" src="https://camo.githubusercontent.com/a6677b08c955af8400f44c6298f40e7d19cc5b2d/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f677261795f3664366436642e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png">
|
||||
<a class="github-banner-link" href="https://github.com/nagadomi/waifu2x" target="_blank"></a>
|
||||
</div>
|
||||
<a href="index.html">en</a>/<a href="index.ja.html">ja</a>/<a href="index.ru.html">ru</a>
|
||||
</div>
|
||||
<div class="about">
|
||||
<div>深層畳み込みニューラルネットワークによる二次元画像のための超解像システム. 写真にも対応. <a href="https://raw.githubusercontent.com/nagadomi/waifu2x/master/images/slide.png" target="_blank">about</a>.</div>
|
||||
</div>
|
||||
<form action="/api" method="POST" enctype="multipart/form-data" target="_blank">
|
||||
<fieldset>
|
||||
<legend>画像</legend>
|
||||
<div>
|
||||
URL: <input id="url" type="text" name="url" style="width:400px"> or
|
||||
</div>
|
||||
<div>
|
||||
FILE: <input id="file" type="file" name="file">
|
||||
</div>
|
||||
<div class="help">
|
||||
制限: サイズ: 2MB, ノイズ除去: 2560x2560px, 拡大: 1280x1280px
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>スタイル</legend>
|
||||
<label><input type="radio" name="style" value="art" checked>イラスト</label>
|
||||
<label><input type="radio" name="style" value="photo">写真</label>
|
||||
</fieldset>
|
||||
<fieldset class="noise-field">
|
||||
<legend>ノイズ除去 (JPEGノイズを想定)</legend>
|
||||
<label><input type="radio" name="noise" value="0"> なし</label>
|
||||
<label><input type="radio" name="noise" value="1" checked="checked"> 弱</label>
|
||||
<label><input type="radio" name="noise" value="2"> 強</label>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>拡大</legend>
|
||||
<label><input type="radio" name="scale" value="0" checked="checked"> なし</label>
|
||||
<label><input type="radio" name="scale" value="1"> 1.6x</label>
|
||||
<label><input type="radio" name="scale" value="2"> 2x</label>
|
||||
</fieldset>
|
||||
<input type="submit" value="実行" class="button"><br>
|
||||
<input type="submit" name="download" value="ダウンロード" class="button">
|
||||
</form>
|
||||
<div class="help">
|
||||
<ul class="padding-left">
|
||||
<li>なし/なしで入力画像を変換せずに出力する。ブラウザのタブで変換結果を比較したい人用。
|
||||
<li>Firefoxの方は、右クリから画像が保存できないようなので、CTRL+SキーかALTキー後 ファイル - ページを保存 で画像を保存してください。
|
||||
</ul>
|
||||
</div>
|
||||
</body>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<meta charset="utf-8">
|
||||
<title>waifu2x</title>
|
||||
<link rel="shortcut icon" href="favicon.ico"/>
|
||||
<link href="style.css" rel="stylesheet" type="text/css">
|
||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
|
||||
<script type="text/javascript" src="ui.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="mainTitle"><!--
|
||||
--><div class="mainTitle-text">waifu2x</div><!--
|
||||
--><a href="index.html" class="flagLink first"><img src="img/flags/US.png" class="chooseLang"></a><!--
|
||||
--><a href="index.ja.html" class="flagLink"><img src="img/flags/JP.png" class="chooseLang"></a><!--
|
||||
--><a href="index.ru.html" class="flagLink"><img src="img/flags/RU.png" class="chooseLang"></a><!--
|
||||
--></div>
|
||||
<p>深層畳み込みニューラルネットワークによる二次元画像のための超解像システム。 写真にも対応。</p>
|
||||
<p class="margin1 linksBox"><a href="https://raw.githubusercontent.com/nagadomi/waifu2x/master/images/slide.png" class="blueLink" target="_blank">デモンストレーションを見ます</a> | <a href="https://github.com/nagadomi/waifu2x" class="blueLink" target="_blank">GitHubに行きます</a></p>
|
||||
<img src="img/example2-zip.png" class="example">
|
||||
|
||||
<div class="secondTitle">画像を変換します:</div>
|
||||
|
||||
<form action="/api" method="POST" enctype="multipart/form-data" target="_blank">
|
||||
<div class="optionBox first">
|
||||
<div class="option-left">画像:</div>
|
||||
<div class="option-right">
|
||||
<input type="text" id="url" name="url" placeholder="URLを書いてか">
|
||||
<div class="option-right-small">ファイルを選んでください: <input type="file" id="file" name="file"></div>
|
||||
</div>
|
||||
<div class="option-hint">制限: サイズ: 3MB, ノイズ除去: 2560x2560px, 拡大後: 2560x2560px</div>
|
||||
</div>
|
||||
|
||||
<div class="optionBox">
|
||||
<div class="option-left">スタイル:</div>
|
||||
<div class="option-right">
|
||||
<label><input type="radio" name="style" class="radio fisrt" value="art" checked><span class="r-text">イラスト</span></label>
|
||||
<label><input type="radio" name="style" class="radio" value="photo"><span class="r-text">写真</span></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="optionBox">
|
||||
<div class="option-left">ノイズ除去:<div class="option-left-small">(JPEGノイズを想定)</div></div>
|
||||
<div class="option-right">
|
||||
<label><input type="radio" name="noise" class="radio fisrt" value="0"><span class="r-text">なし</span></label>
|
||||
<label><input type="radio" name="noise" class="radio" value="1" checked><span class="r-text">弱</span></label>
|
||||
<label><input type="radio" name="noise" class="radio" value="2"><span class="r-text">強</span></label>
|
||||
<label><input type="radio" name="noise" class="radio" value="3"><span class="r-text">スーパー</span></label>
|
||||
</div>
|
||||
<div class="option-hint">画像はノイズがなければノイズ除去すると逆効果を引き起こす可能性があります。</div>
|
||||
</div>
|
||||
|
||||
<div class="optionBox">
|
||||
<div class="option-left">拡大:<div class="option-left-small"></div></div>
|
||||
<div class="option-right">
|
||||
<label><input type="radio" name="scale" class="radio fisrt" value="0" checked><span class="r-text">なし</span></label>
|
||||
<label><input type="radio" name="scale" class="radio" value="1"><span class="r-text">1.6x</span></label>
|
||||
<label><input type="radio" name="scale" class="radio" value="2"><span class="r-text">2x</span></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input type="submit" class="button" value="実行">
|
||||
<input type="submit" name="download" value="結果を保存" class="button">
|
||||
|
||||
<div class="bottomHint">Firefoxの方は、右クリから画像が保存できないようなので、CTRL+SキーかALTキー後 ファイル - ページを保存 で画像を保存してください。</div>
|
||||
<!--<div class="bottomHint">本サイトは、コンテンツ改善のために Google Analytics を使用しています。 </div>-->
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,65 +1,72 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link href="style.css" rel="stylesheet" type="text/css">
|
||||
<title>waifu2x</title>
|
||||
<link href="style.css" rel="stylesheet" type="text/css">
|
||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
|
||||
<script type="text/javascript" src="ui.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>waifu2x</h1>
|
||||
<div class="header">
|
||||
<div class="github-banner">
|
||||
<img class="github-banner-image" src="https://camo.githubusercontent.com/a6677b08c955af8400f44c6298f40e7d19cc5b2d/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f677261795f3664366436642e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png">
|
||||
<a class="github-banner-link" href="https://github.com/nagadomi/waifu2x" target="_blank"></a>
|
||||
</div>
|
||||
<a href="index.html">en</a>/<a href="index.ja.html">ja</a>/<a href="index.ru.html">ru</a>
|
||||
</div>
|
||||
<div class="about">
|
||||
<div>Увеличение в 4 раза рисованных изображений, например, аниме или фан-арт, а также устранение шума (преимущественно артефактов сжатия JPEG), см. <a href="https://raw.githubusercontent.com/nagadomi/waifu2x/master/images/slide.png" target="_blank">демонстрацию и сравнения</a></div>
|
||||
</div>
|
||||
<form action="/api" method="POST" enctype="multipart/form-data" target="_blank">
|
||||
<fieldset>
|
||||
<legend>Выбор изображения</legend>
|
||||
<div>
|
||||
Указать URL: <input id="url" type="text" name="url" style="width:400px">
|
||||
</div>
|
||||
<div>
|
||||
Или загрузить файл: <input id="file" type="file" name="file">
|
||||
</div>
|
||||
<div class="help">
|
||||
Макс. размер файла — 2MB, устранение шума — макс. 2560x2560px, апскейл — 1280x1280px
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Стиль</legend>
|
||||
<label><input type="radio" name="style" value="art" checked>Произведение искусства</label>
|
||||
<label><input type="radio" name="style" value="photo">фото</label>
|
||||
</fieldset>
|
||||
<fieldset class="noise-field">
|
||||
<legend>Устранение шума (артефактов JPEG)</legend>
|
||||
<label><input type="radio" name="noise" value="0"> Нет</label>
|
||||
<label><input type="radio" name="noise" value="1" checked="checked"> Средне</label>
|
||||
<label><input type="radio" name="noise" value="2"> Сильно</label>
|
||||
<div class="help">Устранение шума нужно использовать, если на картинке действительно есть шум, иначе это даст противоположный эффект. Также не рекомендуется сильное устранение шума, оно даёт выгоду только в редких случаях, когда картинка изначально была сильно испорчена.</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Апскейл (увеличение размера)</legend>
|
||||
<label><input type="radio" name="scale" value="0" checked="checked"> Нет</label>
|
||||
<label><input type="radio" name="scale" value="1"> 1.6x</label>
|
||||
<label><input type="radio" name="scale" value="2"> 2x</label>
|
||||
</fieldset>
|
||||
<input type="submit" class="button"><br>
|
||||
<input type="submit" name="download" value="Download" class="button">
|
||||
</form>
|
||||
<div class="help">
|
||||
<ul class="padding-left">
|
||||
<li>Если Вы используете Firefox, для сохранения изображения Вам придётся нажать Ctrl+S (опция в меню "Сохранить изображение" работать не будет!)
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</body>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<meta charset="utf-8">
|
||||
<title>waifu2x</title>
|
||||
<link rel="shortcut icon" href="favicon.ico"/>
|
||||
<link href="style.css" rel="stylesheet" type="text/css">
|
||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
|
||||
<script type="text/javascript" src="ui.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="mainTitle"><!--
|
||||
--><div class="mainTitle-text">waifu2x</div><!--
|
||||
--><a href="index.html" class="flagLink first"><img src="img/flags/US.png" class="chooseLang"></a><!--
|
||||
--><a href="index.ja.html" class="flagLink"><img src="img/flags/JP.png" class="chooseLang"></a><!--
|
||||
--><a href="index.ru.html" class="flagLink"><img src="img/flags/RU.png" class="chooseLang"></a><!--
|
||||
--></div>
|
||||
<p>Waifu2x позволяет увеличивать в 4 раза рисованные изображения, например аниме или арт, а также устранять шум на изображении (преимущественно артефакты сжатия JPEG).</p>
|
||||
<p>Теперь также поддерживаются фотографии.</p>
|
||||
<p class="margin1 linksBox"><a href="https://raw.githubusercontent.com/nagadomi/waifu2x/master/images/slide.png" class="blueLink" target="_blank">Посмотреть полную демонстрацию</a> | <a href="https://github.com/nagadomi/waifu2x" class="blueLink" target="_blank">Перейти на GitHub</a></p>
|
||||
<img src="img/example2-zip.png" class="example">
|
||||
|
||||
<div class="secondTitle">Преобразовать изображение:</div>
|
||||
|
||||
<form action="/api" method="POST" enctype="multipart/form-data" target="_blank">
|
||||
<div class="optionBox first">
|
||||
<div class="option-left">Выбор изображения:</div>
|
||||
<div class="option-right">
|
||||
<input type="text" id="url" name="url" placeholder="Укажите URL">
|
||||
<div class="option-right-small">Либо выберите файл: <input type="file" id="file" name="file"></div>
|
||||
</div>
|
||||
<div class="option-hint">Макс. размер файла — 2MB, устранение шума — макс. 2560x2560px, апскейл — 1280x1280px.</div>
|
||||
</div>
|
||||
|
||||
<div class="optionBox">
|
||||
<div class="option-left">Тип изображения:</div>
|
||||
<div class="option-right">
|
||||
<label><input type="radio" name="style" class="radio fisrt" value="art" checked><span class="r-text">Арт</span></label>
|
||||
<label><input type="radio" name="style" class="radio" value="photo"><span class="r-text">Фотография</span></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="optionBox">
|
||||
<div class="option-left">Устранение шума:<div class="option-left-small">(артефактов JPEG)</div></div>
|
||||
<div class="option-right">
|
||||
<label><input type="radio" name="noise" class="radio fisrt" value="0"><span class="r-text">Нет</span></label>
|
||||
<label><input type="radio" name="noise" class="radio" value="1" checked><span class="r-text">Средне</span></label>
|
||||
<label><input type="radio" name="noise" class="radio" value="2"><span class="r-text">Сильно</span></label>
|
||||
<label><input type="radio" name="noise" class="radio" value="3"><span class="r-text">Очень сильно (эксперим.)</span></label>
|
||||
</div>
|
||||
<div class="option-hint">Устранение шума нужно использовать, если на картинке действительно есть шум, иначе это даст противоположный эффект.</div>
|
||||
</div>
|
||||
|
||||
<div class="optionBox">
|
||||
<div class="option-left">Апскейл:<div class="option-left-small">(увеличение размера)</div></div>
|
||||
<div class="option-right">
|
||||
<label><input type="radio" name="scale" class="radio fisrt" value="0" checked><span class="r-text">Нет</span></label>
|
||||
<label><input type="radio" name="scale" class="radio" value="1"><span class="r-text">1.6x</span></label>
|
||||
<label><input type="radio" name="scale" class="radio" value="2"><span class="r-text">2x</span></label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input type="submit" class="button" value="Преобразовать">
|
||||
<input type="submit" name="download" value="Скачать" class="button">
|
||||
|
||||
<div class="bottomHint">Если Вы используете Firefox, для сохранения изображения нажмите Ctrl+S (перетаскивание изображения и опция "Сохранить изображение" работать не будут).</div>
|
||||
<!--<div class="bottomHint">Этот сайт использует Google Analytics, чтобы помочь нам повысить качество содержания сайта.</div>-->
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
BIN
assets/src/example1-zip.png
Normal file
BIN
assets/src/example1-zip.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 63 KiB |
BIN
assets/src/example1.png
Normal file
BIN
assets/src/example1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 221 KiB |
BIN
assets/src/example2.png
Normal file
BIN
assets/src/example2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 102 KiB |
BIN
assets/src/favicon.psd
Normal file
BIN
assets/src/favicon.psd
Normal file
Binary file not shown.
159
assets/style.css
159
assets/style.css
|
|
@ -1,57 +1,128 @@
|
|||
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: top; background: transparent; } /*Reset style*/
|
||||
button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner { border: none; } input[type="checkbox"]:focus { -moz-outline-offset: -1px !important; -moz-outline: 1px solid #000 !important; } :focus { outline: none; } /*Remove a dotted line around 1) buttons, 2) checkboxes, 3) links*/
|
||||
a { text-decoration: none; cursor: pointer; color: inherit; } a:hover { text-decoration: underline; }
|
||||
div, span, a, input { background-repeat: no-repeat; }
|
||||
|
||||
|
||||
|
||||
body {
|
||||
margin: 1em 2em 1em 2em;
|
||||
background: LightGray;
|
||||
width: 640px;
|
||||
margin: 2em 0.5em 2em 2em;
|
||||
padding: 0;
|
||||
background: #fff;
|
||||
color: #000;
|
||||
font-size: 14px;
|
||||
font-family: Tahoma, Arial, Verdana, sans-serif, Lucida Sans;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
fieldset {
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
|
||||
.mainTitle {
|
||||
font-size: 2em;
|
||||
font-weight: bold;
|
||||
margin: 0.6em 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.about {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
font-size: 0.9em;
|
||||
padding: 1em 5px 0.2em 0;
|
||||
|
||||
.mainTitle-text {
|
||||
display: inline-block;
|
||||
}
|
||||
.help {
|
||||
font-size: 0.8em;
|
||||
margin: 1em 0 0 0;
|
||||
|
||||
.flagLink {
|
||||
display: inline-block;
|
||||
}
|
||||
.github-banner {
|
||||
position:absolute;
|
||||
display:block;
|
||||
top:0;
|
||||
left:540px;
|
||||
max-height:140px;
|
||||
.flagLink.first { margin-left: 20px; }
|
||||
|
||||
.chooseLang {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin: 0 5px;
|
||||
opacity: 0.9;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.github-banner-image {
|
||||
position: absolute;
|
||||
display: block;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 149px;
|
||||
height: 149px;
|
||||
border: 0;
|
||||
|
||||
p {
|
||||
max-width: 710px;
|
||||
margin: 0.4em 0;
|
||||
}
|
||||
.github-banner-link {
|
||||
position: absolute;
|
||||
display: block;
|
||||
left:0;
|
||||
top:0;
|
||||
width:149px;
|
||||
height:130px;
|
||||
p.margin1 { margin: 0.9em 0; }
|
||||
|
||||
.linksBox {
|
||||
color: #999;
|
||||
}
|
||||
.padding-left {
|
||||
padding-left: 15px;
|
||||
|
||||
.example {
|
||||
width: 445px;
|
||||
height: 200px;
|
||||
}
|
||||
.hide {
|
||||
display: none;
|
||||
|
||||
.blueLink {
|
||||
color: #36b;
|
||||
}
|
||||
.experimental {
|
||||
margin-bottom: 1em;
|
||||
|
||||
|
||||
|
||||
.secondTitle {
|
||||
font-size: 1.5em;
|
||||
font-weight: bold;
|
||||
margin: 2.4em 0 1.2em;
|
||||
line-height: 1.3em;
|
||||
}
|
||||
|
||||
.optionBox {
|
||||
max-width: 800px;
|
||||
margin: 1.5em 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.option-left {
|
||||
display: inline-block;
|
||||
width: 180px;
|
||||
color: #777;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.option-left-small {
|
||||
font-size: 0.8em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.option-right {
|
||||
display: inline-block;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.option-right-small {
|
||||
margin-top: 2px;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.option-hint {
|
||||
margin: 0.5em 0;
|
||||
color: #999;
|
||||
font-size: 0.85em;
|
||||
line-height: 1.5em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
#url {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.radio.fisrt {
|
||||
margin-left: 0;
|
||||
}
|
||||
.radio:checked + .r-text { color: #494; }
|
||||
|
||||
.button {
|
||||
min-width: 128px;
|
||||
min-height: 2em;
|
||||
margin: 4px;
|
||||
min-width: 160px;
|
||||
height: 26px;
|
||||
margin: 0 10px 3px 0;
|
||||
padding-bottom: 1px;
|
||||
}
|
||||
|
||||
.bottomHint {
|
||||
max-width: 710px;
|
||||
margin: 0.85em 0;
|
||||
color: #999;
|
||||
font-size: 0.85em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
|
|
|||
107
assets/ui.js
107
assets/ui.js
|
|
@ -1,72 +1,53 @@
|
|||
$(function (){
|
||||
var expires = 365;
|
||||
function clear_file() {
|
||||
var new_file = $("#file").clone();
|
||||
new_file.change(clear_url);
|
||||
$("#file").replaceWith(new_file);
|
||||
}
|
||||
function clear_url() {
|
||||
$("#url").val("")
|
||||
}
|
||||
function on_change_style(e) {
|
||||
$("input[name=style]").parents("label").each(
|
||||
function (i, elm) {
|
||||
$(elm).css("font-weight", "normal");
|
||||
});
|
||||
var checked = $("input[name=style]:checked");
|
||||
checked.parents("label").css("font-weight", "bold");
|
||||
if (checked.val() == "art") {
|
||||
$("h1").text("waifu2x");
|
||||
} else {
|
||||
$("h1").html("w<s>/a/</s>ifu2x");
|
||||
var expires = 365;
|
||||
function clear_file() {
|
||||
var new_file = $("#file").clone();
|
||||
new_file.change(clear_url);
|
||||
$("#file").replaceWith(new_file);
|
||||
}
|
||||
$.cookie("style", checked.val(), {expires: expires});
|
||||
}
|
||||
function on_change_noise_level(e)
|
||||
{
|
||||
$("input[name=noise]").parents("label").each(
|
||||
function (i, elm) {
|
||||
$(elm).css("font-weight", "normal");
|
||||
});
|
||||
var checked = $("input[name=noise]:checked");
|
||||
if (checked.val() != 0) {
|
||||
checked.parents("label").css("font-weight", "bold");
|
||||
function clear_url() {
|
||||
$("#url").val("")
|
||||
}
|
||||
$.cookie("noise", checked.val(), {expires: expires});
|
||||
}
|
||||
function on_change_scale_factor(e)
|
||||
{
|
||||
$("input[name=scale]").parents("label").each(
|
||||
function (i, elm) {
|
||||
$(elm).css("font-weight", "normal");
|
||||
});
|
||||
var checked = $("input[name=scale]:checked");
|
||||
if (checked.val() != 0) {
|
||||
checked.parents("label").css("font-weight", "bold");
|
||||
function on_change_style(e) {
|
||||
var checked = $("input[name=style]:checked");
|
||||
if (checked.val() == "art") {
|
||||
$(".mainTitle-text").text("waifu2x");
|
||||
} else {
|
||||
$(".mainTitle-text").html("w<s>/a/</s>ifu2x");
|
||||
}
|
||||
$.cookie("style", checked.val(), {expires: expires});
|
||||
}
|
||||
$.cookie("scale", checked.val(), {expires: expires});
|
||||
}
|
||||
function restore_from_cookie()
|
||||
{
|
||||
if ($.cookie("style")) {
|
||||
$("input[name=style]").filter("[value=" + $.cookie("style") + "]").prop("checked", true)
|
||||
function on_change_noise_level(e)
|
||||
{
|
||||
var checked = $("input[name=noise]:checked");
|
||||
$.cookie("noise", checked.val(), {expires: expires});
|
||||
}
|
||||
if ($.cookie("noise")) {
|
||||
$("input[name=noise]").filter("[value=" + $.cookie("noise") + "]").prop("checked", true)
|
||||
function on_change_scale_factor(e)
|
||||
{
|
||||
var checked = $("input[name=scale]:checked");
|
||||
$.cookie("scale", checked.val(), {expires: expires});
|
||||
}
|
||||
if ($.cookie("scale")) {
|
||||
$("input[name=scale]").filter("[value=" + $.cookie("scale") + "]").prop("checked", true)
|
||||
function restore_from_cookie()
|
||||
{
|
||||
if ($.cookie("style")) {
|
||||
$("input[name=style]").filter("[value=" + $.cookie("style") + "]").prop("checked", true)
|
||||
}
|
||||
if ($.cookie("noise")) {
|
||||
$("input[name=noise]").filter("[value=" + $.cookie("noise") + "]").prop("checked", true)
|
||||
}
|
||||
if ($.cookie("scale")) {
|
||||
$("input[name=scale]").filter("[value=" + $.cookie("scale") + "]").prop("checked", true)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$("#url").change(clear_file);
|
||||
$("#file").change(clear_url);
|
||||
$("input[name=style]").change(on_change_style);
|
||||
$("input[name=noise]").change(on_change_noise_level);
|
||||
$("input[name=scale]").change(on_change_scale_factor);
|
||||
|
||||
$("#url").change(clear_file);
|
||||
$("#file").change(clear_url);
|
||||
$("input[name=style]").change(on_change_style);
|
||||
$("input[name=noise]").change(on_change_noise_level);
|
||||
$("input[name=scale]").change(on_change_scale_factor);
|
||||
|
||||
restore_from_cookie();
|
||||
on_change_style();
|
||||
on_change_scale_factor();
|
||||
on_change_noise_level();
|
||||
restore_from_cookie();
|
||||
on_change_style();
|
||||
on_change_scale_factor();
|
||||
on_change_noise_level();
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in a new issue