ZAMYLA Chan: No, tässä me olemme, viimeinen p-asetettu CS50. Onnittelen itse saamasta edennyt niin pitkälle, koska ensimmäinen Hei Maailmoja ja tulostaminen Up Pyramidit Mario. Teit verkkosivuilla viime viikolla. Ja aiomme olla tehdä toinen tällä viikolla, yksi, jonka avulla voit ajaa ympäri Harvardin kampuksella, poiminta up CS50 toimihenkilöille ja tuo heidät takaisin asuinrakennusta. 

Nyt viime viikolla teimme PHP, palvelimen puolella kieltä. Tästä p-sarja, menemme käyttöön JavaScript, joka on asiakkaan puolella kieltä. Joten katsotaanpa katsomaan joitakin jakelu-koodi, joka annetaan teitä tästä p-set. JavaScript-kansiossa, siellä olla joukko JavaScript-tiedostot. 

On buildings.js, joka sisältää joukko rakennuksia ympäri Harvard kampuksella tietonsa ja sijainti. Houses.js on joukko Harvard asuinrakennusta kanssa leveys-ja pituusaste. Passengers.js sisältää erilaisia matkustajat, CS50 toimihenkilöille että sinulla on tuo takaisin niiden asuinrakennusta. 

Math3D.js, joka sisältää paljon toimintoja tekemistä liikkeen. Jos olet matemaattisesti ajattelevia, niin Toivotan teidät tervetulleeksi katsomaan. Mutta sinun ei tarvitse ymmärtää Kaikki siellä. Shuttle.js, joka käsittelee Shuttlen liikettä. Ja index.html on kotisivu, josta kaikki tapahtuu, todella, jos käyttäjä on vuorovaikutuksessa sivuston. 

Service.css on CSS tyylisivu, joka lisäksi Twitter Bootstrap Library, hallintalaitteet miten index.html näyttää. Ja sitten meillä on myös service.js, joka sisältää palvelun toiminnot Shuttle. Ja tässä on, jos aiot olla täyttämällä joitakin to-do: n. 

Nyt katsomaan esineitä ja assosiatiiviset taulukot JavaScript, jotka kaikki aikomukset ja tarkoituksiin, ovat vaihdettavissa. Jos haluaisin tehdä objektin muuttujan kutsutaan sauva, olisin julistaa sen. Ja sisältä nuo aaltosulkeita, olisin täsmentää, ydin on yksisarvinen, puu on kirsikka, ja pituus on 13. 

Nyt voin myös käyttää arvoja esineiden avulla assosiatiivisia array merkintätapa. Joten sauva indeksi ydin, voin asettaa että sama yksisarvinen, tai tarkista, että jos tarvitsen. Tai voin käyttää piste operaattori wand.wood vastaa kirsikka, ja niin edelleen ja niin edelleen. Niin näet, että assosiatiivisia taulukoita ja esineet JavaScript aiotaan vaihdettavissa, ja tahdon tulevat varsin kätevä. 

Sitten näemme erilaisia ​​rakennuksia vuonna buildings.js, jälleen, erilaisia ​​esineitä. Jos haluaisin tehdä joukko paras rakennukset Harvardin kampuksella sitten Haluaisin tehdä sen seuraavasti. Käyttämällä tätä objektin muodossa, jossa Olen tallentaa juuri, nimi, osoite, leveyttä ja pituuspiirin jokaiselle yksi rakennus objektin. 

Katsotaanpa nopeasti puhua muuttujista JavaScript. Kuten PHP, JavaScript muuttujat ovat heikosti tai väljästi kirjoitettu. Voit luoda paikallinen muuttuja, voit etuliite muuttujan nimen V--R, var. Nyt, JavaScript, toiminnot rajoittaa muuttujia. Joten jos sinulla on paikallinen muuttuja sisällä toiminto, sitten muut toiminnot voi käyttää sitä. 

Mutta toisin kuin C, silmukoita ja olosuhteet eivät rajata muuttuja. Joten vaikka et julistaa sen sisällä kunnossa, koko toiminto on pääsy siihen. Nyt ilman var, muuttuja on maailmanlaajuinen. Joten jos vain julistaa nimi ja määrittää arvon, että muuttuja on globaali muuttuja JavaScript. 

Nyt taloissa, meillä on assosiatiivinen joukko isäntä tyypin esineitä, joissa jokainen talo on vain leveyttä ja pituutta. Sitten meillä on matkustajia array, joka on array objektin tyypin matkustaja. Joten jokainen matkustaja on käyttäjän nimi, nimi, ja talon. 

