Skip to main content ↑ ↓
Topic: Triple Triad JS (Read 61242 times) previous topic - next topic
0 Members and 2 Guests are viewing this topic.

Triple Triad JS

Spent the past week or so boning up on Triple Triad, the card game first introduced in Final Fantasy VIII. Searching for already-made Triple Triad games to play, I found a couple of sites mostly using Flash and some no-longer-maintained programs. Suffice it to say the vast majority of these are unplayable. I've wanted to make a Triple Triad clone for a pretty long time that I could actually play. Enter Triple Triad JS!

Rules
For those unfamiliar with Triple Triad, it is a card game with a few basic rules and the innate ability to add a few more rules. It is a two-player duel with a coin flip to determine who starts. Players take turns placing cards into empty cells of a 3*3 grid. The game ends when all 9 cells are filled and the winner is determined by who holds the most cards, including the leftover card in the second player's hand, when the grid is filled.

Cards have 4 values, each corresponding to a compass direction (North, East, South, West). When a card is placed in a cell, its values are checked against the opposite values of cards in neighboring cells; North checks against the North card's South, East checks against the East card's West, etc. If the played card's checked value wins over the adjacent card's value based on the given play rules, the adjacent card flips possession (like Reversi), otherwise no change takes place.

Greater
A played card only wins if its value is greater than the adjacent card's corresponding value. By default this is the only capture rule in effect, but capture rules can be declared to extend win conditions; the Greater rule cannot be removed, however. The original Triple Triad did not name this condition.

Same
If a played card's value is the same as an adjacent card's corresponding value, the adjacent card flips.

Example: played card's North value is 3, adjacent North card's South value is 3, North adjacent card flips.

Same Wall
Similar to Same but also checks against the Wall. The Wall's value is always 10. Same Wall can only be in effect if Same is also in effect and Wall-adjacent cards can only be flipped if their corresponding values are 10.

Plus
If the sum of a played card's value and its adjacent card's corresponding value in one direction is the same as the sum of the played card's value and its adjacent card's corresponding value in another direction, both adjacent cards flip.

Example: played card's North value is 3, adjacent North card's South value is 7 (sum is 10), played card's East value is 4, adjacent East card's West value is 6 (sum is also 10), North and East adjacent cards flip.

Combo
If a card is flipped using Same, Plus, or Same Wall, cards adjacent to it are checked according to all the given capture rules (including Greater), similar to a paint bucket fill in image editors. This chain continues until no more cards can be flipped according to the current rules; one can theoretically win a game by flipping all the cards on the board with their last card if Combo is in effect. Combo is automatically in effect if Same, Same Wall, and/or Plus are in effect.

Elemental
Random cells are assigned random elements. If a card's element is the same as the cell's it receives a +1 boost on all values, otherwise it receives a -1 penalty on all values. The boost does not affect Same, Same Wall, or Plus comparisons in effect.

Open
Both players' hands are visible during the match.

Random
A player's hand is chosen randomly from his or her deck instead of being able to choose manually. This can be accomplished by shuffling the deck and choosing the top five cards or programmatically choosing five random cards.

Sudden Death
If a game ends in a Draw, the match restarts but the players instead start with the cards they captured. Play continues in this manner until a winner is determined.

Trading and Winning
Triple Triad has built-in rules for trading and winning which can be agreed upon before a match starts. They are irrelevant in a local installation of a given Triple Triad game but shall be elaborated upon and expanded once multiplayer features and online deck management are added.

JS Edition Progress
Currently I have successfully implemented Open, Random, Same, and Combo rules. Both players decks are created randomly and hands are chosen randomly and programmatically. The first player is chosen randomly in a simulated coin flip and all nine turns are simulated with a winner or draw determined at the end.

Once I add basic user interaction (choosing hands, choosing cell placement) I'll upload it to the site and provide source code. For now I'm working on the web version of the game while I abstract as much platform-independent stuff as possible (jQuery for web interaction and the game simulation). I also plan on making this an example of using Firebase to manage online Sphere data.

(edit - clarified Combo)

Re: Triple Triad JS

Reply #1 –
This is cool, I liked that game! I think this could work really well as an online game, too!

By the way, are you using the original card graphics from FF8? Or are you going a copyright law safe route with that?

Re: Triple Triad JS

Reply #2 –
For now I'm using the original graphics, since pretty much every other Triple Triad on the net has been able to get away with it so far (I got the card graphics from finalfantasy.wikia.com), but down the line I'm going to add customization options that will allow easy replacement of visual elements on a card (the pic, frame, elementals, directional values, and variable background colors) and the playing field and eventually just un-brand the default cards. For now I want to simply recreate the original game and get the source up for reference purposes.

I may also extend rules to allow diagonal capturing, but I'm still on the fence about that one.
 

Re: Triple Triad JS

Reply #3 –
Update: basic site up http://www.spheredev.org/tt/ !

For now it only programmatically plays a game with no user input, but most of the mechanics are in place. Still need to debug Combo, add Same Wall, Random, and Sudden Death play rules, all the trading rules, and continue work on my Card Manager interface, then hook it up to Firebase, then I'll work on taking the web stuff and turning it into Sphere stuff.