Added basic onboarding steps

rpg-docs/client/views/character/newUserStepper/newUserStepper.css

@@ -0,0 +1,12 @@
+.newUserStepper {
+	height: 300px !important;
+}
+
+.newUserStepper paper-step .invalid-step-message {
+	color: #d13b2e;
+	visibility: hidden;
+}
+
+.newUserStepper paper-step[invalid] .invalid-step-message {
+	visibility: visible;
+}

rpg-docs/client/views/character/newUserStepper/newUserStepper.html

@@ -0,0 +1,26 @@
+<template name="newUserStepper">
+	<paper-stepper linear selected="0" class="newUserStepper">
+		<paper-step id="step0" label="Add a feature">
+			<p>
+				To get started, add a feature
+			</p>
+		</paper-step>
+		<paper-step id="step1" label="Add an effect">
+			<p>
+				Add a racial effect to set your speed
+			</p>
+		</paper-step>
+		<paper-step id="step2" label="See the effect in action">
+			<p>
+				View your speed stat
+			</p>
+		</paper-step>
+		<paper-step id="step3" label="Finish">
+			If you get stuck, be sure to check out the guide, or ask for help using the feedback form.
+		</paper-step>
+	</paper-stepper>
+</template>
+
+<template name="newUserStepperPlaceholder">
+	<div style="height: 300px"></div>
+</template>

rpg-docs/client/views/character/newUserStepper/newUserStepper.js

@@ -0,0 +1,41 @@
+Template.newUserStepper.onRendered(function(){
+	let stepper = this.find("paper-stepper");
+	this.autorun((c) => {
+		var step = Session.get("newUserExperienceStep");
+		var hasFeatures = Features.find({charId: this.data._id}).count() > 1
+		if (step === 0 && hasFeatures){
+			stepper.continue();
+			c.stop();
+		}
+	});
+	this.autorun((c) => {
+		var step = Session.get("newUserExperienceStep");
+		var hasEffect = !!Effects.find({
+			charId: this.data._id,
+			stat: "speed",
+		}).count();
+		if (step === 1 && hasEffect){
+			stepper.continue();
+			c.stop();
+		}
+	});
+	this.autorun((c) => {
+		var step = Session.get("newUserExperienceStep");
+		if (step === 2 && Session.get("viewedSpeed")){
+			stepper.continue();
+			c.stop();
+		}
+	});
+});
+
+Template.newUserStepper.events({
+	"paper-stepper-progressed paper-stepper": function(event, template){
+		const step = template.find("paper-stepper").selected;
+		Session.set("newUserExperienceStep", step);
+	},
+	"paper-stepper-completed paper-stepper": function(event, template){
+		Session.set("newUserExperienceStep", undefined);
+		Session.set("showNewUserExperience", undefined);
+		Characters.update(this._id, {$unset: {"settings.newUserExperience": 1}});
+	},
+});