Kirjautuminen

Haku

Tehtävät

Kilpailu

Ohjelmoi tekoäly!
Aikaa on 30.6. saakka.

Keskustelu: Projektit: Tasteroids

Sivu 1 / 1

Sivun loppuun

TapaniS [28.03.2020 15:09:09]

Lainaa #

Tämä liittyy meneillään olevaan kilpailuun. Eli olen tekemässä html+canvas+JavaScript -työkaluja käyttäen peliä tänne.

TapaniS [28.03.2020 15:25:19]

Lainaa #

En saa ääniä toimimaan kunnolla. Uuden äänen pitäisi alkaa heti, kun esim. ammutaan tai osutaan johonkin. Nyt edellinen audio -elementti soitetaan loppuun asti ennenkuin seuraava alkaa. Osaisiko joku neuvoa, miten tuon saisi toimimaan? Audio.pause pysäyttää äänen, mutta se jatkuu samasta kohtaa, kun sen käynnistää uudestaan.

Metabolix [28.03.2020 16:00:43]

Lainaa #

Hyvä alku!

Näppäimet eivät toimi kunnolla. Vilkaisin koodia, ja ilmeisesti käsittelet vain enintään yhtä näppäintä kerrallaan, ja toisen näppäimen painaminen samaan aikaan sekoittaa pelin. Parempi olisi pitää kirjaa painetuista näppäimistä, esimerkiksi Set-objektiin voi lisätä ja poistaa tietoja keydown- ja keyup-tapahtumissa, jolloin pelaaja voisi esimerkiksi kääntyä ja kaasuttaa samaan aikaan.

Näppäinten osalta harkitsisin myös vaihtoehtona WASD-näppäinten käyttämisen liikkumisessa, ja muut toiminnot voisivat olla keskemmällä näppäimistöä.

Jotta ääni alkaisi alusta, pitää asettaa currentTime = 0 ennen soittamista.

TapaniS [28.03.2020 16:51:44]

Lainaa #

Kiitos ohjeista! Tuo näppisongelma tosiaan on, pitää säätää vielä.

En saanut currentTime -asetusta toimimaan, mutta kiertoliikkeenä tallensin saman äänen uusilla nimillä ja soitan aina uudennimisen raidan toisen perään, niin nyt toimii mukavasti tämäkin.

Metabolix [28.03.2020 20:49:36]

Lainaa #

Yksi vaihtoehto äänen (varsinkin ääniefektien) soittamiseen on se, että kopioit soitettavan äänen. Näin voi myös soittaa samaa ääntä useana kappaleena samaan aikaan.

// Alussa:
const räjähdys = new Audio("poks.wav");

// Myöhemmin:
räjähdys.cloneNode().play();

Lisäys: Tein Tykkipeli-projektin, jossa on esitelty tätä äänen soittoa, syötteen lukua sekä parempi pelisilmukka requestAnimationFrame-funktion avulla.

Miten tämän pelin nimi pitäisi muuten tulkita? Taste-roids, Ta-steroids? ;)

peran [28.03.2020 21:15:43]

Lainaa #

Itse veikkasin, että se tulee...

T-asteroids eli TapaniS:n asteroids

TapaniS [29.03.2020 15:59:23]

Lainaa #

Joo - peran osui lähelle! Sehän on tietysti TaS - asteroids!

Sain äänet pelaamaan, kun laitoin alla olevan pätkän soundiin:

  this.onbegin = function() {
	this.sound.pause();
	this.sound.currentTime = 0;
  }

Ja nyt näppiksetkin toimii paremmin, kaasu ja kääntyminen toimii samaan aikaan. Jokin häikkä on, kun yhtä aikaa alhaalla space+arrowUp+arrowLeft. Muilla on ollut sama ongelma, joten lisäsin pari nappulaa ampuja varten (f ja b). Myös w kaasuttaa ja a kääntää vasempaan ja d oikeaan.

TapaniS [03.04.2020 21:38:20]

Lainaa #

Nyt kaipaisin jälleen neuvoa:

Haluaisin toteuttaa Top-10 listan, joka siis innostaa pelaamaan ja yrittämään listalle pääsyä ... Eli miten tuon voisi toteuttaa Javascript-canvas -pelissä?

