-
+
@@ -89,15 +96,147 @@
-
-
-
-
+
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Content
+
+
+
+ | Day Of Week |
+ In |
+ Out |
+ In |
+ Out |
+ In |
+ Out |
+ Sub-Total |
+
+
+
+
+ | Monday |
+ |
+ |
+ |
+ |
+ |
+ |
+ 8 |
+
+
+ | Tuesday |
+ |
+ |
+ |
+ |
+ |
+ |
+ 8 |
+
+
+ | Wednesday |
+ |
+ |
+ |
+ |
+ |
+ |
+ 8 |
+
+
+ | Thursday |
+ |
+ |
+ |
+ |
+ |
+ |
+ 8 |
+
+
+ | Friday |
+ |
+ |
+ |
+ |
+ |
+ |
+ 8 |
+
+
+ | Weekly Total |
+ 37 |
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.css b/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.css
index aa309c1..583e3ae 100644
--- a/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.css
+++ b/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.css
@@ -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
- 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;
}
\ No newline at end of file
diff --git a/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.js b/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.js
index ed4a012..f4ecdb4 100644
--- a/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.js
+++ b/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.js
@@ -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());
\ No newline at end of file