Start of wizard steps. File renaming

This commit is contained in:
Jonathon Wilson 2013-05-16 09:33:04 -06:00
parent 6b9c0402a2
commit 48cf369de5
10 changed files with 88 additions and 41 deletions

View File

@ -100,9 +100,10 @@
}
function initialize() {
events();
var screenBindings = { 'beforeShow': beforeShow, 'afterShow': afterShow };
app.bindScreen('ftue2', screenBindings);
//
//events();
//var screenBindings = { 'beforeShow': beforeShow, 'afterShow': afterShow };
//app.bindScreen('ftue2', screenBindings);
}
// Expose publics

View File

@ -136,7 +136,7 @@
// if (someFTUEflag) { this.showFTUE = false; }
if (app.showFTUE) {
app.layout.showDialog('ftue1');
app.layout.showDialog('ftue');
}
}

View File

@ -437,6 +437,17 @@
return false;
}
function wizardLinkClicked(evt) {
evt.preventDefault();
var $myStep = $(evt.currentTarget).closest('[layout-wizard-step]');
var targetStepId = $(evt.currentTarget).attr("layout-wizard-link");
var selector = '[layout-wizard-step="' + targetStepId + '"]';
var $targetStep = $(selector);
$myStep.hide();
$targetStep.show();
return false;
}
function events() {
$(context).resize(function() {
if (resizing) {
@ -448,6 +459,7 @@
$('[layout-action="close"]').on('click', close);
$('[layout-sidebar-expander]').on('click', toggleSidebar);
$('[layout-panel="expanded"] [layout-panel="header"]').on('click', panelHeaderClicked);
$('[layout-wizard-link]').on('click', wizardLinkClicked);
$('[tab-target]').on('click', tabClicked);
}

View File

@ -5,6 +5,7 @@
/* Jonathon's FTUE overrides */
div.dialog.ftue {
min-width: 750px;
max-width: 750px;
.ftue-inner {

View File

@ -0,0 +1,69 @@
<!-- First time user experience screen 1 -->
<div layout="dialog" layout-id="ftue" class="dialog ftue">
<div class="content-head">
<h1>audio gear setup</h1>
</div>
<!-- inner wrapper -->
<div class="ftue-inner" layout-wizard="ftue">
<!-- First screen of the FTUE wizard -->
<div layout-wizard-step="1" style="display:block;">
<p>
If you already have audio gear to get your instrumental or vocal music
into your computer, please set up your gear and instrument now. Then
click the "NEXT" button below.
</p>
<ul>
<li>For Windows, you'll need ASIO-compatible audio gear.</li>
<li>We strongly recommend using headphones. Speakers will cause feedback problems.</li>
<li>If you are not sure what will work or how to do this, <a href="#">get help here</a>.</li>
<li>If you do not have your audio gear handy, you can click the "REGISTER AS A FAN"
button below. You will be able to listen in on public sessions, but cannot create or
participate in sessions until you complete this audio gear setup at a later time.</li>
</ul>
<div class="right mr30 buttonbar">
<a class="button-grey">REGISTER AS A FAN</a>&nbsp;
<a class="button-orange" layout-wizard-link="2">NEXT</a>
</div>
</div>
<!-- Second screen of the FTUE wizard -->
<div layout-wizard-step="2" style="display:none;">
<p>
This is the second screen. Placeholder for now.
</p>
<div class="right mr30 buttonbar">
<a class="button-grey" layout-wizard-link="1">BACK</a>
<a class="button-grey">REGISTER AS A FAN</a>&nbsp;
<a class="button-orange" layout-wizard-link="3">NEXT</a>
</div>
</div>
<!-- Third screen of the FTUE wizard -->
<div layout-wizard-step="3" style="display:none;">
<p>
This is the third screen. Placeholder for now.
</p>
<div class="right mr30 buttonbar">
<a class="button-grey" layout-wizard-link="2">BACK</a>
<a class="button-grey">REGISTER AS A FAN</a>&nbsp;
<a class="button-orange">DONE</a>
</div>
</div>
</div>
</div>

View File

@ -1,34 +0,0 @@
<!-- First time user experience screen 1 -->
<div layout="dialog" layout-id="ftue1" class="dialog ftue">
<div class="content-head">
<h1>audio gear setup</h1>
</div>
<!-- inner wrapper -->
<div class="ftue-inner">
<p>
If you already have audio gear to get your instrumental or vocal music
into your computer, please set up your gear and instrument now. Then
click the "NEXT" button below.
</p>
<ul>
<li>For Windows, you'll need ASIO-compatible audio gear.</li>
<li>We strongly recommend using headphones. Speakers will cause feedback problems.</li>
<li>If you are not sure what will work or how to do this, <a href="#">get help here</a>.</li>
<li>If you do not have your audio gear handy, you can click the "REGISTER AS A FAN"
button below. You will be able to listen in on public sessions, but cannot create or
participate in sessions until you complete this audio gear setup at a later time.</li>
</ul>
<div class="right mr30 buttonbar">
<a class="button-grey">REGISTER AS A FAN</a>&nbsp;
<a class="button-orange">NEXT</a>
</div>
</div>
</div>

View File

@ -10,9 +10,7 @@
<%= render "header" %>
<%= render "home" %>
<%= render "searchResults" %>
<%= render "ftue1" %>
<%= render "ftue2" %>
<%= render "ftue3" %>
<%= render "ftue" %>
<%= render "sidebar" %>
<%= render "createSession" %>
<%= render "findSession" %>