Botones de redes

This commit is contained in:
Nulo 2021-07-06 23:07:17 +00:00
parent d2105b0ea4
commit c1b897341c
6 changed files with 61 additions and 0 deletions

View file

@ -4,6 +4,9 @@ import botonComenzar from "./assets/Comenzar.png";
import botonSiguiente from "./assets/Siguiente.png"; import botonSiguiente from "./assets/Siguiente.png";
import botonCompartirPerdiste from "./assets/Comparti_2.png"; import botonCompartirPerdiste from "./assets/Comparti_2.png";
import botonCompartirFelicitaciones from "./assets/Comparti_1.png"; import botonCompartirFelicitaciones from "./assets/Comparti_1.png";
import instagram from "./assets/240px-Instagram_simple_icon.svg.png";
import facebook from "./assets/Font_Awesome_5_brands_facebook-square.png";
import twitter from "./assets/240px-Font_Awesome_5_brands_Twitter.svg.png";
import logoFPGFDTBlanco from "./assets/Logo Blanco.png"; import logoFPGFDTBlanco from "./assets/Logo Blanco.png";
import logoSalvaLaCostanera from "./assets/SalvaCostanera.png"; import logoSalvaLaCostanera from "./assets/SalvaCostanera.png";
import logoSalvaLaCostaneraCostado from "./assets/Salva2.png"; import logoSalvaLaCostaneraCostado from "./assets/Salva2.png";
@ -59,6 +62,9 @@ export const imageAssetUrls = {
botonSiguiente, botonSiguiente,
botonCompartirPerdiste, botonCompartirPerdiste,
botonCompartirFelicitaciones, botonCompartirFelicitaciones,
facebook,
instagram,
twitter,
logoFPGFDTBlanco, logoFPGFDTBlanco,
logoSalvaLaCostanera, logoSalvaLaCostanera,
logoSalvaLaCostaneraCostado, logoSalvaLaCostaneraCostado,

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

View file

@ -120,6 +120,37 @@ function shareButton(juego: Juego<State>): {
}; };
} }
const socialUrls = {
facebook: "https://www.facebook.com/Fpg.caba",
instagram: "https://www.instagram.com/fpg.caba/",
twitter: "https://twitter.com/FtePatriaGrande",
};
function socialButtons(juego: Juego<State>): {
[key in "facebook" | "instagram" | "twitter"]: {
box: Box;
sprite: Sprite;
};
} {
let x = juego.canvas.width - 5;
let s: any = {};
for (const network of ["facebook", "instagram", "twitter"]) {
const sprite = (juego.sprites as any)[network];
const width = sprite.getWidth(juego);
const height = sprite.getHeight(juego);
x -= width + 20;
s[network] = {
box: {
x,
y: juego.canvas.height * 0.95 - height,
width,
height,
},
sprite,
};
}
return s;
}
export function update(juego: Juego<State>, dt: number) { export function update(juego: Juego<State>, dt: number) {
if (juego.state.has) { if (juego.state.has) {
const button = shareButton(juego); const button = shareButton(juego);
@ -130,6 +161,14 @@ export function update(juego: Juego<State>, dt: number) {
share(); share();
(juego as Juego<AllState>).state = welcome.createState(); (juego as Juego<AllState>).state = welcome.createState();
} }
for (const [network, { box }] of Object.entries(socialButtons(juego))) {
if (
isTouching(juego, box) ||
(juego.mouse.down && posInBox(box, juego.mouse))
) {
location.href = (socialUrls as any)[network];
}
}
return; return;
} }
@ -506,5 +545,9 @@ export function draw(juego: Juego<State>, timestamp: number) {
} }
const button = shareButton(juego); const button = shareButton(juego);
button.sprite.draw(juego, button.box.x, button.box.y); button.sprite.draw(juego, button.box.x, button.box.y);
const socials = socialButtons(juego);
for (const { sprite, box } of Object.values(socials)) {
sprite.draw(juego, box.x, box.y);
}
} }
} }

View file

@ -19,6 +19,9 @@ export type Juego<T extends State> = {
| "botonComenzar" | "botonComenzar"
| "botonCompartirPerdiste" | "botonCompartirPerdiste"
| "botonCompartirFelicitaciones" | "botonCompartirFelicitaciones"
| "instagram"
| "twitter"
| "facebook"
| "logoFPGFDTBlanco" | "logoFPGFDTBlanco"
| "logoSalvaLaCostaneraGrande" | "logoSalvaLaCostaneraGrande"
| "logoSalvaLaCostaneraCostado" | "logoSalvaLaCostaneraCostado"
@ -135,6 +138,15 @@ async function initJuego() {
height: (juego) => juego.canvas.height / 8, height: (juego) => juego.canvas.height / 8,
} }
), ),
instagram: loadSprite(assets.instagram, {
height: (juego) => juego.canvas.height * 0.1,
}),
facebook: loadSprite(assets.facebook, {
height: (juego) => juego.canvas.height * 0.1,
}),
twitter: loadSprite(assets.twitter, {
height: (juego) => juego.canvas.height * 0.1,
}),
logoFPGFDTBlanco: loadSprite(assets.logoFPGFDTBlanco, { logoFPGFDTBlanco: loadSprite(assets.logoFPGFDTBlanco, {
height: (juego) => juego.canvas.height / 6, height: (juego) => juego.canvas.height / 6,
}), }),