Introduce basic welcome tutorial flow

This commit is contained in:
Johannes Zellner
2016-05-06 13:06:12 +02:00
parent d50fa70f47
commit bf99475dbd
3 changed files with 106 additions and 0 deletions

View File

@@ -58,6 +58,54 @@
<body>
<!-- Welcome logic -->
<div class="welcome" ng-show="welcomeSteps[welcomeStep]">
<div class="dialog" ng-show="welcomeSteps[welcomeStep].title === 'intro'">
<h2>Welcome</h2>
<p>This page is the configuration interface to your Cloudron.</p>
<br/>
<button class="btn btn-success pull-right" ng-click="nextWelcomeStep();">Next</button>
</div>
<div class="dialog" ng-show="welcomeSteps[welcomeStep].title === 'apps'">
<h2>Applications</h2>
<p>In this screen you see all applications installed on your Cloudron.</p>
<p>Use your mouse to hover over an app icon and you will be able to configure or uninstall it.</p>
<br/>
<button class="btn btn-default pull-left" ng-click="prevWelcomeStep();">Back</button>
<button class="btn btn-success pull-right" ng-click="nextWelcomeStep();">Next: <b>Cloudron Store</b></button>
</div>
<div class="dialog" ng-show="welcomeSteps[welcomeStep].title === 'appstore'">
<h2>Cloudron Store</h2>
<p>Applications can be installed from this screen onto you Cloudron.</p>
<p>Each app is installed on its own subdomain.</p>
<p>Access control may be applied to each application individually.</p>
<br/>
<button class="btn btn-default pull-left" ng-click="prevWelcomeStep();">Back</button>
<button class="btn btn-success pull-right" ng-click="nextWelcomeStep();">Next: <b>Users and Groups</b></button>
</div>
<div class="dialog" ng-show="welcomeSteps[welcomeStep].title === 'users'">
<h2>Users and Groups</h2>
<p>The Cloudron comes with a built-in user and group managment.</p>
<p>Most apps are single sign-on integrated.</p>
<p>Just use your Cloudron account to log into them.</p>
<br/>
<button class="btn btn-default pull-left" ng-click="prevWelcomeStep();">Back</button>
<button class="btn btn-success pull-right" ng-click="nextWelcomeStep();">Got it</button>
</div>
<div class="dialog" ng-show="welcomeSteps[welcomeStep].title === 'finish'">
<h2>That's it!</h2>
<p>This interface will always be available for you at this domain.</p>
<p>You might want to bookmark this page so you can find it later again.</p>
<br/>
<button class="btn btn-default pull-left" ng-click="prevWelcomeStep();">Back</button>
<button class="btn btn-success pull-right" ng-click="nextWelcomeStep();">Start using apps and invite users</button>
</div>
</div>
<!-- Modal update -->
<div class="modal fade" id="updateModal" tabindex="-1" role="dialog" aria-labelledby="updateModalLabel" aria-hidden="true">
<div class="modal-dialog">