jecfish · August 31, 2017 16:14 · Aug 31, 2017 · Aug 31, 2017 · Aug 31, 2017
diff --git a/cards.index.ts b/cards.index.ts
@@ -16,7 +16,7 @@ export class MyCards extends GestureEventListeners(PolymerElement) {
 
     static get properties() {
         return {
-            cards: []
+            cards: Array
         };
     }
 

diff --git a/cards.index.ts b/cards.index.ts
@@ -35,7 +35,7 @@ export class MyCards extends GestureEventListeners(PolymerElement) {
     }
 
     private isMatch([image1, image2]: string[]) {
-        return image1 === image2;
+        // logic to check if two card images matched
     }
 
     flip({ model }) {

diff --git a/cards.index.ts b/cards.index.ts
@@ -0,0 +1,47 @@
+// index.ts
+
+import { Element as PolymerElement } from '@polymer/polymer/polymer-element';
+import '@polymer/polymer/lib/elements/dom-repeat';
+import { GestureEventListeners } from '@polymer/polymer/lib/mixins/gesture-event-listeners';
+import * as view from './cards.template.html';
+
+export class MyCards extends GestureEventListeners(PolymerElement) {
+    static get template() {
+        return view;
+    }
+
+    constructor() {
+        super();
+    }
+
+    static get properties() {
+        return {
+            cards: []
+        };
+    }
+
+    getClass(item) {
+        return (item.isFlipped || item.isMatched) ? 'card flipped' : 'card';
+    }
+
+    cards: PolyTest.Card[];
+
+    private get isReachMaxFlippedCard() {
+        // logic to check max 2 cards flip at any point of time
+    }
+
+    private get isAllCardsMatched() {
+        // logic to check if all cards matched
+    }
+
+    private isMatch([image1, image2]: string[]) {
+        return image1 === image2;
+    }
+
+    flip({ model }) {
+        const card = { ...model.item };
+        const index = model.index;
+
+        // logic to flip the card
+    }
+}