Reorganize directory structures
Signed-off-by: Sean Du <do4suki@gmail.com>
This commit is contained in:
@@ -1,27 +0,0 @@
|
||||
{{ define "admin/card.html" }}
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<title>SIF 小助手</title>
|
||||
{{ template "admin/nav/css.html" . }}
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="layui-layout layui-layout-admin">
|
||||
{{ template "admin/nav/header.html" . }}
|
||||
{{ template "admin/nav/side.html" . }}
|
||||
|
||||
<div class="layui-body">
|
||||
<div style="padding: 15px;">{{ .url }}</div>
|
||||
</div>
|
||||
|
||||
{{ template "admin/nav/footer.html" . }}
|
||||
</div>
|
||||
<script src="/static/js/layui.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
{{ end }}
|
||||
@@ -1,27 +0,0 @@
|
||||
{{ define "admin/index.html" }}
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<title>SIF 小助手</title>
|
||||
{{ template "admin/nav/css.html" . }}
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="layui-layout layui-layout-admin">
|
||||
{{ template "admin/nav/header.html" . }}
|
||||
{{ template "admin/nav/side.html" . }}
|
||||
|
||||
<div class="layui-body">
|
||||
<div style="padding: 15px;">{{ .url }}</div>
|
||||
</div>
|
||||
|
||||
{{ template "admin/nav/footer.html" . }}
|
||||
</div>
|
||||
<script src="/static/js/layui.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
{{ end }}
|
||||
@@ -1,113 +0,0 @@
|
||||
{{ define "admin/login.html" }}
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>SIF 小助手</title>
|
||||
{{ template "admin/nav/css.html" . }}
|
||||
|
||||
<style>
|
||||
body {
|
||||
background: url("/static/images/admin/top-bg.jpg") no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
margin-top: 1%;
|
||||
border: 0px;
|
||||
color: azure;
|
||||
background: #e4007f;
|
||||
}
|
||||
|
||||
.login-btn:hover {
|
||||
color: aliceblue;
|
||||
}
|
||||
|
||||
.layui-input {
|
||||
width: 85%;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="layui-container">
|
||||
<button type="button" class="layui-btn layui-btn-lg layui-btn-primary layui-btn-radius login-btn">点击登录</button>
|
||||
</div>
|
||||
<script src="/static/js/layui.js"></script>
|
||||
<script>
|
||||
layui.use('layer', function () {
|
||||
var $ = layui.$
|
||||
, layer = layui.layer;
|
||||
|
||||
$(".login-btn").click(function () {
|
||||
layer.open({
|
||||
type: 1,
|
||||
area: ['600px', '280px'],
|
||||
title: "登录",
|
||||
content: $('#login-form'),
|
||||
shade: 0
|
||||
})
|
||||
})
|
||||
|
||||
$("#login-submit").click(function () {
|
||||
let area = $("#area option:selected").val();
|
||||
let user = $("#sifuser").val();
|
||||
let pass = $("#sifpass").val();
|
||||
console.log(area)
|
||||
console.log(user)
|
||||
console.log(pass)
|
||||
$.post("/admin/login", { area: area, user: user, pass: pass }, function (data) {
|
||||
if (data.code != 0) {
|
||||
layer.msg(data.message)
|
||||
return
|
||||
}
|
||||
layer.msg(data.message)
|
||||
setTimeout(function () {
|
||||
window.location.href = data.redirect;
|
||||
}, 1500)
|
||||
})
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
<div id="login-form" style="display: none; padding: 10px;">
|
||||
<form class="layui-form">
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">地区</label>
|
||||
<div class="layui-input-block">
|
||||
<select name="area" id="area" lay-verify="required">
|
||||
<option value="86" selected>中国大陆(+86)</option>
|
||||
<option value="852">中国香港(+852)</option>
|
||||
<option value="853">中国澳门(+853)</option>
|
||||
<option value="886">中国台湾(+886)</option>
|
||||
<option value="1">美国(+1)</option>
|
||||
<option value="81">日本(+81)</option>
|
||||
<option value="82">韩国(+82)</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">账号</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="sifuser" id="sifuser" required lay-verify="required" placeholder="请输入账号"
|
||||
autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">密码</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="password" name="sifpass" id="sifpass" required lay-verify="required" placeholder="请输入密码"
|
||||
autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div class="layui-input-block">
|
||||
<button class="layui-btn" id="login-submit">登录</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</html>
|
||||
{{ end }}
|
||||
@@ -1,34 +0,0 @@
|
||||
{{ define "admin/nav/css.html" }}
|
||||
<link rel="stylesheet" href="/static/css/layui.css">
|
||||
|
||||
<style>
|
||||
.sif-title {
|
||||
font-size: 1.3em;
|
||||
color: aliceblue;
|
||||
}
|
||||
|
||||
.layui-body {
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
.layui-header {
|
||||
background-color: #e4007f !important;
|
||||
}
|
||||
|
||||
.layui-side {
|
||||
background-color: #e4007f;
|
||||
}
|
||||
|
||||
.layui-nav {
|
||||
background-color: #e4007f;
|
||||
}
|
||||
|
||||
.layui-nav-tree .layui-nav-child dd.layui-this,
|
||||
.layui-nav-tree .layui-nav-child dd.layui-this a,
|
||||
.layui-nav-tree .layui-this,
|
||||
.layui-nav-tree .layui-this>a,
|
||||
.layui-nav-tree .layui-this>a:hover {
|
||||
background-color: #ff6699 !important;
|
||||
}
|
||||
</style>
|
||||
{{ end }}
|
||||
@@ -1,5 +0,0 @@
|
||||
{{ define "admin/nav/footer.html" }}
|
||||
<div class="layui-footer">
|
||||
Copyright © 2023 YumeMichi
|
||||
</div>
|
||||
{{ end }}
|
||||
@@ -1,23 +0,0 @@
|
||||
{{ define "admin/nav/header.html" }}
|
||||
<div class="layui-header">
|
||||
<div class="layui-logo layui-hide-xs"><a href="/admin/index"><span class="sif-title">SIF
|
||||
小助手</span></a></div>
|
||||
<ul class="layui-nav layui-layout-left">
|
||||
<li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm" lay-header-event="menuLeft">
|
||||
<i class="layui-icon layui-icon-spread-left"></i>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="layui-nav layui-layout-right">
|
||||
<li class="layui-nav-item layui-hide layui-show-md-inline-block">
|
||||
<a href="javascript:;">
|
||||
<img src="/static/images/admin/ic_launcher.png" class="layui-nav-img">
|
||||
设置
|
||||
</a>
|
||||
<dl class="layui-nav-child">
|
||||
<dd><a href="">个人信息</a></dd>
|
||||
<dd><a href="/admin/logout">登出</a></dd>
|
||||
</dl>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
{{ end }}
|
||||
@@ -1,17 +0,0 @@
|
||||
{{ define "admin/nav/side.html" }}
|
||||
<div class="layui-side">
|
||||
<div class="layui-side-scroll">
|
||||
<ul class="layui-nav layui-nav-tree" lay-filter="test">
|
||||
<li class="layui-nav-item {{ if eq .menu 1 }} layui-nav-itemed {{ end }}">
|
||||
<a class="" href="javascript:;">卡片管理</a>
|
||||
<dl class="layui-nav-child">
|
||||
<dd {{ if eq .url "/admin/card" }} class="layui-this" {{ end }}><a href="/admin/card">卡片一览</a></dd>
|
||||
<dd {{ if eq .url "/admin/upload" }} class="layui-this" {{ end }}><a href="/admin/upload">卡片导入</a>
|
||||
</dd>
|
||||
</dd>
|
||||
</dl>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
@@ -1,87 +0,0 @@
|
||||
{{ define "admin/upload.html" }}
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<title>SIF 小助手</title>
|
||||
{{ template "admin/nav/css.html" . }}
|
||||
<style>
|
||||
li {
|
||||
list-style-type: decimal !important;
|
||||
margin-left: 10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="layui-layout layui-layout-admin">
|
||||
{{ template "admin/nav/header.html" . }}
|
||||
{{ template "admin/nav/side.html" . }}
|
||||
|
||||
<div class="layui-body">
|
||||
<form class="layui-form layui-col-md6" action="">
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">文件</label>
|
||||
<div class="layui-input-block">
|
||||
<button type="button" name="file" class="layui-btn layui-btn-normal" id="test8">选择文件</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label"></label>
|
||||
<div class="layui-input-block">
|
||||
<div class="layui-collapse">
|
||||
<div class="layui-colla-item">
|
||||
<h2 class="layui-colla-title">使用帮助</h2>
|
||||
<div class="layui-colla-content">
|
||||
<ol>
|
||||
<li>从 <a href="https://card.niconi.co.ni/" target="_blank">LLSIF
|
||||
查卡器</a> 查询需要导入的卡片 ID,卡片信息上的 No.xxx 数字。
|
||||
</li>
|
||||
<li>使用任意文本编辑器创建一个 .txt 文件,按照<b>卡片 ID,技能等级</b>的格式(例如 SDS 果,技能 8 级则填入
|
||||
3885,8)填入需要导入的卡片,每张卡片单独一行。</li>
|
||||
<li>分隔符逗号为<b>半角 ,</b> 而非<b>全角 ,</b>。</li>
|
||||
<li>仅需要设置技能等级,卡片默认等级MAX,宝石请在游戏内设置。</li>
|
||||
<li>仅支持导入UR卡片。</li>
|
||||
<li>仅支持导入国服拥有的卡片。</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<button type="button" class="layui-btn" id="test9">开始导入</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{{ template "admin/nav/footer.html" . }}
|
||||
</div>
|
||||
<script src="/static/js/layui.js"></script>
|
||||
<script>
|
||||
layui.use(['upload', 'layer'], function () {
|
||||
var $ = layui.jquery
|
||||
, upload = layui.upload
|
||||
, layer = layui.layer;
|
||||
|
||||
upload.render({
|
||||
elem: '#test8'
|
||||
, url: '/admin/upload' // 此处配置你自己的上传接口即可
|
||||
, auto: false
|
||||
, accept: 'file' // 普通文件
|
||||
, size: 50 // 限制文件大小,单位 KB
|
||||
, bindAction: '#test9'
|
||||
, done: function (res) {
|
||||
layer.msg(res.msg);
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
{{ end }}
|
||||
@@ -1,57 +0,0 @@
|
||||
{{ define "common/announce.html" }}
|
||||
<!DOCTYPE html>
|
||||
<html lang="ja">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="viewport" content="width=880, target-densitydpi=device-dpi, user-scalable=no">
|
||||
<meta name="format-detection" content="telephone=no">
|
||||
<title>{{ .title }}</title>
|
||||
<link rel="stylesheet" href="/static/css/base.css">
|
||||
<link rel="stylesheet" href="/static/css/window.css">
|
||||
<link rel="stylesheet" href="/static/css/perfect-scrollbar.css">
|
||||
<link rel="stylesheet" href="/static/css/ll-perfect-scrollbar.css">
|
||||
<style>
|
||||
h2 {
|
||||
color: red;
|
||||
font-size: 100%;
|
||||
}
|
||||
|
||||
p+p {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.update-link {
|
||||
color: #0be;
|
||||
display: block;
|
||||
font-size: 150%;
|
||||
margin: 20px auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.notice {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body class="no-back">
|
||||
<div id="outer">
|
||||
<div id="inner">
|
||||
<div id="header">
|
||||
<h1>{{ .title }}</h1>
|
||||
</div>
|
||||
<div id="body">
|
||||
<p>{{ .content }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="/static/js/perfect-scrollbar.min.js"></script>
|
||||
<script>
|
||||
new PerfectScrollbar('#body', { suppressScrollX: true });
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
{{ end }}
|
||||
@@ -1,256 +0,0 @@
|
||||
{{ define "common/manga.html" }}
|
||||
<!DOCTYPE html>
|
||||
<html lang="ja">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="viewport" content="width=880, target-densitydpi=device-dpi, user-scalable=no">
|
||||
<meta name="format-detection" content="telephone=no">
|
||||
<title>转校生漫画 〜转校生庆典〜</title>
|
||||
<link rel="stylesheet" href="/static/css/base.css">
|
||||
<link rel="stylesheet" href="/static/css/perfect-scrollbar.css">
|
||||
<link rel="stylesheet" href="/static/css/ll-perfect-scrollbar.css">
|
||||
<link rel="stylesheet" href="/static/css/style.css">
|
||||
</head>
|
||||
|
||||
<body class="android_chromium ">
|
||||
<div id="body">
|
||||
<div id="list-container">
|
||||
<h2><img src="/static/images/title-banner.png"></h2>
|
||||
<div id="list-scroll">
|
||||
<ul>
|
||||
<li class="button" data-image="/static/images/15238702168776.png">
|
||||
<p>第54话 转学生派对</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15238701747409.png">
|
||||
<p>第53话 末路</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15238695641197.png">
|
||||
<p>第52话 练习</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15238695587056.png">
|
||||
<p>第51话 放松效果</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15238695455400.png">
|
||||
<p>第50话 好胜心</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15238695303404.png">
|
||||
<p>第49话 相遇的两人</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15238695116848.png">
|
||||
<p>第48话 消化</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15238694919055.png">
|
||||
<p>第47话 摘花</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15238694807202.png">
|
||||
<p>第46话 小心叮咛</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141865196092.jpg">
|
||||
<p>第45话 好人有好报</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141865133555.jpg">
|
||||
<p>第44话 被宠坏的鸟儿</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141865055652.jpg">
|
||||
<p>第43话 海对岸的双峰</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15238681581968.png">
|
||||
<p>第42话 美丽的发声练习</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141864889884.jpg">
|
||||
<p>第41话 强力副歌的美学</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141864804128.jpg">
|
||||
<p>第40话 热血女子</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141864695842.jpg">
|
||||
<p>第39话 恶作剧之风</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141864584520.jpg">
|
||||
<p>第38话 禅之心</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141864261972.jpg">
|
||||
<p>第37话 枪械迷</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141863772178.jpg">
|
||||
<p>第36话 爱与正义的风纪纠察</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141863639911.jpg">
|
||||
<p>第35话 帅哥特集</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141863483422.jpg">
|
||||
<p>第34话 保护</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141863365919.jpg">
|
||||
<p>第33话 窗边美景</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141863229129.jpg">
|
||||
<p>第32话 机动性↑↑</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141863126912.jpg">
|
||||
<p>第31话 祈祷</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141862946556.jpg">
|
||||
<p>第30话 努力</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141862776588.jpg">
|
||||
<p>第29话 溜冰</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15141856059568.jpg">
|
||||
<p>第28话 逃跑</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047555888980.jpg">
|
||||
<p>第27话 突刺</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047555798773.jpg">
|
||||
<p>第26话 咖喱饭</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047555704112.jpg">
|
||||
<p>第25话 坠入爱河之日</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047555585712.jpg">
|
||||
<p>第24话 饲料</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047555499746.jpg">
|
||||
<p>第23话 刚才的事</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047555411780.jpg">
|
||||
<p>第22话 天体观测</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15107324142966.png">
|
||||
<p>第21话 空腹</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047555219572.jpg">
|
||||
<p>第20话 斗舞2</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047555087747.jpg">
|
||||
<p>第19话 斗舞</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047554922924.jpg">
|
||||
<p>第18话 点单</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15088959186072.jpg">
|
||||
<p>第17话 学园偶像祭最快决定战!!</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047554774569.jpg">
|
||||
<p>第16话 历史</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047554596230.jpg">
|
||||
<p>第15话 量尺寸</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047554481319.jpg">
|
||||
<p>第14话 艺术</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047554315307.jpg">
|
||||
<p>第13话 读书</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047554203428.jpg">
|
||||
<p>第12话 演出前</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047554108052.jpg">
|
||||
<p>第11话 特技</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047553982300.jpg">
|
||||
<p>第10话 学园偶像祭最快决定战!!</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047553849518.jpg">
|
||||
<p>第9话 给我醒过来!!</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047553728636.jpg">
|
||||
<p>第8话 秘密调查</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047553611357.jpg">
|
||||
<p>第7话 炎</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047553496606.jpg">
|
||||
<p>第6话 野生</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047553374283.jpg">
|
||||
<p>第5话 诞生</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047551242040.jpg">
|
||||
<p>第4话 优雅的放学后</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047551145790.jpg">
|
||||
<p>第3话 情人节</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047551059201.jpg">
|
||||
<p>第2话 游泳</p>
|
||||
</li>
|
||||
<li class="button" data-image="/static/images/15047550942873.jpg">
|
||||
<p>第1话 开始!</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="image-container">
|
||||
<div id="image-scroll">
|
||||
<img id="image" src="/static/images/15238702168776.png" width="444" height="850">
|
||||
</div>
|
||||
</div>
|
||||
<div id="large-image-container">
|
||||
<div id="large-image-scroll">
|
||||
<img id="large-image" width="888" height="1700">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="/static/js/perfect-scrollbar.min.js"></script>
|
||||
<script src="/static/js/button.js"></script>
|
||||
<script>
|
||||
var largeImageContainer = document.getElementById('large-image-container');
|
||||
|
||||
var listScroll = document.getElementById('list-scroll');
|
||||
var imageScroll = document.getElementById('image-scroll');
|
||||
var largeImageScroll = document.getElementById('large-image-scroll');
|
||||
|
||||
var image = document.getElementById('image');
|
||||
var largeImage = document.getElementById('large-image');
|
||||
|
||||
new PerfectScrollbar(listScroll, { suppressScrollX: true });
|
||||
var imageScrollbar = new PerfectScrollbar(imageScroll, { suppressScrollX: true });
|
||||
var largeImageScrollbar = new PerfectScrollbar(largeImageScroll, { suppressScrollX: true });
|
||||
|
||||
function resetImageScroll() {
|
||||
imageScroll.scrollTop = 0;
|
||||
imageScrollbar.update();
|
||||
}
|
||||
|
||||
function showLargeImage() {
|
||||
if (largeImageContainer.style.display === 'block') {
|
||||
return;
|
||||
}
|
||||
|
||||
largeImage.src = image.src;
|
||||
largeImageContainer.style.display = 'block';
|
||||
|
||||
largeImageScroll.scrollTop = 0;
|
||||
largeImageScrollbar.update();
|
||||
}
|
||||
|
||||
function hideLargeImage() {
|
||||
largeImageContainer.style.display = 'none';
|
||||
}
|
||||
|
||||
image.addEventListener('load', resetImageScroll);
|
||||
image.addEventListener('click', showLargeImage);
|
||||
|
||||
largeImageContainer.addEventListener('click', hideLargeImage);
|
||||
|
||||
var buttons = document.getElementsByClassName('button');
|
||||
for (var i = 0; i < buttons.length; ++i) {
|
||||
Button.initialize(buttons[i], function () {
|
||||
var url = this.getAttribute('data-image');
|
||||
if (url.replace(/^.*\//, '') !== image.src.replace(/^.*\//, '')) {
|
||||
image.src = url;
|
||||
} else {
|
||||
resetImageScroll();
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
{{ end }}
|
||||
Reference in New Issue
Block a user