Added character creation dialog

app/imports/ui/dialogStack/DialogBase.vue

@@ -1,13 +1,39 @@
 <template>
   <v-card>
-    <v-toolbar color="primary" dark>
-      <slot name="toolbar"></slot>
-    </v-toolbar>
-    <v-layout>
-      <slot></slot>
-    </v-layout>
-    <v-card-actions>
-      <slot name="actions"></slot>
-    </v-card-actions>
+		<v-layout column style="height: 100%;">
+	    <v-toolbar color="primary" dark class="base-dialog-toolbar" :flat="!offsetTop">
+	      <slot name="toolbar"></slot>
+	    </v-toolbar>
+			<div id="base-dialog-body" v-scroll:#base-dialog-body="onScroll">
+				<slot></slot>
+			</div>
+			<v-card-actions>
+				<slot name="actions"></slot>
+			</v-card-actions>
+		</v-layout>
   </v-card>
 </template>
+
+<script>
+	export default {
+		data(){ return {
+			offsetTop: 0,
+		}},
+		methods: {
+			onScroll(e){
+				this.offsetTop = e.target.scrollTop
+			},
+		},
+	}
+</script>
+
+<style scoped>
+	.base-dialog-toolbar {
+		z-index: 1;
+		border-radius: 2px 2px 0 0;
+	}
+	#base-dialog-body {
+		flex-grow: 1;
+		overflow: auto;
+	}
+</style>

app/imports/ui/dialogStack/DialogStack.vue

@@ -12,7 +12,7 @@
         class="dialog"
         :style="getDialogStyle(index)"
       >
-        <component :is="dialog.component" :data="dialog.data"></component>
+        <component :is="dialog.component" :data="dialog.data" @pop="popDialogStack($event)"></component>
       </div>
     </transition-group>
   </v-layout>
@@ -32,8 +32,8 @@
       },
     },
     methods: {
-      popDialogStack(){
-        store.dispatch("popDialogStack");
+      popDialogStack(result){
+        store.dispatch("popDialogStack", result);
       },
       backdropClicked(event){
         if (event.target === event.currentTarget) this.popDialogStack();
@@ -61,8 +61,8 @@
   }
   .dialog-sizer {
     position: relative;
-    height: 500px;
-    width: 500px;
+    height: 600px;
+    width: 600px;
     z-index: 5;
     flex: initial;
   }

app/imports/ui/dialogStack/dialogStackStore.js

@@ -8,6 +8,7 @@ dialogStack.dialogs = [];
 const dialogStackStore = {
   state: {
     dialogs: [],
+    currentResult: null,
   },
   mutations: {
     pushDialogStack(state, {component, data, element, returnElement, callback}){
@@ -24,15 +25,18 @@ const dialogStackStore = {
       updateHistory();
     },
     popDialogStackMutation (state, result){
+      console.log({popped: result});
       const dialog = state.dialogs.pop();
+      state.currentResult = null;
       updateHistory();
       if (!dialog) return;
-      dialog.callback && dialog.callback(result);
+      if (dialog.callback) dialog.callback(result);
     },
   },
   actions: {
     popDialogStack(context, result){
       if (history && history.state && history.state.openDialogs){
+        context.state.currentResult = result;
         history.back();
       } else {
         context.commit("popDialogStackMutation", result)

app/imports/ui/dialogStack/dialogStackWindowEvents.js

@@ -5,7 +5,7 @@ if (window){
     let state = event.state;
     let numDialogs = store.state.dialogStack.dialogs.length;
     if (_.isFinite(state.openDialogs) && numDialogs > state.openDialogs){
-      store.commit("popDialogStackMutation");
+      store.commit("popDialogStackMutation", store.state.dialogStack.currentResult);
     }
   };
 }