initial commit

217907a4 · orbitgw · 217907a4 · 217907a4 · 217907a4 · 217907a4
8 changed file
--- a/LICENSE.md
+++ b/LICENSE.md
+MIT License
+
+Copyright (c) 2022 Chris Cheng <15086960386@163.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.
\ No newline at end of file
--- a/README.md
+++ b/README.md
+# Game - ZhiYin
+
+![](https://img.shields.io/badge/license-MIT-orange)
+![GitHub code size in bytes](https://img.shields.io/github/languages/code-size/orbitgw/zhiyin)
+
+This is a game project for 2022‘s CSDN 1024 Open Source Challenge.
+
+## Preview
+
+![](./imgs/preview.png)
+
+## Play
+
+It's an web game, please open the `index.html` in your web-browser.
+
+## Copyrgiht
+
+Copyright (C) 2022 OrbitGW(Chris Cheng) <15086960386@163.com>
+
+## LICENSE
+
+This project is under MIT License.
--- a/imgs/ball.png
+++ b/imgs/ball.png
--- a/imgs/bg.jpg
+++ b/imgs/bg.jpg
--- a/imgs/kun-1.png
+++ b/imgs/kun-1.png
--- a/imgs/kun-2.png
+++ b/imgs/kun-2.png
--- a/imgs/preview.png
+++ b/imgs/preview.png
--- a/index.html
+++ b/index.html
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <meta name="--Author" content="orbigw">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <style>
+        html, body{ margin:0; width:100%; height:100%;}
+        #topbox{
+            background-color: rgb(59, 79, 194);
+            position: relative;
+            width: 800px;
+            height: 100px;
+            left:50%;
+            transform: translateX(-50%);
+            text-align: center;
+            line-height: 80px;
+            color:white;
+            font-weight: 100;
+            border-radius: 16px;
+            font-size: 32px;
+        }
+        #cvs{
+            box-sizing: border-box;
+            position: relative;
+            left:50%;
+            transform: translateX(-50%);
+            border: black solid 4px;
+            border-radius: 16px;
+            margin: 0px;
+            padding: 0px;
+        }
+    </style>
+    <title>zhiyin - orbitgw</title>
+</head>
+<body>
+    <div id="topbox">CSDN 1024程序员开源挑战赛作品 - ZhiYin(只因)<div style="font-size: 8px;line-height: 20px;">by orbitgw<div></div>
+    <canvas id="cvs" width="800" height="640">
+        Do not Support canvas
+    </canvas>
+    <script type="text/javascript">
+        var cvs = document.getElementById('cvs')
+        var ctx = cvs.getContext('2d')
+
+        var mouse = {x : 0,y:0};
+        var lastx;
+
+        var kun1 = new Image();
+        var kun2 = new Image();
+        var ball = new Image();
+        var bg = new Image();
+
+        kun1.src = 'imgs/kun-1.png';
+        kun2.src = 'imgs/kun-2.png';
+        ball.src = 'imgs/ball.png';
+        bg.src = "imgs/bg.jpg";
+
+        var gameover = false;
+        var init = true;
+
+        var kposx;
+        var bposx;
+        var bposy;
+        var ddx=0;
+        var kef=0;
+        var bup = false;
+        kposx = 360;
+        bposx = 380;
+        bposy = 20;
+        bg.onload = function(){
+            ctx.drawImage(bg,0,0,810,640);
+        }
+
+        var state = {
+            left:true,
+            right:false
+        };
+
+        document.addEventListener("keydown",keydown);
+        function keydown(event){      
+            if (event.keyCode == 65 & kposx >= 0){  
+                kposx -= 20;
+                
+                
+            }
+            if (event.keyCode == 68 & kposx <= 720){  
+                kposx += 20;
+                
+                
+            }
+            if(event.keyCode == 32&&(gameover||init)){
+                init = false;
+                kposx = 360;
+                bposx = 380;
+                bposy = 20;
+                gameover = false;
+                state.left = true;
+                state.right = false; 
+                ddx=0;
+                kef=0;
+            }
+        }
+        var frame = 0;
+        addEventListener("mousemove",function (e) {
+            var x,y;
+            var e = e||window.event;
+            if(e.pageX||e.pageY){
+                x = e.pageX;
+                y = e.pageY;
+            }
+            else {
+                x = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;                  
+                y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
+                
+            }
+            offsetLeft = (document.body.clientWidth - 800)/2;
+            offsetTop = 104;
+            //window.console.log(x+" "+y);
+            x -= offsetLeft;
+            y -= offsetTop;
+            kposx = x;
+            if(x<lastx){
+                state.left = true;
+                state.right =false;
+                kef=-10;
+            }
+            if(x<lastx){
+                state.right = true;
+                state.left = false;
+                kef=10;
+            }
+            if(frame%5==0)
+                lastx=kposx;
+            frame++;
+            window.console.log(lastx+" "+x);
+        },false);
+
+        function draw(){
+            if(!gameover&&!init){
+                ctx.drawImage(bg,0,0,810,640);
+                if(state.left){
+                    ctx.drawImage(kun1,kposx,500,80,80);
+                }
+                if(state.right){
+                    ctx.drawImage(kun2,kposx,500,80,80);
+                }
+                if(bposx<=0||bposx>=760)
+                    ddx=-ddx;
+                bposx+=ddx;
+                if(!bup){
+                    bposy += 5;
+                }else{
+                    bposy -= 5;
+                    if(bposy<0)
+                        bup=false;
+                }
+                if(kef>0)
+                    kef--;
+                if(kef<0)
+                    kef++;
+                if(bposy>=480 && bposy<500 && kposx-25 < bposx && bposx < kposx+75){
+                    bup = true;
+                    ddx = -ddx;
+                    ddx += kef;
+                }
+                if(bposy>=540)
+                {
+                    gameover = true;
+                }
+
+                ctx.drawImage(ball,bposx,bposy,40,40);
+
+                
+            }else{
+                ctx.fillStyle = "black";
+                ctx.font = '72px "Arial"'
+                if(init){
+                    ctx.fillText("ZhiYin", 290, 300);
+                }else{
+                    ctx.fillText("Game Over", 220, 300);
+                }
+
+                ctx.font = '32px "Arial"'
+                ctx.fillText("Press SPACE to start", 240, 350);
+            }
+            ctx.fillStyle = "white";
+            ctx.font = '16px "Arial"'
+            ctx.fillText("Copyright (C) 2022 OrbitGW(Chris Cheng) <15086960386@163.com>", 140, 620);
+        }
+        (function animloop() {
+            draw();
+            window.requestAnimationFrame(animloop);
+        })();
+      </script>
+</body>
+</html>
\ No newline at end of file