hook up pause menu to event, use mixins for pause menu

This commit is contained in:
Kevin Ngo
2018-10-03 18:06:03 -07:00
parent 06b699847b
commit 8212888de0
2 changed files with 25 additions and 23 deletions

View File

@@ -110,7 +110,7 @@ AFRAME.registerState({
},
pausegame: (state) => {
state.menu.active = true;
state.isPaused = true;
},
/**

View File

@@ -1,25 +1,27 @@
<a-mixin
id="dialogButton"
mixin="slice"
bind-toggle__raycastable="isPaused"
animation__mouseenter="property: components.slice9.material.color; type: color; from: #050505; to: #067197; startEvents: mouseenter; pauseEvents: mouseleave; dur: 150"
animation__mouseleave="property: components.slice9.material.color; type: color; from: #067197; to: #050505; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150"
slice9="width: 1; height: 0.27; padding: 0.04"></a-mixin>
<a-mixin
id="dialogButtonText"
mixin="font"
position="0 -0.070 0.01"
text="align: center; wrapCount: 17; color: #AAA"></a-mixin>
<a-entity id="pauseDialog" position="0 1.6 -2" bind__visible="isPaused">
<a-entity position="0 0.35 0"
bind-toggle__raycastable="isPaused"
animation__mouseenter="property: components.slice9.material.color; type: color; from: #050505; to: #067197; startEvents: mouseenter; pauseEvents: mouseleave; dur: 150"
animation__mouseleave="property: components.slice9.material.color; type: color; from: #067197; to: #050505; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150"
mixin="slice" slice9="width: 1; height: 0.27; padding: 0.04">
<a-entity mixin="font" text="align: center; wrapCount: 17; value: CONTINUE; color: #AAA" position="0 -0.070 0.01"></a-entity>
</a-entity>
<a-entity
bind-toggle__raycastable="isPaused"
animation__mouseenter="property: components.slice9.material.color; type: color; from: #050505; to: #067197; startEvents: mouseenter; pauseEvents: mouseleave; dur: 150"
animation__mouseleave="property: components.slice9.material.color; type: color; from: #067197; to: #050505; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150"
mixin="slice" slice9="width: 1; height: 0.27; padding: 0.04">
<a-entity mixin="font" text="align: center; wrapCount: 17; value: RESTART SONG; color: #AAA" position="0 -0.070 0.01"></a-entity>
</a-entity>
<a-entity id="continueButton" mixin="dialogButton" position="0 0.35 0">
<a-entity mixin="dialogButtonText" text="value: CONTINUE" position="0 -0.070 0.01"></a-entity>
</a-entity>
<a-entity position="0 -0.35 0"
bind-toggle__raycastable="isPaused"
animation__mouseenter="property: components.slice9.material.color; type: color; from: #050505; to: #067197; startEvents: mouseenter; pauseEvents: mouseleave; dur: 150"
animation__mouseleave="property: components.slice9.material.color; type: color; from: #067197; to: #050505; startEvents: mouseleave; pauseEvents: mouseenter; dur: 150"
mixin="slice" slice9="width: 1; height: 0.27; padding: 0.04">
<a-entity mixin="font" text="align: center; wrapCount: 17; value: EXIT TO MENU; color: #AAA" position="0 -0.070 0.01"></a-entity>
</a-entity>
<a-entity id="restartButton" mixin="dialogButton">
<a-entity mixin="dialogButtonText" text="value: RESTART SONG"></a-entity>
</a-entity>
</a-entity>
<a-entity id="exitButton" mixin="dialogButton" position="0 -0.35 0">
<a-entity mixin="dialogButtonText" text="value: EXIT TO MENU" position="0 -0.070 0.01"></a-entity>
</a-entity>
</a-entity>