<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 ---------->
<!DOCTYPE html>
<html lang="en">
<head>
<title>Support</title>
<!-- Force IE to turn off past version compatibility mode and use current version mode -->
<meta http-equiv="X-UA-Compatible" content="IE=edge;chrome=1">
<!-- Get the width of the users display-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Text encoded as UTF-8 -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!-- fonts -->
<link href="https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Signika+Negative:400,700" rel="stylesheet" type="text/css">
<!-- icons -->
<link href="https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" rel="stylesheet">
<!-- bootstrap -->
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" id="default">
<!-- theme -->
<link href="https://netdna.bootstrapcdn.com/bootswatch/3.1.1/bootstrap/bootstrap.min.css" rel="stylesheet" title="theme">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries in IE8, IE9 -->
<!--[if lt IE 9]>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6.2/html5shiv.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/respond.js/1.3.0/respond.js"></script>
<![endif]-->
<style>
/* global section style */
#TixContent td { padding:0; margin:0; background-color: #e0e0e0;}
#TixManagementContent td { padding:0; margin:0; background-color: #fcfbfc}
#navbar { border-radius: 0px; padding: 0px;}
#wrapper { text-align: left; padding: 10px;}
/* remove outline and underscore from button */
a.btn, a.btn:link, a.btn:visited, a.btn:hover, a.btn:active, a.btn:focus, button.btn, button.btn:link, button.btn:visited, button.btn:hover, button.btn:active, button.btn:focus { outline:0; text-decoration:none; }
ul.dropdown-menu li a, ul.dropdown-menu li a:link, ul.dropdown-menu li a:visited, ul.dropdown-menu li a:hover, ul.dropdown-menu li a:active, ul.dropdown-menu li a:focus { text-decoration:none; }
/* change button font color */
a.btn, a.btn:link, a.btn:visited, a.btn:hover, a.btn:active, a.btn:focus { color:#ffffff; }
/* navbar search */
nav#navbar form.navbar-form .input-group-btn ul.dropdown-menu { min-width: 25px;}
nav#navbar form.navbar-form div.form-group div.input-group div.input-group input.form-control { width: 100%;}
/* navbar buttons */
nav#navbar div#navbar-collapsible div.navbar-btn.navbar-left button.btn.btn-nav { margin-right: 5px; }
nav#navbar div#navbar-collapsible div.navbar-btn.navbar-right button.btn.btn-nav { margin-left: 5px; }
/* navbar preferences form */
navv#navbar div#navbar-collapsible div.navbar-btn div.dropdown ul.dropdown-menu {width: 350px; padding:0; margin:0;}
navv#navbar div#preferences.panel {padding: 0px; margin-bottom:0;}
/* transition animation between page views */
#navbar *, #wrapper * { -webkit-transition: all 1.5s ease-in-out; -moz-transition: all 1.5s ease-in-out; -ms-transition: all 1.5s ease-in-out; transition: all 1.5s ease-in-out;
/* carousel */
.carousel-caption { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.45); left: 0; right: 0; bottom: 0; padding: 1px; position: absolute; }
.carousel-caption .item-name { padding-top: 10px; }
div.panel-footer div.btn-group button.btn { border-left:2px solid white; border-right:2px solid white; }
</style>
<style>
.mastheadd h1 { font-size: 26px; line-height: 31px; letter-spacing: .01em; }
.masthead h1 .dark {font-family: 'Signika Negative' ,sans-serif; color: #333333; font-weight: 700; text-decoration: none; text-shadow: 1px 1px 1px rgba(51,51,51,.30); }
.masthead h1 .light {font-size: 32px; font-family: 'Lato', sans-serif; color: #666666; font-weight: 300; letter-spacing: .01em; text-decoration: none; text-shadow: 0px 0px 1px rgba(0,0,0,.30); }
.masthead h1 a { color: #666666; font-weight: 400; text-decoration: none; }
</style>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries in IE8, IE9 -->
<!--[if lt IE 9]>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6.2/html5shiv.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/respond.js/1.3.0/respond.js"></script>
<![endif]-->
</head>
<body class="default">
<div class="container">
<nav id="navbar-button" class="navbar navbar-default" role="navigation">
<div class="navbar-collapse collapse" id="navbar-collapsible">
<div class="navbar-btn navbar-left">
<button type="button" class="btn btn-nav btn-default"><span class="fa fa-bars"></span><span class="nav-label"> Menu</span></button>
<button type="button" class="btn btn-nav btn-default"><span class="fa fa-dashboard"></span><span class="nav-label"> Dashboard</span></button>
</div>
<div class="navbar-btn navbar-right">
<div class="dropdown">
<button type="button" class="btn btn-nav btn-default dropdown-toggle" data-toggle="dropdown">
<span class="glyphicon glyphicon-cog"></span>
<span class="nav-label"> Preferences</span>
</button>
<ul class="dropdown-menu" style="width:300px; padding:0px;">
<li>
<form class="form-horizontal" id="preferences" action="" method="post" accept-charset="utf-8">
<div class="panel panel-default" id="preferences" style="margin:0px;">
<div class="panel-heading">
<span class="panel-label">User Preferences</span>
</div>
<div class="panel-body">
<div class="form-group">
<label for="theme_name" class="col-lg-6 control-label">
Theme
</label>
<div class="col-lg-6">
<select class="form-control" id="theme_name" name="theme_name">
<option value="amelia"> Amelia </option>
<option value="bootstrap"> Default </option>
<option value="cerulean"> Cerulean </option>
<option value="cosmo"> Cosmo </option>
<option value="cyborg"> Cyborg </option>
<option selected value="flatly"> Flatly </option>
<option value="journal"> Journal </option>
<option value="lumen"> Lumen </option>
<option value="readable"> Readable </option>
<option value="simplex"> Simplex </option>
<option value="slate"> Slate </option>
<option value="spacelab"> Spacelab </option>
<option value="superhero"> Superhero </option>
<option value="united"> United </option>
<option value="yeti"> Yeti </option>
</select>
</div>
</div>
<div class="form-group">
<label for="navbar_style" class="col-lg-6 control-label" >
Navbar Style
</label>
<div class="col-lg-6">
<select class="form-control" id="navbar_style" name="navbar_style">
<option value="navbar-default">Default</option>
<option value="navbar-inverse">Inverse</option>
</select>
</div>
</div>
<div class="form-group">
<label for="btn_style" class="col-lg-6 control-label" >
Navbar Buttons
</label>
<div class="col-lg-6">
<select class="form-control" id="btn_style" name="btn_style">
<option value="btn-primary">Primary</option>
<option value="btn-default">Default</option>
<option value="btn-success">Success</option>
<option value="btn-info">Info</option>
<option value="btn-warning">Warning</option>
<option value="btn-danger">Danger</option>
<option value="btn-inverse">Inverse</option>
</select>
</div>
</div>
<div class="form-group">
<label for="text_size" class="col-lg-6 control-label">
Icon Labels
</label>
<div class="col-lg-6">
<select class="form-control" id="display_label" name="display_label">
<option value="hide">Icons Only</option>
<option value="">Icons/Labels</option>
</select>
</div>
</div>
</div>
<div class="panel-footer">
<div class="form-group">
<div class="col-lg-12">
<button type="submit" class="btn btn-primary btn-block">Update</button>
<button type="submit" class="btn btn-default btn-block">Reset</button>
</div>
</div>
</div>
</div>
</form>
</li>
</ul>
</div>
</div>
<div class="navbar-btn navbar-right">
<button type="button" class="btn btn-nav btn-default"><span class="fa fa-bell"></span><span class="nav-label"> Alerts</span></button>
</div>
<form action="clientsearch/index.asp" method="post" class="navbar-form" name="search-form" id="search-form" accept-charset="utf-8">
<div class="form-group" style="display:inline;">
<div class="input-group">
<span class="input-group-btn btn-block" >
<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">
<span class="glyphicon glyphicon-search"></span>
<span class="nav-label"> Search</span>
<span class="fa fa-caret-down"></span>
</button>
<ul class="dropdown-menu pull-left" role="menu">
<li>
<a href="#">
<span class="glyphicon glyphicon-user"></span>
<span class="nav-label">User</span>
</a>
</li>
<li>
<a href="#" class="disabled">
<span class="fa fa-building-o"></span>
<span class="nav-label">Organization</span>
</a>
</li>
<li>
<a href="#" class="disabled">
<span class="fa fa-book"></span>
<span class="nav-label">KnowledgeBase</span>
</a>
</li>
<li>
<a href="#" class="disabled">
<span class="fa fa-map-marker"></span>
<span class="nav-label">Venue</span>
</a>
</li>
<li>
<a href="#" class="disabled">
<span class="fa fa-ticket"></span>
<span class="nav-label">Private Label</span>
</a>
</li>
</ul>
</span>
<div class="input-group col-lg-12 center-block">
<input class="form-control" type="text" placeholder="Search">
</div>
<div class="input-group-btn navbar-btn">
<button class="btn btn-default btn-nav">
GO
</button>
</div>
</div>
</div>
</form>
</div>
</nav>
<section id="wrapper">
<div class="row">
<div class="col-md-6">
<div id="orders" class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
panel title
</h3>
</div>
<div class="panel-body">
panel body
</div>
<div class="panel-footer">
panel footer
</div>
</div>
</div>
<div class="col-md-6">
<div id="orders" class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
panel title
</h3>
</div>
<div class="panel-body">
panel body
</div>
<div class="panel-footer">
panel footer
</div>
</div>
</div>
</div>
</section>
</div>
</body>
</html>
<script type="text/javascript">
$( "div:eq( 5 )" ).removeClass( "TixManagementContent" ).attr("class", "boxed-page" );
$( "table:eq( 1 )" ).attr("id", "TixManagementContent").attr("class", "TixManagementContent");
$( "#TixManagementContent" ).removeAttr("style");
$(".widget-data").squishy({maxWidth: 100, minSize: 6, maxSize: 15});
$("#toggle-chevron").click(function () {
if ($('#side-outer > #fullwidth').is(":visible") === true) {
$("#side-outer").toggleClass("active");
$("#toggle-chevron").toggleClass("active");
$("#toggle-chevron").toggleClass("fa-chevron-right");
} else {
$("#side-outer").toggleClass("active");
$("#toggle-chevron").toggleClass("active");
$("#toggle-chevron").toggleClass("fa-chevron-left");
}
});
$("#shortwidth").hide();
$('#toggle-bars').click(function () {
if ($('#side-inner > #shortwidth').is(":visible") === true) {
$("#shortwidth").animate({width: "hide"}, 1500, "easeOutBounce");
$("#toggle-bars").toggleClass("active");
} else {
$("#shortwidth").animate({width: "show"}, 1500, "easeOutBounce");
$("#toggle-bars").toggleClass("active");
}
});
</script>
<script type="text/javascript">
function save_settings()
{
//Get form values and save to local storage
localStorage.setItem("theme_name", $( "#theme_name" ).val());
localStorage.setItem("navbar_style" , $( "#navbar_style" ).val());
localStorage.setItem("btn_style", $( "#btn_style" ).val());
localStorage.setItem("display_label", $( "#display_label" ).val());
apply_preferences_to_page();
}
function load_settings()
{
//Get settings stored in local storage
var theme_name = localStorage.getItem( "theme_name" );
var navbar_style = localStorage.getItem( "navbar_style" );
var btn_style = localStorage.getItem( "btn_style" );
var display_label = localStorage.getItem( "display_label" );
//Update form with preferences
$("#navbar_style").val(navbar_style);
$("#btn_style").val(btn_style);
$("#theme_name").val(theme_name);
$("#display_label").val(display_label);
apply_preferences_to_page();
}
function apply_preferences_to_page()
{
var theme_name = localStorage.getItem("theme_name");
var navbar_style = localStorage.getItem("navbar_style");
var btn_style = localStorage.getItem("btn_style");
var display_label = localStorage.getItem("display_label");
//apply setting to the page
$("body").attr("class",theme_name);
$("nav#navbar-button").attr("class", "navbar "+navbar_style);
$('nav#navbar-button button.btn.btn-nav').attr('class','btn btn-nav '+btn_style);
$('nav#navbar-button button.btn.dropdown-toggle').attr('class','btn '+btn_style+' dropdown-toggle');
$('link[title="theme"]').attr('href','http://netdna.bootstrapcdn.com/bootswatch/3.1.0/'+theme_name+'/bootstrap.min.css');
$(".current-theme").html(theme_name);
$(".nav-label").attr("class",'nav-label '+display_label);
display_preferences();
}
function display_preferences()
{
//the variable that will hold the results
var dataLog = "";
var i = 0;
//how many items are in the database starting with zero
var logLength = localStorage.length-1;
dataLog = "<thead><tr class='active'><th>Item Name</th><th>Item Data</th></tr></thead><tbody>"
//now we are going to loop through each item in the database
for (i = 0; i <= logLength; i++) {
//lets setup some variables for the key and values
var itemKey = localStorage.key(i);
var itemData = localStorage.getItem(itemKey);
//now that we have the item, lets add it to the table
dataLog += '<tr><td>'+itemKey+'</td><td>'+itemData+'</td></tr>';
}
//if there were no items in the database
if (dataLog == "")
dataLog = '<li class="empty">Log Currently Empty</li>';
//update the ul with the list items
$("#theLog").html(dataLog);
}
$(function()
{
load_settings();
$('form#preferences').submit(function(e){
event.preventDefault();
save_settings();
});
});
//search box //
$(function()
{
$(".input-group-btn .dropdown-menu li a").click(function()
{
var selText = $(this).html();
//working version - for single button //
//$('.btn:first-child').html(selText+'<span class="caret"></span>');
//working version - for multiple buttons - updates the search title //
$(this).parents('.input-group-btn').find('.dropdown-toggle').html(selText+'<span class="caret"></span>');
});
});
</script>