Oma ajatus olisi lähinnä tallentaa tulokset palvelimelle txt-tiedostoon ja lukea tiedot sieltä. Onnistuuko tämmöinen ja löytyisikö esimerkkiä jostakin? En haluaisi liittää tietokantatoimintoja vaan pitää pelin mahdollisimman yksinkertaisena.

Metabolix [03.04.2020 21:58:17]

Lainaa #

Tuloslista pitää tehdä palvelimelle. Sinänsä listan saa tehtyä helposti esimerkiksi PHP:llä ja tekstitiedostolla, kunhan tiedoston muistaa lukita. Listalle voisi lähettää tietoa JavaScriptin fetch-rajapinnalla.

Listan suuri ongelma on kuitenkin se, että listalle on helppo lähettää mitä tahansa väärennettyjä ”tuloksia”. Viime kädessä hakkeri voi muokata selainpelin koodia niin, että jokainen ammus osuu, jolloin huipputulos on taattu. Luotettava lista vaatisi siis, että koko pelin kulku tallennettaisiin ja sen laillisuus tarkastettaisiin palvelimella, mikä on melko epäkäytännöllistä. Tarkastuksessa voi tulla vaikeuksia myös, jos pelin laskutoimituksissa tulee hieman erilaisia pyöristysvirheitä eri koneilla.

TapaniS [05.04.2020 15:04:42]

Lainaa #

Nyt sain parin päivän väsäämisen jälkeen Top-10 -listan toimimaan. Ratkaisuna hiukan monimutkainen, mutta en saanut oikein muutenkaan toimimaan.

Tiedoston lukeminen:
Luetaan PHP:llä ja syötetään tiedot piilotettuun text-input -kenttään, josta ne luetaan Javascriptillä.

Tietojen tallennus:
Syötetään tiedot lomakkeen näkyviin text-input -kenttiin ja submit lähettää ne uudelle PHP-sivulle, joka tallettaa tiedot tiedostoon. Forwardointi takaisin pelin pääsivulle.

Lisäksi näppiksen preventDefault poistetaan käytöstä tietojen syöttämistä varten. Submit disabled, kunnes peli loppuu ja pisteet riittävät listalle.

Metabolix [05.04.2020 18:55:36]

Lainaa #

Ei kuulosta nyt kovin turvalliselta ratkaisulta. Mitä käy, jos kaksi henkilöä lähettää tuloksia samaan aikaan? Katoaako toisen tulos? Voiko pelaaja poistaa listalta muiden tulokset tai muuten lähettää mitä tahansa? Kyllä listalle pitäisi vain lähettää nykyisen pelin tulos, ja palvelin katsoisi, mihin kohti listaa tulos kuuluu.

Jos taas haluat tehdä listan vain paikallisesti pelaajan koneelle, voit tallentaa tiedot localStorage-rajapinnalla.

Lisäys: Kävinpä lähettämässä listalle tuloksen 715517 nimellä HAX. Lopputulos on vähintäänkin mielenkiintoinen, sillä tulos meni läpi ja on nyt listalla 4 kertaa (joka toisessa välissä).

TapaniS [05.04.2020 20:40:45]

Lainaa #

Hei,

Kiitokset kommenteista jälleen! Jep tämä kaipaa vielä pientä säätöä, mutta pikkuhiljaa pitäisi asettua palaset kohdilleen.

<input type="text" name="playpoints" id="playpoints" value="0" size="6" readonly>

Tuossa siis on tuo readonly -optio, jonka pitäisi estää pisteiden manuaalimuokkaus, mutta ilmeisesti ei toimikaan sitten. Eli ehkä tuokin pitää laittaa sitten piiloon.

Metabolix [05.04.2020 21:07:19]

Lainaa #

Vaikka kuinka piilottaisit tuon kentän, käyttäjä voi painaa F12 ja kirjoittaa selaimen konsoliin document.querySelector("#playpoints").value­=1234567, tai viime kädessä käyttäjä voi lukea sivun lähdekoodista, miten tieto lähetetään palvelimelle, ja suoraan lähettää sinne ihan mitä tahansa. Eli kuten koetin jo edellä selittää, ainoa tapa luotettavaan pistelistaan on se, että nimenomaan palvelimella jotenkin tarkastetaan, onko tulos laillinen.

