Facebook
From Ronalds Mazītis, 3 Years ago, written in JavaScript.
Embed
Download Paste or View Raw
Hits: 125
  1.  
  2.  
  3.  
  4. <!DOCTYPE html>
  5. <html lang="en">
  6.   <head>
  7.     <meta charset="UTF-8" />
  8.     <meta
  9.       name="viewport"
  10.       content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
  11.     />
  12.     <meta http-equiv="X-UA-Compatible" content="ie=edge" />
  13.     <title>3D ONLINE GAME 2</title>
  14.     <link rel="stylesheet" href="/css/examples.css?ver=1.0.0" />
  15.     <script src="/js/examples.js?ver=1.1.1"></script>
  16.     <script src="/lib/phaser.min.js?ver=3.52.0"></script>
  17.     <script src="/lib/enable3d/enable3d.phaserExtension.0.25.0.min.js"></script>
  18.           <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  19.  
  20.    
  21.  
  22.   </head>
  23.  
  24.   <body>
  25.    <!--- <div id="info-text">Use WASD, SPACE and your Mouse.<br />Try to play it on your mobile device :)</div> -->
  26.    
  27.  <center>
  28.    <h1>
  29.           <?php  
  30.    include_once 'db.php';
  31.  
  32. $sessionid = $_SESSION['user_id'];
  33.  
  34. echo $user_data['username'];
  35.  
  36. if(empty($sessionid)){
  37.             header('Location: index.php');
  38.  
  39. //echo $sessionid;
  40.  
  41. }
  42.  
  43.  
  44. //skripts kurš pie katras čaraktera kustību apstājas updeito tabulas sadaļu *location*
  45. //skripts kurš katru lietotāju kura datetime sakrīt ar intervālu pēdējās 15 min, zīmē ekrānā
  46.  
  47.  
  48.  
  49.  
  50.  
  51.    ?>
  52.  
  53.    </h1>  <a href="logout.php">Logout.</a>
  54.    </center>
  55.     <script>
  56.                
  57.                
  58.                
  59.  
  60.  
  61.  
  62.  
  63.  
  64.       const {
  65.         enable3d,
  66.         Scene3D,
  67.         Canvas,
  68.         ThirdDimension,
  69.         THREE,
  70.         JoyStick,
  71.         ExtendedObject3D,
  72.         ThirdPersonControls,
  73.         PointerLock,
  74.         PointerDrag
  75.       } = ENABLE3D
  76.  
  77.       /**
  78.        * Is touch device?
  79.        */
  80.       const isTouchDevice = 'ontouchstart' in window
  81.  
  82.       class MainScene extends Scene3D {
  83.         constructor() {
  84.           super({ key: 'MainScene' })
  85.         }
  86.  
  87.         init() {
  88.           this.accessThirdDimension({ maxSubSteps: 10, fixedTimeStep: 1 / 120 })
  89.           this.third.renderer.outputEncoding = THREE.LinearEncoding
  90.           this.canJump = true
  91.           this.move = false
  92.  
  93.           this.moveTop = 0
  94.           this.moveRight = 0
  95.         }
  96.  
  97.         async create() {
  98.           const { lights } = await this.third.warpSpeed('-ground', '-orbitControls')
  99.  
  100.           const { hemisphereLight, ambientLight, directionalLight } = lights
  101.           const intensity = 0.65
  102.           hemisphereLight.intensity = intensity
  103.           ambientLight.intensity = intensity
  104.           directionalLight.intensity = intensity
  105.  
  106.           //this.third.physics.add.box({ y: 10, x: 35 }, { lambert: { color: 'red' } })
  107.  
  108.           // this.third.physics.debug.enable()
  109.  
  110.           /**
  111.            * Medieval Fantasy Book by Pixel (https://sketchfab.com/stefan.lengyel1)
  112.            * https://sketchfab.com/3d-models/medieval-fantasy-book-06d5a80a04fc4c5ab552759e9a97d91a
  113.            * Attribution 4.0 International (CC BY 4.0)
  114.            
  115.            E4E717
  116.            */
  117.           this.third.load.gltf('/assets/glb/book6.glb').then(object => {
  118.             const scene = object.scenes[0]
  119.  
  120.             const book = new ExtendedObject3D()
  121.             book.name = 'scene'
  122.             book.add(scene)
  123.             this.third.add.existing(book)
  124.  
  125.             // add animations
  126.             // sadly only the flags animations works
  127.             object.animations.forEach((anim, i) => {
  128.               book.mixer = this.third.animationMixers.create(book)
  129.               // overwrite the action to be an array of actions
  130.               book.action = []
  131.               book.action[i] = book.mixer.clipAction(anim)
  132.               book.action[i].play()
  133.             })
  134.  
  135.             book.traverse(child => {
  136.               if (child.isMesh) {
  137.                 child.castShadow = child.receiveShadow = false
  138.                 child.material.metalness = 0
  139.                 child.material.roughness = 1
  140.  
  141.                 if (/mesh/i.test(child.name)) {
  142.                   this.third.physics.add.existing(child, {
  143.                     shape: 'concave',
  144.                     mass: 0,
  145.                     collisionFlags: 1,
  146.                     autoCenter: false
  147.                   })
  148.                   child.body.setAngularFactor(0, 0, 0)
  149.                   child.body.setLinearFactor(0, 0, 0)
  150.                 }
  151.               }
  152.             })
  153.           })
  154.  
  155.  
  156.  //$.post( "postlocation.php", function( data ) {
  157.  
  158. //});
  159.  
  160.  
  161.             //this.man.position.set(35, -3.5, 0)
  162.            
  163.            
  164.            
  165. //function getData(ajaxurl) {
  166.   //return   $.ajax({
  167.            //type: "GET",
  168.            //url: 'getlocation.php',
  169.            //data:{},
  170.            //success:function(html) {
  171.                                     //var obj = JSON.parse(html);
  172.  
  173.            //}
  174.  
  175.       //});
  176. //};
  177.  
  178. //async function test() {
  179.   //try {
  180.     //const res = await getData()
  181.     //console.log(res)
  182. //this.man.position.set(obj.x, obj.y, obj.z)
  183.  
  184.   //} catch(err) {
  185.     //console.log(err);
  186.   //}
  187. //}
  188.  
  189. //test();
  190.  
  191.  
  192. //$.ajax({
  193.      //type:"POST",
  194.      //async: false,
  195.      //url:"loaduserdata.php",
  196.      //dataType: 'json',
  197.      //success: function (html) {
  198.          //$('#message').html(html);
  199.          //fruits = html;
  200.          ////console.log(data);
  201.      //}
  202. //});
  203.  
  204.  
  205. //fruits.forEach(myFunction);
  206.  
  207.  
  208.  
  209. //function myFunction(){
  210.   /////katram iegūtajam elementam būs savs čārakters
  211.  
  212.  
  213.           /**
  214.            * box_man.glb by Jan Bláha
  215.            * https://github.com/swift502/Sketchbook
  216.            * CC-0 license 2018
  217.            */
  218.           this.third.load.gltf('/assets/glb/box_man.glb').then(object => {
  219.             const man = object.scene.children[0]
  220.                        
  221.        
  222.             this.man = new ExtendedObject3D()
  223.             this.man.name = 'man'
  224.             this.man.rotateY(Math.PI + 0.1) // a hack
  225.             this.man.add(man)
  226.             this.man.rotation.set(0, Math.PI * 1.5, 0)
  227.  
  228.   var obj;
  229.   $.ajax({
  230.            type: "GET",
  231.            async: false,
  232.            url: 'getlocation.php',
  233.            data:{},
  234.            success:function(html) {
  235.                                     obj = JSON.parse(html);
  236.                                 console.log("noliek", obj);
  237.            }
  238.  
  239.       });
  240.                         //console.log(obj.x);
  241.                         //console.log(obj.y);
  242.                         //console.log(obj.z);
  243.  
  244.  
  245.  
  246. //{"x":-0.9553362921119645,"y":0,"z":0.2955208435521314}
  247. ///alert(obj.x, obj.y, obj.z);
  248.  
  249. //this.man.position.set(obj.x, obj.y, obj.z)
  250. this.man.position.set(754.2014, 1000, -205.63472)
  251.            
  252.            
  253.            
  254.            
  255.                        
  256.             // add shadow
  257.             this.man.traverse(child => {
  258.               if (child.isMesh) {
  259.                 child.castShadow = child.receiveShadow = true
  260.                 // https://discourse.threejs.org/t/cant-export-material-from-blender-gltf/12258
  261.                 child.material.roughness = 1
  262.                 child.material.metalness = 0
  263.               }
  264.             })
  265.  
  266.             /**
  267.              * Animations
  268.              */
  269.             this.third.animationMixers.add(this.man.animation.mixer)
  270.             object.animations.forEach(animation => {
  271.               if (animation.name) {
  272.                 this.man.animation.add(animation.name, animation)
  273.               }
  274.             })
  275.             this.man.animation.play('idle')
  276.  
  277.             /**
  278.              * Add the player to the scene with a body
  279.              */
  280.             this.third.add.existing(this.man)
  281.             this.third.physics.add.existing(this.man, {
  282.               shape: 'sphere',
  283.               radius: 0.25,
  284.               width: 0.5,
  285.               offset: { y: -0.25 }
  286.             })
  287.             this.man.body.setFriction(0.8)
  288.             this.man.body.setAngularFactor(0, 0, 0)
  289.  
  290.             // https://docs.panda3d.org/1.10/python/programming/physics/bullet/ccd
  291.             this.man.body.setCcdMotionThreshold(1e-7)
  292.             this.man.body.setCcdSweptSphereRadius(0.25)
  293.  
  294.             /**
  295.              * Add 3rd Person Controls
  296.              */
  297.             this.controls = new ThirdPersonControls(this.third.camera, this.man, {
  298.               offset: new THREE.Vector3(0, 1, 0),
  299.               targetRadius: 3
  300.             })
  301.             // set initial view to 90 deg theta
  302.             this.controls.theta = 90
  303.  
  304.             /**
  305.              * Add Pointer Lock and Pointer Drag
  306.              */
  307.             if (!isTouchDevice) {
  308.               let pl = new PointerLock(this.game.canvas)
  309.               let pd = new PointerDrag(this.game.canvas)
  310.               pd.onMove(delta => {
  311.                 if (pl.isLocked()) {
  312.                   this.moveTop = -delta.y
  313.                   this.moveRight = delta.x
  314.                 }
  315.               })
  316.             }
  317.           })
  318.  
  319.           /**
  320.            * Add Keys
  321.            */
  322.           this.keys = {
  323.             a: this.input.keyboard.addKey('a'),
  324.             w: this.input.keyboard.addKey('w'),
  325.             d: this.input.keyboard.addKey('d'),
  326.             s: this.input.keyboard.addKey('s'),
  327.             space: this.input.keyboard.addKey(32)
  328.           }
  329.  
  330.           /**
  331.            * Add joystick
  332.            */
  333.           if (isTouchDevice) {
  334.             const joystick = new JoyStick()
  335.             const axis = joystick.add.axis({
  336.               styles: { left: 35, bottom: 35, size: 100 }
  337.             })
  338.             axis.onMove(event => {
  339.               /**
  340.                * Update Camera
  341.                */
  342.               const { top, right } = event
  343.               this.moveTop = top * 3
  344.               this.moveRight = right * 3
  345.             })
  346.             const buttonA = joystick.add.button({
  347.               letter: 'A',
  348.               styles: { right: 35, bottom: 110, size: 80 }
  349.             })
  350.             buttonA.onClick(() => this.jump())
  351.             const buttonB = joystick.add.button({
  352.               letter: 'B',
  353.               styles: { right: 110, bottom: 35, size: 80 }
  354.             })
  355.             buttonB.onClick(() => (this.move = true))
  356.             buttonB.onRelease(() => (this.move = false))
  357.           }
  358.         }
  359.  
  360.  
  361. /// iegūst no datubāzes vai leciens ir animācija
  362.         jump() {
  363.           if (!this.man || !this.canJump) return
  364.           this.canJump = false
  365.           this.man.animation.play('jump_running', 500, false)
  366.           this.time.addEvent({
  367.             delay: 650,
  368.             callback: () => {
  369.               this.canJump = true
  370.               this.man.animation.play('idle')
  371.             }
  372.           })
  373.           this.man.body.applyForceY(6)
  374.         }
  375. //ja tas notiek updeito datubāzi ar to ka palecās
  376.  
  377.  
  378.  
  379.         update(time, delta) {
  380.           if (this.man && this.man.body) {
  381.             /**
  382.              * Update Controls
  383.              */
  384.             this.controls.update(this.moveRight * 2, -this.moveTop * 2)
  385.             if (!isTouchDevice) this.moveRight = this.moveTop = 0
  386.             /**
  387.              * Player Turn
  388.              */
  389.             const speed = 4
  390.             const v3 = new THREE.Vector3()
  391.  
  392.  
  393.  
  394. /////console.log(time);
  395. //if(time % 55 == 0){
  396.         //console.log(5000);
  397.        
  398.         ///{"x":0.9991227572113053,"y":0,"z":0.04187739273736313}
  399.         //{
  400.     //"x": -0.9994445004172535,
  401.     //"y": 0,
  402.     //"z": -0.03332702485530725
  403. //}
  404.        
  405.        
  406.  setTimeout(function () {
  407.                                
  408. var locatedata = JSON.stringify( v3 );
  409.  
  410.  
  411.  
  412.                            $.post(
  413.                   "postlocation.php",
  414.                   { locatedata: locatedata },
  415.                   function(data) {
  416.                                          
  417.                                           console.log("izsaukta", v3);
  418.                   }
  419.                );
  420.  
  421.  
  422.  }, 10000);
  423.  
  424. //}
  425.  
  426.            
  427. // iegūtos rotācijas datus ievieto šeit ja nav jau iegūti manuāli
  428.  
  429.             const rotation = this.third.camera.getWorldDirection(v3)
  430.            
  431. //gadijumā ja ir jau izveidoti updeito datubāzi
  432.            
  433.            
  434.             const theta = Math.atan2(rotation.x, rotation.z)
  435.             const rotationMan = this.man.getWorldDirection(v3)
  436.             const thetaMan = Math.atan2(rotationMan.x, rotationMan.z)
  437.             this.man.body.setAngularVelocityY(0)
  438.  
  439.             const l = Math.abs(theta - thetaMan)
  440.             let rotationSpeed = isTouchDevice ? 2 : 4
  441.             let d = Math.PI / 24
  442.  
  443.             if (l > d) {
  444.               if (l > Math.PI - d) rotationSpeed *= -1
  445.               if (theta < thetaMan) rotationSpeed *= -1
  446.               this.man.body.setAngularVelocityY(rotationSpeed)
  447.             }
  448.  
  449.             /**
  450.              * Player Move
  451.              */
  452.             if (this.keys.w.isDown || this.move) {
  453.               if (this.man.animation.current === 'idle' && this.canJump) this.man.animation.play('run')
  454.  
  455.               const x = Math.sin(theta) * speed,
  456.                 y = this.man.body.velocity.y,
  457.                 z = Math.cos(theta) * speed
  458.  
  459. //iegūtos ātruma datus iegūst no datubāzes
  460.               this.man.body.setVelocity(x, y, z)
  461. //gadijumā ja ir izveidoti updeito datubāzi ar tiem
  462.  
  463.  
  464.             } else {
  465.               if (this.man.animation.current === 'run' && this.canJump) this.man.animation.play('idle')
  466.             }
  467.  
  468.             /**
  469.              * Player Jump
  470.              */
  471.             if (this.keys.space.isDown && this.canJump) {
  472.               this.jump()
  473.             }
  474.           }
  475.         }
  476.       }
  477.  
  478.       const config = {
  479.         type: Phaser.WEBGL,
  480.         transparent: true,
  481.         scale: {
  482.           mode: Phaser.Scale.FIT,
  483.           autoCenter: Phaser.Scale.CENTER_BOTH,
  484.           width: window.innerWidth * Math.max(1, window.devicePixelRatio / 2),
  485.           height: window.innerHeight * Math.max(1, window.devicePixelRatio / 2)
  486.         },
  487.         scene: [MainScene],
  488.         ...Canvas({ antialias: false })
  489.       }
  490.  
  491.       window.addEventListener('load', () => {
  492.         enable3d(() => new Phaser.Game(config)).withPhysics('/lib/ammo/kripken')
  493.       })
  494.     </script>
  495.   </body>
  496. </html>
  497. © 2022 GitHub, Inc.
  498. Terms
  499. Privacy
  500. Security
  501. Status
  502. Docs
  503. Contact GitHub
  504. Pricing
  505. API
  506. Training
  507. Blog
  508. About
  509.