Huomaa, että sanon tyypin matkustaja, joka todella tarkoittaa vain sitä että jokainen esine on samalla avaimella arvo-pareja. Joten jokainen esine tyypin matkustajalla on käyttäjätunnus, nimi, ja talon. Joten mitä meidän on tehdä p-sarja? No, meidän täytyy avulla käyttäjät voivat valita up toimihenkilöiden näkyviin kaikki henkilökunnan jäsenet, jotka ovat tällä hetkellä meidän bussikuljetus ja pudottaa ne pois. Ja sitten me myös puhua ylimääräistä ominaisuuksia, jotka voidaan toteuttaa Shuttle p-set. 

Mutta puhutaanpa pickup ensin. Kasvot CS50 työntekijät ovat olleet istutettu ympäri kampusta, jossa kukin kasvot on toteutettu paikka merkki 3D-maapallolla, ja sillä merkitsin 2D-kartan. Joten kun käyttäjä napsauttaa Pickup painiketta, haluamme lisätä lähistöllä matkustajia shuttle. Ja haluamme myös poistaa niiden paikka Merkitse maailmasta ja poistaa niiden merkkiaine kartan, joka osoittaa, että he ovat meidän shuttle nyt. 

Miten siis havaita, jos matkustajia kuuluvuusalueella meidän sukkula? No, etäisyyden funktiona, joten shuttle.distance, ohimennen leveyttä ja pituutta, laskee etäisyys nykyisestä sijainnista sukkulan siihen pisteeseen, että voit määrittää sen kanssa annetaan leveyttä ja pituutta. Voit siis käyttää tätä laskea etäisyys kuljetus matkustajia. 

Mutta mistä tiedät, missä matkustajat ovat? No, siitähän meidän täytyy muokata populate toiminto. Kansoittavat paikkoja kaikki henkilökunnan jäsenet Matkustajamäärien maailmaan ja osaksi karttaa, mutta ei tallentaa niiden sijainti. Joten ehkä voit tallentaa niiden aseta merkit ja tussit Joissakin globaali array. 

Nyt on jo olemassa maailmanlaajuinen array tallentamiseen tietoja matkustajista. Matkustajien array tallentaa kunkin matkustajan nimi ja heidän talonsa. Joten ehkä voit lisätä muutama parametri siellä matkustaja esineitä. 

Auttaa meitä havaitsemaan kaikkia matkustajia kuuluvuusalueella meidän shuttle, nyt silmukan läpi kaikki matkustajille matkustajien jono. Silmukan JavaScript voisi näyttää jotain tällaista, hyvin samankaltainen nämä silmukkahakujasi C. Tai voimme käyttää vaihtoehto silmukkarakenteen varten var i array, jossa i on silti indeksin, mutta sinun ei tarvitse Määritä array.length kunnossa ja i + +. 

Jokaisella matkustajalla sijainti on antama paikkansa merkki. Mutta paikka tavaramerkki ei ole leveyttä ja pituutta. Meidän täytyy käyttää näitä parametreja saada geometria, GET geometrian paikka merkki, ja sitten kun meillä on geometria, saada joko leveyttä tai pituusaste käyttää näitä toimintoja. 

Joten nyt me tiedämme, miten tunnistaa, onko matkustajat ovat Valikoima shuttle. Kun meillä on niitä matkustajia, näytämme haluat lisätä matkustajia, jotka ovat tällä alueella. Haluamme antaa heille mahdollisuuden hypätä ja ottaa istuin meidän shuttle, mutta vain jos meillä on tarpeeksi tilaa heille. 

Shuttle.seats array osoittaa onko istuimet ovat tyhjiä, tai kuka kyseiselle istuimelle. Joten jos istuin on tyhjä, että istuin on nolla. Joten kerrata yli paikkaa array, tarkistamalla tyhjiä paikkoja, tallentamiseen matkustajia istuimet kunnes ei ole enää tyhjiä paikkoja. Ja valitettavasti muita matkustajia on odotettava Seuraavan kerran sukkulan tulee alas. 

Kun he saavat sukkula, me haluamme riisumaan paikkaan merkki, joka on heidän kuvansa 3D-maailmassa. Jos haluaisin poistaa paikkaan merkin p, niin saisin kaikki ominaisuudet minun Earth Google Earth ja irrota kyseisen paikan merkitä käyttämällä removeChild toimintoa. Sitten lopuksi, älkäämme poistaa merkinnän, kuvaketta 2D-kartan, mistään henkilöauto että olemme poimien. 