TapaniS [06.04.2020 21:23:32]

Lainaa #

Hei! Eihän noin saa tehdä! Hehehe!

Lisäsin pienen tarkastuksen palvelimelle. Kyllähän tämänkin voi varmaan hakkeroida, mutta vaatii jo vähän enemmän vaivaa, että ehkä nyt on ihan riittävä tähän kisaan.

TapaniS [10.04.2020 13:19:11]

Lainaa #

Nyt on tehty pieni päivitys Top-10 -listan tuloksien tarkastukseen. Jokaiselle pelille luodaan yksilöllinen tunniste, joka vaikuttaa myös pelin kulkuun. Tarkistus on vielä hiukan keskeneräinen, mutta sitä voidaan vielä kiristää, jos se ei toimi riittävän hyvin. Jatkossa listalle päästäkseen pitänee kuitenkin pelata peli loppuun.

TapaniS [10.04.2020 23:01:24]

Lainaa #

Nyt lisätty osumista pisteet ruudulle.

Puuttuu vielä ufot ja lämpöohjukset, sekä oman aluksen suojat ja uudet "elämät" saavutetuista pisterajoista. Näitä yritän saada pikkuhiljaa väsättyä.

Ai niin, nyt tuo tarkistus Top-10 -listalle on viritetty taas hiukan paremmaksi. Pieni lisäys tähänkin on kuitenkin vielä tulossa ...

The Alchemist [11.04.2020 05:29:36]

Lainaa #

Tuossa ei kyllä sitten ole mitään järkeä, että tapat kaiken inputin koko sivulla. Kuuntele vain canvas-elementin sisäisiä syötteitä, ja silloinkin sinun pitää sallia vähintään "tab out".

TapaniS [11.04.2020 08:15:24]

Lainaa #

The Alchemist kirjoitti:

Tuossa ei kyllä sitten ole mitään järkeä, että tapat kaiken inputin koko sivulla. Kuuntele vain canvas-elementin sisäisiä syötteitä, ja silloinkin sinun pitää sallia vähintään "tab out".

Joo, tykkipelissä onkin hieno esimerkki tästäkin! Yritän vielä saada tuon paremmaksi, aikaa palaa vaan ihan kauheasti kaikkeen muuhun, kuin itse pelin ominaisuuksien toteutukseen ...

jalski [11.04.2020 11:03:52]

Lainaa #

Pari parannus ehdotusta: Alkuvalikossa ei varmaan kuuluisi kuulla rakettimoottorin polttoääntä, jos painaa näppäimistöltä nuolta ylöspäin? Mielestäni kuolin animaatio kun alus hajoaa palasiksi saisi olla melkein puolet nopeampi ettei pelaajalla mene odotteluksi.

Itse olen miettinyt minkälaisen pelin tekisin kilpailuun ja milä työkalulla. Pelin kirjoittaminen 8th:lla vaatisi melkein kaiken toiminnallisuuden toteuttamista itse. Hauskaa puuhaahan tuo silti olisi... Olen nyt kirjoitellut vanhaa asteroids peliäni selain versioksi SpiderBasic:illa. Homma luonnistuu kyllä nopeasti ja syntaksi sopii minulle JavaScriptiä paremmin kun en ole mikään OOP-ohjelmointityylin ystävä. Kilpailuun en tätä kyllä silti varmaan laita, ettei tule asteroids ylikuormitusta...

The Alchemist [12.04.2020 05:22:42]

Lainaa #

TapaniS kirjoitti:

Joo, tykkipelissä onkin hieno esimerkki tästäkin! Yritän vielä saada tuon paremmaksi, aikaa palaa vaan ihan kauheasti kaikkeen muuhun, kuin itse pelin ominaisuuksien toteutukseen ...

En tiedä, mihin se aika sitten kuluu, mutta ei noiden pienten muutosten tekeminen ole ollenkaan vaikeaa.

