jdb/personal-display
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

AJAX calls are now async.

Browse Source 
* JS file is now versioned.
* AJAX calls are now asynchronous (since many browsers no longer support
  synchronous calls).
This commit is contained in:
Jonathan Bernard 2014-09-06 22:15:06 -05:00
parent 64e90eaeb5
commit 7ba8d76843
3 changed files with 60 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
Makefile
View File

@ -1,17 +1,19 @@
VERSION =1.4 VERSION =1.5
BUILD_NUMBER_FILE = build-number.txt BUILD_NUMBER_FILE = build-number.txt
BUILD_NUMBER = $$(cat $(BUILD_NUMBER_FILE)) BUILD_NUMBER = $$(cat $(BUILD_NUMBER_FILE))
build : increment-build-number build : increment-build-number
mkdir -p build/css mkdir -p build/css
mkdir -p build/js
cp src/www/*.* build cp src/www/*.* build
cp -r src/www/js build
cp -r resources/* build/. cp -r resources/* build/.
cp src/www/js/personal-display.js build/js/personal-display-$(VERSION).$(BUILD_NUMBER)js
sed -i "s/%VERSION%/$(VERSION).$(BUILD_NUMBER)/g" build/index.html
sass src/www/css/personal-display.scss build/css/personal-display.css sass src/www/css/personal-display.scss build/css/personal-display.css
tar czf personal-display-$(VERSION).$(BUILD_NUMBER).tar.gz build tar czf personal-display-$(VERSION).$(BUILD_NUMBER).tar.gz build
clean : clean :
rm -r build -rm -r build
local-deploy: build local-deploy: build
cp -r build ~/temp/server cp -r build ~/temp/server

4
src/www/index.html
View File

@ -18,10 +18,10 @@
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone.js" defer></script> <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone.js" defer></script>
--> -->
<script src="js/personal-display.js" type="text/javascript" defer></script> <script src="js/personal-display-%VERSION%.js" type="text/javascript" defer></script>
<meta name="viewport" content="width=device-width, user-scalable=no"> <meta name="viewport" content="width=device-width, user-scalable=no">
<meta name=version content="1.4"> <meta name=version content="1.5">
</head> </head>
<body> <body>
<section id=current-task> <section id=current-task>

102
src/www/js/personal-display.js
View File

@ -2,7 +2,7 @@
var root = this; var root = this;
var PD = root.PersonalDisplay = {}; var PD = root.PersonalDisplay = {};
PD.version = "1.4" PD.version = "1.5"
PD.hasHTML5LocalStorage = function() { PD.hasHTML5LocalStorage = function() {
try { try {
@ -171,7 +171,6 @@
xhrFields: { withCredentials: true }, xhrFields: { withCredentials: true },
processData: false, processData: false,
type: 'POST', type: 'POST',
async: false,
data: JSON.stringify( data: JSON.stringify(
{"username": username, "password": password}), {"username": username, "password": password}),
@ -183,7 +182,10 @@
else { $(".validate-tips").text("There was an error " + else { $(".validate-tips").text("There was an error " +
"trying to log into the TimeStamper service: " + "trying to log into the TimeStamper service: " +
error); } error); }
PD.tsAuth = false; }, PD.tsAuth = false;
// Hide the wait overlay.
this.$el.find(".wait-overlay").fadeOut(); },
success: function(data, textStatus, jqXHR) { success: function(data, textStatus, jqXHR) {
PD.tsAuth = true; PD.tsAuth = true;
@ -192,11 +194,10 @@
// Load the user's timelines. // Load the user's timelines.
PD.configDialog.loadTsData(host, username); PD.configDialog.loadTsData(host, username);
}
});
// Success or failure we hide the wait overlay. // Hide the wait overlay.
this.$el.find(".wait-overlay").fadeOut(); this.$el.find(".wait-overlay").fadeOut(); }
});
}, },
@ -217,7 +218,6 @@
xhrFields: { withCredentials: true }, xhrFields: { withCredentials: true },
processData: false, processData: false,
type: 'POST', type: 'POST',
async: false,
data: JSON.stringify( data: JSON.stringify(
{"username": username, "password": password}), {"username": username, "password": password}),
@ -229,61 +229,72 @@
else { $(".validate-tips").text("There was an error " + else { $(".validate-tips").text("There was an error " +
"trying to log into the Getting Things Done service: " + "trying to log into the Getting Things Done service: " +
error); } error); }
PD.gtdAuth = false; }, PD.gtdAuth = false;
this.$el.find(".wait-overlay").fadeOut(); },
success: function(data, textStatus, jqXHR) { success: function(data, textStatus, jqXHR) {
PD.gtdAuth = true; PD.gtdAuth = true;
$(".validate-tips").text(""); $(".validate-tips").text("");
PD.configDialog.loadGtdData(host); } PD.configDialog.loadGtdData(host);
this.$el.find(".wait-overlay").fadeOut(); }
}); });
this.$el.find(".wait-overlay").fadeOut();
}, },
loadTsData: function(host, username) { loadTsData: function(host, username) {
var thisView = this;
// (Re)load the user's timelines. // (Re)load the user's timelines.
PD.tsCfg.timelines = JSON.parse($.ajax({ $.ajax({
url: 'https://' + host + '/ts_api/timelines/' + username, url: 'https://' + host + '/ts_api/timelines/' + username,
xhrFields: { withCredentials: true }, xhrFields: { withCredentials: true },
async: false}).responseText); success: function(data, textStatus, jqXHR) {
debugger;
PD.tsCfg.timelines = data;
// Populate the available timelines list. // Populate the available timelines list.
var $timelineSelectEl = this.$el.find(".timestamper-config .timeline"); var $timelineSelectEl = $(".timestamper-config .timeline");
$timelineSelectEl.empty();
_.forEach(PD.tsCfg.timelines, function(timeline) { $timelineSelectEl.empty();
var $optionEl = $(document.createElement("option")); _.forEach(PD.tsCfg.timelines, function(timeline) {
$optionEl.attr("value", timeline.id); var $optionEl = $(document.createElement("option"));
$optionEl.text(timeline.description); $optionEl.attr("value", timeline.id);
$timelineSelectEl.append($optionEl); }); }, $optionEl.text(timeline.description);
$timelineSelectEl.append($optionEl); });
}}); },
loadGtdData: function(host) { loadGtdData: function(host) {
// Load the user's contexts // Load the user's contexts
PD.gtdCfg.contexts = JSON.parse($.ajax({ var contextedLoaded = $.ajax({
url: 'http://' + host + '/gtd/contexts', url: 'http://' + host + '/gtd/contexts',
xhrFields: { withCredentials: true }, xhrFields: { withCredentials: true },
async: false }).responseText); success: function(data, textStatus, jqXHR) {
PD.gtdCfg.contexts = data;} });
// Load the user's projects // Load the user's projects
PD.gtdCfg.projects = JSON.parse($.ajax({ var projectsLoaded = $.ajax({
url: 'http://' + host + '/gtd/projects', url: 'http://' + host + '/gtd/projects',
xhrFields: { withCredentials: true }, xhrFields: { withCredentials: true },
async: false }).responseText); success: function(data, statuxText, jqXHR) {
PD.gtdCfg.projects = data;} });
// Populate the available contexts and projects drop-down. $.when(contextLoaded, projectsLoaded).then(function() {
var $categorySelectEl = $(".gtd-config .category") // Populate the available contexts and projects drop-down.
$categorySelectEl.empty(); var $categorySelectEl = $(".gtd-config .category")
$categorySelectEl.append( $categorySelectEl.empty();
"<option class=default-option value='none'>" + $categorySelectEl.append(
"Add a category...</option>"); "<option class=default-option value='none'>" +
_.forEach(PD.gtdCfg.contexts.concat(PD.gtdCfg.projects), "Add a category...</option>");
function(category) { _.forEach(PD.gtdCfg.contexts.concat(PD.gtdCfg.projects),
var $optionEl = $(document.createElement("option")); function(category) {
$optionEl.attr("value", category.id); var $optionEl = $(document.createElement("option"));
$optionEl.text(category.id); $optionEl.attr("value", category.id);
$categorySelectEl.append($optionEl); }); $optionEl.text(category.id);
$categorySelectEl[0].selectedIndex = 0; }, $categorySelectEl.append($optionEl); });
$categorySelectEl[0].selectedIndex = 0; }},
makeCategoryItem: function(catName) { makeCategoryItem: function(catName) {
var $liEl = $( var $liEl = $(
@ -394,7 +405,6 @@
xhrFields: { withCredentials: true }, xhrFields: { withCredentials: true },
processData: false, processData: false,
type: "POST", type: "POST",
async: false,
data: JSON.stringify( data: JSON.stringify(
{ "username": PD.tsCfg.username, { "username": PD.tsCfg.username,
@ -416,7 +426,6 @@
xhrFields: { withCredentials: true }, xhrFields: { withCredentials: true },
processData: false, processData: false,
type: "POST", type: "POST",
async: false,
data: JSON.stringify( data: JSON.stringify(
{ "username": PD.gtdCfg.username, { "username": PD.gtdCfg.username,
@ -451,12 +460,10 @@
if (jqXHR.status == 401) { PD.tsAuth = false; } if (jqXHR.status == 401) { PD.tsAuth = false; }
else { else {
alert("Unable to retrieve current timestamp: " + errorText); alert("Unable to retrieve current timestamp: " + errorText);
PD.configDialog.show(); } PD.configDialog.show(); } },
},
success: function(data, textStatus, jqXHR) { success: function(data, textStatus, jqXHR) {
PD.currentActivityModel.set(data[0]); } PD.currentActivityModel.set(data[0]); } });
});
// Get the list of GTD entries for each of our categories. // Get the list of GTD entries for each of our categories.
var categories = _.reduce( var categories = _.reduce(
@ -476,8 +483,7 @@
else if (jqXHR.status == 500) { return; } else if (jqXHR.status == 500) { return; }
else { else {
alert("Unable to retrieve next actions: " + errorText); alert("Unable to retrieve next actions: " + errorText);
PD.configDialog.show(); } PD.configDialog.show(); } },
},
success: function(data, textStatus, jqXHR) { success: function(data, textStatus, jqXHR) {
var collection = PD.gtdNextActionCollection; var collection = PD.gtdNextActionCollection;
@ -497,9 +503,7 @@
// longer in our retrieved data and remove them. // longer in our retrieved data and remove them.
collection.forEach(function(model) { collection.forEach(function(model) {
if (!_.any(data, model.equals)) { if (!_.any(data, model.equals)) {
collection.remove(model); }}); collection.remove(model); }}); } });
}
});
if (evt) evt.preventDefault(); if (evt) evt.preventDefault();
}, },