Voit poistaa merkki m, sitten minä tietenkään suorita m.setMap null. Tee tämä matkustajia ulottuvilla, ja olet valmis pickup. Kaavio toiminto pitäisi näyttää kaikki matkustajista, jotka ovat teidän bussikuljetus ja tyhjä paikka, jos tyhjiä. Joten kaavion pitäisi kerrata yli shuttle.seats, näytetään matkustajatietojen jokaiselle indeksi, ja tyhjä paikka, jos indeksi on nolla. 

Nyt jos HTML teksti on laittaa sisälle JavaScript muuttuja, sitten käyttämällä document.getElementById, Kaavio voi muokata sisäinen HTML siitä, mitä saadaan elementti nimeämällä HTML tekstin document.getElementById sisempi HTML muuttuja. Kun käyttäjät napsauttavat Drop Off-painiketta vuonna index.html, se soitan dropoff toiminto. Ja se on meidän tehtävämme toteuttaa sitä. 

Vuonna dropoff, me haluamme poistaa matkustajia shuttle vain, jos olemme erilaisia ​​määränpäähänsä, niiden asuintalo. Joten dropoff täytyy tarkistaa, onko sukkula on välillä tahansa taloja, ja poista kaikki tarvittavat matkustajia shuttle. Miten siis tarkistaa, jos olemme kantaman tahansa taloja? No, jälleen kerran, me hyödyntää shuttle.distance toiminto, ohimennen pituus-ja leveyspiiri pisteen että me tarkastamme vastaan. 

Mutta mitä ovat ne kohdat? No, talot array, jos muistat vuonna houses.js, tallentaa pituus-ja leveysasteiden kunkin talon assosiatiivisia array, jossa jokainen indeksi on nimi, että talon. Sitten poistaa matkustajia - hyvin, vain jos olemme kantaman heidän talo, että he haluavat mennä. Joten jälleen, muista, että matkustajat tallentaa talo, että jokainen matkustaja haluaa mennä. Jos ne ovat erilaisia ​​niiden talo, niin poistamme että matkustajan shuttle.seats ja asettaa asemansa array nollaksi. 

Nyt Puhutaanpa joitakin lisäominaisuuksia , joka voidaan toteuttaa CS50 Shuttle p-set. Tuossa on järjestelmä, jonka avulla voit seurata, kuinka monta huomauttaa käyttäjällä on. Pudottamalla pois matkustajia onnistuneesti, he voivat saada pisteitä. Mutta yrittää pudottaa pois matkustajia jos ei ole mitään talon lähellä, hyvin, he voivat saada rangaista siitä. Joten ehkä haluat seurata pistettä globaali muuttuja. 

Voit toteuttaa ehkä ajastin, jossa käyttäjällä on tietty määrä aikaa poimia ja pudota pois tietty määrä matkustajia. Ehkä jopa integroida tämän kanssa pisteytysjärjestelmä. Tai voit Muokkaa kaaviota siten, että matkustajat ovat järjestetty talon. Jotta olisi todennäköisesti eräänlainen toimiakseen to shuttle.seats. 

Voit toteuttaa lentävät ominaisuus, jossa, jos käyttäjä syöttää Konami koodi ja sukkula irtoaa maahan ja sukkula voi lentää. Mutta turvallinen pudota pois, parasta tehdä shuttle purkamaan pyörät ensimmäisenä maahan. Voit myös toteuttaa teleportaatio, jos teet avattavaa rakennusten index.html. Ja valitaan yksi niistä, Käyttäjä kuljetetaan että rakennus kampuksella. OK, kuitenkin kulkea seinät joidenkin Rakennusten matkalla sinne. 

Voit myös vaihtaa nopeutta sukkula, jonka avulla käyttäjä voi lisätä tai vähentää nopeutta. Ehkä haluat globaali muuttuja seurata, kuinka paljon polttoainetta sukkula on, vähentämällä se matkan varrella. Kun osut nolla, vaikka, sukkula ei voi liikkua, paitsi jos olet tankattiin, ehkä käyttämällä painiketta tai jopa tehdä oman huoltoasema. 

Mutta se ei tietenkään ole tyhjentävä luettelo. Tutustu spec koko listata, tai ehkä ehdottaa omia oman TF. Taivas on rajana. Tämä on viimeinen CS50 p-set, joten pitää hauskaa sen kanssa. Tämä oli CS50 Shuttle. 

Minun täytyy sanoa, se on ollut ilo tekevät näitä sinulle tuotantotiimi. Ja toivon, että olet nauttia niistä, samoin. Nimeni on Zamyla. Ja tämä oli CS50.