From e9ed17ca2d5eaafe69704ee817817a539d847e78 Mon Sep 17 00:00:00 2001
From: Junjie <fallin.jie@qq.com>
Date: 星期四, 20 七月 2023 09:04:44 +0800
Subject: [PATCH] 登录页面
---
src/main/java/com/zy/system/service/impl/ConfigServiceImpl.java | 11
src/main/webapp/static/wcs/images/weixin_qrcode.jpg | 0
src/main/java/com/zy/common/web/AuthController.java | 16
src/main/java/com/zy/system/mapper/ConfigMapper.java | 7
src/main/webapp/views/login2.html | 799 ++++++++++++++++++++++++
src/main/webapp/static/wcs/images/banner.mp4 | 0
src/main/java/com/zy/system/service/ConfigService.java | 7
src/main/resources/mapper/ConfigMapper.xml | 13
src/main/webapp/views/login.html | 1075 ++++++++-----------------------
9 files changed, 1,145 insertions(+), 783 deletions(-)
diff --git a/src/main/java/com/zy/common/web/AuthController.java b/src/main/java/com/zy/common/web/AuthController.java
index badc290..452170f 100644
--- a/src/main/java/com/zy/common/web/AuthController.java
+++ b/src/main/java/com/zy/common/web/AuthController.java
@@ -46,6 +46,8 @@
private PermissionService permissionService;
@Autowired
private RolePermissionService rolePermissionService;
+ @Autowired
+ private ConfigService configService;
@RequestMapping("/login.action")
@ManagerAuth(value = ManagerAuth.Auth.NONE, memo = "鐧诲綍")
@@ -80,6 +82,20 @@
return R.ok(res);
}
+ @RequestMapping("/loginInformation")
+ public R getLoginPageInformation() {
+ Config loginLogo = configService.selectByCode("loginLogo");
+ Config loginCopyrightText = configService.selectByCode("loginCopyrightText");
+ Config loginCopyrightImg1 = configService.selectByCode("loginCopyrightImg1");
+
+ HashMap<String, Object> map = new HashMap<>();
+ map.put("loginLogo", loginLogo.getValue());
+ map.put("loginCopyrightText", loginCopyrightText.getValue());
+ map.put("loginCopyrightImg1", loginCopyrightImg1.getValue());
+
+ return R.ok().add(map);
+ }
+
@RequestMapping("/code/switch.action")
public R code() {
return R.ok().add(Parameter.get().getCodeSwitch());
diff --git a/src/main/java/com/zy/system/mapper/ConfigMapper.java b/src/main/java/com/zy/system/mapper/ConfigMapper.java
index 9ec6ab3..e82ce27 100644
--- a/src/main/java/com/zy/system/mapper/ConfigMapper.java
+++ b/src/main/java/com/zy/system/mapper/ConfigMapper.java
@@ -3,10 +3,17 @@
import com.baomidou.mybatisplus.mapper.BaseMapper;
import com.zy.system.entity.Config;
import org.apache.ibatis.annotations.Mapper;
+import org.apache.ibatis.annotations.Param;
import org.springframework.stereotype.Repository;
+
+import java.util.List;
@Mapper
@Repository
public interface ConfigMapper extends BaseMapper<Config> {
+ Config selectByCode(String code);
+
+ List<Config> selectByCodes(@Param("codes") List<String> codes);
+
}
diff --git a/src/main/java/com/zy/system/service/ConfigService.java b/src/main/java/com/zy/system/service/ConfigService.java
index 7e31e9a..09f4e02 100644
--- a/src/main/java/com/zy/system/service/ConfigService.java
+++ b/src/main/java/com/zy/system/service/ConfigService.java
@@ -2,7 +2,14 @@
import com.baomidou.mybatisplus.service.IService;
import com.zy.system.entity.Config;
+import org.apache.ibatis.annotations.Param;
+
+import java.util.List;
public interface ConfigService extends IService<Config> {
+ Config selectByCode(String code);
+
+ List<Config> selectByCodes(@Param("codes") List<String> codes);
+
}
diff --git a/src/main/java/com/zy/system/service/impl/ConfigServiceImpl.java b/src/main/java/com/zy/system/service/impl/ConfigServiceImpl.java
index 0a8661c..8f27ef8 100644
--- a/src/main/java/com/zy/system/service/impl/ConfigServiceImpl.java
+++ b/src/main/java/com/zy/system/service/impl/ConfigServiceImpl.java
@@ -6,7 +6,18 @@
import com.zy.system.service.ConfigService;
import org.springframework.stereotype.Service;
+import java.util.List;
+
@Service("configService")
public class ConfigServiceImpl extends ServiceImpl<ConfigMapper, Config> implements ConfigService {
+ @Override
+ public Config selectByCode(String code) {
+ return this.baseMapper.selectByCode(code);
+ }
+
+ @Override
+ public List<Config> selectByCodes(List<String> codes) {
+ return this.baseMapper.selectByCodes(codes);
+ }
}
diff --git a/src/main/resources/mapper/ConfigMapper.xml b/src/main/resources/mapper/ConfigMapper.xml
index 8673fe5..8dd9f7d 100644
--- a/src/main/resources/mapper/ConfigMapper.xml
+++ b/src/main/resources/mapper/ConfigMapper.xml
@@ -13,4 +13,17 @@
</resultMap>
+ <select id="selectByCode" resultMap="BaseResultMap">
+ select top 1 * from sys_config
+ where code = #{code}
+ </select>
+
+ <select id="selectByCodes" resultMap="BaseResultMap">
+ select * from sys_config
+ where code in
+ <foreach item="item" collection="codes" index="index" separator="," open="(" close=")">
+ #{item}
+ </foreach>
+ </select>
+
</mapper>
diff --git a/src/main/webapp/static/wcs/images/banner.mp4 b/src/main/webapp/static/wcs/images/banner.mp4
new file mode 100644
index 0000000..81cf575
--- /dev/null
+++ b/src/main/webapp/static/wcs/images/banner.mp4
Binary files differ
diff --git a/src/main/webapp/static/wcs/images/weixin_qrcode.jpg b/src/main/webapp/static/wcs/images/weixin_qrcode.jpg
new file mode 100644
index 0000000..50fedd5
--- /dev/null
+++ b/src/main/webapp/static/wcs/images/weixin_qrcode.jpg
Binary files differ
diff --git a/src/main/webapp/views/login.html b/src/main/webapp/views/login.html
index 19e17dc..075a534 100644
--- a/src/main/webapp/views/login.html
+++ b/src/main/webapp/views/login.html
@@ -1,799 +1,308 @@
-<!doctype html>
+<!DOCTYPE html>
<html>
-<head>
- <meta charset="utf-8">
- <title>涓壃 鈹� login of zoneyung wcs</title>
+ <head>
+ <meta charset="utf-8">
+ <title>涓壃 鈹� login of zoneyung wcs</title>
+ <style>
+ * {
+ padding: 0;
+ margin: 0;
+ }
- <style>
- html,body {
- height:100%;
- }
- body {
- margin:0;
- background:#000;
- }
- canvas {
- display:block;
- }
- .waves {
- position:absolute;
- left:0;
- top:0;
- right:0;
- bottom:0;
- }
+ .container {
+ display: flex;
+ height: 100vh;
+ width: 100%;
+ }
- .form_main {
- width: 300px;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- background-color: rgba(255, 255, 255, 0.6);
- padding: 50px 30px 50px 30px;
- border-radius: 30px;
- box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.062);
- }
+ .left-box {
+ height: 100%;
+ width: 70%;
+ }
- .heading {
- font-size: 2.5em;
- color: #2e2e2e;
- font-weight: 700;
- margin: 15px 0 0px 0;
- }
+ .login-video {
+ height: 100%;
+ overflow: hidden;
+ }
- .inputContainer {
- width: 100%;
- position: relative;
- display: flex;
- align-items: center;
- justify-content: center;
- }
+ .form-main {
+ width: 300px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ background-color: rgba(255, 255, 255, 0.6);
+ padding: 50px 30px 50px 30px;
+ border-radius: 20px;
+ box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.062);
+ }
- .inputIcon {
- position: absolute;
- left: 10px;
- }
+ .heading {
+ font-size: 2.5em;
+ color: #2e2e2e;
+ font-weight: 700;
+ margin: 15px 0 0px 0;
+ }
- .inputField {
- width: 100%;
- height: 40px;
- background-color: transparent;
- border: none;
- border-bottom: 2px solid rgb(173, 173, 173);
- border-radius: 30px;
- margin: 10px 0;
- color: black;
- font-size: .8em;
- font-weight: 500;
- box-sizing: border-box;
- padding-left: 30px;
- }
+ .inputContainer {
+ width: 100%;
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
- .inputField:focus {
- outline: none;
- border-bottom: 2px solid rgb(199, 114, 255);
- }
+ .inputIcon {
+ position: absolute;
+ left: 10px;
+ }
- .inputField::placeholder {
- color: rgb(80, 80, 80);
- font-size: 1em;
- font-weight: 500;
- }
+ .inputField {
+ width: 100%;
+ height: 40px;
+ background-color: transparent;
+ border: none;
+ border-bottom: 2px solid rgb(173, 173, 173);
+ border-radius: 30px;
+ margin: 10px 0;
+ color: black;
+ font-size: .8em;
+ font-weight: 500;
+ box-sizing: border-box;
+ padding-left: 30px;
+ }
- #login-button {
- position: relative;
- width: 100%;
- border: 2px solid #8000ff;
- background-color: #8000ff;
- height: 40px;
- color: white;
- font-size: .8em;
- font-weight: 500;
- letter-spacing: 1px;
- border-radius: 30px;
- margin: 10px;
- cursor: pointer;
- overflow: hidden;
- }
+ .inputField:focus {
+ outline: none;
+ border-bottom: 2px solid rgb(199, 114, 255);
+ }
- #login-button::after {
- content: "";
- position: absolute;
- background-color: rgba(255, 255, 255, 0.253);
- height: 100%;
- width: 150px;
- top: 0;
- left: -200px;
- border-bottom-right-radius: 100px;
- border-top-left-radius: 100px;
- filter: blur(10px);
- transition-duration: .5s;
- }
+ .inputField::placeholder {
+ color: rgb(80, 80, 80);
+ font-size: 1em;
+ font-weight: 500;
+ }
+
+ .login-box {
+ height: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
- #login-button:hover::after {
- transform: translateX(600px);
- transition-duration: .5s;
- }
+ #login-button {
+ position: relative;
+ width: 100%;
+ border: 2px solid #8000ff;
+ background-color: #8000ff;
+ height: 40px;
+ color: white;
+ font-size: .8em;
+ font-weight: 500;
+ letter-spacing: 1px;
+ border-radius: 30px;
+ margin: 10px;
+ cursor: pointer;
+ overflow: hidden;
+ }
- .signupContainer {
- margin: 0;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- gap: 20px;
- }
+ #login-button::after {
+ content: "";
+ position: absolute;
+ background-color: rgba(255, 255, 255, 0.253);
+ height: 100%;
+ width: 150px;
+ top: 0;
+ left: -200px;
+ border-bottom-right-radius: 100px;
+ border-top-left-radius: 100px;
+ filter: blur(10px);
+ transition-duration: .5s;
+ }
- .signupContainer p {
- font-size: .9em;
- font-weight: 500;
- color: black;
- }
+ #login-button:hover::after {
+ transform: translateX(600px);
+ transition-duration: .5s;
+ }
+
+ .right-box {
+ height: 100%;
+ width: 30%;
+ background: #f6f6f6;
+ position: relative;
+ }
+
+ .login-copyright {
+ position: absolute;
+ bottom: 20px;
+ right: 20px;
+ font-size: 14px;
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+
+ .copyright-text {
+ margin-right: 20px;
+ }
+
+ .copyright-img {
+ width: 40px;
+ height: 40px;
+ position: relative;
+ }
+
+ .copyright-img > img {
+ width: 100%;
+ height: 100%;
+ }
+
+ .copyright-img-large {
+ width: 140px;
+ height: 140px;
+ position: absolute;
+ top: -140px;
+ left: -50px;
+ display: none;
+ }
+
+ .copyright-img-large > img {
+ width: 100%;
+ height: 100%;
+ }
+ </style>
+ </head>
+ <body>
+ <div class="container">
+ <div class="left-box">
+ <div class="login-video">
+ <video src="../static/wcs/images/banner.mp4" height="100%" loop autoplay muted="false"
+ controlslist="nodownload" disablepictureinpicture></video>
+ </div>
+ </div>
- .signupContainer a {
- font-size: .7em;
- font-weight: 500;
- background-color: #2e2e2e;
- color: white;
- text-decoration: none;
- padding: 8px 15px;
- border-radius: 20px;
- }
+ <div class="right-box">
+ <div class="login-box">
+ <div class="form-main">
+ <p style="text-align: center;"><img class="loginLogoUrl" src="../static/wcs/images/logo.png" alt="" style="width: 80%">
+ </p>
+ <p style="margin-top: -15px;"><span class="login100-form-title p-t-20 p-b-45"
+ style="color: #868686;font-size: 24px">WCS</span></p>
+ <div class="inputContainer">
+ <svg viewBox="0 0 16 16" fill="#2e2e2e" height="16" width="16"
+ xmlns="http://www.w3.org/2000/svg" class="inputIcon">
+ <path
+ d="M13.106 7.222c0-2.967-2.249-5.032-5.482-5.032-3.35 0-5.646 2.318-5.646 5.702 0 3.493 2.235 5.708 5.762 5.708.862 0 1.689-.123 2.304-.335v-.862c-.43.199-1.354.328-2.29.328-2.926 0-4.813-1.88-4.813-4.798 0-2.844 1.921-4.881 4.594-4.881 2.735 0 4.608 1.688 4.608 4.156 0 1.682-.554 2.769-1.416 2.769-.492 0-.772-.28-.772-.76V5.206H8.923v.834h-.11c-.266-.595-.881-.964-1.6-.964-1.4 0-2.378 1.162-2.378 2.823 0 1.737.957 2.906 2.379 2.906.8 0 1.415-.39 1.709-1.087h.11c.081.67.703 1.148 1.503 1.148 1.572 0 2.57-1.415 2.57-3.643zm-7.177.704c0-1.197.54-1.907 1.456-1.907.93 0 1.524.738 1.524 1.907S8.308 9.84 7.371 9.84c-.895 0-1.442-.725-1.442-1.914z">
+ </path>
+ </svg>
+ <input placeholder="璇疯緭鍏ョ敤鎴峰悕" id="username" name="username" class="inputField" type="text">
+ </div>
+
+ <div class="inputContainer">
+ <svg viewBox="0 0 16 16" fill="#2e2e2e" height="16" width="16"
+ xmlns="http://www.w3.org/2000/svg" class="inputIcon">
+ <path
+ d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z">
+ </path>
+ </svg>
+ <input placeholder="璇疯緭鍏ュ瘑鐮�" id="password" name="pass" class="inputField" type="password">
+ </div>
+
+ <input type="button" id="login-button" value="鐧诲綍">
+ </div>
+ </div>
+
+ <div class="login-copyright">
+ <div class="copyright-text">Copyright 漏2023 娴欐睙涓壃绔嬪簱鎶�鏈湁闄愬叕鍙哥増鏉冩墍鏈�</div>
+ <div id="copyright-img1" class="copyright-img">
+ <img class="copyright-img-url" src="../static/wcs/images/weixin_qrcode.jpg" />
+ <div id="copyright-img-large1" class="copyright-img-large"><img class="copyright-img-url" src="../static/wcs/images/weixin_qrcode.jpg" /></div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <script type="text/javascript" src="../static/wms/js/jquery/jquery-3.3.1.min.js"></script>
+ <script type="text/javascript" src="../static/wms/js/tools/md5.js"></script>
+ <script type="text/javascript" src="../static/wms/layer/layer.js"></script>
+ <script type="text/javascript" src="../static/wms/js/common.js"></script>
+ <script>
+ // remember pwd
+ $(function () {
+ $.ajax({
+ url: baseUrl+"/loginInformation",
+ data: {},
+ method: 'GET',
+ success: function (res) {
+ var data = res.data
+ $(".copyright-text").text(data.loginCopyrightText);
+ $(".copyright-img-url").attr("src", data.loginCopyrightImg1);
+ $(".loginLogoUrl").attr("src", data.loginLogo);
+ }
+ });
- </style>
-</head>
-<body>
-
-<div class="waves">
- <div style="position: absolute;left: calc(50% - 200px);top: 25%;">
- <div class="form_main">
- <p style="text-align: center;"><img src="../static/wcs/images/logo.png" alt="" style="width: 80%"></p>
- <p style="margin-top: -15px;"><span class="login100-form-title p-t-20 p-b-45" style="color: #868686;font-size: 24px">WCS</span></p>
- <div class="inputContainer">
- <svg viewBox="0 0 16 16" fill="#2e2e2e" height="16" width="16" xmlns="http://www.w3.org/2000/svg" class="inputIcon">
- <path d="M13.106 7.222c0-2.967-2.249-5.032-5.482-5.032-3.35 0-5.646 2.318-5.646 5.702 0 3.493 2.235 5.708 5.762 5.708.862 0 1.689-.123 2.304-.335v-.862c-.43.199-1.354.328-2.29.328-2.926 0-4.813-1.88-4.813-4.798 0-2.844 1.921-4.881 4.594-4.881 2.735 0 4.608 1.688 4.608 4.156 0 1.682-.554 2.769-1.416 2.769-.492 0-.772-.28-.772-.76V5.206H8.923v.834h-.11c-.266-.595-.881-.964-1.6-.964-1.4 0-2.378 1.162-2.378 2.823 0 1.737.957 2.906 2.379 2.906.8 0 1.415-.39 1.709-1.087h.11c.081.67.703 1.148 1.503 1.148 1.572 0 2.57-1.415 2.57-3.643zm-7.177.704c0-1.197.54-1.907 1.456-1.907.93 0 1.524.738 1.524 1.907S8.308 9.84 7.371 9.84c-.895 0-1.442-.725-1.442-1.914z"></path>
- </svg>
- <input placeholder="璇疯緭鍏ョ敤鎴峰悕" id="username" name="username" class="inputField" type="text">
- </div>
-
- <div class="inputContainer">
- <svg viewBox="0 0 16 16" fill="#2e2e2e" height="16" width="16" xmlns="http://www.w3.org/2000/svg" class="inputIcon">
- <path d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z"></path>
- </svg>
- <input placeholder="璇疯緭鍏ュ瘑鐮�" id="password" name="pass" class="inputField" type="password">
- </div>
-
- <button id="login-button">鐧诲綍</button>
- </div>
-
- </div>
-</div>
-
-<script>
- class ShaderProgram {
-
- constructor( holder, options = {} ) {
-
- options = Object.assign( {
- antialias: false,
- depthTest: false,
- mousemove: false,
- autosize: true,
- side: 'front',
- vertex: `
- precision highp float;
-
- attribute vec4 a_position;
- attribute vec4 a_color;
-
- uniform float u_time;
- uniform vec2 u_resolution;
- uniform vec2 u_mousemove;
- uniform mat4 u_projection;
-
- varying vec4 v_color;
-
- void main() {
-
- gl_Position = u_projection * a_position;
- gl_PointSize = (10.0 / gl_Position.w) * 100.0;
-
- v_color = a_color;
-
- }`,
- fragment: `
- precision highp float;
-
- uniform sampler2D u_texture;
- uniform int u_hasTexture;
-
- varying vec4 v_color;
-
- void main() {
-
- if ( u_hasTexture == 1 ) {
-
- gl_FragColor = v_color * texture2D(u_texture, gl_PointCoord);
-
- } else {
-
- gl_FragColor = v_color;
-
- }
-
- }`,
- uniforms: {},
- buffers: {},
- camera: {},
- texture: null,
- onUpdate: ( () => {} ),
- onResize: ( () => {} ),
- }, options )
-
- const uniforms = Object.assign( {
- time: { type: 'float', value: 0 },
- hasTexture: { type: 'int', value: 0 },
- resolution: { type: 'vec2', value: [ 0, 0 ] },
- mousemove: { type: 'vec2', value: [ 0, 0 ] },
- projection: { type: 'mat4', value: [ 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1 ] },
- }, options.uniforms )
-
- const buffers = Object.assign( {
- position: { size: 3, data: [] },
- color: { size: 4, data: [] },
- }, options.buffers )
-
- const camera = Object.assign( {
- fov: 60,
- near: 1,
- far: 10000,
- aspect: 1,
- z: 100,
- perspective: true,
- }, options.camera )
-
- const canvas = document.createElement( 'canvas' )
- const gl = canvas.getContext( 'webgl', { antialias: options.antialias } )
-
- if ( ! gl ) return false
-
- this.count = 0
- this.gl = gl
- this.canvas = canvas
- this.camera = camera
- this.holder = holder
- this.onUpdate = options.onUpdate
- this.onResize = options.onResize
- this.data = {}
-
- holder.appendChild( canvas )
-
- this.createProgram( options.vertex, options.fragment )
-
- this.createBuffers( buffers )
- this.createUniforms( uniforms )
-
- this.updateBuffers()
- this.updateUniforms()
-
- this.createTexture( options.texture )
-
- gl.enable( gl.BLEND )
- gl.enable( gl.CULL_FACE )
- gl.blendFunc( gl.SRC_ALPHA, gl.ONE )
- gl[ options.depthTest ? 'enable' : 'disable' ]( gl.DEPTH_TEST )
-
- if ( options.autosize )
- window.addEventListener( 'resize', e => this.resize( e ), false )
- if ( options.mousemove )
- window.addEventListener( 'mousemove', e => this.mousemove( e ), false )
-
- this.resize()
-
- this.update = this.update.bind( this )
- this.time = { start: performance.now(), old: performance.now() }
- this.update()
-
- }
-
- mousemove( e ) {
-
- let x = e.pageX / this.width * 2 - 1
- let y = e.pageY / this.height * 2 - 1
-
- this.uniforms.mousemove = [ x, y ]
-
- }
-
- resize( e ) {
-
- const holder = this.holder
- const canvas = this.canvas
- const gl = this.gl
-
- const width = this.width = holder.offsetWidth
- const height = this.height = holder.offsetHeight
- const aspect = this.aspect = width / height
- const dpi = this.dpi = devicePixelRatio
-
- canvas.width = width * dpi
- canvas.height = height * dpi
- canvas.style.width = width + 'px'
- canvas.style.height = height + 'px'
-
- gl.viewport( 0, 0, width * dpi, height * dpi )
- gl.clearColor( 0, 0, 0, 0 )
-
- this.uniforms.resolution = [ width, height ]
- this.uniforms.projection = this.setProjection( aspect )
-
- this.onResize( width, height, dpi )
-
- }
-
- setProjection( aspect ) {
-
- const camera = this.camera
-
- if ( camera.perspective ) {
-
- camera.aspect = aspect
-
- const fovRad = camera.fov * ( Math.PI / 180 )
- const f = Math.tan( Math.PI * 0.5 - 0.5 * fovRad )
- const rangeInv = 1.0 / ( camera.near - camera.far )
-
- const matrix = [
- f / camera.aspect, 0, 0, 0,
- 0, f, 0, 0,
- 0, 0, (camera.near + camera.far) * rangeInv, -1,
- 0, 0, camera.near * camera.far * rangeInv * 2, 0
- ]
-
- matrix[ 14 ] += camera.z
- matrix[ 15 ] += camera.z
-
- return matrix
-
- } else {
-
- return [
- 2 / this.width, 0, 0, 0,
- 0, -2 / this.height, 0, 0,
- 0, 0, 1, 0,
- -1, 1, 0, 1,
- ]
-
- }
-
- }
-
- createShader( type, source ) {
-
- const gl = this.gl
- const shader = gl.createShader( type )
-
- gl.shaderSource( shader, source )
- gl.compileShader( shader )
-
- if ( gl.getShaderParameter (shader, gl.COMPILE_STATUS ) ) {
-
- return shader
-
- } else {
-
- console.log( gl.getShaderInfoLog( shader ) )
- gl.deleteShader( shader )
-
- }
-
- }
-
- createProgram( vertex, fragment ) {
-
- const gl = this.gl
-
- const vertexShader = this.createShader( gl.VERTEX_SHADER, vertex )
- const fragmentShader = this.createShader( gl.FRAGMENT_SHADER, fragment )
-
- const program = gl.createProgram()
-
- gl.attachShader( program, vertexShader )
- gl.attachShader( program, fragmentShader )
- gl.linkProgram( program )
-
- if ( gl.getProgramParameter( program, gl.LINK_STATUS ) ) {
-
- gl.useProgram( program )
- this.program = program
-
- } else {
-
- console.log( gl.getProgramInfoLog( program ) )
- gl.deleteProgram( program )
-
- }
-
- }
-
- createUniforms( data ) {
-
- const gl = this.gl
- const uniforms = this.data.uniforms = data
- const values = this.uniforms = {}
-
- Object.keys( uniforms ).forEach( name => {
-
- const uniform = uniforms[ name ]
-
- uniform.location = gl.getUniformLocation( this.program, 'u_' + name )
-
- Object.defineProperty( values, name, {
- set: value => {
-
- uniforms[ name ].value = value
- this.setUniform( name, value )
-
- },
- get: () => uniforms[ name ].value
- } )
-
- } )
-
- }
-
- setUniform( name, value ) {
-
- const gl = this.gl
- const uniform = this.data.uniforms[ name ]
-
- uniform.value = value
-
- switch ( uniform.type ) {
- case 'int': {
- gl.uniform1i( uniform.location, value )
- break
- }
- case 'float': {
- gl.uniform1f( uniform.location, value )
- break
- }
- case 'vec2': {
- gl.uniform2f( uniform.location, ...value )
- break
- }
- case 'vec3': {
- gl.uniform3f( uniform.location, ...value )
- break
- }
- case 'vec4': {
- gl.uniform4f( uniform.location, ...value )
- break
- }
- case 'mat2': {
- gl.uniformMatrix2fv( uniform.location, false, value )
- break
- }
- case 'mat3': {
- gl.uniformMatrix3fv( uniform.location, false, value )
- break
- }
- case 'mat4': {
- gl.uniformMatrix4fv( uniform.location, false, value )
- break
- }
- }
-
- // ivec2 : uniform2i,
- // ivec3 : uniform3i,
- // ivec4 : uniform4i,
- // sampler2D : uniform1i,
- // samplerCube : uniform1i,
- // bool : uniform1i,
- // bvec2 : uniform2i,
- // bvec3 : uniform3i,
- // bvec4 : uniform4i,
-
- }
-
- updateUniforms() {
-
- const gl = this.gl
- const uniforms = this.data.uniforms
-
- Object.keys( uniforms ).forEach( name => {
-
- const uniform = uniforms[ name ]
-
- this.uniforms[ name ] = uniform.value
-
- } )
-
- }
-
- createBuffers( data ) {
-
- const gl = this.gl
- const buffers = this.data.buffers = data
- const values = this.buffers = {}
-
- Object.keys( buffers ).forEach( name => {
-
- const buffer = buffers[ name ]
-
- buffer.buffer = this.createBuffer( 'a_' + name, buffer.size )
-
- Object.defineProperty( values, name, {
- set: data => {
-
- buffers[ name ].data = data
- this.setBuffer( name, data )
-
- if ( name == 'position' )
- this.count = buffers.position.data.length / 3
-
- },
- get: () => buffers[ name ].data
- } )
-
- } )
-
- }
-
- createBuffer( name, size ) {
-
- const gl = this.gl
- const program = this.program
-
- const index = gl.getAttribLocation( program, name )
- const buffer = gl.createBuffer()
-
- gl.bindBuffer( gl.ARRAY_BUFFER, buffer )
- gl.enableVertexAttribArray( index )
- gl.vertexAttribPointer( index, size, gl.FLOAT, false, 0, 0 )
-
- return buffer
-
- }
-
- setBuffer( name, data ) {
-
- const gl = this.gl
- const buffers = this.data.buffers
-
- if ( name == null && ! gl.bindBuffer( gl.ARRAY_BUFFER, null ) ) return
-
- gl.bindBuffer( gl.ARRAY_BUFFER, buffers[ name ].buffer )
- gl.bufferData( gl.ARRAY_BUFFER, new Float32Array( data ), gl.STATIC_DRAW )
-
- }
-
- updateBuffers() {
-
- const gl = this.gl
- const buffers = this.buffers
-
- Object.keys( buffers ).forEach( name =>
- buffers[ name ] = buffer.data
- )
-
- this.setBuffer( null )
-
- }
-
- createTexture( src ) {
-
- const gl = this.gl
- const texture = gl.createTexture()
-
- gl.bindTexture( gl.TEXTURE_2D, texture )
- gl.texImage2D( gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array( [ 0, 0, 0, 0 ] ) )
-
- this.texture = texture
-
- if ( src ) {
-
- this.uniforms.hasTexture = 1
- this.loadTexture( src )
-
- }
-
- }
-
- loadTexture( src ) {
-
- const gl = this.gl
- const texture = this.texture
-
- const textureImage = new Image()
-
- textureImage.onload = () => {
-
- gl.bindTexture( gl.TEXTURE_2D, texture )
-
- gl.texImage2D( gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, textureImage )
-
- gl.texParameteri( gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR )
- gl.texParameteri( gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR )
-
- gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE)
- gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE)
-
- // gl.generateMipmap( gl.TEXTURE_2D )
-
- }
-
- textureImage.src = src
-
- }
-
- update() {
-
- const gl = this.gl
-
- const now = performance.now()
- const elapsed = ( now - this.time.start ) / 5000
- const delta = now - this.time.old
- this.time.old = now
-
- this.uniforms.time = elapsed
-
- if ( this.count > 0 ) {
- gl.clear( gl.COLORBUFFERBIT )
- gl.drawArrays( gl.POINTS, 0, this.count )
- }
-
- this.onUpdate( delta )
-
- requestAnimationFrame( this.update )
-
- }
-
- }
-
- const pointSize = 2.5
-
- const waves = new ShaderProgram( document.querySelector( '.waves' ), {
- texture: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAb1BMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////8v0wLRAAAAJHRSTlMAC/goGvDhmwcExrVjWzrm29TRqqSKenRXVklANSIUE8mRkGpv+HOfAAABCElEQVQ4y4VT13LDMAwLrUHteO+R9f/fWMfO6dLaPeKVEECRxOULWsEGpS9nULDwia2Y+ALqUNbAWeg775zv+sA4/FFRMxt8U2FZFCVWjR/YrH4/H9sarclSKdPMWKzb8VsEeHB3m0shkhVCyNzeXeAQ9Xl4opEieX2QCGnwGbj6GMyjw9t1K0fK9YZunPXeAGsfJtYjwzxaBnozGGorYz0ypK2HzQSYx1y8DgSRo2ewOiyh2QWOEk1Y9OrQV0a8TiBM1a8eMHWYnRMy7CZ4t1CmyRkhSUvP3gRXyHOCLBxNoC3IJv//ZrJ/kxxUHPUB+6jJZZHrpg6GOjnqaOmzp4NDR48OLxn/H27SRQ08S0ZJAAAAAElFTkSuQmCC',
- uniforms: {
- size: { type: 'float', value: pointSize },
- field: { type: 'vec3', value: [ 0, 0, 0 ] },
- speed: { type: 'float', value: 5 },
- },
- vertex: `
- #define M_PI 3.1415926535897932384626433832795
-
- precision highp float;
-
- attribute vec4 a_position;
- attribute vec4 a_color;
-
- uniform float u_time;
- uniform float u_size;
- uniform float u_speed;
- uniform vec3 u_field;
- uniform mat4 u_projection;
-
- varying vec4 v_color;
-
- void main() {
-
- vec3 pos = a_position.xyz;
-
- pos.y += (
- cos(pos.x / u_field.x * M_PI * 8.0 + u_time * u_speed) +
- sin(pos.z / u_field.z * M_PI * 8.0 + u_time * u_speed)
- ) * u_field.y;
-
- gl_Position = u_projection * vec4( pos.xyz, a_position.w );
- gl_PointSize = ( u_size / gl_Position.w ) * 100.0;
-
- v_color = a_color;
-
- }`,
- fragment: `
- precision highp float;
-
- uniform sampler2D u_texture;
-
- varying vec4 v_color;
-
- void main() {
-
- gl_FragColor = v_color * texture2D(u_texture, gl_PointCoord);
-
- }`,
- onResize( w, h, dpi ) {
-
- const position = [], color = []
-
- const width = 400 * ( w / h )
- const depth = 400
- const height = 3
- const distance = 5
-
- for ( let x = 0; x < width; x += distance ) {
- for ( let z = 0; z < depth; z+= distance ) {
-
- position.push( - width / 2 + x, -30, -depth / 2 + z )
- color.push( 0, 1 - ( x / width ) * 1, 0.5 + x / width * 0.5, z / depth )
-
- }
- }
-
- this.uniforms.field = [ width, height, depth ]
-
- this.buffers.position = position
- this.buffers.color = color
-
- this.uniforms.size = ( h / 400) * pointSize * dpi
-
- },
- } )
-</script>
-
-<script type="text/javascript" src="../static/wms/js/jquery/jquery-3.3.1.min.js"></script>
-<script type="text/javascript" src="../static/wms/js/tools/md5.js"></script>
-<script type="text/javascript" src="../static/wms/layer/layer.js"></script>
-<script type="text/javascript" src="../static/wms/js/common.js"></script>
-<script>
- // remember pwd
- $(function () {
- var oldUserName = localStorage.getItem('oldUserName');
- var oldPass = localStorage.getItem('oldPass');
- if(oldUserName){
- $('#username').val(oldUserName);
- }
- if(oldPass){
- $('#password').val(oldPass);
- }
- })
-
- window.onload = function(){document.getElementById("username").focus();}
-
- $(document).on('click','#login-button', function () {
- let username = $("#username").val();
- if (username === "") {
- layer.tips('璇疯緭鍏ョ櫥褰曡处鍙�', '#username', {tips: [4, '#ff0000']});
- return;
- }
- let password = $("#password").val();
- if (password === "") {
- layer.tips('璇疯緭鍏ュ瘑鐮�', '#password', {tips: [4, '#ff0000']});
- return;
- }
- $.ajax({
- url: baseUrl+"/login.action",
- data: {
- mobile: username,
- password: hex_md5(password)
- },
- method: 'POST',
- success: function (res) {
- if (res.code === 200){
- localStorage.setItem("token", res.data.token);
- localStorage.setItem("username", res.data.username);
- window.location.href = "index.html";
- } else if (res.code === 10001) {
- layer.tips(res.msg, '#username', {tips: [4, '#ff0000']});
- } else if (res.code === 10002) {
- layer.tips(res.msg, '#username', {tips: [4, '#ff0000']});
- } else if (res.code === 10003) {
- layer.tips(res.msg, '#password', {tips: [4, '#ff0000']});
- } else {
- layer.tips(res.msg, '.login-btn', {tips: [3, '#ff0000']});
- }
- }
- });
- });
-
- $('body').keydown(function () {
- if (event.keyCode === 13) {
- $(".login-btn").click();
- }
- });
-</script>
-
-</body>
-</html>
\ No newline at end of file
+ var oldUserName = localStorage.getItem('oldUserName');
+ var oldPass = localStorage.getItem('oldPass');
+ if(oldUserName){
+ $('#username').val(oldUserName);
+ }
+ if(oldPass){
+ $('#password').val(oldPass);
+ }
+ })
+
+ window.onload = function(){document.getElementById("username").focus();}
+
+ $(document).on('click','#login-button', function () {
+ let username = $("#username").val();
+ if (username === "") {
+ layer.tips('璇疯緭鍏ョ櫥褰曡处鍙�', '#username', {tips: [4, '#ff0000']});
+ return;
+ }
+ let password = $("#password").val();
+ if (password === "") {
+ layer.tips('璇疯緭鍏ュ瘑鐮�', '#password', {tips: [4, '#ff0000']});
+ return;
+ }
+ $.ajax({
+ url: baseUrl+"/login.action",
+ data: {
+ mobile: username,
+ password: hex_md5(password)
+ },
+ method: 'POST',
+ success: function (res) {
+ if (res.code === 200){
+ localStorage.setItem("token", res.data.token);
+ localStorage.setItem("username", res.data.username);
+ window.location.href = "index.html";
+ } else if (res.code === 10001) {
+ layer.tips(res.msg, '#username', {tips: [4, '#ff0000']});
+ } else if (res.code === 10002) {
+ layer.tips(res.msg, '#username', {tips: [4, '#ff0000']});
+ } else if (res.code === 10003) {
+ layer.tips(res.msg, '#password', {tips: [4, '#ff0000']});
+ } else {
+ layer.tips(res.msg, '.login-btn', {tips: [3, '#ff0000']});
+ }
+ }
+ });
+ });
+
+ $(document).keydown(function () {
+ if (event.keyCode === 13) {
+ $("#login-button").click();
+ }
+ });
+
+ $("#copyright-img1").on("mouseover", () => {
+ $("#copyright-img-large1").show()
+ })
+
+ $("#copyright-img1").on("mouseout", () => {
+ $("#copyright-img-large1").hide()
+ })
+ </script>
+ </body>
+</html>
diff --git a/src/main/webapp/views/login2.html b/src/main/webapp/views/login2.html
new file mode 100644
index 0000000..19e17dc
--- /dev/null
+++ b/src/main/webapp/views/login2.html
@@ -0,0 +1,799 @@
+<!doctype html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <title>涓壃 鈹� login of zoneyung wcs</title>
+
+ <style>
+ html,body {
+ height:100%;
+ }
+ body {
+ margin:0;
+ background:#000;
+ }
+ canvas {
+ display:block;
+ }
+ .waves {
+ position:absolute;
+ left:0;
+ top:0;
+ right:0;
+ bottom:0;
+ }
+
+ .form_main {
+ width: 300px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ background-color: rgba(255, 255, 255, 0.6);
+ padding: 50px 30px 50px 30px;
+ border-radius: 30px;
+ box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.062);
+ }
+
+ .heading {
+ font-size: 2.5em;
+ color: #2e2e2e;
+ font-weight: 700;
+ margin: 15px 0 0px 0;
+ }
+
+ .inputContainer {
+ width: 100%;
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .inputIcon {
+ position: absolute;
+ left: 10px;
+ }
+
+ .inputField {
+ width: 100%;
+ height: 40px;
+ background-color: transparent;
+ border: none;
+ border-bottom: 2px solid rgb(173, 173, 173);
+ border-radius: 30px;
+ margin: 10px 0;
+ color: black;
+ font-size: .8em;
+ font-weight: 500;
+ box-sizing: border-box;
+ padding-left: 30px;
+ }
+
+ .inputField:focus {
+ outline: none;
+ border-bottom: 2px solid rgb(199, 114, 255);
+ }
+
+ .inputField::placeholder {
+ color: rgb(80, 80, 80);
+ font-size: 1em;
+ font-weight: 500;
+ }
+
+ #login-button {
+ position: relative;
+ width: 100%;
+ border: 2px solid #8000ff;
+ background-color: #8000ff;
+ height: 40px;
+ color: white;
+ font-size: .8em;
+ font-weight: 500;
+ letter-spacing: 1px;
+ border-radius: 30px;
+ margin: 10px;
+ cursor: pointer;
+ overflow: hidden;
+ }
+
+ #login-button::after {
+ content: "";
+ position: absolute;
+ background-color: rgba(255, 255, 255, 0.253);
+ height: 100%;
+ width: 150px;
+ top: 0;
+ left: -200px;
+ border-bottom-right-radius: 100px;
+ border-top-left-radius: 100px;
+ filter: blur(10px);
+ transition-duration: .5s;
+ }
+
+ #login-button:hover::after {
+ transform: translateX(600px);
+ transition-duration: .5s;
+ }
+
+ .signupContainer {
+ margin: 0;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ gap: 20px;
+ }
+
+ .signupContainer p {
+ font-size: .9em;
+ font-weight: 500;
+ color: black;
+ }
+
+ .signupContainer a {
+ font-size: .7em;
+ font-weight: 500;
+ background-color: #2e2e2e;
+ color: white;
+ text-decoration: none;
+ padding: 8px 15px;
+ border-radius: 20px;
+ }
+
+ </style>
+</head>
+<body>
+
+<div class="waves">
+ <div style="position: absolute;left: calc(50% - 200px);top: 25%;">
+ <div class="form_main">
+ <p style="text-align: center;"><img src="../static/wcs/images/logo.png" alt="" style="width: 80%"></p>
+ <p style="margin-top: -15px;"><span class="login100-form-title p-t-20 p-b-45" style="color: #868686;font-size: 24px">WCS</span></p>
+ <div class="inputContainer">
+ <svg viewBox="0 0 16 16" fill="#2e2e2e" height="16" width="16" xmlns="http://www.w3.org/2000/svg" class="inputIcon">
+ <path d="M13.106 7.222c0-2.967-2.249-5.032-5.482-5.032-3.35 0-5.646 2.318-5.646 5.702 0 3.493 2.235 5.708 5.762 5.708.862 0 1.689-.123 2.304-.335v-.862c-.43.199-1.354.328-2.29.328-2.926 0-4.813-1.88-4.813-4.798 0-2.844 1.921-4.881 4.594-4.881 2.735 0 4.608 1.688 4.608 4.156 0 1.682-.554 2.769-1.416 2.769-.492 0-.772-.28-.772-.76V5.206H8.923v.834h-.11c-.266-.595-.881-.964-1.6-.964-1.4 0-2.378 1.162-2.378 2.823 0 1.737.957 2.906 2.379 2.906.8 0 1.415-.39 1.709-1.087h.11c.081.67.703 1.148 1.503 1.148 1.572 0 2.57-1.415 2.57-3.643zm-7.177.704c0-1.197.54-1.907 1.456-1.907.93 0 1.524.738 1.524 1.907S8.308 9.84 7.371 9.84c-.895 0-1.442-.725-1.442-1.914z"></path>
+ </svg>
+ <input placeholder="璇疯緭鍏ョ敤鎴峰悕" id="username" name="username" class="inputField" type="text">
+ </div>
+
+ <div class="inputContainer">
+ <svg viewBox="0 0 16 16" fill="#2e2e2e" height="16" width="16" xmlns="http://www.w3.org/2000/svg" class="inputIcon">
+ <path d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z"></path>
+ </svg>
+ <input placeholder="璇疯緭鍏ュ瘑鐮�" id="password" name="pass" class="inputField" type="password">
+ </div>
+
+ <button id="login-button">鐧诲綍</button>
+ </div>
+
+ </div>
+</div>
+
+<script>
+ class ShaderProgram {
+
+ constructor( holder, options = {} ) {
+
+ options = Object.assign( {
+ antialias: false,
+ depthTest: false,
+ mousemove: false,
+ autosize: true,
+ side: 'front',
+ vertex: `
+ precision highp float;
+
+ attribute vec4 a_position;
+ attribute vec4 a_color;
+
+ uniform float u_time;
+ uniform vec2 u_resolution;
+ uniform vec2 u_mousemove;
+ uniform mat4 u_projection;
+
+ varying vec4 v_color;
+
+ void main() {
+
+ gl_Position = u_projection * a_position;
+ gl_PointSize = (10.0 / gl_Position.w) * 100.0;
+
+ v_color = a_color;
+
+ }`,
+ fragment: `
+ precision highp float;
+
+ uniform sampler2D u_texture;
+ uniform int u_hasTexture;
+
+ varying vec4 v_color;
+
+ void main() {
+
+ if ( u_hasTexture == 1 ) {
+
+ gl_FragColor = v_color * texture2D(u_texture, gl_PointCoord);
+
+ } else {
+
+ gl_FragColor = v_color;
+
+ }
+
+ }`,
+ uniforms: {},
+ buffers: {},
+ camera: {},
+ texture: null,
+ onUpdate: ( () => {} ),
+ onResize: ( () => {} ),
+ }, options )
+
+ const uniforms = Object.assign( {
+ time: { type: 'float', value: 0 },
+ hasTexture: { type: 'int', value: 0 },
+ resolution: { type: 'vec2', value: [ 0, 0 ] },
+ mousemove: { type: 'vec2', value: [ 0, 0 ] },
+ projection: { type: 'mat4', value: [ 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1 ] },
+ }, options.uniforms )
+
+ const buffers = Object.assign( {
+ position: { size: 3, data: [] },
+ color: { size: 4, data: [] },
+ }, options.buffers )
+
+ const camera = Object.assign( {
+ fov: 60,
+ near: 1,
+ far: 10000,
+ aspect: 1,
+ z: 100,
+ perspective: true,
+ }, options.camera )
+
+ const canvas = document.createElement( 'canvas' )
+ const gl = canvas.getContext( 'webgl', { antialias: options.antialias } )
+
+ if ( ! gl ) return false
+
+ this.count = 0
+ this.gl = gl
+ this.canvas = canvas
+ this.camera = camera
+ this.holder = holder
+ this.onUpdate = options.onUpdate
+ this.onResize = options.onResize
+ this.data = {}
+
+ holder.appendChild( canvas )
+
+ this.createProgram( options.vertex, options.fragment )
+
+ this.createBuffers( buffers )
+ this.createUniforms( uniforms )
+
+ this.updateBuffers()
+ this.updateUniforms()
+
+ this.createTexture( options.texture )
+
+ gl.enable( gl.BLEND )
+ gl.enable( gl.CULL_FACE )
+ gl.blendFunc( gl.SRC_ALPHA, gl.ONE )
+ gl[ options.depthTest ? 'enable' : 'disable' ]( gl.DEPTH_TEST )
+
+ if ( options.autosize )
+ window.addEventListener( 'resize', e => this.resize( e ), false )
+ if ( options.mousemove )
+ window.addEventListener( 'mousemove', e => this.mousemove( e ), false )
+
+ this.resize()
+
+ this.update = this.update.bind( this )
+ this.time = { start: performance.now(), old: performance.now() }
+ this.update()
+
+ }
+
+ mousemove( e ) {
+
+ let x = e.pageX / this.width * 2 - 1
+ let y = e.pageY / this.height * 2 - 1
+
+ this.uniforms.mousemove = [ x, y ]
+
+ }
+
+ resize( e ) {
+
+ const holder = this.holder
+ const canvas = this.canvas
+ const gl = this.gl
+
+ const width = this.width = holder.offsetWidth
+ const height = this.height = holder.offsetHeight
+ const aspect = this.aspect = width / height
+ const dpi = this.dpi = devicePixelRatio
+
+ canvas.width = width * dpi
+ canvas.height = height * dpi
+ canvas.style.width = width + 'px'
+ canvas.style.height = height + 'px'
+
+ gl.viewport( 0, 0, width * dpi, height * dpi )
+ gl.clearColor( 0, 0, 0, 0 )
+
+ this.uniforms.resolution = [ width, height ]
+ this.uniforms.projection = this.setProjection( aspect )
+
+ this.onResize( width, height, dpi )
+
+ }
+
+ setProjection( aspect ) {
+
+ const camera = this.camera
+
+ if ( camera.perspective ) {
+
+ camera.aspect = aspect
+
+ const fovRad = camera.fov * ( Math.PI / 180 )
+ const f = Math.tan( Math.PI * 0.5 - 0.5 * fovRad )
+ const rangeInv = 1.0 / ( camera.near - camera.far )
+
+ const matrix = [
+ f / camera.aspect, 0, 0, 0,
+ 0, f, 0, 0,
+ 0, 0, (camera.near + camera.far) * rangeInv, -1,
+ 0, 0, camera.near * camera.far * rangeInv * 2, 0
+ ]
+
+ matrix[ 14 ] += camera.z
+ matrix[ 15 ] += camera.z
+
+ return matrix
+
+ } else {
+
+ return [
+ 2 / this.width, 0, 0, 0,
+ 0, -2 / this.height, 0, 0,
+ 0, 0, 1, 0,
+ -1, 1, 0, 1,
+ ]
+
+ }
+
+ }
+
+ createShader( type, source ) {
+
+ const gl = this.gl
+ const shader = gl.createShader( type )
+
+ gl.shaderSource( shader, source )
+ gl.compileShader( shader )
+
+ if ( gl.getShaderParameter (shader, gl.COMPILE_STATUS ) ) {
+
+ return shader
+
+ } else {
+
+ console.log( gl.getShaderInfoLog( shader ) )
+ gl.deleteShader( shader )
+
+ }
+
+ }
+
+ createProgram( vertex, fragment ) {
+
+ const gl = this.gl
+
+ const vertexShader = this.createShader( gl.VERTEX_SHADER, vertex )
+ const fragmentShader = this.createShader( gl.FRAGMENT_SHADER, fragment )
+
+ const program = gl.createProgram()
+
+ gl.attachShader( program, vertexShader )
+ gl.attachShader( program, fragmentShader )
+ gl.linkProgram( program )
+
+ if ( gl.getProgramParameter( program, gl.LINK_STATUS ) ) {
+
+ gl.useProgram( program )
+ this.program = program
+
+ } else {
+
+ console.log( gl.getProgramInfoLog( program ) )
+ gl.deleteProgram( program )
+
+ }
+
+ }
+
+ createUniforms( data ) {
+
+ const gl = this.gl
+ const uniforms = this.data.uniforms = data
+ const values = this.uniforms = {}
+
+ Object.keys( uniforms ).forEach( name => {
+
+ const uniform = uniforms[ name ]
+
+ uniform.location = gl.getUniformLocation( this.program, 'u_' + name )
+
+ Object.defineProperty( values, name, {
+ set: value => {
+
+ uniforms[ name ].value = value
+ this.setUniform( name, value )
+
+ },
+ get: () => uniforms[ name ].value
+ } )
+
+ } )
+
+ }
+
+ setUniform( name, value ) {
+
+ const gl = this.gl
+ const uniform = this.data.uniforms[ name ]
+
+ uniform.value = value
+
+ switch ( uniform.type ) {
+ case 'int': {
+ gl.uniform1i( uniform.location, value )
+ break
+ }
+ case 'float': {
+ gl.uniform1f( uniform.location, value )
+ break
+ }
+ case 'vec2': {
+ gl.uniform2f( uniform.location, ...value )
+ break
+ }
+ case 'vec3': {
+ gl.uniform3f( uniform.location, ...value )
+ break
+ }
+ case 'vec4': {
+ gl.uniform4f( uniform.location, ...value )
+ break
+ }
+ case 'mat2': {
+ gl.uniformMatrix2fv( uniform.location, false, value )
+ break
+ }
+ case 'mat3': {
+ gl.uniformMatrix3fv( uniform.location, false, value )
+ break
+ }
+ case 'mat4': {
+ gl.uniformMatrix4fv( uniform.location, false, value )
+ break
+ }
+ }
+
+ // ivec2 : uniform2i,
+ // ivec3 : uniform3i,
+ // ivec4 : uniform4i,
+ // sampler2D : uniform1i,
+ // samplerCube : uniform1i,
+ // bool : uniform1i,
+ // bvec2 : uniform2i,
+ // bvec3 : uniform3i,
+ // bvec4 : uniform4i,
+
+ }
+
+ updateUniforms() {
+
+ const gl = this.gl
+ const uniforms = this.data.uniforms
+
+ Object.keys( uniforms ).forEach( name => {
+
+ const uniform = uniforms[ name ]
+
+ this.uniforms[ name ] = uniform.value
+
+ } )
+
+ }
+
+ createBuffers( data ) {
+
+ const gl = this.gl
+ const buffers = this.data.buffers = data
+ const values = this.buffers = {}
+
+ Object.keys( buffers ).forEach( name => {
+
+ const buffer = buffers[ name ]
+
+ buffer.buffer = this.createBuffer( 'a_' + name, buffer.size )
+
+ Object.defineProperty( values, name, {
+ set: data => {
+
+ buffers[ name ].data = data
+ this.setBuffer( name, data )
+
+ if ( name == 'position' )
+ this.count = buffers.position.data.length / 3
+
+ },
+ get: () => buffers[ name ].data
+ } )
+
+ } )
+
+ }
+
+ createBuffer( name, size ) {
+
+ const gl = this.gl
+ const program = this.program
+
+ const index = gl.getAttribLocation( program, name )
+ const buffer = gl.createBuffer()
+
+ gl.bindBuffer( gl.ARRAY_BUFFER, buffer )
+ gl.enableVertexAttribArray( index )
+ gl.vertexAttribPointer( index, size, gl.FLOAT, false, 0, 0 )
+
+ return buffer
+
+ }
+
+ setBuffer( name, data ) {
+
+ const gl = this.gl
+ const buffers = this.data.buffers
+
+ if ( name == null && ! gl.bindBuffer( gl.ARRAY_BUFFER, null ) ) return
+
+ gl.bindBuffer( gl.ARRAY_BUFFER, buffers[ name ].buffer )
+ gl.bufferData( gl.ARRAY_BUFFER, new Float32Array( data ), gl.STATIC_DRAW )
+
+ }
+
+ updateBuffers() {
+
+ const gl = this.gl
+ const buffers = this.buffers
+
+ Object.keys( buffers ).forEach( name =>
+ buffers[ name ] = buffer.data
+ )
+
+ this.setBuffer( null )
+
+ }
+
+ createTexture( src ) {
+
+ const gl = this.gl
+ const texture = gl.createTexture()
+
+ gl.bindTexture( gl.TEXTURE_2D, texture )
+ gl.texImage2D( gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array( [ 0, 0, 0, 0 ] ) )
+
+ this.texture = texture
+
+ if ( src ) {
+
+ this.uniforms.hasTexture = 1
+ this.loadTexture( src )
+
+ }
+
+ }
+
+ loadTexture( src ) {
+
+ const gl = this.gl
+ const texture = this.texture
+
+ const textureImage = new Image()
+
+ textureImage.onload = () => {
+
+ gl.bindTexture( gl.TEXTURE_2D, texture )
+
+ gl.texImage2D( gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, textureImage )
+
+ gl.texParameteri( gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR )
+ gl.texParameteri( gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR )
+
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE)
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE)
+
+ // gl.generateMipmap( gl.TEXTURE_2D )
+
+ }
+
+ textureImage.src = src
+
+ }
+
+ update() {
+
+ const gl = this.gl
+
+ const now = performance.now()
+ const elapsed = ( now - this.time.start ) / 5000
+ const delta = now - this.time.old
+ this.time.old = now
+
+ this.uniforms.time = elapsed
+
+ if ( this.count > 0 ) {
+ gl.clear( gl.COLORBUFFERBIT )
+ gl.drawArrays( gl.POINTS, 0, this.count )
+ }
+
+ this.onUpdate( delta )
+
+ requestAnimationFrame( this.update )
+
+ }
+
+ }
+
+ const pointSize = 2.5
+
+ const waves = new ShaderProgram( document.querySelector( '.waves' ), {
+ texture: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAb1BMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////8v0wLRAAAAJHRSTlMAC/goGvDhmwcExrVjWzrm29TRqqSKenRXVklANSIUE8mRkGpv+HOfAAABCElEQVQ4y4VT13LDMAwLrUHteO+R9f/fWMfO6dLaPeKVEECRxOULWsEGpS9nULDwia2Y+ALqUNbAWeg775zv+sA4/FFRMxt8U2FZFCVWjR/YrH4/H9sarclSKdPMWKzb8VsEeHB3m0shkhVCyNzeXeAQ9Xl4opEieX2QCGnwGbj6GMyjw9t1K0fK9YZunPXeAGsfJtYjwzxaBnozGGorYz0ypK2HzQSYx1y8DgSRo2ewOiyh2QWOEk1Y9OrQV0a8TiBM1a8eMHWYnRMy7CZ4t1CmyRkhSUvP3gRXyHOCLBxNoC3IJv//ZrJ/kxxUHPUB+6jJZZHrpg6GOjnqaOmzp4NDR48OLxn/H27SRQ08S0ZJAAAAAElFTkSuQmCC',
+ uniforms: {
+ size: { type: 'float', value: pointSize },
+ field: { type: 'vec3', value: [ 0, 0, 0 ] },
+ speed: { type: 'float', value: 5 },
+ },
+ vertex: `
+ #define M_PI 3.1415926535897932384626433832795
+
+ precision highp float;
+
+ attribute vec4 a_position;
+ attribute vec4 a_color;
+
+ uniform float u_time;
+ uniform float u_size;
+ uniform float u_speed;
+ uniform vec3 u_field;
+ uniform mat4 u_projection;
+
+ varying vec4 v_color;
+
+ void main() {
+
+ vec3 pos = a_position.xyz;
+
+ pos.y += (
+ cos(pos.x / u_field.x * M_PI * 8.0 + u_time * u_speed) +
+ sin(pos.z / u_field.z * M_PI * 8.0 + u_time * u_speed)
+ ) * u_field.y;
+
+ gl_Position = u_projection * vec4( pos.xyz, a_position.w );
+ gl_PointSize = ( u_size / gl_Position.w ) * 100.0;
+
+ v_color = a_color;
+
+ }`,
+ fragment: `
+ precision highp float;
+
+ uniform sampler2D u_texture;
+
+ varying vec4 v_color;
+
+ void main() {
+
+ gl_FragColor = v_color * texture2D(u_texture, gl_PointCoord);
+
+ }`,
+ onResize( w, h, dpi ) {
+
+ const position = [], color = []
+
+ const width = 400 * ( w / h )
+ const depth = 400
+ const height = 3
+ const distance = 5
+
+ for ( let x = 0; x < width; x += distance ) {
+ for ( let z = 0; z < depth; z+= distance ) {
+
+ position.push( - width / 2 + x, -30, -depth / 2 + z )
+ color.push( 0, 1 - ( x / width ) * 1, 0.5 + x / width * 0.5, z / depth )
+
+ }
+ }
+
+ this.uniforms.field = [ width, height, depth ]
+
+ this.buffers.position = position
+ this.buffers.color = color
+
+ this.uniforms.size = ( h / 400) * pointSize * dpi
+
+ },
+ } )
+</script>
+
+<script type="text/javascript" src="../static/wms/js/jquery/jquery-3.3.1.min.js"></script>
+<script type="text/javascript" src="../static/wms/js/tools/md5.js"></script>
+<script type="text/javascript" src="../static/wms/layer/layer.js"></script>
+<script type="text/javascript" src="../static/wms/js/common.js"></script>
+<script>
+ // remember pwd
+ $(function () {
+ var oldUserName = localStorage.getItem('oldUserName');
+ var oldPass = localStorage.getItem('oldPass');
+ if(oldUserName){
+ $('#username').val(oldUserName);
+ }
+ if(oldPass){
+ $('#password').val(oldPass);
+ }
+ })
+
+ window.onload = function(){document.getElementById("username").focus();}
+
+ $(document).on('click','#login-button', function () {
+ let username = $("#username").val();
+ if (username === "") {
+ layer.tips('璇疯緭鍏ョ櫥褰曡处鍙�', '#username', {tips: [4, '#ff0000']});
+ return;
+ }
+ let password = $("#password").val();
+ if (password === "") {
+ layer.tips('璇疯緭鍏ュ瘑鐮�', '#password', {tips: [4, '#ff0000']});
+ return;
+ }
+ $.ajax({
+ url: baseUrl+"/login.action",
+ data: {
+ mobile: username,
+ password: hex_md5(password)
+ },
+ method: 'POST',
+ success: function (res) {
+ if (res.code === 200){
+ localStorage.setItem("token", res.data.token);
+ localStorage.setItem("username", res.data.username);
+ window.location.href = "index.html";
+ } else if (res.code === 10001) {
+ layer.tips(res.msg, '#username', {tips: [4, '#ff0000']});
+ } else if (res.code === 10002) {
+ layer.tips(res.msg, '#username', {tips: [4, '#ff0000']});
+ } else if (res.code === 10003) {
+ layer.tips(res.msg, '#password', {tips: [4, '#ff0000']});
+ } else {
+ layer.tips(res.msg, '.login-btn', {tips: [3, '#ff0000']});
+ }
+ }
+ });
+ });
+
+ $('body').keydown(function () {
+ if (event.keyCode === 13) {
+ $(".login-btn").click();
+ }
+ });
+</script>
+
+</body>
+</html>
\ No newline at end of file
--
Gitblit v1.9.1