Pelin pohjana näyttää olevan 20 vuotta ja vanhentunut koodi. Jos olet sen verran kouliintunut JS-ohjelmoija, ettet pelkää hajottaa vierasta koodia, niin sinuna kyllä lähtisin ihan siitä liikkeelle, että restrukturoit koodin sellaiseksi, että se noudattaa edes perustason bestpractiseja. (Validi HTML, erilliset koodikomponentit yhden ison spagettitiedoston sijaan.)

Kannattaa myös varmaan unohtaa HTML-lomakkeilla kikkailu ja tehdä taustatyö ihan kunnollisella JS-freimiksellä. Se säästää aikaa ja hermoja.

TapaniS [12.04.2020 19:20:58]

Lainaa #

Kiitokset jälleen kommenteista! Nyt on uusi päivitys laitettu. Tuossa on odotteluaikaa pienennetty ja pieni bugi korjattu (oma alus saattoi rähähtää, kun ammutun asteroidin haamu ajoi sen yli). Jalskin asteroids näyttää hienolta! Sillä olisi mitalisija kisassa hyvinkin tulossa!

Alchemist:
Koodi varmaan näyttää vanhalta, kun tämä on ihan ensimmäinen Javascript -tuotokseni ja vaikutteet Javasta ja PHP:stä ovat vahvasti näkyvissä. En saanut tuota tiedoston käsittelyä toimimaan Javascriptillä ja lomakkeet taas toimivat kuin "junan vessa". Eli taidot eivät nyt vielä riitä parempaan. Ongelmana ainakin oli, että kun sain tiedoston jotenkin luettua Javascriptin avulla, niin se tuntui sitten jäävän johonkin puskuriin niin, että vaikka tiedostoon tuli uusia rivejä, niin ne eivät koskaan tulleet käyttöön, vaan vanhan tiedoston tiedot tulivat aina uudestaan, kun sivu ladattiin uudelleen.

Lisäksi tietysti homma menee tosi nopsaan, kun sen osaa. Näitä kun harjoittelee ja kirjoittaa koodia moneen kertaan, testaa ja taas uudestaan, niin siinähän se aika sitten menee. Iso spagettitiedosto on tosiaan, ehkä olisi hyvä jotenkin jakaa pienempiin palasiin. Toisaalta, kun on tämmöinen kisa käynnissä, niin ehkä ei tarvitse ihan kaikki olla niin helposti kopioitavissa.

Lebe80 [13.04.2020 16:15:25]

Lainaa #

"Toimii kuin junan vessa" viittaa siis siihen, että jokin toimii varmasti. Junan vessa on siis vain reikä radalle.

Grez [13.04.2020 16:21:23]

Lainaa #

Lebe80 kirjoitti:

"Toimii kuin junan vessa" viittaa siis siihen, että jokin toimii varmasti. Junan vessa on siis vain reikä radalle.

Mielestäni Tapanin viesti vaikuttaa siltä että hän tämän kyllä tietää ja muutenkin kyseessä on ihan yleistieto.

TapaniS [14.04.2020 09:26:52]

Lainaa #

Joo, itselle tuo ilmaus on oman kokemuksen kautta hyvin konkreettinen. Tosin nämä uudemmat lähiliikenteen junavessat taitaakin jo toimia toisella periaatteella eli siinä mielessä on ymmärrettävää, jos nuorempi polvi ei tuota ilmausta täysin pysty hahmottamaan. Tarkoitin siis, että lomakkeet toimivat hyvin luotettavasti.

TapaniS [16.04.2020 21:44:10]

Lainaa #

Pieniä päivityksiä: näppäinohjaus ja äänet vain pelin aikana, oma alus luodaan vapaalle kentälle ja hetken suojaus, että ehtii väistellä asteroideja. Peruutus lisätty omalle alukselle. Top-10 -lista myös viimeisen viikon aikaisille tuloksille. Ufo lentelee jo introssa, mutta peliin asti se ei ole vielä ehtinyt.

Puuttuu vielä: Ufot, lämpöohjukset, oman aluksen suojukset, Hyper-Space, pelin pause ja äänten sammutus M-näppäimellä.

jalski [16.04.2020 22:46:59]

Lainaa #

TapaniS kirjoitti:

(16.04.2020 21:44:10): Pieniä päivityksiä: näp­päi­nohjaus ja äänet...

