save_the_planet

所属分类:交通/航空行业
开发工具:JavaScript
文件大小:0KB
下载次数:0
上传日期:2022-12-10 06:40:50
上 传 者sh-1993
说明:  网络编程19,
(Webprog 19,)

文件列表:
babel.rc (29, 2019-11-17)
package-lock.json (309899, 2019-11-17)
package.json (1295, 2019-11-17)
src/ (0, 2019-11-17)
src/app.js (11409, 2019-11-17)
src/clicker/ (0, 2019-11-17)
src/clicker/clicker.css (2353, 2019-11-17)
src/clicker/clicker.html (842, 2019-11-17)
src/clicker/clicker.js (11869, 2019-11-17)
src/clicker/collector.js (569, 2019-11-17)
src/clicker/collectortemplate.html (396, 2019-11-17)
src/game.js (14681, 2019-11-17)
src/img/ (0, 2019-11-17)
src/img/IdeonellaSakariensis.jpg (87870, 2019-11-17)
src/img/MainPage1.JPG (258688, 2019-11-17)
src/img/MainPage2.JPG (242528, 2019-11-17)
src/img/MainPage3.JPG (294149, 2019-11-17)
src/img/MainPage4.JPG (281697, 2019-11-17)
src/img/SaveGame1.jpg (279670, 2019-11-17)
src/img/SaveGame2.jpg (305383, 2019-11-17)
src/img/Statistiken1.JPG (334976, 2019-11-17)
src/img/Workshop1.JPG (422852, 2019-11-17)
src/img/Workshop2.JPG (368479, 2019-11-17)
src/img/Workshop3.JPG (447683, 2019-11-17)
src/img/Workshop4.JPG (361726, 2019-11-17)
src/img/blackhole.jpg (117231, 2019-11-17)
src/img/broom.jpg (165200, 2019-11-17)
src/img/bucket.png (194737, 2019-11-17)
src/img/cat.jpg (129843, 2019-11-17)
src/img/collectiveRobot.png (197085, 2019-11-17)
src/img/dipNet.jpg (89956, 2019-11-17)
src/img/drone.jpg (34797, 2019-11-17)
src/img/magnetic.png (133888, 2019-11-17)
src/img/net2.jpg (138829, 2019-11-17)
src/img/plastic_airplane.jpg (6233, 2019-11-17)
src/img/plastic_airport.jpg (145922, 2019-11-17)
src/img/plastic_car.jpg (119886, 2019-11-17)
src/img/plastic_chain.jpg (2175160, 2019-11-17)
... ...

# save_the_planet ## Starten der Anwendung: 1. git clone in ein Verzeichnis 2. in dieses Verzeichnis wechseln 3. 'npm install' ausführen 4. 'npm start' zum Starten des Entwicklungsservers ausführen ## Kurzbeschreibung Unsere Browserapp "Save_the_planet" stellt ein Minispiel dar, dass dem 'Cookie-Klicker' - Spielprinzip hnelt. Das Ziel des Spiels ist es , immer mehr und mehr Plastik zu sammeln um den Planeten von diesem zu befreien. Das gesammelte Plastik kann in recycle-Produkte umgewandelt werden, welche für Spielgeld verkauft werden. Für dieses Geld knnen anschlieend Kollektoren gekauft werden, die das Plastiksammeln für den Nutzer übernehmen und automatisch Plastik sammeln. Die Seite wurde für Chrome optimiert. ## Sub-Seiten Die Webapplikation beeinhaltet folgende Seiten: - Eine Klicker Seite, auf dieser befindet sich der "Klicker"-Button und die Liste mit den verfügbaren Kollektoren, die nacheinander freigeschaltet werden. - Eine Workshop Seite, auf dieser knnen verschiedene Produkte hergestellt werden und somit kann das Plastik gegen Geld eingetauscht werden - Eine Statistik Seite, hier knnen verschiedene Statistiken und Graphen über den Spielverlauf hinweg angeschaut werden - Eine Tutorial Seite in der das Spiel mittels verschiedenen Bildern erklrt wird und die austauschbar gegen einen Artikel über die Plastikverschutzung der Weltmeere ist (Quelle: https://www.zeit.de/wissen/umwelt/2019-05/umweltschutz-artenschutz-klimawandel-loesung, ine Analyse von Elena Erdmann und Maria Mast, 9. Mai 2019) Ebenfalls ist es mglich mehrere Spielstnde zu speichern und zu laden. Da die Entwicklung der Sub-Seiten unterschiedlich viel Aufwand bedeutete, wurde der Entwicklungsaufwand nicht nach Sub-Seiten aufgeteilt, sondern jedes Gruppenmitglied hat die gerade anstehenden Aufgaben durchgeführt. Hierbei wurde bestmglichst darauf geachtet, dass jedes Gruppen- mitglied ungefhr gleich Aufwand in die Webapplikation gesteckt hat. ## Verwendete Technologien Die App nutzt den Node Package Manager npm als Paketverwaltung. Als Application Bundler wurde ParcelJS verwendet. Ebenfalls verwendet wurden die externen Bibliotheken: - chart.js für die Graphen - sweetalert für Alerts - Navigo als Sinle Page Application Router - Hacktimer, um zu verhindern dass der Browser die laufenden Intervalle beendet, wenn er minimiert wurde. Um die Spielstnde zu speichern und zu laden wurde der localStorage verwendet. ## Folgende Entwicklungswerkzeuge kamen zum Einsatz: Webstorm & Atom: IDE zum entwicklen git: Versionsverwaltung zur gemeinsamen Arbeit am Quellcode npm: Paketverwaltung zum automatischen Download abhngiger Bibliotheken Parcel: Web Application Bundler und Entwicklungsserver Zum Koordinieren der Einzelaufgaben wurde Trello verwendet. ## Gruppenteilnehmer: - Kevin Hink - Selami Dagtasoglu - Eileen Bednar - Florian Gromann

近期下载者

相关文件


收藏者