test/server.html

<!doctype html>
<html lang="zh-cn">
<meta name="viewport" content="width=device-width, user-scalable=no">
<head>
    <meta charset="UTF-8">
    <title>lrz4 demo&test</title>

    <link rel="stylesheet" href="../src/lib/bootstrap.min.css?v=1e35cd1"/>
    <style>
        img {
            width: 100%;
            max-width: 320px;
            padding: 10px 15px;
        }

        .tip {
            position: relative;
            top: 15px;
            right: 10px;
        }
    </style>
</head>
<body>
<div class="navbar navbar-default">
    <div class="pull-right tip text-muted">遇到问题时请截图到 <a
            href="https://github.com/think2011/localResizeIMG/issues">issues</a>
    </div>
    <div class="container">
        <div class="navbar-header">
            <a href="./" class="navbar-brand">Lrz4 </a>
        </div>
    </div>
</div>

<div class="container">
    <div class="row">
        <div class="col-xs-12 text-center">
            <h3 style="margin-top: 0;">上传图片测试</h3>
            <small><a href="index.html">切换至无服务端演示</a></small>
            <div>
                <progress value="0" max="100"></progress>
            </div>

            <small class="text-muted">配置：宽度不超过800，高度适应，70%压缩率</small>
            <br/>
            <small class="text-muted">演示服务端是跨域上传且免费的,所以较慢,请耐心等待..</small>
            <br/>
            <small class="text-muted UA">UA</small>
            <hr/>
        </div>

        <div id="upload-container" class="col-xs-12 text-center">
            <input accept="image/*" type="file"/>
        </div>

        <div class="col-xs-12 text-center">
            <hr/>
            <h3>旋转方向测试</h3>
            <small class="text-muted">看到的图像应该全是一个方向的，没见到图片是出问题了</small>
            <hr/>
        </div>

        <div class="col-xs-6 text-center">
            <img data-src="img/orientation_1.JPG?v=49ec2ec"
                 src="http://placehold.it/1x1" alt="点击载入"/>

            <p>方向为【1】的图片</p>
        </div>
        <div class="col-xs-6 text-center">
            <img data-src="img/orientation_3.JPG?v=c393d29"
                 src="http://placehold.it/1x1" alt="点击载入"/>

            <p>方向为【3】的图片</p>
        </div>
        <div class="col-xs-6 text-center">
            <img data-src="img/orientation_6.JPG?v=cd9d967"
                 src="http://placehold.it/1x1" alt="点击载入"/>

            <p>方向为【6】的图片</p>
        </div>
        <div class="col-xs-6 text-center">
            <img data-src="img/orientation_8.JPG?v=619646c"
                 src="http://placehold.it/1x1" alt="点击载入"/>

            <p>方向为【8】的图片</p>
        </div>
    </div>
</div>

<footer class="text-center">
    <hr/>
    <p class="text-muted"><a href="https://github.com/think2011/localResizeIMG">
        localResizeIMG(<span id="version"></span>版) by think2011</a>
    </p>
</footer>


<script src="../dist/lrz.bundle.js?v=7687367"></script>
<script src="./server.js?v=c8aaa97"></script>
</body>
</html>