diff --git a/back/data/lastActionPointsUpdate b/back/data/lastActionPointsUpdate
index 96188cedf835a65f1ddafeb6a61a76f35b3be50b..ba6994b3f9a6bfab20335f5edde10721443f6e47 100644
--- a/back/data/lastActionPointsUpdate
+++ b/back/data/lastActionPointsUpdate
@@ -1 +1 @@
-Mon Feb 18 2019 21:20:58 GMT+0100 (Central European Standard Time)
\ No newline at end of file
+Tue Feb 19 2019 18:56:58 GMT+0100 (Central European Standard Time)
\ No newline at end of file
diff --git a/back/index.js b/back/index.js
index c41031ece35594b9f8429bb42330b49dbf22d56e..e2e68e44187a054e0e90d6193159fd0c202179b2 100644
--- a/back/index.js
+++ b/back/index.js
@@ -30,7 +30,7 @@ app.use(loginChecker);
// Routes
app.use('/users', usersRouter);
-// app.use('/characters', charactersRouter);
+app.use('/characters', charactersRouter);
mongoose.connect('mongodb://localhost/rolegame', err => {
if (err) {
diff --git a/back/routes/characters.js b/back/routes/characters.js
index bf48dc3bbeba15c83d978089388ed3329b1ed005..17bf85b3fbca6398391391f4de160fb714dcc0ca 100644
--- a/back/routes/characters.js
+++ b/back/routes/characters.js
@@ -8,9 +8,14 @@ const router = express.Router();
const getScore = (data) => Object.keys(data).reduce((total, el) => total + costTable[data[el]], 0);
+router.get('/avatars', (req, res) => {
+ const avatars = fs.readdirSync('../front/public/img/avatars');
+ res.json({ avatars });
+})
+
router.get('/', async (req, res) => {
// TODO: Login required
- const avatars = fs.readdirSync('media/avatars');
+
Character.find({ user: req.session.user._id }, (err, characters) => {
if (err) return res.status(400).json({ error: err });
return res.json(characters);
diff --git a/back/views/character_summary.pug b/back/views/character_summary.pug
deleted file mode 100644
index 8e8cca865ca33c2f8d3289930fc60576ca98ff57..0000000000000000000000000000000000000000
--- a/back/views/character_summary.pug
+++ /dev/null
@@ -1,32 +0,0 @@
-.ui.card.fluid
- .content
- img.right.floated.mini.image.ui(src="/media/avatars/"+character.avatar, alt="Avatar")
- .header= character.name
- .meta
- .date Created on #{character.birthDate.toDateString()}
- .ui.tiny.progress.yellow.progress(id="action-points-bar-"+character._id)
- .bar
- .label
- span(id="action-points-value-"+character._id)= character.actionPoints
- | action points
- //- .content
- //- .ui.label(class=character.attributes.strength<=8 ? "orange" : character.attributes.strength>=12 ? "green" : "" )
- //- | Strength
- //- .detail= character.attributes.strength
- //- .ui.label(class=character.attributes.constitution<=8 ? "orange" : character.attributes.constitution>=12 ? "green" : "" )
- //- | Constitution
- //- .detail= character.attributes.constitution
- //- .ui.label(class=character.attributes.dexterity<=8 ? "orange" : character.attributes.dexterity>=12 ? "green" : "" )
- //- | Dexterity
- //- .detail= character.attributes.dexterity
- //- .ui.label(class=character.attributes.intelligence<=8 ? "orange" : character.attributes.intelligence>=12 ? "green" : "" )
- //- | Intelligence
- //- .detail= character.attributes.intelligence
- //- .ui.label(class=character.attributes.wisdom<=8 ? "orange" : character.attributes.wisdom>=12 ? "green" : "" )
- //- | Wisdom
- //- .detail= character.attributes.wisdom
- //- .ui.label(class=character.attributes.charisma<=8 ? "orange" : character.attributes.charisma>=12 ? "green" : "" )
- //- | Charisma
- //- .detail= character.attributes.charisma
- script $('#action-points-bar-#{character._id}').progress({ total: #{maxActionPoints}, value: #{character.actionPoints}});
- script updateActionPoints('#{character._id}', #{character.actionPoints}, #{maxActionPoints});
diff --git a/back/media/avatars/boris_by_charro_art_d8eta2f-pre.jpg b/front/public/img/avatars/boris_by_charro_art_d8eta2f-pre.jpg
similarity index 100%
rename from back/media/avatars/boris_by_charro_art_d8eta2f-pre.jpg
rename to front/public/img/avatars/boris_by_charro_art_d8eta2f-pre.jpg
diff --git a/back/media/avatars/drake_by_charro_art_d8eta33-pre.jpg b/front/public/img/avatars/drake_by_charro_art_d8eta33-pre.jpg
similarity index 100%
rename from back/media/avatars/drake_by_charro_art_d8eta33-pre.jpg
rename to front/public/img/avatars/drake_by_charro_art_d8eta33-pre.jpg
diff --git a/back/media/avatars/fazzlemare_by_charro_art_d8etbfa-pre.jpg b/front/public/img/avatars/fazzlemare_by_charro_art_d8etbfa-pre.jpg
similarity index 100%
rename from back/media/avatars/fazzlemare_by_charro_art_d8etbfa-pre.jpg
rename to front/public/img/avatars/fazzlemare_by_charro_art_d8etbfa-pre.jpg
diff --git a/back/media/avatars/mortimer_by_charro_art_d8eta4a-pre.jpg b/front/public/img/avatars/mortimer_by_charro_art_d8eta4a-pre.jpg
similarity index 100%
rename from back/media/avatars/mortimer_by_charro_art_d8eta4a-pre.jpg
rename to front/public/img/avatars/mortimer_by_charro_art_d8eta4a-pre.jpg
diff --git a/back/media/avatars/scarlet_by_charro_art_d8eta4q-pre.jpg b/front/public/img/avatars/scarlet_by_charro_art_d8eta4q-pre.jpg
similarity index 100%
rename from back/media/avatars/scarlet_by_charro_art_d8eta4q-pre.jpg
rename to front/public/img/avatars/scarlet_by_charro_art_d8eta4q-pre.jpg
diff --git a/back/media/avatars/tobias_by_charro_art_d8eta17-pre.jpg b/front/public/img/avatars/tobias_by_charro_art_d8eta17-pre.jpg
similarity index 100%
rename from back/media/avatars/tobias_by_charro_art_d8eta17-pre.jpg
rename to front/public/img/avatars/tobias_by_charro_art_d8eta17-pre.jpg
diff --git a/back/media/avatars/warren_by_charro_art_d8eta25-pre.jpg b/front/public/img/avatars/warren_by_charro_art_d8eta25-pre.jpg
similarity index 100%
rename from back/media/avatars/warren_by_charro_art_d8eta25-pre.jpg
rename to front/public/img/avatars/warren_by_charro_art_d8eta25-pre.jpg
diff --git a/front/public/index.html b/front/public/index.html
index 35239811aa290bb59e428c968efb3c5e1fcd110f..10302b52ef3eb1fa17bc2ee536f818c6ab11b0c3 100644
--- a/front/public/index.html
+++ b/front/public/index.html
@@ -5,7 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
- <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.min.css">
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.min.css">
<title>front</title>
</head>
<body>
diff --git a/front/src/components/CharacterItem.vue b/front/src/components/CharacterItem.vue
new file mode 100644
index 0000000000000000000000000000000000000000..5d3ccc927bff82e56038ffcfcf4e9a31c56b56b2
--- /dev/null
+++ b/front/src/components/CharacterItem.vue
@@ -0,0 +1,24 @@
+<template lang="pug">
+ sui-card(class="fluid")
+ sui-card-content
+ sui-image(floated="right", size="mini", :src="`avatars/${character.avatar}`")
+ sui-card-header {{ character.name }}
+ sui-card-meta Created on {{ character.birthDate }}
+ sui-progress(size="tiny", color="yellow", :label="`${character.actionPoints} action points`", :percent="character.actionPoints/480*100")
+</template>
+
+<script>
+export default {
+ name: "CharacterItem",
+ props: ['character'],
+ data() {
+ return {
+ }
+ }
+ // TODO: Update action points
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/front/src/components/HelloWorld.vue b/front/src/components/HelloWorld.vue
deleted file mode 100644
index af0ec2d7a4ee416d672950b50a69a0200676c94f..0000000000000000000000000000000000000000
--- a/front/src/components/HelloWorld.vue
+++ /dev/null
@@ -1,122 +0,0 @@
-<template>
- <div class="hello">
- <h1>{{ msg }}</h1>
- <p>
- For a guide and recipes on how to configure / customize this project,<br />
- check out the
- <a href="https://cli.vuejs.org" target="_blank" rel="noopener"
- >vue-cli documentation</a
- >.
- </p>
- <h3>Installed CLI Plugins</h3>
- <ul>
- <li>
- <a
- href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
- target="_blank"
- rel="noopener"
- >babel</a
- >
- </li>
- <li>
- <a
- href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa"
- target="_blank"
- rel="noopener"
- >pwa</a
- >
- </li>
- <li>
- <a
- href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
- target="_blank"
- rel="noopener"
- >eslint</a
- >
- </li>
- </ul>
- <h3>Essential Links</h3>
- <ul>
- <li>
- <a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a>
- </li>
- <li>
- <a href="https://forum.vuejs.org" target="_blank" rel="noopener"
- >Forum</a
- >
- </li>
- <li>
- <a href="https://chat.vuejs.org" target="_blank" rel="noopener"
- >Community Chat</a
- >
- </li>
- <li>
- <a href="https://twitter.com/vuejs" target="_blank" rel="noopener"
- >Twitter</a
- >
- </li>
- <li>
- <a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a>
- </li>
- </ul>
- <h3>Ecosystem</h3>
- <ul>
- <li>
- <a href="https://router.vuejs.org" target="_blank" rel="noopener"
- >vue-router</a
- >
- </li>
- <li>
- <a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a>
- </li>
- <li>
- <a
- href="https://github.com/vuejs/vue-devtools#vue-devtools"
- target="_blank"
- rel="noopener"
- >vue-devtools</a
- >
- </li>
- <li>
- <a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener"
- >vue-loader</a
- >
- </li>
- <li>
- <a
- href="https://github.com/vuejs/awesome-vue"
- target="_blank"
- rel="noopener"
- >awesome-vue</a
- >
- </li>
- </ul>
- </div>
-</template>
-
-<script>
-export default {
- name: "HelloWorld",
- props: {
- msg: String
- }
-};
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped>
-h3 {
- margin: 40px 0 0;
-}
-ul {
- list-style-type: none;
- padding: 0;
-}
-li {
- display: inline-block;
- margin: 0 10px;
-}
-a {
- color: #42b983;
-}
-</style>
diff --git a/front/src/router.js b/front/src/router.js
index 7b4bb791ec5bb7aa0ef76fac1691412d8815d0d4..9a623cf6d9c5c1cc25d82f8e1dff791397a10d12 100644
--- a/front/src/router.js
+++ b/front/src/router.js
@@ -1,6 +1,7 @@
import Vue from "vue";
import Router from "vue-router";
import Home from "./views/Home.vue";
+import Characters from "./views/Characters.vue";
Vue.use(Router);
@@ -14,13 +15,9 @@ export default new Router({
component: Home
},
{
- path: "/about",
- name: "about",
- // route level code-splitting
- // this generates a separate chunk (about.[hash].js) for this route
- // which is lazy-loaded when the route is visited.
- component: () =>
- import(/* webpackChunkName: "about" */ "./views/About.vue")
+ path: "/characters",
+ name: "characters",
+ component: Characters
}
]
});
diff --git a/front/src/views/Characters.vue b/front/src/views/Characters.vue
new file mode 100644
index 0000000000000000000000000000000000000000..687c5cae40aa1766972278a418cc341aaa1c9d8b
--- /dev/null
+++ b/front/src/views/Characters.vue
@@ -0,0 +1,81 @@
+<template lang="pug">
+ div
+ sui-card-group
+ CharacterItem(v-for="character in characters", :key="character._id", :character="character")
+ sui-container(text-align="center")
+ sui-button(color="teal", basic, icon="add", @click="creationModal=true") Create character
+
+ sui-modal(v-model="creationModal")
+ sui-modal-header Create a new character
+ sui-modal-content(image)
+ sui-image(size="medium", :src="`avatars/${newCharacter.avatar}`")
+ sui-modal-description
+ sui-form(@submit.prevent="")
+ sui-header Details
+ sui-form-fields
+ sui-form-field
+ sui-input(type="text", v-model="newCharacter.name", placeholder="name")
+ sui-form-field
+ sui-dropdown(placeholder="Avatar", selection, :options="avatars", v-model="newCharacter.avatar")
+ sui-header Attributes: {{ availablePoints }} points remaning
+ sui-grid
+ sui-grid-column(:width="8", v-for="attribute in attributes" :key="attribute")
+ sui-segment
+ sui-statistic(horizontal)
+ sui-statistic-value {{ newCharacter.attributes[attribute] }}
+ sui-statistic-label {{ attribute }}
+ sui-button(color="orange", circular, floated="left", icon="minus")
+ sui-button(color="teal", circular, floated="right", icon="add")
+ sui-progress(attached, bottom, :percent="newCharacter.attributes[attribute]/20*100")
+ sui-modal-actions
+ sui-button(color="orange", basic, icon="close", @click="creationModal=false") Cancel
+ sui-button(color="grey", basic, icon="redo", @click="resetCharacter") Reset
+ sui-button(color="teal", basic, icon="check") Create
+</template>
+
+<script>
+import http from "@/http";
+import CharacterItem from "@/components/CharacterItem.vue";
+export default {
+ name: "Characters",
+ components: {
+ CharacterItem
+ },
+ data() {
+ return {
+ characters: [{
+ _id: "13F3V34GBB",
+ avatar: "boris_by_charro_art_d8eta2f-pre.jpg",
+ name: "Kagamino",
+ birthDate: "01-01-1998",
+ actionPoints: 400
+ }],
+ creationModal: false,
+ newCharacter: { attributes: { } },
+ avatars: [],
+ attributes: ['strength', 'constitution', 'dexterity', 'intelligence', 'wisdom', 'charisma'],
+ availablePoints: 15
+ }
+ },
+ created() {
+ this.attributes.forEach(attribute => {
+ this.newCharacter.attributes[attribute] = 10
+ });
+ http()
+ .get('http://localhost:3000/characters/avatars')
+ .then(res => this.avatars = res.data.avatars.map(avatar => ({ text: avatar, value: avatar })))
+ },
+ methods: {
+ resetCharacter() {
+ this.characters = { attributes: { } };
+ this.attributes.forEach(attribute => {
+ this.newCharacter.attributes[attribute] = 10
+ });
+ }
+ }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/front/src/views/Home.vue b/front/src/views/Home.vue
index c048ee965b20b83451a0472ff7ffdb80f1f4a71a..8270dfb73599207a26edf046525e7c78e40cc7a0 100644
--- a/front/src/views/Home.vue
+++ b/front/src/views/Home.vue
@@ -1,6 +1,5 @@
<template lang="pug">
- .home
- sui-image(src="img/wallpaper.jpg")
+ sui-image(src="img/wallpaper.jpg")
</template>
<script>