X-Git-Url: https://git.auder.net/img/rock_paper_scissors_lizard_spock.gif?a=blobdiff_plain;ds=sidebyside;f=client%2Fsrc%2Fviews%2FHome.vue;h=1eaa6b17daf5273867706cf539eaaa9fe3f135cf;hb=8d61fc4ab7373b4a576f3f9108cdf7768ae27096;hp=156976c1c89ceb4ac9ff1c42000a5e7361102bcc;hpb=625022fdcf750f0aff8fcd699f7e9b89730e1d10;p=vchess.git

diff --git a/client/src/views/Home.vue b/client/src/views/Home.vue
index 156976c1..1eaa6b17 100644
--- a/client/src/views/Home.vue
+++ b/client/src/views/Home.vue
@@ -1,7 +1,6 @@
 <template>
   <div class="home">
-		<!--<img alt="Vue logo" src="../assets/logo.png">-->
-    <HelloWorld msg="Welcome to Your Vue.js Apppp"/>
+    <Home msg="Welcome to Your Vue.js Apppp"/>
   </div>
 </template>
 
@@ -12,7 +11,38 @@ import HelloWorld from "@/components/HelloWorld.vue";
 export default {
   name: "home",
   components: {
-    HelloWorld
+    HelloWorld,
   }
 };
 </script>
+
+// Show a variant summary on index
+Vue.component('my-variant-summary', {
+	props: ['vobj','index'],
+	template: `
+		<div class="variant col-sm-12 col-md-5 col-lg-4" :id="vobj.name"
+			:class="{'col-md-offset-1': index%2==0, 'col-lg-offset-2': index%2==0}">
+			<a :href="url">
+				<h4 class="boxtitle text-center">
+					{{ vobj.name }}
+					<span class="count-players">
+						/ {{ vobj.count }}
+					</span>
+				</h4>
+				<p class="description text-center">
+					{{ translate(vobj.desc) }}
+				</p>
+			</a>
+		</div>
+	`,
+	computed: {
+		url: function() {
+			return "/" + this.vobj.name;
+		},
+	},
+	methods: {
+		translate: function(text) {
+			return translations[text];
+		},
+	},
+})