diff --git a/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.js b/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.js index f4ecdb4..0610c00 100644 --- a/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.js +++ b/DataCenter_Windows/WindowsDataCenter/WindowsDataCenter/www/spa.js @@ -1,52 +1,86 @@ -(function ($) { - 'use strict'; - $.fn.clickToggle = function (func1, func2) { - var funcs = [func1, func2]; - this.data('toggleclicked', 0); - this.click(function () { - var data = $(this).data(); - var tc = data.toggleclicked; - $.proxy(funcs[tc], this)(); - data.toggleclicked = (tc + 1) % 2; - }); - return this; - }; -}(jQuery)); +//(function ($) { +// "use strict"; +// $.fn.clickToggle = function (func1, func2) { +// var funcs = [func1, func2]; +// this.data("toggleclicked", 0); +// this.click(function () { +// var data = $(this).data(); +// var tc = data.toggleclicked; +// $.proxy(funcs[tc], this)(); +// data.toggleclicked = (tc + 1) % 2; +// }); +// return this; +// }; +//}(jQuery)); function DataVM() { - 'use strict'; + "use strict"; var self = this; - self.endpointUrl = 'http://192.168.1.178:3000'; - self.menuOptions = ['Users', 'Data', 'Other']; + self.menuOptions = ["Users", "Data", "Stats", "Other"]; self.chosenMenuItemId = ko.observable(); - self.userList = ko.observable(); - self.chosenUserDetails = ko.observable(); - self.chosenMenuData = ko.observable(); - self.userTimeLogData = ko.observable(); - self.unassignedCardData = ko.observable(); + self.userList = ko.observable(null); + self.chosenUserDetails = ko.observable(null); + self.userTimeLogData = ko.observable(null); + self.unassignedCardData = ko.observable(null); self.selectedCalendarWeek = ko.observable(0); - + self.apiEndpoints = { + root: "http://160.100.28.242:3000", + getUserList: "/userstest", + getUserDetails: "/users", + editUser: "/users/edit", + getTimeLogs: "/timelogs", + getUnassignedCards: "/unassignedcards" + }; + self.uiPages = { + users: "users", + userDetails: "userData", + timeLogs: "timelogs", + home: this.users + }; 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; }; + self.goToUserDetails = function (user) { location.hash = self.uiPages.userDetails + "/" + user.Id; }; + self.goToTimeLogs = function (user) { location.hash= "timelogs" + "/" + user.Id; }; + self.createRequestUrl = function (routePath, params, requiresCallback) { + var appender = "?"; + var url = self.apiEndpoints.root + routePath; + if (params !== undefined + && params !== null) { + if (params.length > 0) { + for (var i = 0; i < params.length; i++) { + url += appender + params[i].key + "=" + params[i].value; + appender = "&"; + } + } + } + if (requiresCallback) { + url += appender + "callback=?"; + } + return url; + }; //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) { - var target; + var target = null; if (event.target) target = event.target; else if (event.srcElement) target = event.srcElement; var destination = ""; - for (var i = 0; i < target.attributes.length; i++) { - if (target.attributes[i].nodeName === "pagedestination") { - destination = target.attributes[i].value; - break; + if (target != null) { + for (var i = 0; i < target.attributes.length; i++) { + if (target.attributes[i].nodeName === "pagedestination") { + destination = target.attributes[i].value; + break; + } } + console.log(destination); + self.goToMenuOption(destination); //redirect to whereever the button is telling us to go.. + } else { + console.log("target is null, going nowhere"); } - console.log(destination); - self.goToMenuOption(destination); //redirect to whereever the button is telling us to go.. }; self.getUserList = function () { console.log("beginGetUserData"); - $.getJSON(self.endpointUrl + '/userstest?callback=?', function (res) { + var url = self.createRequestUrl(self.apiEndpoints.getUserList, null, true); + console.log(url); + $.getJSON(url, function (res) { console.log("getting user data"); console.log(res); self.userList(res); @@ -56,9 +90,10 @@ function DataVM() { }; self.getUserDetails = function (userId) { console.log("beginGetUserDetailsData"); - var url = self.endpointUrl + '/users/' + userId; + //var url = self.apiEndpoints.root + self.apiEndpoints.getUserDetails + "/" + userId; + var url = self.createRequestUrl(self.apiEndpoints.getUserDetails + "/" + userId, null, true); console.log(url); - $.getJSON(url + '?callback=?', function (res) { + $.getJSON(url, function (res) { console.log("got user data"); //console.log(res); self.chosenUserDetails(res); @@ -69,13 +104,14 @@ function DataVM() { }; self.handleEditedUser = function (user) { console.log("Post Edited User: " + user.Id); - var url = self.endpointUrl + '/users/edit'; - console.log("posting.."); + //var url = self.apiEndpoints.root + self.apiEndpoints.editUser; + var url = self.createRequestUrl(self.apiEndpoints.editUser, null, true); + console.log("posting to.." + url); $.post(url, user, function () { console.log("finished posting.."); - }, 'json') + }, "json") .done(function () { - self.goToMenuOption("Users"); + self.goToMenuOption("users"); self.chosenUserDetails(null); }) .fail(function () { @@ -84,64 +120,64 @@ function DataVM() { self.goToUserDetails(self.chosenUserDetails().Id); }); }; - self.getTimeLogData = function (userId) { + self.getTimeLogData = function (userId, calendarWeek) { console.log("begin get TimeLog Data"); - var url = self.endpointUrl + '/timelogs?userId=' + userId; - console.log(url); - $.getJSON(url + '&callback=?', function (res) { + var url = self.createRequestUrl(self.apiEndpoints.getTimeLogs, + [{ key: "userId", value: userId }, { key: "calendarWeek", value: calendarWeek }], + true); + $.getJSON(url, function (res) { console.log("got user timelog data"); //console.log(res); self.userTimeLogData(res); - //console.log(self.chosenUserDetails()); }).fail(function () { console.log("error - getuserdetails"); + self.goToMenuOption(self.uiPages.home); //go home. }); }; self.getUnassignedCardData = function () { console.log("begin get unassigned cards"); - var url = self.endpointUrl + '/unassignedCards'; - console.log(url); - $.getJSON(url + '?callback=?', function (res) { + var url = self.createRequestUrl(self.apiEndpoints.getUnassignedCards, null, true); + $.getJSON(url, function (res) { console.log("got unassigned card data"); //console.log(res); self.unassignedCardData(res); - //console.log(self.chosenUserDetails()); }).fail(function () { console.log("error - getuserdetails"); + self.goToMenuOption(self.uiPages.home); //go home. }); }; Sammy(function () { - this.get('#Users', function () { + this.get("#users", function () { console.log(this.params.menuOption); - self.chosenMenuItemId('Users'); + self.chosenMenuItemId("Users"); self.chosenUserDetails(null); self.userList(null); self.userTimeLogData(null); self.getUserList(); //$.get("http://localhost:3000", { menu: this.params.menu }, self.chosenMenuData); }); - this.get('#userData/:userId', function () { + this.get("#userData/:userId", function () { console.log("userData userId: " + this.params.userId); console.log("getting details for user: " + this.params.userId); - self.chosenMenuItemId('Data'); //todo: change this! (replace with actual get timelogs call) + 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 () { + this.get("#timelogs/:userId", function () { console.log("get user time logs, userID: " + this.params.userId); self.chosenMenuItemId('Other'); self.userList(null); self.chosenUserDetails(null); //self.selectedCalendarWeek = 0; - //self.getTimeLogData(this.params.userId); + self.getTimeLogData(this.params.userId, self.selectedCalendarWeek()); self.userTimeLogData({ "test": 0 }); self.initDatePicker(); //$( "#datepicker" ).datepicker(); }); - this.get('#newUser', function () { + this.get("#newUser", function () { console.log("creating new user"); self.chosenMenuItemId('newUser'); self.userList(null); @@ -156,8 +192,10 @@ function DataVM() { }); self.getUnassignedCardData(); }); - this.get('#stats', function () { }); - this.post('#edituser', function (context) { + this.get("#stats", function() { + self.goToMenuOption("users"); + }); + this.post("#edituser", function (context) { $.each(self.chosenUserDetails().AssociatedCards, function (k, v) { if (v.IsSelected !== true) { console.log("removing.."); @@ -176,13 +214,13 @@ function DataVM() { return true; }); //default route (home page) - this.get('', function () { this.app.runRoute('get', '#Users') }); + this.get("", function () { this.app.runRoute("get", "#" + self.uiPages.users) }); }).run(); self.initDatePicker = function () { "use strict"; //Initialize the datePicker(I have taken format as mm-dd-yyyy, you can //have your owh) - $('#weeklyDatePicker').datepicker({ + $("#weeklyDatePicker").datepicker({ weekStart: 1, maxViewMode: 2, endDate: "+0d", @@ -191,7 +229,7 @@ function DataVM() { todayHighlight: true, calendarWeeks: true }); - $('#weeklyDatePicker').on('changeDate', function (e) { + $("#weeklyDatePicker").on("changeDate", function (e) { "use strict"; console.log("in here2"); var kk = e.date; @@ -200,11 +238,11 @@ function DataVM() { "1: Iso Week Number: " + moment(kk).isoWeek() + " of " + moment(kk).weeksInYear() ); - console.log(self.selectedCalendarWeek()); + console.log("before: " + self.selectedCalendarWeek()); self.selectedCalendarWeek(moment(kk).isoWeek()); - console.log(self.selectedCalendarWeek()); + console.log("after: " + self.selectedCalendarWeek()); }); - console.log("finished init"); + //console.log("finished init"); }; }; ko.applyBindings(new DataVM()); \ No newline at end of file