Hyper-Space äärimmäisen helppo lisätä, lisäät vaan uuden näppäimen käsittelijään ja arvot uudet koordinaatit alukselle. Tarvitset jonkunmoisen pelitilan käsittelyn peliin ja pause-tila sekä muut vastaavat pienet muutokset toteutuvat sen jälkeen kuin itsestään (yksinkertainen switch/case rakenne riittänee tähän).

Metabolix [16.04.2020 23:18:06]

Lainaa #

Harkitse vielä tykkipelini tutkimista, siinä on mm. tuo pause-mahdollisuus koodissa (joskaan ei käytössä) ja myös varmatoiminen ajanottoon perustuva silmukka.

TapaniS [20.04.2020 21:45:20]

Lainaa #

Nyt on vähän isompi päivitys TaSteroids 3.1.0 Beta.

Piti laittaa Beta perään, kun on jo hiukan hankala hahmottaa, mitä koodissa oikein tapahtuu ja varmaan bugejakin joukkoon taas mahtuu.

Ensimmäinen UFO on nyt aktivoitu. Onkohan tuo liian "tappava"? No suojukset auttaa jatkossa, kunhan saan niitä väsättyä. Ne olen kuitenkin halunnut jättää viimeiseksi, ettei parhaat pisteet karkaa kovin korkealle.

TapaniS [23.04.2020 20:47:13]

Lainaa #

Uusia päivityksiä, nyt on jo enemmän pelaamisen tuntua. Hidastin UFOn fotonien nopeutta, niin nyt niitä pystyy jo väistelemään aika mukavasti. Lisäsin myös 3 suojakilpeä, jotka ovat hyvä lisä. Suojakilpiä tulee lisää, kun saan vielä lämpöohjukset peliin. Äänet ovat nyt oletuksena pois päältä, mutta ne saa M-näppäimellä päälle.

Yritän viikonlopun aikana saada vielä puuttuvia kohteita: HyperSpace, lämpöohjukset ja pelin pause. Ei kovin paljon enää puutu! Tietysti lisäksi pitää vielä säätää aika monta asetusta kohdilleen ja ehkä koodiakin pitää vielä siivota ... :-)

Metabolix [23.04.2020 21:34:00]

Lainaa #

Peli itsessään on jo aika hyvä.

Äänet pätkivät ikävästi esimerkiksi usean samanaikaisen räjähdyksen tapauksessa. Voisit kokeilla äänen kopiointia, kuten Tykkipelissä. Moottorin äänen voisi myös tehdä niin, että sen saisi soimaan ilman taukoa. (Audio-objektissa on jopa loop-ominaisuus tätä varten.)

Mitäpä jos tekisit sivun HTML-osuuden uusiksi paremmin? Kun sivulla on noin vähän HTML-sisältöä ja noin yksinkertaiset muotoilut, sivun uusiminen on helppo juttu. Voit ottaa ottaa pohjaksi vaikka tykkipelin sivun ja lisätä siihen puuttuvat palaset. Kannattaa käyttää myös validaattoria.

walkout_ [24.04.2020 16:23:11]

Lainaa #

Hyvä peli. Mutta äänet ei lähtenyt päälle heiti vaan vasta kun tuli Game Over niin suraavassa pelissä äänet toimi.

TapaniS [26.04.2020 14:36:32]

Lainaa #

Nyt on uusi päivitys TaSteroids 3.2.0 Beta.

Eli pelin kaikki ominaisuudet ovat nyt käytössä. Lopulliseen versioon saattaa tulla vielä joitakin muutoksia ja koodia ei ole vielä "kirjoitettu puhtaaksi".

En tehnyt lämpöohjuksia (ainakaan vielä), kun tuntui riittävän haastavalta ilman niitäkin. Pieni UFO ampuu kohti ja ennakoi oman liikkeen, joten sen pitäisi olla hyvä korvike lämpöohjukselle. En ole tätä päässyt kovin paljoa vielä testaamaan, mutta säädän asetuksia palautteen ja kokemusten mukaan vielä myöhemmin.

TapaniS [29.04.2020 19:23:36]

Lainaa #

