So real...it hurts! A mash-up of Pong and Mortal Kombat, first introduced 1994.
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
demo
documents
fonts
guide
icons
images
languages/en
music
screenshots
scripts
sounds
styles
templates
.gitignore
.htaccess
BingSiteAuth.xml
LICENSE.md
README.md
error.php
favicon.ico
google42dfbc7fe4b65d2a.html
humans.txt
index.html
listing.php
pinterest-fb752.html
play.html
pong-kombat.icns
pong-kombat.sublime-project
pong-kombat.sublime-workspace
press.html
privacy.html
robots.txt
sitemap.xml
teaser.html

README.md

Pong Kombat

This documentation is intended for project developers and interested participants. For more information on Pong Kombat in general, consult your language-specific README file:

If you'd like, translate the project into your language and submit it to the repository, or send it directly to jeff@pongkombat.com. See the Internationalization section below until a GUI can be developed.

Description

At it's core, this project is an enhanced remake of the classic freeware title of the same name. The project resides at www.pongkombat.com. It is a web-based application that includes a high quality game. It aims for broad compatibility, providing lots of learning experiences across mobile, tablet, desktop, television, and other platforms.

Purpose

The purpose of Pong Kombat is--and always has been--to learn something new and to have fun doing it.

This project intends to stand as an example for the following web development topics:

  1. Apache - A popular HTTP server
    1.1 PHP - An open-source scripting language
    1.2 MySQL - An open-source SQL database
  2. MEAN.JS - An open-source full-stack application solution
    2.1 MongoDB - An open-source NoSQL document database
    2.2 Express - A back-end web application framework
    2.3 AngularJS - A front-end MVW (Model-View-Whatever) web application framework
    2.4 Node.js - An open-source JavaScript based runtime environment and application server
  3. SASS - A front-end styling extension
    3.1 CSS - Latest web standards include transitions, animations, transformations, etc.
  4. HTML5 - Latest web standards including canvas, audio/video, sockets, etc.
    4.1 JavaScript - A powerful client-side scripting language
  5. Seach engine optimization and social media integration
    5.1 Facebook - Social media application
    5.2 Twitter - Social media application
    5.3 Pinterest - A visual content discovery tool
    5.4 YouTube - A video sharing application
    5.5 GitHub - A Git repository distribution channel and revision control application

Local Development

To work on this project locally, you will need to configure an Apache server. If you don't know how to do this, send me an email at jeff@pongkombat.com and I can possibly help.

Once the environment is ready to go, download a working copy of the Git repository to your local project folder. I like to configure a special domain name for my local development environment. I add www.pongkombat.dev (note the domain extension) to my hosts file and set up a Virtual Host in my Apache config. Then, after restarting Apache, point the web browser to http://www.pongkombat.com and bada-bing, bada-boom.

File Structure

For the most part, the folders in this project are pretty self-explanatory.

  • /demo/ - The public demo that was released in December 2014
  • /documents/ - Text and other portable documents related to the project
  • /fonts/ - Web font fonts
  • /guide/ - A strategy guide in plain text and ePub formats
  • /icons/ - Icon files in various sizes and formats, including .png, .icns, .ico
  • /images/ - Image resources used in the game and throughout the web pages
  • /languages/ - Localization strings in JSON format and localized README in markdown format
  • /music/ - Audio loops in various formats
  • /screenshots/ - In-game screen captures
  • /scripts/ - JavaScript resources
  • /scripts/engine/ - The game engine JavaScript resources
  • /scripts/game/ - The game logic JavaScript resources
  • /sounds/ - Audio files in various formats
  • /styles/ - SASS and compiled CSS resources
  • /templates/ - HTML templates
  • /vendors/ - 3rd party front-end resources

Internationalization

One of the goals of this project is to create a fully localizable application, including all text content, embedded images, dates and times, currency, and (perhaps) even advertising images.

The strings are stored in separate files inside the /languages/ directory, using the RFC 1766 specification as the naming convention. Some content utilizes the JSON (JavaScript Object Notation) format, some utilize the Markdown format, and some are plain text files.

The default language of the application is generic English, which is /languages/en/. The strings.en.json file contains a dictionary of terms and groups of terms that are used throughout the entire application. Each term is represented by a KEY and a value.

{
	"PONG_KOMBAT" : "Pong Kombat",
	"THANK_YOU" : "Thank you for playing!"
	/*...*/
}

Keys are represented in ALL CAPS and should not be changed. The values listed immediately after the key are the translated strings. Notice the keys in the generic Spanish example below:

{
	"PONG_KOMBAT" : "Pong Kombat",
	"THANK_YOU" : "¡Gracias por jugar Pong Kombat!",
	/*...*/
}

Since many languages utilize accented and special characters, translations can be provided using Unicode escaped characters. The Unicode character shown in the Spanish example, ¡ (written ¡), references the inverted exclamation point character.

Some strings may contain a placeholder variable, such as DIRECTORY as defined in "LISTING" : "Index of {{ DIRECTORY }}". These variables will be replaced by the logic within the application.

One final note: Some languages might only be a slight variance to another language.

In the United Kingdom, the primary language is English, but occasionally words are spelled differently, as in localization and localisation. For these types of translations, you only need to include the changed key-value pairs. The translation logic will automatically fill in the missing ones from it's parent language (en_GB fills in with en, es_MX fills in with es, etc.). If the key is not defined in the parent language, or if the parent language is missing completely, the translation logic will fill in from the application default language, /languages/en/.

Related