summaryrefslogtreecommitdiff
path: root/resources/js
diff options
context:
space:
mode:
Diffstat (limited to 'resources/js')
-rw-r--r--resources/js/app.js23
-rw-r--r--resources/js/components/chessTable.vue33
2 files changed, 56 insertions, 0 deletions
diff --git a/resources/js/app.js b/resources/js/app.js
index 40c55f6..c34da8c 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -1 +1,24 @@
+/**
+ * First we will load all of this project's JavaScript dependencies which
+ * includes Vue and other libraries. It is a great starting point when
+ * building robust, powerful web applications using Vue and Laravel.
+ */
+
require('./bootstrap');
+
+window.Vue = require('vue');
+import 'vue-chessboard/dist/vue-chessboard.browser.js';
+
+const files = require.context('./', true, /\.vue$/i)
+files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default))
+
+/**
+ * Next, we will create a fresh Vue application instance and attach it to
+ * the page. Then, you may begin adding components to this application
+ * or customize the JavaScript scaffolding to fit your unique needs.
+ */
+
+const app = new Vue({
+ el: '#app'
+});
+
diff --git a/resources/js/components/chessTable.vue b/resources/js/components/chessTable.vue
new file mode 100644
index 0000000..45eeb99
--- /dev/null
+++ b/resources/js/components/chessTable.vue
@@ -0,0 +1,33 @@
+<template>
+ <div class="">
+ <chessboard :showThreats="showThreats" @onMove="showInfo"></chessboard>
+ </div>
+
+</template>
+
+<script>
+import {chessboard} from 'vue-chessboard'
+import jQuery from 'jquery'
+
+export default {
+ name: 'App',
+ components: {
+ chessboard
+ },
+ data () {
+ return {
+ currentPosition: {},
+ showThreats: false,
+ positionNumber: 0,
+ started: false,
+ isStartModalActive: true,
+ positionInfo: {},
+ }
+ },
+ methods: {
+ showInfo(info) {
+ this.positionInfo = info
+ }
+ }
+}
+</script> \ No newline at end of file