mirror of
https://github.com/exane/not-gwent-online
synced 2024-12-23 21:03:14 +00:00
add routing
This commit is contained in:
parent
da6f8749db
commit
9654ba6a50
5
site/client/app/components/deckBuilder.js
Normal file
5
site/client/app/components/deckBuilder.js
Normal file
@ -0,0 +1,5 @@
|
||||
module.exports = {
|
||||
|
||||
template: "<h2>deckbuilder hier</h2>"
|
||||
|
||||
};
|
@ -13,7 +13,8 @@ module.exports = {
|
||||
navigation: require('./navigation'),
|
||||
chat: require('./chat'),
|
||||
|
||||
lobby: require('./lobby')
|
||||
lobby: require('./lobby'),
|
||||
deckBuilder: require('./deckBuilder')
|
||||
}
|
||||
|
||||
};
|
@ -1,5 +1,5 @@
|
||||
module.exports = {
|
||||
|
||||
template: require('../views/lobby.html'),
|
||||
template: "<h2>lobby hier</h2>"
|
||||
|
||||
};
|
@ -7,10 +7,6 @@ module.exports = {
|
||||
inherit: true,
|
||||
|
||||
methods: {
|
||||
changeView: function(view) {
|
||||
router.changeRoute(view);
|
||||
},
|
||||
|
||||
searchMatch: function() {
|
||||
this.modal = true;
|
||||
// trigger match functions
|
||||
|
@ -1,26 +1,19 @@
|
||||
var routes = {
|
||||
'/lobby': function() {
|
||||
alert('lobby');
|
||||
},
|
||||
|
||||
'/deck-builder': function() {
|
||||
alert('deck-builder');
|
||||
},
|
||||
|
||||
'/highscore': function() {
|
||||
alert('highscore');
|
||||
}
|
||||
};
|
||||
|
||||
var options = {
|
||||
html5history: true
|
||||
}
|
||||
|
||||
var Router = require('director').Router;
|
||||
var router = new Router(routes).configure(options).init();
|
||||
require('../../../public/Config.js');
|
||||
|
||||
module.exports = {
|
||||
changeRoute: function(route) {
|
||||
router.setRoute(route);
|
||||
|
||||
maps: {
|
||||
'/lobby': {
|
||||
component: 'lobby'
|
||||
},
|
||||
|
||||
'/deck-builder': {
|
||||
component: 'deckBuilder'
|
||||
}
|
||||
},
|
||||
|
||||
options: {
|
||||
history: true,
|
||||
root: window.Config.Site.base
|
||||
}
|
||||
}
|
@ -4,10 +4,21 @@
|
||||
|
||||
<main>
|
||||
|
||||
<style>
|
||||
.test {
|
||||
transition: all .5s ease;
|
||||
}
|
||||
.test-enter, .test-leave {
|
||||
opacity: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
<navigation></navigation>
|
||||
|
||||
<section class="container-content">
|
||||
<component is="lobby"></component>
|
||||
|
||||
<router-view class="test" v-transition="test" transition-mode="out-in"></router-view>
|
||||
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
@ -1,7 +1,7 @@
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a class="active" v-on="click: changeView('lobby')">Lobby</a></li>
|
||||
<li><a v-on="click: changeView('deck-builder')">Deck Builder</a></li>
|
||||
<li><a class="active" v-link="/lobby">Lobby</a></li>
|
||||
<li><a v-link="/deck-builder">Deck Builder</a></li>
|
||||
<li><a v-on="click: changeView('highscore')">Highscore</a></li>
|
||||
|
||||
<li class="sub-nav" v-on="click: searchMatch"><a>Quick Match</a></li>
|
||||
|
@ -21,11 +21,11 @@
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
|
||||
@include transition();
|
||||
|
||||
&.active {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
|
||||
@include transition();
|
||||
}
|
||||
}
|
||||
|
||||
@ -38,9 +38,9 @@
|
||||
margin: 24vh 0 0 0;
|
||||
float: left;
|
||||
|
||||
.active & {
|
||||
@include transition();
|
||||
@include transition();
|
||||
|
||||
.active & {
|
||||
margin: 25vh 0 0 0;
|
||||
}
|
||||
}
|
||||
@ -65,7 +65,6 @@
|
||||
clear: both;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
//margin: 3px 0 0 20px;
|
||||
}
|
||||
|
||||
.btn-cancel {
|
||||
@ -77,7 +76,9 @@
|
||||
color: darken(#8798ac, 10%);
|
||||
cursor: pointer;
|
||||
|
||||
@include transition();
|
||||
|
||||
&:hover {
|
||||
color: #8798ac;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user