Pieniä päivityksiä: Auto Fire, Bonukset tasojen selvityksestä, mustat kivet. Lisäksi asteroidien määrää sekä UFOjen ilmestymistiheyttä on pienennetty. Enää ei saa suojia niin helposti kuin ennen.

Joudun vielä harkitsemaan TOP-10 listan nollausta. Nyt siellä on kärjessä tosi iso tulos, mutta tuo oli vielä, kun suojia sai UFOjen ampumisesta.

-tossu- [30.04.2020 01:04:25]

Lainaa #

Tällä hetkellä tuloksen tallennus top-listaan ei tunnu toimvan. Yritin kahdesti lähettää uuden ennätyksen (227070 pistettä), mutta se ei näy listassa. Minulla on lomakkeen data tallessa, jos tarvitset sitä vianetsinnässä.

TapaniS [30.04.2020 09:52:38]

Lainaa #

Tarkastuslaskennassa ei löytynyt virheitä, joten tulos on hyväksytty listalle. Tarkastusohjelmasta löytynyt bugi on korjattu.

Itse en ole päässyt testaamaan kovin paljon yli tason 15 toimintaa, tuosta olisi mukava kuulla, miten peli toimii korkeammilla tasoilla. Ilmeisesti lämpöohjus kuitenkin pitää vielä rakentaa ... :( Ja täytyy vielä säätää jotenkin, että peli ei voi jatkua loputtomiin.

-tossu- [30.04.2020 11:45:12]

Lainaa #

Peli oli täysin pelattava ainakin vielä tasolla 28. Ruudulla on toki paljon tavaraa, mutta hitaasti liikkumalla sitä saa hyvin väisteltyä. Pidemmälle mentäessa tasot alkavat tuntua aika samanlaisilta.

Jossain vaiheessa peliä alkaa aina tason lopussa ufoja tulla aivan hirveällä tahdilla. En tiedä, onko kyseessä bugi vai ominaisuus, mutta se on ehkä pelin ärsyttävin asia.

Lopussa oli vielä reilusti aluksia ja suojia jäljellä, mutta lopetin pelin tarkoituksella. Tämä peli toimii mielestäni parhaiten hetken kerrallaan pelattuna, mutta nykyisellään pelimekaniikka ei oikein tue sitä. Se toki johtuu suoraan pelityypistä, eikä minulla ole siihen parempaakaan vaihtoehtoa tarjota.

Pieninä parannuksina äänet voisivat olla oletuksena päällä ja sivun vierityksen pelin alussa voisi ottaa pois. Nyt sivu vierittyy siten, että pelialue on aivan ruudun yläreunassa, jolloin tuntuu siltä, että osa pelistä on näkymättömissä. Vaihtoehtoisesti pelialueen voisi vierittää keskelle tai siihen voisi lisätä kehyksen.

TapaniS [03.05.2020 09:12:38]

Lainaa #

Kiitos palautteesta. Joo, UFOjen ideana oli toimia pelin lopettajana, mutta säädöissä on ollut hakemista, että tulisi jonkinlainen tasapaino pelattavuuden ja pelin vaikeutumisen suhteen.

Nyt laitoin sitten nämä lämpöohjukset peliin mukaan ja ne toimivat nyt pelin lopetuksen varmistuksena. Kun suojat loppuvat, niin aika paha on noita väistellä. Suojat ottavat nyt myös siipeensä jokaisesta törmäyksestä ja torjutusta ammuksesta tai ohjuksesta eli ei kannata enää ehkä ajaa asteroidien yli suojat päällä.

En ole kovin paljon pystynyt testaamaan yli 20 tasojen toimintaa, mutta jonkinlainen parempi tasapaino nyt pitäisi olla ainakin tuonne tasolle 23 asti. Näitä asetuksia ja ajoituksia pitänee vielä säätää, kun tulee enemmän kokemuksia. En ole vielä koskenut ääniasetuksiin tai vieritykseen. Tuo vieritys tuli siitä, kun itsellä on niin pieni ruutu läppärissä, että piti vierittää ylöspäin, että koko pelialue tulee näkyviin (nyt ei isompaa aluetta tähän mahdu).

TaSteroids 3.2.4.


Sivun alkuun

Vastaus

Muista lukea kirjoitusohjeet.
Tietoa sivustosta