<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container-fluid">
<div class="row">
<div class="col-lg-offset-3 col-lg-6">
<div id="theForm" class="theForm">
<label for="validate-length">Patient's Encounter ID*</label>
<div class="form-group form-inline" id="divBid">
<div class="input-group" data-validate="length" data-length="6" id="divBidInputGroup">
<input type="text" class="form-control" name="validate-length" id="inputBid" placeholder="Enter Patient's Encounter ID" style="width: 300px;" required>
<span class="input-group-btn" id="spnBid">
<button class="btn btn-primary ladda-button" data-style="zoom-in" id="btnSearch"><i id="iSearch" class="glyphicon glyphicon-search"></i></button>
</span>
</div>
</div>
<label for="validate-text">Patient's Medical Record #*</label>
<div class="form-group form-inline auto-populate">
<input type="text" class="form-control" name="validate-text" id="inputMrn" placeholder="Enter Number" required>
<!-- <span class="input-group-addon danger"><span class="glyphicon glyphicon-remove"></span></span> -->
</div>
<label for="validate-optional">Patient's Name</label>
<div class="form-group form-inline">
<div class="form-group auto-populate">
<input type="text" class="form-control" name="validate-text" id="inputFirst" placeholder="FIRST" required>
</div>
<div class="form-group auto-populate">
<input type="text" class="form-control" name="validate-text" id="inputMiddle" placeholder="M" required>
</div>
<div class="form-group auto-populate">
<input type="text" class="form-control" name="validate-text" id="inputLast" placeholder="LAST" required>
</div>
</div>
<label for="validate-email">Patient's Date of Birth*</label>
<div class="form-group form-inline auto-populate">
<!--<div class="input-group" data-validate="length" data-length="10">-->
<input type="text" class="form-control" name="validate-length" id="inputDob" placeholder="MM/DD/YYYY" required>
<!-- <span class="input-group-addon danger"><span class="glyphicon glyphicon-remove"></span></span> -->
<!--</div>-->
</div>
<label for="validate-gender">Patient's Gender</label>
<div class="form-group">
<div class="input-group" data-validate="gender" id="inputGender">
<div class="radio auto-populate">
<label>
<input type="radio" name="gender" id="option1" value="option1"> Male
</label>
</div>
<div class="radio auto-populate">
<label>
<input type="radio" name="gender" id="option2" value="option2"> Female
</label>
</div>
<div class="radio auto-populate">
<label>
<input type="radio" name="gender" id="option3" value="option3"> Unknown
</label>
</div>
</div>
</div>
<label for="validate-ethnicity">Is the patient's ethnicity Hispanic or Latino? CHECK ONE:*</label>
<div class="form-group">
<div class="input-group" data-validate="ethnicity" id="inputEthnicity">
<div class="radio auto-populate">
<label>
<input type="radio" name="ethnicity" id="option1" value="option1">
Hispanic or Latino
</label>
</div>
<div class="radio auto-populate">
<label>
<input type="radio" name="ethnicity" id="option2" value="option2">
Not Hispanic or Latino
</label>
</div>
<div class="radio auto-populate">
<label>
<input type="radio" name="ethnicity" id="option3" value="option3">
Unknown
</label>
</div>
</div>
</div>
<label for="validate-ethnicity">What is the patient's race'? CHECK ONE:*</label>
<div class="form-group">
<div class="input-group" data-validate="race" id="inputRace">
<div class="radio auto-populate">
<label>
<input type="radio" name="race" id="option1" value="option1">
American Indian or Alaska Native
</label>
</div>
<div class="radio auto-populate">
<label>
<input type="radio" name="race" id="option2" value="option2">
Asian
</label>
</div>
<div class="radio auto-populate">
<label>
<input type="radio" name="race" id="option3" value="option3">
Black or African American
</label>
</div>
<div class="radio auto-populate">
<label>
<input type="radio" name="race" id="option4" value="option4">
Native Hawaiian or Other Pacific Islander
</label>
</div>
<div class="radio auto-populate">
<label>
<input type="radio" name="race" id="option5" value="option5">
White
</label>
</div>
<div class="radio auto-populate">
<label>
<input type="radio" name="race" id="option6" value="option6">
More than one race
</label>
</div>
<div class="radio auto-populate">
<label>
<input type="radio" name="race" id="option7" value="option7">
Unknown
</label>
</div>
</div>
</div>
<div class="form-group">
<button type="submit" class="btn btn-danger col-lg-2" disabled><<< BACK</button>
<button type="submit" class="btn btn-danger col-lg-2 col-lg-offset-8" disabled>NEXT >>></button>
</div>
</div>
</div>
</div>
<div class="message-item col-xs-3 sr-only" id="miAlert">
<div class="message-inner alert alert-default sr-only">
<button type="button" class="close" aria-label="Close" data-hide="alert"><span aria-hidden="true">×</span></button>
<button class="btn btn-xs btn-primary message-action pull-right"></button>
<p class="message"></p>
</div>
</div>
</div>
/*
.input-group-addon.primary {
color: rgb(255, 255, 255);
background-color: rgb(50, 118, 177);
border-color: rgb(40, 94, 142);
}
.input-group-addon.success {
color: rgb(255, 255, 255);
background-color: rgb(92, 184, 92);
border-color: rgb(76, 174, 76);
}
.input-group-addon.info {
color: rgb(255, 255, 255);
background-color: rgb(57, 179, 215);
border-color: rgb(38, 154, 188);
}
.input-group-addon.warning {
color: rgb(255, 255, 255);
background-color: rgb(240, 173, 78);
border-color: rgb(238, 162, 54);
}
.input-group-addon.danger {
color: rgb(255, 255, 255);
background-color: rgb(217, 83, 79);
border-color: rgb(212, 63, 58);
}
.input-same-line {
float: left;
}
*/
/* CSS label from http://bootsnipp.com/snippets/featured/buttons-with-labels */
/*
.btn-label {position: relative;left: -12px;display: inline-block;padding: 6px 12px;background: rgba(0,0,0,0.15);border-radius: 3px 0 0 3px;}
.btn-labeled {padding-top: 0;padding-bottom: 0;}
.btn { margin-bottom:2px; }
.btn-block {text-align:left;}
*/
/*
.btn span.glyphicon {
opacity: 0;
}
.btn.active span.glyphicon {
opacity: 1;
}
*/
/*
.btn-group .dropdown-menu a{
color:#fff;
}
.btn-group-success .dropdown-menu {
background-color: #51b351 !important;
}
.btn-group-success .dropdown-menu li > a:hover,
.btn-group-success .dropdown-menu li > a:focus {
background-color: #5cb85c !important;
}
*/
/* ladda.min.css */
/*
* Ladda
* http://lab.hakim.se/ladda
* MIT licensed
*
* Copyright (C) 2013 Hakim El Hattab, http://hakim.se
*/.ladda-button{position:relative}.ladda-button .ladda-spinner{position:absolute;z-index:2;display:inline-block;width:32px;height:32px;top:50%;margin-top:-16px;opacity:0;pointer-events:none}.ladda-button .ladda-label{position:relative;z-index:3}.ladda-button .ladda-progress{position:absolute;width:0;height:100%;left:0;top:0;background:rgba(0,0,0,0.2);visibility:hidden;opacity:0;-webkit-transition:0.1s linear all !important;-moz-transition:0.1s linear all !important;-ms-transition:0.1s linear all !important;-o-transition:0.1s linear all !important;transition:0.1s linear all !important}.ladda-button[data-loading] .ladda-progress{opacity:1;visibility:visible}.ladda-button,.ladda-button .ladda-spinner,.ladda-button .ladda-label{-webkit-transition:0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;-moz-transition:0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;-ms-transition:0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;-o-transition:0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;transition:0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important}.ladda-button[data-style=zoom-in],.ladda-button[data-style=zoom-in] .ladda-spinner,.ladda-button[data-style=zoom-in] .ladda-label,.ladda-button[data-style=zoom-out],.ladda-button[data-style=zoom-out] .ladda-spinner,.ladda-button[data-style=zoom-out] .ladda-label{-webkit-transition:0.3s ease all !important;-moz-transition:0.3s ease all !important;-ms-transition:0.3s ease all !important;-o-transition:0.3s ease all !important;transition:0.3s ease all !important}.ladda-button[data-style=expand-right] .ladda-spinner{right:14px}.ladda-button[data-style=expand-right][data-size="s"] .ladda-spinner,.ladda-button[data-style=expand-right][data-size="xs"] .ladda-spinner{right:4px}.ladda-button[data-style=expand-right][data-loading]{padding-right:56px}.ladda-button[data-style=expand-right][data-loading] .ladda-spinner{opacity:1}.ladda-button[data-style=expand-right][data-loading][data-size="s"],.ladda-button[data-style=expand-right][data-loading][data-size="xs"]{padding-right:40px}.ladda-button[data-style=expand-left] .ladda-spinner{left:14px}.ladda-button[data-style=expand-left][data-size="s"] .ladda-spinner,.ladda-button[data-style=expand-left][data-size="xs"] .ladda-spinner{left:4px}.ladda-button[data-style=expand-left][data-loading]{padding-left:56px}.ladda-button[data-style=expand-left][data-loading] .ladda-spinner{opacity:1}.ladda-button[data-style=expand-left][data-loading][data-size="s"],.ladda-button[data-style=expand-left][data-loading][data-size="xs"]{padding-left:40px}.ladda-button[data-style=expand-up]{overflow:hidden}.ladda-button[data-style=expand-up] .ladda-spinner{top:-32px;left:50%;margin-left:-16px}.ladda-button[data-style=expand-up][data-loading]{padding-top:54px}.ladda-button[data-style=expand-up][data-loading] .ladda-spinner{opacity:1;top:14px;margin-top:0}.ladda-button[data-style=expand-up][data-loading][data-size="s"],.ladda-button[data-style=expand-up][data-loading][data-size="xs"]{padding-top:32px}.ladda-button[data-style=expand-up][data-loading][data-size="s"] .ladda-spinner,.ladda-button[data-style=expand-up][data-loading][data-size="xs"] .ladda-spinner{top:4px}.ladda-button[data-style=expand-down]{overflow:hidden}.ladda-button[data-style=expand-down] .ladda-spinner{top:62px;left:50%;margin-left:-16px}.ladda-button[data-style=expand-down][data-size="s"] .ladda-spinner,.ladda-button[data-style=expand-down][data-size="xs"] .ladda-spinner{top:40px}.ladda-button[data-style=expand-down][data-loading]{padding-bottom:54px}.ladda-button[data-style=expand-down][data-loading] .ladda-spinner{opacity:1}.ladda-button[data-style=expand-down][data-loading][data-size="s"],.ladda-button[data-style=expand-down][data-loading][data-size="xs"]{padding-bottom:32px}.ladda-button[data-style=slide-left]{overflow:hidden}.ladda-button[data-style=slide-left] .ladda-label{position:relative}.ladda-button[data-style=slide-left] .ladda-spinner{left:100%;margin-left:-16px}.ladda-button[data-style=slide-left][data-loading] .ladda-label{opacity:0;left:-100%}.ladda-button[data-style=slide-left][data-loading] .ladda-spinner{opacity:1;left:50%}.ladda-button[data-style=slide-right]{overflow:hidden}.ladda-button[data-style=slide-right] .ladda-label{position:relative}.ladda-button[data-style=slide-right] .ladda-spinner{right:100%;margin-left:-16px}.ladda-button[data-style=slide-right][data-loading] .ladda-label{opacity:0;left:100%}.ladda-button[data-style=slide-right][data-loading] .ladda-spinner{opacity:1;left:50%}.ladda-button[data-style=slide-up]{overflow:hidden}.ladda-button[data-style=slide-up] .ladda-label{position:relative}.ladda-button[data-style=slide-up] .ladda-spinner{left:50%;margin-left:-16px;margin-top:1em}.ladda-button[data-style=slide-up][data-loading] .ladda-label{opacity:0;top:-1em}.ladda-button[data-style=slide-up][data-loading] .ladda-spinner{opacity:1;margin-top:-16px}.ladda-button[data-style=slide-down]{overflow:hidden}.ladda-button[data-style=slide-down] .ladda-label{position:relative}.ladda-button[data-style=slide-down] .ladda-spinner{left:50%;margin-left:-16px;margin-top:-2em}.ladda-button[data-style=slide-down][data-loading] .ladda-label{opacity:0;top:1em}.ladda-button[data-style=slide-down][data-loading] .ladda-spinner{opacity:1;margin-top:-16px}.ladda-button[data-style=zoom-out]{overflow:hidden}.ladda-button[data-style=zoom-out] .ladda-spinner{left:50%;margin-left:-16px;-webkit-transform:scale(2.5);-moz-transform:scale(2.5);-ms-transform:scale(2.5);-o-transform:scale(2.5);transform:scale(2.5)}.ladda-button[data-style=zoom-out] .ladda-label{position:relative;display:inline-block}.ladda-button[data-style=zoom-out][data-loading] .ladda-label{opacity:0;-webkit-transform:scale(0.5);-moz-transform:scale(0.5);-ms-transform:scale(0.5);-o-transform:scale(0.5);transform:scale(0.5)}.ladda-button[data-style=zoom-out][data-loading] .ladda-spinner{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}.ladda-button[data-style=zoom-in]{overflow:hidden}.ladda-button[data-style=zoom-in] .ladda-spinner{left:50%;margin-left:-16px;-webkit-transform:scale(0.2);-moz-transform:scale(0.2);-ms-transform:scale(0.2);-o-transform:scale(0.2);transform:scale(0.2)}.ladda-button[data-style=zoom-in] .ladda-label{position:relative;display:inline-block}.ladda-button[data-style=zoom-in][data-loading] .ladda-label{opacity:0;-webkit-transform:scale(2.2);-moz-transform:scale(2.2);-ms-transform:scale(2.2);-o-transform:scale(2.2);transform:scale(2.2)}.ladda-button[data-style=zoom-in][data-loading] .ladda-spinner{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none}.ladda-button[data-style=contract]{overflow:hidden;width:100px}.ladda-button[data-style=contract] .ladda-spinner{left:50%;margin-left:-16px}.ladda-button[data-style=contract][data-loading]{border-radius:50%;width:52px}.ladda-button[data-style=contract][data-loading] .ladda-label{opacity:0}.ladda-button[data-style=contract][data-loading] .ladda-spinner{opacity:1}.ladda-button[data-style=contract-overlay]{overflow:hidden;width:100px;box-shadow:0px 0px 0px 3000px rgba(0,0,0,0)}.ladda-button[data-style=contract-overlay] .ladda-spinner{left:50%;margin-left:-16px}.ladda-button[data-style=contract-overlay][data-loading]{border-radius:50%;width:52px;box-shadow:0px 0px 0px 3000px rgba(0,0,0,0.8)}.ladda-button[data-style=contract-overlay][data-loading] .ladda-label{opacity:0}.ladda-button[data-style=contract-overlay][data-loading] .ladda-spinner{opacity:1}
/* --------------------------------- Message item --------------------------------- */
/* General */
.message-item {
margin-bottom: 25px;
margin-left: 40px;
position: relative;
}
/* ----------------------- Custom ----------------------- */
/* Success */
.message-item .alert-success {
border-color: #5cb85c;
}
/* Info */
.message-item .alert-info {
border-color: #5bc0de;
}
/* Warning */
.message-item .alert-warning {
border-color: #f0ad4e;
}
/* Danger */
.message-item .alert-danger {
border-color: #d9534f;
}
/* Default */
.message-item .alert-default {
border-color: #337ab7;
}
/* --------------------------------- Message interior --------------------------------- */
.message-item .message-inner {
border-width: 1px;
border-style: solid;
border-radius: 3px;
padding: 6px;
position: relative;
}
/* --------------------------------- Direction pointers --------------------------------- */
/* General */
.message-item .message-inner:before {
border-style: solid;
border-width: 10px;
color: rgba(0,0,0,0);
content: "";
display: block;
height: 0;
position: absolute;
left: -20px;
top: 6px;
width: 0;
}
.message-item .message-inner:after {
border-style: solid;
border-width: 10px;
color: rgba(0,0,0,0);
content: "";
display: block;
height: 0;
position: absolute;
left: -18px;
top: 6px;
width: 0;
}
/* ----------------------- Custom ----------------------- */
/* Success */
.message-item .message-inner.alert-success:before {
border-right: 10px solid #5cb85c;
}
.message-item .message-inner.alert-success:after {
border-right: 10px solid #DFF0D8;
}
/* Info */
.message-item .message-inner.alert-info:before {
border-right: 10px solid #5bc0de;
}
.message-item .message-inner.alert-info:after {
border-right: 10px solid #D9EDF7;
}
/* Warning */
.message-item .message-inner.alert-warning:before {
border-right: 10px solid #f0ad4e;
}
.message-item .message-inner.alert-warning:after {
border-right: 10px solid #FCF8E3;
}
/* Danger */
.message-item .message-inner.alert-danger:before {
border-right: 10px solid #d9534f;
}
.message-item .message-inner.alert-danger:after {
border-right: 10px solid #F2DEDE;
}
/* Default */
.message-item .message-inner.alert-default:before {
border-right: 10px solid #337ab7;
}
.message-item .message-inner.alert-default:after {
border-right: 10px solid #fff;
}
.message-item .message-inner .close {
padding-left: 5px;
}
$(document).ready(function() {
$('.input-group input[required], .input-group textarea[required], .input-group select[required]').on('keyup change', function() {
var $form = $(this).closest('.theForm'),
$group = $(this).closest('.input-group'),
$addon = $group.find('.input-group-addon'),
$icon = $addon.find('span'),
state = false;
if (!$group.data('validate')) {
state = $(this).val() ? true : false;
}else if ($group.data('validate') == "email") {
state = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test($(this).val())
}else if($group.data('validate') == 'phone') {
state = /^[(]{0,1}[0-9]{3}[)]{0,1}[-\s\.]{0,1}[0-9]{3}[-\s\.]{0,1}[0-9]{4}$/.test($(this).val())
}else if ($group.data('validate') == "length") {
state = $(this).val().length >= $group.data('length') ? true : false;
}else if ($group.data('validate') == "number") {
state = !isNaN(parseFloat($(this).val())) && isFinite($(this).val());
}
if (state) {
$addon.removeClass('danger');
$addon.addClass('success');
$icon.attr('class', 'glyphicon glyphicon-ok');
}else{
$addon.removeClass('success');
$addon.addClass('danger');
$icon.attr('class', 'glyphicon glyphicon-remove');
}
if ($form.find('.input-group-addon.danger').length == 0) {
$form.find('[type="submit"]').prop('disabled', false);
}else{
$form.find('[type="submit"]').prop('disabled', true);
}
if ($(this).prop("id") == "inputBid") {
$("#iSearch").removeClass("glyphicon-ok glyphicon-exclamation-sign").addClass("glyphicon-search");
$("#btnSearch").removeClass("btn-success btn-warning").addClass("btn-primary");
if ($("#miAlert").is(":visible") && $("#miAlert .message-inner").hasClass("alert-warning")) {
hideMessage();
}
if ($form.find('#inputBid').val().length >= $group.data('length')) {
$('#btnSearch').prop('disabled', false);
}else{
$('#btnSearch').prop('disabled', true);
}
}
});
$('.input-group input[required], .input-group textarea[required], .input-group select[required]').trigger('change');
function showMessage(referenceElement, messageClass, messageText, buttonClass, buttonText) {
// .position() uses position relative to the offset parent,
// so it supports position: relative parent elements
var pos = referenceElement.position();
// .outerWidth() takes into account border and padding.
var width = referenceElement.outerWidth();
//Get reference to the alert message element
var theAlert = $("#miAlert");
//List of classes to remove
var alertClassesToRemove = "alert-default alert-info alert-success alert-warning alert-danger sr-only";
var buttonClassesToRemove = "btn-default btn-primary btn-info btn-success btn-warning btn-danger sr-only";
//Set the display and content of the alert message
theAlert.removeClass('sr-only');
theAlert.find(".message-inner").removeClass(alertClassesToRemove).addClass(messageClass);
theAlert.find(".message").text(messageText);
theAlert.find(".message-action").removeClass(buttonClassesToRemove).addClass(buttonClass).text(buttonText);
//show the menu directly over the placeholder
$("#miAlert").css({
position: "absolute",
top: pos.top + "px",
left: (pos.left + width - 50) + "px"
}).show();
}
function hideMessage() {
$("#miAlert").hide();
}
function loadFields(foundData) {
if ($("#btnSearch").prop("disabled") == false) {
if (foundData) {
$("#inputMrn").val("123456789").closest('.auto-populate').addClass('has-success');
$("#inputFirst").val("Jack").closest('.auto-populate').addClass('has-success');
$("#inputMiddle").val("Test").closest('.auto-populate').addClass('has-success');
$("#inputLast").val("White").closest('.auto-populate').addClass('has-success');
$("#inputDob").val("**/**/1977").closest('.auto-populate').addClass('has-success');;
$("#inputGender").find("#option1").prop("checked", true).closest('.auto-populate').addClass('has-success');;
$("#inputEthnicity").find("#option2").prop("checked", true).closest('.auto-populate').addClass('has-success');;
$("#inputRace").find("#option5").prop("checked", true).closest('.auto-populate').addClass('has-success');;
//$('.input-group input[required], .input-group textarea[required], .input-group select[required]').trigger('change');
//$("#divFound").removeClass("sr-only");
//$("#divNotFound").addClass("sr-only");
$("#iSearch").removeClass("glyphicon-search").addClass("glyphicon-ok");
$("#btnSearch").removeClass("btn-primary").addClass("btn-success");
showMessage($("#divBid"), "alert-success", "Populated 8 fields with EHR data.", "btn-danger reset-fields", "Reset fields");
$(".reset-fields").click(function (){
resetFields();
});
} else {
$("#iSearch").removeClass("glyphicon-search").addClass("glyphicon-exclamation-sign");
$("#btnSearch").removeClass("btn-primary").addClass("btn-warning");
showMessage($("#divBid"), "alert-warning", "No records found with this Encounter ID. Please continue with manual entry.", "sr-only", "");
resetFields();
}
}
}
$("[data-hide]").on("click", function(){
$("#miAlert").hide();
//$(this).closest("." + $(this).attr("data-hide")).hide();
});
function resetFields() {
$(".auto-populate").find("input:text").val("");
$(".auto-populate").find("input:checkbox, input:radio").prop("checked", false);
$(".has-success").removeClass('has-success');
$(".reset-fields").addClass("btn-primary import-fields").removeClass("btn-danger reset-fields").text("Re-import data");
$(".import-fields").click(function (){
loadFields(true);
});
}
// Bind progress buttons and simulate loading progress
Ladda.bind( '#btnSearch', {
callback: function( instance ) {
//hideMessage();
var timeout = setTimeout(function() {
instance.stop();
if ($("#inputBid").val() == "000000") {
loadFields(false);
} else {
loadFields(true);
}
}, 1000);
}
} );
//showMessage($("#divBid"), "alert-success", "Populated 8 fields with EHR data", "btn-danger", "Reset fields");
});
/*
Files:
spin.min.js
ladda.min.js"
*/
/*!
* Copyright (c) 2011-2013 Felix Gnass
* Licensed under the MIT license
*/
(function(t,e){"object"==typeof exports?module.exports=e():"function"==typeof define&&define.amd?define(e):t.Spinner=e()})(this,function(){"use strict";function t(t,e){var i,n=document.createElement(t||"div");for(i in e)n[i]=e[i];return n}function e(t){for(var e=1,i=arguments.length;i>e;e++)t.appendChild(arguments[e]);return t}function i(t,e,i,n){var o=["opacity",e,~~(100*t),i,n].join("-"),r=.01+100*(i/n),a=Math.max(1-(1-t)/e*(100-r),t),s=u.substring(0,u.indexOf("Animation")).toLowerCase(),l=s&&"-"+s+"-"||"";return f[o]||(c.insertRule("@"+l+"keyframes "+o+"{"+"0%{opacity:"+a+"}"+r+"%{opacity:"+t+"}"+(r+.01)+"%{opacity:1}"+(r+e)%100+"%{opacity:"+t+"}"+"100%{opacity:"+a+"}"+"}",c.cssRules.length),f[o]=1),o}function n(t,e){var i,n,o=t.style;if(void 0!==o[e])return e;for(e=e.charAt(0).toUpperCase()+e.slice(1),n=0;d.length>n;n++)if(i=d[n]+e,void 0!==o[i])return i}function o(t,e){for(var i in e)t.style[n(t,i)||i]=e[i];return t}function r(t){for(var e=1;arguments.length>e;e++){var i=arguments[e];for(var n in i)void 0===t[n]&&(t[n]=i[n])}return t}function a(t){for(var e={x:t.offsetLeft,y:t.offsetTop};t=t.offsetParent;)e.x+=t.offsetLeft,e.y+=t.offsetTop;return e}function s(t){return this===void 0?new s(t):(this.opts=r(t||{},s.defaults,p),void 0)}function l(){function i(e,i){return t("<"+e+' xmlns="urn:schemas-microsoft.com:vml" class="spin-vml">',i)}c.addRule(".spin-vml","behavior:url(#default#VML)"),s.prototype.lines=function(t,n){function r(){return o(i("group",{coordsize:u+" "+u,coordorigin:-l+" "+-l}),{width:u,height:u})}function a(t,a,s){e(f,e(o(r(),{rotation:360/n.lines*t+"deg",left:~~a}),e(o(i("roundrect",{arcsize:n.corners}),{width:l,height:n.width,left:n.radius,top:-n.width>>1,filter:s}),i("fill",{color:n.color,opacity:n.opacity}),i("stroke",{opacity:0}))))}var s,l=n.length+n.width,u=2*l,d=2*-(n.width+n.length)+"px",f=o(r(),{position:"absolute",top:d,left:d});if(n.shadow)for(s=1;n.lines>=s;s++)a(s,-2,"progid:DXImageTransform.Microsoft.Blur(pixelradius=2,makeshadow=1,shadowopacity=.3)");for(s=1;n.lines>=s;s++)a(s);return e(t,f)},s.prototype.opacity=function(t,e,i,n){var o=t.firstChild;n=n.shadow&&n.lines||0,o&&o.childNodes.length>e+n&&(o=o.childNodes[e+n],o=o&&o.firstChild,o=o&&o.firstChild,o&&(o.opacity=i))}}var u,d=["webkit","Moz","ms","O"],f={},c=function(){var i=t("style",{type:"text/css"});return e(document.getElementsByTagName("head")[0],i),i.sheet||i.styleSheet}(),p={lines:12,length:7,width:5,radius:10,rotate:0,corners:1,color:"#000",direction:1,speed:1,trail:100,opacity:.25,fps:20,zIndex:2e9,className:"spinner",top:"auto",left:"auto",position:"relative"};s.defaults={},r(s.prototype,{spin:function(e){this.stop();var i,n,r=this,s=r.opts,l=r.el=o(t(0,{className:s.className}),{position:s.position,width:0,zIndex:s.zIndex}),d=s.radius+s.length+s.width;if(e&&(e.insertBefore(l,e.firstChild||null),n=a(e),i=a(l),o(l,{left:("auto"==s.left?n.x-i.x+(e.offsetWidth>>1):parseInt(s.left,10)+d)+"px",top:("auto"==s.top?n.y-i.y+(e.offsetHeight>>1):parseInt(s.top,10)+d)+"px"})),l.setAttribute("role","progressbar"),r.lines(l,r.opts),!u){var f,c=0,p=(s.lines-1)*(1-s.direction)/2,h=s.fps,m=h/s.speed,g=(1-s.opacity)/(m*s.trail/100),v=m/s.lines;(function y(){c++;for(var t=0;s.lines>t;t++)f=Math.max(1-(c+(s.lines-t)*v)%m*g,s.opacity),r.opacity(l,t*s.direction+p,f,s);r.timeout=r.el&&setTimeout(y,~~(1e3/h))})()}return r},stop:function(){var t=this.el;return t&&(clearTimeout(this.timeout),t.parentNode&&t.parentNode.removeChild(t),this.el=void 0),this},lines:function(n,r){function a(e,i){return o(t(),{position:"absolute",width:r.length+r.width+"px",height:r.width+"px",background:e,boxShadow:i,transformOrigin:"left",transform:"rotate("+~~(360/r.lines*l+r.rotate)+"deg) translate("+r.radius+"px"+",0)",borderRadius:(r.corners*r.width>>1)+"px"})}for(var s,l=0,d=(r.lines-1)*(1-r.direction)/2;r.lines>l;l++)s=o(t(),{position:"absolute",top:1+~(r.width/2)+"px",transform:r.hwaccel?"translate3d(0,0,0)":"",opacity:r.opacity,animation:u&&i(r.opacity,r.trail,d+l*r.direction,r.lines)+" "+1/r.speed+"s linear infinite"}),r.shadow&&e(s,o(a("#000","0 0 4px #000"),{top:"2px"})),e(n,e(s,a(r.color,"0 0 1px rgba(0,0,0,.1)")));return n},opacity:function(t,e,i){t.childNodes.length>e&&(t.childNodes[e].style.opacity=i)}});var h=o(t("group"),{behavior:"url(#default#VML)"});return!n(h,"transform")&&h.adj?l():u=n(h,"animation"),s});
/*!
* Ladda 0.8.0 (2013-09-05, 18:54)
* http://lab.hakim.se/ladda
* MIT licensed
*
* Copyright (C) 2013 Hakim El Hattab, http://hakim.se
*/
(function(t,e){"object"==typeof exports?module.exports=e():"function"==typeof define&&define.amd?define(["spin"],e):t.Ladda=e(t.Spinner)})(this,function(t){"use strict";function e(t){if(t===void 0)return console.warn("Ladda button target must be defined."),void 0;t.querySelector(".ladda-label")||(t.innerHTML='<span class="ladda-label">'+t.innerHTML+"</span>");var e=i(t),n=document.createElement("span");n.className="ladda-spinner",t.appendChild(n);var r,a={start:function(){return t.setAttribute("disabled",""),t.setAttribute("data-loading",""),clearTimeout(r),e.spin(n),this.setProgress(0),this},startAfter:function(t){return clearTimeout(r),r=setTimeout(function(){a.start()},t),this},stop:function(){return t.removeAttribute("disabled"),t.removeAttribute("data-loading"),clearTimeout(r),r=setTimeout(function(){e.stop()},1e3),this},toggle:function(){return this.isLoading()?this.stop():this.start(),this},setProgress:function(e){e=Math.max(Math.min(e,1),0);var n=t.querySelector(".ladda-progress");0===e&&n&&n.parentNode?n.parentNode.removeChild(n):(n||(n=document.createElement("div"),n.className="ladda-progress",t.appendChild(n)),n.style.width=(e||0)*t.offsetWidth+"px")},enable:function(){return this.stop(),this},disable:function(){return this.stop(),t.setAttribute("disabled",""),this},isLoading:function(){return t.hasAttribute("data-loading")}};return o.push(a),a}function n(t,n){n=n||{};var r=[];"string"==typeof t?r=a(document.querySelectorAll(t)):"object"==typeof t&&"string"==typeof t.nodeName&&(r=[t]);for(var i=0,o=r.length;o>i;i++)(function(){var t=r[i];if("function"==typeof t.addEventListener){var a=e(t),o=-1;t.addEventListener("click",function(){a.startAfter(1),"number"==typeof n.timeout&&(clearTimeout(o),o=setTimeout(a.stop,n.timeout)),"function"==typeof n.callback&&n.callback.apply(null,[a])},!1)}})()}function r(){for(var t=0,e=o.length;e>t;t++)o[t].stop()}function i(e){var n,r=e.offsetHeight;r>32&&(r*=.8),e.hasAttribute("data-spinner-size")&&(r=parseInt(e.getAttribute("data-spinner-size"),10)),e.hasAttribute("data-spinner-color")&&(n=e.getAttribute("data-spinner-color"));var i=12,a=.2*r,o=.6*a,s=7>a?2:3;return new t({color:n||"#fff",lines:i,radius:a,length:o,width:s,zIndex:"auto",top:"auto",left:"auto",className:""})}function a(t){for(var e=[],n=0;t.length>n;n++)e.push(t[n]);return e}var o=[];return{bind:n,create:e,stopAll:r}});
