517 lines
20 KiB
HTML
517 lines
20 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="">
|
|
<meta name="author" content="">
|
|
<link rel="shortcut icon" href="images/favicon.png" type="image/png">
|
|
|
|
<title>i Kios</title>
|
|
<script src="js/jquery-1.10.2.min.js"></script>
|
|
<script src="js/jquery-migrate-1.2.1.min.js"></script>
|
|
<script src="js/bootstrap.min.js"></script>
|
|
<script src="js/modernizr.min.js"></script>
|
|
<script src="js/jquery.sparkline.min.js"></script>
|
|
<script src="js/toggles.min.js"></script>
|
|
<script src="js/retina.min.js"></script>
|
|
<script src="js/jquery.cookies.js"></script>
|
|
|
|
<script src="js/custom.js"></script>
|
|
|
|
|
|
<link href="css/style.default.css" rel="stylesheet">
|
|
<style>
|
|
body{
|
|
background-color: #003366 !important;
|
|
}
|
|
.sidebartitle{
|
|
color: #fff !important;
|
|
}
|
|
.nav-bracket > li > a {
|
|
color: #fff !important;
|
|
}
|
|
.panel{
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.nav-bracket > li > a:hover {
|
|
color: #003366 !important;
|
|
}
|
|
.carousel-inner>.item {
|
|
padding-left: 100px;
|
|
}
|
|
.carousel-inner>.item>img, .carousel-inner>.item>a>img {
|
|
height: 600px !important;
|
|
}
|
|
#sidebartitle .selected{
|
|
-webkit-filter: hue-rotate(180deg);
|
|
filter: hue-rotate(180deg);
|
|
}
|
|
#submenulist .selected2{
|
|
-webkit-filter: hue-rotate(180deg);
|
|
filter: hue-rotate(180deg);
|
|
}
|
|
#submenu{
|
|
margin-bottom: 10px;
|
|
background-color: darkcyan;
|
|
padding: 10px 0 10px 0;
|
|
}
|
|
</style>
|
|
|
|
<script type="text/javascript" charset="utf-8">
|
|
var loading = "<div id='loadingcontent'><img src='loading81.gif' alt='loading' style='float:right;margin:100px 300px;'/></div>";
|
|
var loading2 = "<div id='loadingcontent'><img src='loading7.gif' alt='loading' style='float:right;margin:100px 300px;'/></div>";
|
|
var imgloading = "<img src='<?php echo base_url(); ?>asset/img/ajax_loading.gif' alt='loading' id='imgloading' width='20px;' style='float:right;margin-top:12px;display:block;' />";
|
|
$(document).ready(function() {
|
|
$('#content').html(loading);
|
|
$("#content").load("home.html");
|
|
});
|
|
|
|
$("#sidebartitle li a").live('click', function(event) {
|
|
$('#content').html(loading);
|
|
$(".selected", event.delegateTarget).removeClass("selected");
|
|
$(this).parent().addClass("selected");
|
|
event.preventDefault();
|
|
var href = $(this).attr('href');
|
|
$.ajax({
|
|
url: href,
|
|
success: function()
|
|
{
|
|
$("#content").load(href);
|
|
setTimeout(function(){
|
|
$('#content').fadeIn(3000);
|
|
$('#imgloading').remove();
|
|
}, 20000);
|
|
},
|
|
error: function(XMLHttpRequest, textStatus, errorThrown)
|
|
{
|
|
//alert("Status: " + textStatus);
|
|
alert("Error: " + errorThrown);
|
|
|
|
}
|
|
});
|
|
});
|
|
|
|
$("#submenulist li a").live('click', function(event) {
|
|
$('#maincontent').html(loading2);
|
|
//alert("test");
|
|
$(".selected2", event.delegateTarget).removeClass("selected2");
|
|
$(this).parent().addClass("selected2");
|
|
event.preventDefault();
|
|
var href = $(this).attr('href');
|
|
$.ajax({
|
|
url: href,
|
|
success: function()
|
|
{
|
|
$("#maincontent").load(href);
|
|
setTimeout(function(){
|
|
$('#maincontent').fadeIn(3000);
|
|
$('#imgloading').remove();
|
|
}, 20000);
|
|
},
|
|
error: function(XMLHttpRequest, textStatus, errorThrown)
|
|
{
|
|
//alert("Status: " + textStatus);
|
|
alert("Error: " + errorThrown);
|
|
|
|
}
|
|
});
|
|
});
|
|
|
|
</script>
|
|
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
|
<!--[if lt IE 9]>
|
|
<script src="js/html5shiv.js"></script>
|
|
<script src="js/respond.min.js"></script>
|
|
<![endif]-->
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<!-- Preloader -->
|
|
<div id="preloader">
|
|
<div id="status"><i class="fa fa-spinner fa-spin"></i></div>
|
|
</div>
|
|
|
|
<section>
|
|
|
|
<div class="leftpanel">
|
|
|
|
<div class="logopanel">
|
|
<img src="images/idm.jpg" class="img-responsive" alt="Image">
|
|
</div><!-- logopanel -->
|
|
|
|
<div class="leftpanelinner">
|
|
<h5 class="sidebartitle">Navigation</h5>
|
|
<ul class="nav nav-pills nav-stacked nav-bracket" id="sidebartitle">
|
|
<li>
|
|
<a href="pulsa.html">
|
|
<img src="image/ipulsa.jpg" style="height:70px"/>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="pulsa.html">
|
|
<img src="image/delivery.jpg" style="height:70px"/>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="voucher.html">
|
|
<img src="image/voucher.jpg" style="height:70px"/>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="ticket.html">
|
|
<img src="image/tiket.jpg" style="height:70px"/>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="payment.html">
|
|
<img src="image/payment.jpg" style="height:70px"/>
|
|
</a>
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</div><!-- leftpanelinner -->
|
|
</div><!-- leftpanel -->
|
|
|
|
<div class="mainpanel">
|
|
|
|
<div class="headerbar">
|
|
|
|
<form class="searchform" action="http://themepixels.com/demo/webpage/bracket/index.html" method="post">
|
|
<input type="text" class="form-control" name="keyword" placeholder="Search here..." style="width:90%"/>
|
|
</form>
|
|
|
|
<div class="header-right">
|
|
<ul class="headermenu">
|
|
<li>
|
|
<div class="btn-group">
|
|
<button class="btn btn-default dropdown-toggle tp-icon" data-toggle="dropdown">
|
|
<i class="fa fa-question"></i>
|
|
</button>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div><!-- header-right -->
|
|
|
|
</div><!-- headerbar -->
|
|
|
|
<div class="contentpanel text-center" id="content" align="center" valign="middle">
|
|
<div id="carousel-id" class="carousel slide" data-ride="carousel">
|
|
<ol class="carousel-indicators">
|
|
<li data-target="#carousel-id" data-slide-to="0" class=""></li>
|
|
<li data-target="#carousel-id" data-slide-to="1" class=""></li>
|
|
<li data-target="#carousel-id" data-slide-to="2" class="active"></li>
|
|
</ol>
|
|
<div class="carousel-inner">
|
|
<div class="item">
|
|
<img data-src="holder.js/900x500/auto/#777:#7a7a7a/text:First slide" alt="First slide" src="images/Lomba Foto Indomaret 2014.jpg" style="height: 600px !important;">
|
|
</div>
|
|
<div class="item">
|
|
<img data-src="holder.js/900x500/auto/#666:#6a6a6a/text:Second slide" alt="Second slide" src="images/Lomba Foto Indomaret 2014.jpg">
|
|
</div>
|
|
<div class="item active">
|
|
<img data-src="holder.js/900x500/auto/#555:#5a5a5a/text:Third slide" alt="Third slide" src="images/Lomba Foto Indomaret 2014.jpg">
|
|
</div>
|
|
</div>
|
|
<a class="left carousel-control" href="#carousel-id" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
|
|
<a class="right carousel-control" href="#carousel-id" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
|
|
</div>
|
|
</div>
|
|
|
|
</div><!-- mainpanel -->
|
|
|
|
<div class="rightpanel">
|
|
<!-- Nav tabs -->
|
|
<ul class="nav nav-tabs nav-justified">
|
|
<li class="active"><a href="#rp-alluser" data-toggle="tab"><i class="fa fa-users"></i></a></li>
|
|
<li><a href="#rp-favorites" data-toggle="tab"><i class="fa fa-heart"></i></a></li>
|
|
<li><a href="#rp-history" data-toggle="tab"><i class="fa fa-clock-o"></i></a></li>
|
|
<li><a href="#rp-settings" data-toggle="tab"><i class="fa fa-gear"></i></a></li>
|
|
</ul>
|
|
|
|
<!-- Tab panes -->
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="rp-alluser">
|
|
<h5 class="sidebartitle">Online Users</h5>
|
|
<ul class="chatuserlist">
|
|
<li class="online">
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/userprofile.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Eileen Sideways</strong>
|
|
<small>Los Angeles, CA</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li class="online">
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user1.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<span class="pull-right badge badge-danger">2</span>
|
|
<strong>Zaham Sindilmaca</strong>
|
|
<small>San Francisco, CA</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li class="online">
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user2.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Nusja Nawancali</strong>
|
|
<small>Bangkok, Thailand</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li class="online">
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user3.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Renov Leongal</strong>
|
|
<small>Cebu City, Philippines</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li class="online">
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user4.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Weno Carasbong</strong>
|
|
<small>Tokyo, Japan</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
</ul>
|
|
|
|
<div class="mb30"></div>
|
|
|
|
<h5 class="sidebartitle">Offline Users</h5>
|
|
<ul class="chatuserlist">
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user5.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Eileen Sideways</strong>
|
|
<small>Los Angeles, CA</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user2.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Zaham Sindilmaca</strong>
|
|
<small>San Francisco, CA</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user3.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Nusja Nawancali</strong>
|
|
<small>Bangkok, Thailand</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user4.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Renov Leongal</strong>
|
|
<small>Cebu City, Philippines</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user5.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Weno Carasbong</strong>
|
|
<small>Tokyo, Japan</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user4.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Renov Leongal</strong>
|
|
<small>Cebu City, Philippines</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user5.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Weno Carasbong</strong>
|
|
<small>Tokyo, Japan</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="tab-pane" id="rp-favorites">
|
|
<h5 class="sidebartitle">Favorites</h5>
|
|
<ul class="chatuserlist">
|
|
<li class="online">
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user2.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Eileen Sideways</strong>
|
|
<small>Los Angeles, CA</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user1.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Zaham Sindilmaca</strong>
|
|
<small>San Francisco, CA</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user3.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Nusja Nawancali</strong>
|
|
<small>Bangkok, Thailand</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li class="online">
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user4.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Renov Leongal</strong>
|
|
<small>Cebu City, Philippines</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li class="online">
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user5.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Weno Carasbong</strong>
|
|
<small>Tokyo, Japan</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="tab-pane" id="rp-history">
|
|
<h5 class="sidebartitle">History</h5>
|
|
<ul class="chatuserlist">
|
|
<li class="online">
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user4.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Eileen Sideways</strong>
|
|
<small>Hi hello, ctc?... would you mind if I go to your...</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user2.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Zaham Sindilmaca</strong>
|
|
<small>This is to inform you that your product that we...</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
<li>
|
|
<div class="media">
|
|
<a href="#" class="pull-left media-thumb">
|
|
<img alt="" src="images/photos/user3.png" class="media-object">
|
|
</a>
|
|
<div class="media-body">
|
|
<strong>Nusja Nawancali</strong>
|
|
<small>Are you willing to have a long term relat...</small>
|
|
</div>
|
|
</div><!-- media -->
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="tab-pane pane-settings" id="rp-settings">
|
|
|
|
<h5 class="sidebartitle mb20">Settings</h5>
|
|
<div class="form-group">
|
|
<label class="col-xs-8 control-label">Show Offline Users</label>
|
|
<div class="col-xs-4 control-label">
|
|
<div class="toggle toggle-success"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-xs-8 control-label">Enable History</label>
|
|
<div class="col-xs-4 control-label">
|
|
<div class="toggle toggle-success"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-xs-8 control-label">Show Full Name</label>
|
|
<div class="col-xs-4 control-label">
|
|
<div class="toggle-chat1 toggle-success"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="col-xs-8 control-label">Show Location</label>
|
|
<div class="col-xs-4 control-label">
|
|
<div class="toggle toggle-success"></div>
|
|
</div>
|
|
</div>
|
|
|
|
</div><!-- tab-pane -->
|
|
|
|
</div><!-- tab-content -->
|
|
</div><!-- rightpanel -->
|
|
|
|
</section>
|
|
</body>
|
|
</html>
|