updated html/js/css to latest codepen code. will out of box point to the json-server endpoint. needs to be modified to work with the datacenter api
This commit is contained in:
parent
fa3a115c5c
commit
974ffe4b13
@ -1,41 +1,34 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>Flexi Time Tracker</title>
|
||||
<script src="https://code.jquery.com/jquery-3.1.0.min.js"
|
||||
integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s="
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="http://learn.knockoutjs.com/Scripts/Lib/knockout-3.0.0.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/sammy.js/0.7.6/sammy.js" type="text/javascript"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.2.2/Chart.bundle.js"></script>
|
||||
<!-- <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css"/> -->
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="spa.css" rel="stylesheet" type="text/css"/>
|
||||
<script src="spa.js" type="text/javascript"></script>
|
||||
<title>Flexi Time Data Viewer</title>
|
||||
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="https://uxsolutions.github.io/bootstrap-datepicker/bootstrap-datepicker/css/bootstrap-datepicker3.min.css" rel="stylesheet" type="text/css" />
|
||||
<link href="spa.css" rel="stylesheet" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-default">
|
||||
<div class="container-fluid">
|
||||
<!-- Brand and toggle get grouped for better mobile display -->
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle collapsed"
|
||||
data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
|
||||
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="#">FlexiTime DataViewer</a>
|
||||
<a class="navbar-brand" href="#">Big Brother</a>
|
||||
</div>
|
||||
|
||||
<!-- Collect the nav links, forms, and other content for toggling data-bind="foreach: menuOptions"-->
|
||||
<!-- Collect the nav links, forms, and other content for toggling data-bind="foreach: menuOptions",active: $data == $root.chosenMenuItemId() -->
|
||||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
||||
<ul class="nav navbar-nav" data-bind="foreach: menuOptions">
|
||||
<li data-bind="text: $data,
|
||||
css: { selected: $data == $root.chosenMenuItemId(),active: $data == $root.chosenMenuItemId() },
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- ko foreach: menuOptions -->
|
||||
<li data-bind="css: { active: $root.chosenMenuItemId() == $data },
|
||||
click: $root.goToMenuOption">
|
||||
<!-- "css: {active: $data == $root.chosenMenuItemId()}, click: $root.goToMenuOption()">
|
||||
<a data-bind="text:$data"></a>-->
|
||||
<a class="indent-nav-xs" data-bind="text: $data"></a> <!-- would be nice to indent these "1 col" on xs, when the navbar compacts.. any ideas? -->
|
||||
</li>
|
||||
<!-- /ko -->
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -43,7 +36,18 @@
|
||||
|
||||
<div class="usersPage container" data-bind="with: userList">
|
||||
<div class="col-md-10 col-md-offset-1">
|
||||
<button class="btn btn-default" data-bind="click: $root.addNewUserClick"><span class="glyphicon glyphicon-plus"></span> Add New User</button>
|
||||
<div class="row">
|
||||
<div class="col-xs-8">
|
||||
<div class="input-group">
|
||||
<span class="input-group-btn">
|
||||
<button class="btn btn-default" type="button">Go!</button>
|
||||
</span>
|
||||
<input type="text" class="form-control" placeholder="Search for...">
|
||||
</div><!-- /input-group -->
|
||||
</div><!-- /.col-lg-6 -->
|
||||
<button class="btn btn-default pull-right" data-bind="click: $root.returnButtonClick" pagedestination="newUser"><span class="glyphicon glyphicon-plus"></span> Add New User</button>
|
||||
</div>
|
||||
<br />
|
||||
<div class="usersGrid">
|
||||
<table class="users table table-striped">
|
||||
<thead>
|
||||
@ -52,6 +56,8 @@
|
||||
<th>UserId</th>
|
||||
<th class="col-md-1">firstName</th>
|
||||
<th class="col-md-1">lastName</th>
|
||||
<th />
|
||||
<th />
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody data-bind="foreach: Users">
|
||||
@ -61,7 +67,7 @@
|
||||
<td class="valign" data-bind="text: LastName"></td>
|
||||
<td class="valign" data-bind="text: FirstName"></td>
|
||||
<td class="fit"><button data-bind="click: $root.goToUserDetails" class="btn btn-default">Details</button></td>
|
||||
<td class="fit"><button data-bind="click: $root.goToTimeLogs" class="btn btn-default">View Logs</button></td>
|
||||
<td class="fit hidden-md-down"><button data-bind="click: $root.goToTimeLogs" class="btn btn-default">View Logs</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@ -69,8 +75,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="chosenUserDetails container" data-bind="with: chosenUserDetails">
|
||||
<div class=" col-md-10 col-md-offset-1">
|
||||
<div class="col-md-10 col-md-offset-1">
|
||||
<button pageDestination="Users" data-bind="click: $root.returnButtonClick" id="returnButton" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-chevron-left"></span>Users
|
||||
</button>
|
||||
@ -89,15 +96,147 @@
|
||||
<label for="HoursPerWeek">Hours Per Week</label>
|
||||
<input for="HoursPerWeek" type="text" class="form-control" id="hoursPerWeekEdit" placeholder="Contracted Hours per Week" data-bind="value: HoursPerWeek">
|
||||
</div>
|
||||
<div data-bind="with: $root.unassignedCardData">
|
||||
<!-- ko foreach: data -->
|
||||
<input type="checkbox" data-bind="name: Id, value: CardUId, checked: IsSelected"> <span data-bind="text: CardUId"></span><br />
|
||||
<!-- /ko -->
|
||||
<div>
|
||||
<label for="AssociatedCards">Associated Cards</label>
|
||||
<br />
|
||||
<div class="row">
|
||||
<!-- ko foreach: AssociatedCards -->
|
||||
<div class="col-md-6 col-md-push-0 col-sm-6 col-sm-push-0 col-xs-12 col-xs-push-0">
|
||||
<div class="input-group ">
|
||||
<span class="input-group-addon">
|
||||
<input type="checkbox" data-bind="name: Id, value: CardUId, checked: IsSelected">
|
||||
</span>
|
||||
<input type="text" readonly class="form-control col-md-8" data-bind="value: CardUId">
|
||||
</div>
|
||||
</div>
|
||||
<!-- /ko -->
|
||||
</div>
|
||||
<hr />
|
||||
</div>
|
||||
|
||||
<div data-bind="with: $root.unassignedCardData">
|
||||
<label for="AssociatedCards">Unassociated/Available Cards</label>
|
||||
<br />
|
||||
<div class="row">
|
||||
<!-- -->
|
||||
<!-- ko foreach: data -->
|
||||
<div class="col-md-6 col-md-push-0 col-sm-6 col-sm-push-0 col-xs-12 col-xs-push-0">
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon">
|
||||
<input type="checkbox" data-bind="name: Id, value: CardUId, checked: IsSelected">
|
||||
</span>
|
||||
<input type="text" readonly class="form-control" data-bind="value: CardUId">
|
||||
</div>
|
||||
</div>
|
||||
<!-- /ko -->
|
||||
</div>
|
||||
</div>
|
||||
<br />
|
||||
<button type="submit" class="btn btn-primary">Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="timelogPage container" data-bind="with: userTimeLogData">
|
||||
<button pageDestination="Users" data-bind="click: $root.returnButtonClick" id="returnButton" class="btn btn-default">
|
||||
<span class="glyphicon glyphicon-chevron-left"></span>Users
|
||||
</button>
|
||||
<br />
|
||||
<br />
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-xs-12">
|
||||
<div id="datePickerContainer">
|
||||
<div id="weeklyDatePicker"></div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input type="text" data-bind="value: $root.selectedCalendarWeek">
|
||||
</div>
|
||||
<!--<div class="week-picker"></div>
|
||||
<p>Date: <input type="text" id="datepicker"></p>-->
|
||||
</div>
|
||||
<div class="col-md-9 col-xs-12 well">
|
||||
<!-- main content panel. -->
|
||||
<p>Content</p>
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Day Of Week</th>
|
||||
<th>In</th>
|
||||
<th>Out</th>
|
||||
<th>In</th>
|
||||
<th>Out</th>
|
||||
<th>In</th>
|
||||
<th>Out</th>
|
||||
<th>Sub-Total</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="valign" for="monday">Monday</td>
|
||||
<td class="valign" for="timein1"></td>
|
||||
<td class="valign" for="timeout1"></td>
|
||||
<td class="valign" for="timein2"></td>
|
||||
<td class="valign" for="timeout2"></td>
|
||||
<td class="valign" for="timein3"></td>
|
||||
<td class="valign" for="timeout3"></td>
|
||||
<td class="valign" for="dailyHrsTotal">8</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="valign" for="monday">Tuesday</td>
|
||||
<td class="valign" for="timein1"></td>
|
||||
<td class="valign" for="timeout1"></td>
|
||||
<td class="valign" for="timein2"></td>
|
||||
<td class="valign" for="timeout2"></td>
|
||||
<td class="valign" for="timein3"></td>
|
||||
<td class="valign" for="timeout3"></td>
|
||||
<td class="valign" for="dailyHrsTotal">8</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="valign" for="monday">Wednesday</td>
|
||||
<td class="valign" for="timein1"></td>
|
||||
<td class="valign" for="timeout1"></td>
|
||||
<td class="valign" for="timein2"></td>
|
||||
<td class="valign" for="timeout2"></td>
|
||||
<td class="valign" for="timein3"></td>
|
||||
<td class="valign" for="timeout3"></td>
|
||||
<td class="valign" for="dailyHrsTotal">8</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="valign" for="monday">Thursday</td>
|
||||
<td class="valign" for="timein1"></td>
|
||||
<td class="valign" for="timeout1"></td>
|
||||
<td class="valign" for="timein2"></td>
|
||||
<td class="valign" for="timeout2"></td>
|
||||
<td class="valign" for="timein3"></td>
|
||||
<td class="valign" for="timeout3"></td>
|
||||
<td class="valign" for="dailyHrsTotal">8</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="valign" for="monday">Friday</td>
|
||||
<td class="valign" for="timein1"></td>
|
||||
<td class="valign" for="timeout1"></td>
|
||||
<td class="valign" for="timein2"></td>
|
||||
<td class="valign" for="timeout2"></td>
|
||||
<td class="valign" for="timein3"></td>
|
||||
<td class="valign" for="timeout3"></td>
|
||||
<td class="valign" for="dailyHrsTotal">8</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="valign" colspan="7" for="monday">Weekly Total</td>
|
||||
<td class="valign" for="dailyHrsTotal">37</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
|
||||
<script src="http://learn.knockoutjs.com/Scripts/Lib/knockout-3.0.0.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/sammy.js/0.7.6/sammy.js" type="text/javascript"></script>
|
||||
|
||||
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/momentjs/2.10.6/moment.min.js"></script>
|
||||
<script src="https://rawgit.com/uxsolutions/bootstrap-datepicker/master/dist/js/bootstrap-datepicker.min.js" type="text/javascript"></script>
|
||||
<script src="spa.js" type="text/javascript"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,127 +1,16 @@
|
||||
table.scroll {
|
||||
width: 650px; /* Optional */
|
||||
/* border-collapse: collapse; */
|
||||
border-spacing: 0;
|
||||
table-layout:auto;
|
||||
border: 2px solid black;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
/*table.scroll tbody,
|
||||
table.scroll thead { display: block }*/
|
||||
|
||||
table.scroll thead tr th {
|
||||
/*width: 100px;
|
||||
width: 90px;*/
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
border-bottom: 1px solid black;
|
||||
/*text-align: left;*/
|
||||
}
|
||||
|
||||
table.scroll tbody {
|
||||
border-top: 1px solid black;
|
||||
height: 300px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
table.scroll tbody { border-top: 2px solid black; }
|
||||
|
||||
table.scroll tbody td, thead th {
|
||||
/*width: 20%; Optional
|
||||
width: 100px;*/
|
||||
border-right: 1px solid black;
|
||||
}
|
||||
|
||||
table.scroll tbody td {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
table.scroll tbody td:last-child, thead th:last-child {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
#contentContainer{
|
||||
}
|
||||
|
||||
#nav {
|
||||
padding-top: 10px;
|
||||
float: left;
|
||||
height: 800px;
|
||||
}
|
||||
#navBar{
|
||||
width: 200px;
|
||||
padding: 20px;
|
||||
float:left;
|
||||
}
|
||||
|
||||
#content {
|
||||
margin-left: 250px;
|
||||
width: 700px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#collapser{
|
||||
float: right;
|
||||
background: black;
|
||||
width: 10px;
|
||||
height: 100%;
|
||||
}
|
||||
/* Dropdown Button */
|
||||
.hoverdropbtn {
|
||||
/*background-color: #4CAF50;
|
||||
color: white;*/
|
||||
padding: 14px;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.hoverdropdown:hover {
|
||||
background-color: #4CAF50;
|
||||
}
|
||||
|
||||
/* The container <div> - needed to position the dropdown content */
|
||||
.hoverdropdown {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* Dropdown Content (Hidden by Default) */
|
||||
.hoverdropdown-content {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #f9f9f9;
|
||||
min-width: 200px;
|
||||
z-index: 999;
|
||||
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
/* Links inside the dropdown */
|
||||
.hoverdropdown-content a {
|
||||
color: black;
|
||||
padding: 12px 16px;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Change color of dropdown links on hover */
|
||||
.hoverdropdown-content a:hover {background-color: #f1f1f1}
|
||||
|
||||
/* Show the dropdown menu on hover */
|
||||
.hoverdropdown:hover .hoverdropdown-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Change the background color of the dropdown button when the dropdown content is shown */
|
||||
.hoverdropdown:hover .hoverdropbtn {
|
||||
background-color: #4CAF50;
|
||||
}
|
||||
|
||||
.table td.fit,
|
||||
.table td.fit,
|
||||
.table th.fit {
|
||||
white-space: nowrap;
|
||||
width: 1%;
|
||||
}
|
||||
.table > tbody > tr > td.valign {
|
||||
vertical-align: middle;
|
||||
}
|
||||
@media (max-width: 576px) {
|
||||
ul>li>a.indent-nav-xs{
|
||||
padding-left: 50px;
|
||||
}
|
||||
}
|
||||
.bootstrap-datetimepicker-widget tr:hover {
|
||||
background-color: #808080;
|
||||
}
|
||||
@ -12,11 +12,10 @@
|
||||
return this;
|
||||
};
|
||||
}(jQuery));
|
||||
|
||||
function DataVM() {
|
||||
'use strict';
|
||||
var self = this;
|
||||
self.endpointUrl = 'http://localhost:8800/api';
|
||||
self.endpointUrl = 'http://192.168.1.178:3000';
|
||||
self.menuOptions = ['Users', 'Data', 'Other'];
|
||||
self.chosenMenuItemId = ko.observable();
|
||||
self.userList = ko.observable();
|
||||
@ -24,10 +23,11 @@ function DataVM() {
|
||||
self.chosenMenuData = ko.observable();
|
||||
self.userTimeLogData = ko.observable();
|
||||
self.unassignedCardData = ko.observable();
|
||||
self.goToMenuOption = function (menu) { location.hash = menu; console.log(menu); };
|
||||
self.selectedCalendarWeek = ko.observable(0);
|
||||
|
||||
self.goToMenuOption = function (menu) { location.hash = menu; console.log("goToMenuOption: " + menu); };
|
||||
self.goToUserDetails = function (user) { location.hash = 'userData/' + user.Id; };
|
||||
self.goToTimeLogs = function (user) { console.log("getTimeLogs"); location.hash = 'timeLogs/' + user.Id; };
|
||||
//$.each(self.unassignedCardData().data, function(k,v){ if(v.IsSelected == true){console.log(v.CardUId);}})
|
||||
//this function looks for a custom attribute called "pagedestination".
|
||||
//if this is used as a clickhandler, the pagedestination attribute should name the page you want.
|
||||
self.returnButtonClick = function (data, event) {
|
||||
@ -44,12 +44,9 @@ function DataVM() {
|
||||
console.log(destination);
|
||||
self.goToMenuOption(destination); //redirect to whereever the button is telling us to go..
|
||||
};
|
||||
self.addNewUserClick = function (data, event) {
|
||||
self.goToMenuOption("newUser");
|
||||
};
|
||||
self.getUserData = function () {
|
||||
self.getUserList = function () {
|
||||
console.log("beginGetUserData");
|
||||
$.getJSON(self.endpointUrl + '/users?callback=?', function (res) {
|
||||
$.getJSON(self.endpointUrl + '/userstest?callback=?', function (res) {
|
||||
console.log("getting user data");
|
||||
console.log(res);
|
||||
self.userList(res);
|
||||
@ -84,7 +81,7 @@ function DataVM() {
|
||||
.fail(function () {
|
||||
console.log("error - post edited user");
|
||||
console.log(self.chosenUserDetails().Id);
|
||||
self.goToUserData(self.chosenUserDetails().Id);
|
||||
self.goToUserDetails(self.chosenUserDetails().Id);
|
||||
});
|
||||
};
|
||||
self.getTimeLogData = function (userId) {
|
||||
@ -116,57 +113,98 @@ function DataVM() {
|
||||
Sammy(function () {
|
||||
this.get('#Users', function () {
|
||||
console.log(this.params.menuOption);
|
||||
self.chosenMenuItemId(this.params.menuOption);
|
||||
self.chosenMenuItemId('Users');
|
||||
self.chosenUserDetails(null);
|
||||
self.userList(null);
|
||||
self.userTimeLogData(null);
|
||||
self.getUserData();
|
||||
self.getUserList();
|
||||
//$.get("http://localhost:3000", { menu: this.params.menu }, self.chosenMenuData);
|
||||
});
|
||||
this.get('#userData/:userId', function () {
|
||||
console.log("userData userId: " + this.params.userId);
|
||||
console.log("getting details for user: " + this.params.userId);
|
||||
self.chosenMenuItemId('Data');
|
||||
self.chosenMenuItemId('Data'); //todo: change this! (replace with actual get timelogs call)
|
||||
self.userList(null);
|
||||
self.getUserDetails(this.params.userId);
|
||||
self.userTimeLogData(null);
|
||||
self.getUnassignedCardData();
|
||||
//$.get("http://localhost:3000", { menu: this.params.menu }, self.chosenMenuData);
|
||||
});
|
||||
this.get('#timeLogs/:userId', function () {
|
||||
console.log("get user time logs, userID: " + this.params.userId);
|
||||
self.chosenMenuItemId('TimeLogs');
|
||||
self.chosenMenuItemId('Other');
|
||||
self.userList(null);
|
||||
self.chosenUserDetails(null);
|
||||
self.getTimeLogData(this.params.userId);
|
||||
//self.selectedCalendarWeek = 0;
|
||||
//self.getTimeLogData(this.params.userId);
|
||||
self.userTimeLogData({ "test": 0 });
|
||||
self.initDatePicker();
|
||||
//$( "#datepicker" ).datepicker();
|
||||
});
|
||||
this.get('#newUser', function () {
|
||||
console.log("creating new user");
|
||||
self.chosenMenuItemId('newUser');
|
||||
self.userList(null);
|
||||
self.userTimeLogData(null);
|
||||
self.chosenUserDetails(
|
||||
{
|
||||
"Id": -1,
|
||||
"UserId": -1,
|
||||
"FirstName": null,
|
||||
"LastName": null,
|
||||
"HoursPerWeek": null
|
||||
});
|
||||
self.chosenUserDetails({
|
||||
"Id": -1,
|
||||
"UserId": -1,
|
||||
"FirstName": null,
|
||||
"LastName": null,
|
||||
"HoursPerWeek": null,
|
||||
"AssociatedCards": null
|
||||
});
|
||||
self.getUnassignedCardData();
|
||||
});
|
||||
this.get('#stats', function () { });
|
||||
this.post('#edituser', function (context) {
|
||||
$.each(self.chosenUserDetails().AssociatedCards, function (k, v) {
|
||||
if (v.IsSelected !== true) {
|
||||
console.log("removing..");
|
||||
self.chosenUserDetails().AssociatedCards.splice(k, 1);
|
||||
console.log(v.CardUId);
|
||||
}
|
||||
});
|
||||
$.each(self.unassignedCardData().data, function (k, v) {
|
||||
if (v.IsSelected == true) {
|
||||
self.chosenUserDetails().AssociatedCards.push(v);
|
||||
console.log(v.CardUId);
|
||||
}
|
||||
});
|
||||
console.log(self.chosenUserDetails());
|
||||
self.handleEditedUser(self.chosenUserDetails());
|
||||
return true;
|
||||
});
|
||||
//default route (home page)
|
||||
this.get('', function () { this.app.runRoute('get', '#Users') });
|
||||
}).run();
|
||||
}
|
||||
DataVM.prototype.dispose = function () {
|
||||
'use strict';
|
||||
//window.clearInterval(self.locationTimerHandle);
|
||||
//window.clearInterval(self.weatherTimerHandle);
|
||||
//self.chart.destroy();
|
||||
self.initDatePicker = function () {
|
||||
"use strict";
|
||||
//Initialize the datePicker(I have taken format as mm-dd-yyyy, you can
|
||||
//have your owh)
|
||||
$('#weeklyDatePicker').datepicker({
|
||||
weekStart: 1,
|
||||
maxViewMode: 2,
|
||||
endDate: "+0d",
|
||||
todayBtn: true,
|
||||
format: "yyyy-mm-dd",
|
||||
todayHighlight: true,
|
||||
calendarWeeks: true
|
||||
});
|
||||
$('#weeklyDatePicker').on('changeDate', function (e) {
|
||||
"use strict";
|
||||
console.log("in here2");
|
||||
var kk = e.date;
|
||||
console.log(kk);
|
||||
console.log(
|
||||
"1: Iso Week Number: " + moment(kk).isoWeek() + " of " +
|
||||
moment(kk).weeksInYear()
|
||||
);
|
||||
console.log(self.selectedCalendarWeek());
|
||||
self.selectedCalendarWeek(moment(kk).isoWeek());
|
||||
console.log(self.selectedCalendarWeek());
|
||||
});
|
||||
console.log("finished init");
|
||||
};
|
||||
};
|
||||
|
||||
ko.applyBindings(new DataVM());
|
||||
Loading…
Reference in New Issue
Block a user