Skip to content

Instantly share code, notes, and snippets.

View willyandan's full-sized avatar

Willyan Antunes willyandan

33 followers · 32 following
  • Caçapava SP
View GitHub Profile
@willyandan
willyandan / JSONView Custom Styles.css
Created September 7, 2018 01:00 — forked from tyom/JSONView Custom Styles.css
Custom styles for JSONView (https://chrome.google.com/webstore/detail/chklaanhfefbnpoihckbnefhakgolnmc)
body {
background: #222;
color: #ddd;
white-space: pre;
font-family: monospace;
}
a {
color: #6482c8;
}
@willyandan
willyandan / index.html
Created January 31, 2019 20:03
Pong - html 1
<html>
<body>
<canvas id="canvas" width="800" height="500"></canvas>
</body>
</html>
@willyandan
willyandan / index.html
Created January 31, 2019 20:10
Pong -html 2
<html>
<body>
<canvas id="canvas" width="800" height="500"></canvas>
<script src="./pong.js"></script>
</body>
</html>
@willyandan
willyandan / pong.js
Last active January 31, 2019 22:13
pong.js - inicializando e loop
let ctx, p1_y, p2_y, p1_points, p2_points
const h=500, w=800, p_w=20, p_h=200, p1_x = 10, p2_x = w - p_w - 10
function setup(){
const canvas = document.getElementById("canvas")
ctx = canvas.getContext("2d")
// inicializa as posições y do p1 e do p2 para metade da tela
p1_y = p2_y = (h / 2) - (p_h/2)
// inicializa os pontos dos jogadores como 0
@willyandan
willyandan / pong.js
Created January 31, 2019 22:15
pong.js - initBall()
let ball_y_orientation, ball_x_orientation, ball_x, ball_y
function initBall(){
console.log(`${p1_points} VS ${p2_points}`)
ball_y_orientation = Math.pow(2, Math.floor( Math.random() * 2 )+1) - 3
ball_x_orientation = Math.pow(2, Math.floor( Math.random() * 2 )+1) - 3
ball_x = w / 2 -10
ball_y = h / 2 -10
}
@willyandan
willyandan / pong.js
Created January 31, 2019 22:21
pong.js - Mesclando função initBall ao código
let ctx, p1_y, p2_y, p1_points, p2_points
let ball_y_orientation, ball_x_orientation, ball_x, ball_y
const h=500, w=800, p_w=20, p_h=200, p1_x = 10, p2_x = w - p_w - 10
function setup(){
const canvas = document.getElementById("canvas")
ctx = canvas.getContext("2d")
// inicializa as posições y do p1 e do p2 para metade da tela
p1_y = p2_y = (h / 2) - (p_h/2)
@willyandan
willyandan / pong.js
Created January 31, 2019 23:06
pong.js - drawRect
function drawRect(x,y,w,h,color="#fff"){
ctx.fillStyle = color
ctx.fillRect(x,y,w,h)
ctx.fillStyle = "#000"
}
@willyandan
willyandan / pong.js
Created January 31, 2019 23:28
pong.js - draw
function draw(){
// fundo
drawRect(0,0,w,h,"#000")
// player 1
drawRect(p1_x, p1_y, p_w, p_h)
// player 2
drawRect(p2_x, p2_y, p_w, p_h)
// barra lateral
drawRect(w/2 -5,0,5,h)
// bola
@willyandan
willyandan / pong.js
Created January 31, 2019 23:31
pong.js - mesclando funções drawRect e draw ao código
let ctx, p1_y, p2_y, p1_points, p2_points
let ball_y_orientation, ball_x_orientation, ball_x, ball_y
const h=500, w=800, p_w=20, p_h=200, p1_x = 10, p2_x = w - p_w - 10
function setup(){
const canvas = document.getElementById("canvas")
ctx = canvas.getContext("2d")
// inicializa as posições y do p1 e do p2 para metade da tela
p1_y = p2_y = (h / 2) - (p_h/2)
@willyandan
willyandan / pong.js
Last active February 1, 2019 00:21
pong.js - event listener
let p1_key, p2_key
document.addEventListener("keydown",function(ev){
// keyCode 87 = w, keycode 83 = s
if(ev.keyCode == 87 || ev.keyCode == 83){
p1_key = ev.keyCode
}
// keycode 38 = arrowUp, keycode 40 = arrowDown
else if(ev.keyCode== 38 || ev.keyCode==40)
p2_key = ev.keyCode
})