diff options
| author | Einar Egilsson <einar@einaregilsson.com> | 2012-05-15 22:43:45 +0200 |
|---|---|---|
| committer | Einar Egilsson <einar@einaregilsson.com> | 2012-05-15 22:43:45 +0200 |
| commit | 850e497889f42a3b6eef556cca0acfbd2a199f9d (patch) | |
| tree | cf336685cd1ae1dd50e840ab660fbdfd2a121f49 | |
| parent | 8cefadb9f616d2d41667558fcdfbdaadb652a332 (diff) | |
Got card deck working
| -rw-r--r-- | cards.js | 91 | ||||
| -rw-r--r-- | demo.html | 7 |
2 files changed, 86 insertions, 12 deletions
@@ -12,32 +12,33 @@ var cards = (function() { var ANIMATION_SPEED = 500; var CARDBACK = { x: 0, y: -4 * CARD_SIZE.height }; var HCARDBACK = { x: -8 * CARD_SIZE.height, y: -5 * CARD_SIZE.height}; - var zIndexCounter = 1; + var table = {}; var all = []; //All the cards created. function init(options) { options = options || {}; - all = []; var start = options.acesHigh ? 2 : 1; var end = start + 12; if (!options.table) { alert('You must set the table id'); } - var table = $(options.table); - + table.el = $(options.table); + if ($(table.el).css('position') == 'static') { + $(table.el).css('position', 'relative'); + } for (var i = start; i <= end; i++) { - all.push(new Card('h', i, table)); - all.push(new Card('s', i, table)); - all.push(new Card('d', i, table)); - all.push(new Card('c', i, table)); + all.push(new Card('h', i, table.el)); + all.push(new Card('s', i, table.el)); + all.push(new Card('d', i, table.el)); + all.push(new Card('c', i, table.el)); } if (options.blackJoker) { - all.push(new Card('bj', 0, table)); + all.push(new Card('bj', 0, table.el)); } if (options.redJoker) { - all.push(new Card('rj', 0, table)); + all.push(new Card('rj', 0, table.el)); } shuffle(all); } @@ -184,12 +185,82 @@ var cards = (function() { $(this.el).css('z-index', zIndexCounter++); } }; + + function Container() { + + } + + Container.prototype = new Array(); + Container.prototype.extend = function(obj) { + for (var prop in obj) { + this[prop] = obj[prop]; + } + } + Container.prototype.extend({ + addCards : function(cards) { + for (var i = 0; i < cards.length;i++) { + this.push(cards[i]); + cards[i].container = this; + } + }, + + immediateRender : function() { + for (var i=0;i<this.length;i++) { + var card = this[i]; + if (this.faceUp) { + card.showCard(); + } else { + card.hideCard(); + } + zIndexCounter++; + $(card.el).css({top : card.targetTop, left: card.targetLeft, 'z-index' : zIndexCounter}); + } + }, + + topCard : function() { + return this[this.length-1]; + }, + + toString: function() { + return 'Container'; + } + }); + + function Deck(options) { + options = options || {}; + this.x = options.x || $(table.el).width()/2; + this.y = options.y || $(table.el).height()/2; + this.faceUp = options.faceUp; + } + + Deck.prototype = new Container(); + Deck.prototype.extend({ + render : function(options) { + var left = Math.round(this.x-CARD_SIZE.width/2, 0); + var top = Math.round(this.y-CARD_SIZE.height/2, 0); + for (var i=0;i<this.length;i++) { + if (i > 0 && i % CONDENSE_COUNT == 0) { + top-=1; + left-=1; + } + this[i].targetTop = top; + this[i].targetLeft = left; + } + if (options.immediate) { + this.immediateRender(); + } else { + + } + } + }); return { init : init, all : all, SIZE : CARD_SIZE, Card : Card, + Container : Container, + Deck : Deck, shuffle: shuffle }; })(); @@ -20,6 +20,7 @@ width:600px; display:block; height:150px; + white-space:pre; } #card-table { @@ -41,8 +42,10 @@ <body> <h1>Cards.js</h1> <code> - cards.init({table:'#card-table'}); - +cards.init({table:'#card-table'}); +deck = new cards.Deck(); +deck.addCards(cards.all) +deck.render({immediate:true}); </code> <button onclick="execute()">Execute</button> <div id="card-table"> |