Skip to content

Commit

Permalink
Wizard to theme
Browse files Browse the repository at this point in the history
  • Loading branch information
smartapant committed Jan 11, 2016
1 parent bfd1084 commit 14e0373
Show file tree
Hide file tree
Showing 11 changed files with 260 additions and 243 deletions.
2 changes: 1 addition & 1 deletion src/app/pages/form/form.module.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
.state('form-wizard',
{
url: '/form-wizard',
templateUrl: 'app/pages/form/wizard/wizardPage.html',
templateUrl: 'app/pages/form/wizard/wizard.html',
controller: 'WizardCtrl',
controllerAs: 'vm'
})
Expand Down
8 changes: 4 additions & 4 deletions src/app/pages/form/inputs/widgets/select/select.html
Original file line number Diff line number Diff line change
@@ -1,29 +1,29 @@
<div class="form-group">
<select class="form-control" title="Standard Select" selectpicker>
<select class="form-control selectpicker" title="Standard Select" selectpicker>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<option>Option 4</option>
</select>
</div>
<div class="form-group">
<select class="form-control" data-live-search="true" title="Select With Search" selectpicker>
<select class="form-control selectpicker" data-live-search="true" title="Select With Search" selectpicker>
<option>Hot Dog, Fries and a Soda</option>
<option>Burger, Shake and a Smile</option>
<option>Sugar, Spice and all things nice</option>
<option>Baby Back Ribs</option>
</select>
</div>
<div class="form-group">
<select class="form-control" title="Option Types" selectpicker>
<select class="form-control selectpicker" title="Option Types" selectpicker>
<option>Standard option</option>
<option data-subtext="option subtext">Option with subtext</option>
<option disabled>Disabled Option</option>
<option data-icon="glyphicon-heart">Option with cion</option>
</select>
</div>
<div class="form-group">
<select class="form-control" disabled title="Disabled Select" selectpicker>
<select class="form-control selectpicker" disabled title="Disabled Select" selectpicker>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
Expand Down
121 changes: 102 additions & 19 deletions src/app/pages/form/wizard/wizard.html
Original file line number Diff line number Diff line change
@@ -1,23 +1,106 @@
<div class="wizard">
<div class="wizard-navigation-container">
<div ng-repeat="t in $baWizardController.tabs" class="wizard-navigation {{$baWizardController.tabNum == $index ? 'active' : ''}}" ng-click="$baWizardController.selectTab($index)">
{{t.title}}
</div>
</div>
<div class="widgets">


