package.json

@@ -7,6 +7,7 @@
     "bootstrap": "^4.0.0-beta.3",
     "dat.gui": "^0.7.1",
     "material-ui": "^0.20.0",
+    "pixi-layers": "^0.1.9",
     "pixi-tween": "^0.2.0",
     "pixi.js": "^4.6.2",
     "react": "^16.2.0",

src/Game/views/base/CollectionDeck.js

@@ -42,15 +42,15 @@ class CollectionDeck extends GuiableContainer{
 
         this.addChild(this.sprite);
 
-        let cardHolder = new CardHolder({'x':0,'y':0,'w':60,'h':96});
-        this.addChild(cardHolder);
-        let cardHolder2 = new CardHolder({'x':0,'y':100,'w':60,'h':96});
+        let cardHolder1 = new CardHolder({'x':0,'y':-200,'w':60,'h':96});
+        this.addChild(cardHolder1);
+        let cardHolder2 = new CardHolder({'x':0,'y':-100,'w':60,'h':96});
         this.addChild(cardHolder2);
         let cardHolder3 = new CardHolder({'x':0,'y':0,'w':60,'h':96});
         this.addChild(cardHolder3);
-        let cardHolder4 = new CardHolder({'x':0,'y':0,'w':60,'h':96});
+        let cardHolder4 = new CardHolder({'x':0,'y':100,'w':60,'h':96});
         this.addChild(cardHolder4);
-        let cardHolder5 = new CardHolder({'x':0,'y':0,'w':60,'h':96});
+        let cardHolder5 = new CardHolder({'x':0,'y':200,'w':60,'h':96});
         this.addChild(cardHolder5);
 
 

src/Game/views/demo/CardCollectionDemo.js

@@ -1,4 +1,5 @@
 import * as PIXI from 'pixi.js';
+import 'pixi-layers';
 
 import CardCollection from '../base/CardCollection';
 import CollectionDeck from '../base/CollectionDeck';
@@ -7,12 +8,20 @@ class CardCollectionDemo extends PIXI.Container{
 	constructor(){
 		super();
 
+		var layer = new PIXI.display.Layer();
+
 		let cardCollection = new CardCollection({});
 		this.addChild(cardCollection);
 		let collectionDeck = new CollectionDeck({'x': 600, 'y':0 });
 		this.addChild(collectionDeck);
+		// this.setChildIndex(collectionDeck, 0);
+		// this.setChildIndex(cardCollection,1);
 	}
 
+	_kill() {
+        
+    }
+
 	getAsJSON = () => {return {component: 'demo/CardCollectionDemo'}}
 }