<div class="progress progress-wizard">
<div class="progress-bar progress-bar-info active" role="progressbar"
aria-valuemin="0" aria-valuemax="100" ng-style="{width: $baWizardController.progress + '%'}">
<div class="row">
<div class="col-md-12">
<div ba-panel ba-panel-title="Form Wizard" ba-panel-class="with-scroll">
<ba-wizard>
<ba-wizard-step title="Personal info" form="vm.personalInfoForm">
<form name="vm.personalInfoForm" novalidate>
<div class="row">
<div class="col-md-6">
<div class="form-group has-feedback"
ng-class="{'has-error': vm.personalInfoForm.username.$invalid && (vm.personalInfoForm.username.$dirty || vm.personalInfoForm.$submitted)}">
<label for="exampleUsername1">Username</label>
<input type="text" class="form-control" id="exampleUsername1" name="username" placeholder="Username" ng-model="vm.personalInfo.username" required>
<span class="help-block error-block basic-block">Required</span>
</div>
<div class="form-group" ng-class="{'has-error': vm.personalInfoForm.email.$invalid && (vm.personalInfoForm.email.$dirty || vm.personalInfoForm.$submitted)}">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" id="exampleInputEmail1" name="email" placeholder="Email" ng-model="vm.personalInfo.email" required>
<span class="help-block error-block basic-block">Proper email required</span>
</div>
</div>
<div class="col-md-6">
<div class="form-group" ng-class="{'has-error': vm.personalInfoForm.password.$invalid && (vm.personalInfoForm.password.$dirty || vm.personalInfoForm.$submitted)}">
<label for="exampleInputPassword1">Password</label>
<input type="password" class="form-control" id="exampleInputPassword1" name="password" placeholder="Password" ng-model="vm.personalInfo.password" required>
<span class="help-block error-block basic-block">Required</span>
</div>
<div class="form-group" ng-class="{'has-error': !vm.arePersonalInfoPasswordsEqual() && (vm.personalInfoForm.confirmPassword.$dirty || vm.personalInfoForm.$submitted)}">
<label for="exampleInputConfirmPassword1">Confirm Password</label>
<input type="password" class="form-control" id="exampleInputConfirmPassword1" name="confirmPassword" placeholder="Confirm Password" ng-model="vm.personalInfo.confirmPassword" required>
<span class="help-block error-block basic-block">Passwords should match</span>
</div>
</div>
</div>
</form>
</ba-wizard-step>
<ba-wizard-step title="Product Info" form="vm.productInfoForm">
<form name="vm.productInfoForm" novalidate>
<div class="row">
<div class="col-md-6">
<div class="form-group has-feedback"
ng-class="{'has-error': vm.productInfoForm.productName.$invalid && (vm.productInfoForm.productName.$dirty || vm.productInfoForm.$submitted)}">
<label for="productName">Product name</label>
<input type="text" class="form-control" id="productName" name="productName" placeholder="Product name" ng-model="vm.productInfo.productName" required>
<span class="help-block error-block basic-block">Required</span>
</div>
<div class="form-group" ng-class="{'has-error': vm.productInfoForm.productId.$invalid && (vm.productInfoForm.productId.$dirty || vm.productInfoForm.$submitted)}">
<label for="productId">Product id</label>
<input type="text" class="form-control" id="productId" name="productId" placeholder="productId" ng-model="vm.productInfo.productId" required>
<span class="help-block error-block basic-block">Required</span>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="productName">Category</label>
<select class="form-control" title="Category" selectpicker>
<option selected>Electronics</option>
<option>Toys</option>
<option>Accessories</option>
</select>
</div>
</div>
</div>
</form>
</ba-wizard-step>
<ba-wizard-step title="Shipment" form="vm.addressForm">
<form name="vm.addressForm" novalidate>
<div class="row">
<div class="col-md-6">
<div class="form-group has-feedback"
ng-class="{'has-error': vm.addressForm.address.$invalid && (vm.addressForm.address.$dirty || vm.addressForm.$submitted)}">
<label for="productName">Shipment address</label>
<input type="text" class="form-control" id="address" name="address" placeholder="Shipment address" ng-model="vm.shipment.address" required>
<span class="help-block error-block basic-block">Required</span>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="productName">Shipment method</label>
<select class="form-control" title="Category" selectpicker>
<option selected>Fast & expensive</option>
<option>Cheap & free</option>
</select>
</div>
</div>
</div>
<div class="checkbox">
<label class="custom-checkbox">
<input type="checkbox">
<span>Save shipment info</span>
</label>
</div>
</form>
</ba-wizard-step>
<ba-wizard-step title="Finish">
<form class="form-horizontal" name="vm.finishForm" novalidate>
Congratulations! You have successfully filled the form!
</form>
</ba-wizard-step>
</ba-wizard>
</div>
</div>
</div>

<div class="steps" ng-transclude></div>

<nav>
<ul class="pager wizard-pager">
<li class="previous"><button ng-disabled="$baWizardController.isFirstTab()" ng-click="$baWizardController.previousTab()" type="button" class=" btn btn-primary"><span aria-hidden="true">&larr;</span> previous</button></li>
<li class="next"> <button ng-disabled="$baWizardController.isLastTab()" ng-click="$baWizardController.nextTab()" type="button" class="btn btn-primary">next <span aria-hidden="true">&rarr;</span></button></li>
</ul>
</nav>
</div>
</div>
106 changes: 0 additions & 106 deletions src/app/pages/form/wizard/wizardPage.html

This file was deleted.

Loading

0 comments on commit 14e0373

Please sign in to comment.