From 840039958abd5a2d7398ff69acc034a82d997a98 Mon Sep 17 00:00:00 2001 From: Marcin Kurczewski Date: Thu, 4 Sep 2014 18:06:25 +0200 Subject: [PATCH] Fixed promises on Internet Explorer --- public_html/index.html | 1 + public_html/js/Api.js | 4 +- public_html/js/Auth.js | 37 ++++++------ public_html/js/Bootstrap.js | 10 ++-- public_html/js/Presenters/LoginPresenter.js | 5 +- public_html/js/Presenters/LogoutPresenter.js | 5 +- .../js/Presenters/PagedCollectionPresenter.js | 32 ++++++----- .../js/Presenters/RegistrationPresenter.js | 3 +- .../js/Presenters/TopNavigationPresenter.js | 4 +- .../js/Presenters/UserListPresenter.js | 4 +- public_html/js/Promise.js | 28 ++++++++++ public_html/js/Util.js | 56 +++++++++---------- 12 files changed, 112 insertions(+), 77 deletions(-) create mode 100644 public_html/js/Promise.js diff --git a/public_html/index.html b/public_html/index.html index c3e85446..38966ca9 100644 --- a/public_html/index.html +++ b/public_html/index.html @@ -28,6 +28,7 @@ + diff --git a/public_html/js/Api.js b/public_html/js/Api.js index ebad8e44..5635cef7 100644 --- a/public_html/js/Api.js +++ b/public_html/js/Api.js @@ -1,6 +1,6 @@ var App = App || {}; -App.API = function() { +App.API = function(promise) { var baseUrl = '/api/'; @@ -24,7 +24,7 @@ App.API = function() { var fullUrl = baseUrl + '/' + url; fullUrl = fullUrl.replace(/\/{2,}/, '/'); - return new Promise(function(resolve, reject) { + return promise.make(function(resolve, reject) { $.ajax({ success: function(data, textStatus, xhr) { resolve({ diff --git a/public_html/js/Auth.js b/public_html/js/Auth.js index 6128fd44..432192c3 100644 --- a/public_html/js/Auth.js +++ b/public_html/js/Auth.js @@ -1,10 +1,10 @@ var App = App || {}; -App.Auth = function(jQuery, api, appState) { +App.Auth = function(jQuery, util, api, appState, promise) { function loginFromCredentials(userName, password, remember) { - return new Promise(function(resolve, reject) { - api.post('/login', {userName: userName, password: password}) + return promise.make(function(resolve, reject) { + promise.wait(api.post('/login', {userName: userName, password: password})) .then(function(response) { updateAppState(response); jQuery.cookie( @@ -12,38 +12,38 @@ App.Auth = function(jQuery, api, appState) { response.json.token.name, remember ? { expires: 365 } : {}); resolve(response); - }).catch(function(response) { + }).fail(function(response) { reject(response); }); }); }; function loginFromToken(token) { - return new Promise(function(resolve, reject) { - api.post('/login', {token: token}) + return promise.make(function(resolve, reject) { + promise.wait(api.post('/login', {token: token})) .then(function(response) { updateAppState(response); resolve(response); - }).catch(function(response) { + }).fail(function(response) { reject(response); }); }); }; function loginAnonymous() { - return new Promise(function(resolve, reject) { - api.post('/login') + return promise.make(function(resolve, reject) { + promise.wait(api.post('/login')) .then(function(response) { updateAppState(response); resolve(response); - }).catch(function(response) { + }).fail(function(response) { reject(response); }); }); }; function logout() { - return new Promise(function(resolve, reject) { + return promise.make(function(resolve, reject) { appState.set('loggedIn', false); appState.set('loginToken', null); jQuery.removeCookie('auth'); @@ -52,7 +52,7 @@ App.Auth = function(jQuery, api, appState) { }; function tryLoginFromCookie() { - return new Promise(function(resolve, reject) { + return promise.make(function(resolve, reject) { if (appState.get('loggedIn')) { resolve(); return; @@ -64,12 +64,13 @@ App.Auth = function(jQuery, api, appState) { return; } - loginFromToken(authCookie).then(function(response) { - resolve(); - }).catch(function(response) { - jQuery.removeCookie('auth'); - reject(); - }); + promise.wait(loginFromToken(authCookie)) + .then(function(response) { + resolve(); + }).fail(function(response) { + jQuery.removeCookie('auth'); + reject(); + }); }); }; diff --git a/public_html/js/Bootstrap.js b/public_html/js/Bootstrap.js index 0346ba1c..7d755845 100644 --- a/public_html/js/Bootstrap.js +++ b/public_html/js/Bootstrap.js @@ -1,15 +1,15 @@ var App = App || {}; -App.Bootstrap = function(auth, router, util) { +App.Bootstrap = function(auth, router, util, promise) { util.initPresenter(function() { return App.DI.get('topNavigationPresenter'); }); - auth.tryLoginFromCookie() + promise.wait(auth.tryLoginFromCookie()) .then(startRouting) - .catch(function(error) { - auth.loginAnonymous() + .fail(function(error) { + promise.wait(auth.loginAnonymous()) .then(startRouting) - .catch(function(response) { + .fail(function(response) { console.log(response); alert('Fatal authentication error: ' + response.json.error); }); diff --git a/public_html/js/Presenters/LoginPresenter.js b/public_html/js/Presenters/LoginPresenter.js index 9a678773..b41122af 100644 --- a/public_html/js/Presenters/LoginPresenter.js +++ b/public_html/js/Presenters/LoginPresenter.js @@ -8,6 +8,7 @@ App.Presenters.LoginPresenter = function( messagePresenter, auth, router, + promise, appState) { var $el = jQuery('#content'); @@ -16,7 +17,7 @@ App.Presenters.LoginPresenter = function( function init() { topNavigationPresenter.select('login'); - util.loadTemplate('login-form').then(function(html) { + promise.wait(util.promiseTemplate('login-form')).then(function(html) { template = _.template(html); if (appState.get('loggedIn')) router.navigateToMainPage(); @@ -46,7 +47,7 @@ App.Presenters.LoginPresenter = function( .then(function(response) { router.navigateToMainPage(); //todo: "redirect" to main page - }).catch(function(response) { + }).fail(function(response) { messagePresenter.showError($messages, response.json && response.json.error || response); }); } diff --git a/public_html/js/Presenters/LogoutPresenter.js b/public_html/js/Presenters/LogoutPresenter.js index b3383d03..232df931 100644 --- a/public_html/js/Presenters/LogoutPresenter.js +++ b/public_html/js/Presenters/LogoutPresenter.js @@ -6,17 +6,18 @@ App.Presenters.LogoutPresenter = function( topNavigationPresenter, messagePresenter, auth, + promise, router) { var $messages = jQuery('#content'); function init() { topNavigationPresenter.select('logout'); - auth.logout().then(function() { + promise.wait(auth.logout()).then(function() { $messages.empty(); var $messageDiv = messagePresenter.showInfo($messages, 'Logged out. Back to main page'); $messageDiv.find('a').click(mainPageLinkClicked); - }).catch(function(response) { + }).fail(function(response) { messagePresenter.showError($messages, response.json && response.json.error || response); }); } diff --git a/public_html/js/Presenters/PagedCollectionPresenter.js b/public_html/js/Presenters/PagedCollectionPresenter.js index b54897e2..a7bee8bf 100644 --- a/public_html/js/Presenters/PagedCollectionPresenter.js +++ b/public_html/js/Presenters/PagedCollectionPresenter.js @@ -1,7 +1,7 @@ var App = App || {}; App.Presenters = App.Presenters || {}; -App.Presenters.PagedCollectionPresenter = function(api, util) { +App.Presenters.PagedCollectionPresenter = function(api, util, promise) { var searchOrder; var searchQuery; @@ -20,7 +20,7 @@ App.Presenters.PagedCollectionPresenter = function(api, util) { backendUri = args.backendUri; renderCallback = args.renderCallback; - util.loadTemplate('pager').then(function(html) { + promise.wait(util.promiseTemplate('pager')).then(function(html) { template = _.template(html); //renderCallback({entities: [], totalRecords: 0}); @@ -31,19 +31,21 @@ App.Presenters.PagedCollectionPresenter = function(api, util) { function changePage(newPageNumber) { pageNumber = newPageNumber; - api.get(backendUri, { - order: searchOrder, - query: searchQuery, - page: pageNumber - }).then(function(response) { - totalRecords = response.json.totalRecords; - pageSize = response.json.pageSize; - renderCallback({ - entities: response.json.data, - totalRecords: response.json.totalRecords}); - }).catch(function(response) { - console.log(Error(response.json && response.json.error || response)); - }); + promise.wait( + api.get(backendUri, { + order: searchOrder, + query: searchQuery, + page: pageNumber + })) + .then(function(response) { + totalRecords = response.json.totalRecords; + pageSize = response.json.pageSize; + renderCallback({ + entities: response.json.data, + totalRecords: response.json.totalRecords}); + }).fail(function(response) { + console.log(Error(response.json && response.json.error || response)); + }); } function render($target) { diff --git a/public_html/js/Presenters/RegistrationPresenter.js b/public_html/js/Presenters/RegistrationPresenter.js index 8f6f656f..8df02a61 100644 --- a/public_html/js/Presenters/RegistrationPresenter.js +++ b/public_html/js/Presenters/RegistrationPresenter.js @@ -4,6 +4,7 @@ App.Presenters = App.Presenters || {}; App.Presenters.RegistrationPresenter = function( jQuery, util, + promise, topNavigationPresenter, messagePresenter, api) { @@ -13,7 +14,7 @@ App.Presenters.RegistrationPresenter = function( function init() { topNavigationPresenter.select('register'); - util.loadTemplate('registration-form').then(function(html) { + promise.wait(util.promiseTemplate('registration-form')).then(function(html) { template = _.template(html); render(); }); diff --git a/public_html/js/Presenters/TopNavigationPresenter.js b/public_html/js/Presenters/TopNavigationPresenter.js index f8bd0de7..d154907d 100644 --- a/public_html/js/Presenters/TopNavigationPresenter.js +++ b/public_html/js/Presenters/TopNavigationPresenter.js @@ -1,14 +1,14 @@ var App = App || {}; App.Presenters = App.Presenters || {}; -App.Presenters.TopNavigationPresenter = function(util, jQuery, appState) { +App.Presenters.TopNavigationPresenter = function(util, jQuery, appState, promise) { var selectedElement = null; var $el = jQuery('#top-navigation'); var template; function init() { - util.loadTemplate('top-navigation').then(function(html) { + promise.wait(util.promiseTemplate('top-navigation')).then(function(html) { template = _.template(html); render(); appState.startObserving('loggedIn', 'top-navigation', loginStateChanged); diff --git a/public_html/js/Presenters/UserListPresenter.js b/public_html/js/Presenters/UserListPresenter.js index f2b77c77..b1892dbb 100644 --- a/public_html/js/Presenters/UserListPresenter.js +++ b/public_html/js/Presenters/UserListPresenter.js @@ -4,6 +4,7 @@ App.Presenters = App.Presenters || {}; App.Presenters.UserListPresenter = function( jQuery, util, + promise, router, pagedCollectionPresenter, topNavigationPresenter) { @@ -17,7 +18,7 @@ App.Presenters.UserListPresenter = function( topNavigationPresenter.select('users'); activeSearchOrder = util.parseComplexRouteArgs(args.searchArgs).order; - util.loadTemplate('user-list').then(function(html) { + promise.wait(util.promiseTemplate('user-list')).then(function(html) { template = _.template(html); pagedCollectionPresenter.init({ @@ -37,7 +38,6 @@ App.Presenters.UserListPresenter = function( })); $el.find('.order a').click(orderLinkClicked); $el.find('.order [data-order="' + activeSearchOrder + '"]').parent('li').addClass('active'); - console.log(activeSearchOrder); var $pager = $el.find('.pager'); pagedCollectionPresenter.render($pager); diff --git a/public_html/js/Promise.js b/public_html/js/Promise.js new file mode 100644 index 00000000..f51e4e00 --- /dev/null +++ b/public_html/js/Promise.js @@ -0,0 +1,28 @@ +var App = App || {}; + +App.Promise = (function(jQuery) { + + function make(callback) + { + var deferred = jQuery.Deferred(); + callback(deferred.resolve, deferred.reject); + return deferred.promise(); + } + + function wait(promise) { + return jQuery.when(promise); + } + + function waitAll() { + return jQuery.when.apply(jQuery, arguments); + } + + return { + make: make, + wait: wait, + waitAll: waitAll, + }; + +}); + +App.DI.registerSingleton('promise', App.Promise); diff --git a/public_html/js/Util.js b/public_html/js/Util.js index 843fcd63..20840e5b 100644 --- a/public_html/js/Util.js +++ b/public_html/js/Util.js @@ -1,6 +1,6 @@ var App = App || {}; -App.Util = (function(jQuery) { +App.Util = (function(jQuery, promise) { var templateCache = {}; @@ -28,30 +28,6 @@ App.Util = (function(jQuery) { return result; } - function loadTemplate(templateName) { - return loadTemplateFromCache(templateName) - || loadTemplateFromDOM(templateName) - || loadTemplateWithAJAX(templateName); - } - - function loadTemplateFromCache(templateName) { - if (templateName in templateCache) { - return new Promise(function(resolve, reject) { - resolve(templateCache[templateName]); - }); - } - } - - function loadTemplateFromDOM(templateName) { - var $template = jQuery('#' + templateName + '-template'); - if ($template.length) { - return new Promise(function(resolve, reject) { - resolve($template.html()); - }); - } - return null; - } - function initPresenter(presenterGetter, args) { var presenter = presenterGetter(); presenter.init.call(presenter, args); @@ -62,8 +38,32 @@ App.Util = (function(jQuery) { initPresenter(presenterGetter, args); }; - function loadTemplateWithAJAX(templateName) { - return new Promise(function(resolve, reject) { + function promiseTemplate(templateName) { + return promiseTemplateFromCache(templateName) + || promiseTemplateFromDOM(templateName) + || promiseTemplateWithAJAX(templateName); + } + + function promiseTemplateFromCache(templateName) { + if (templateName in templateCache) { + return promise.make(function(resolve, reject) { + resolve(templateCache[templateName]); + }); + } + } + + function promiseTemplateFromDOM(templateName) { + var $template = jQuery('#' + templateName + '-template'); + if ($template.length) { + return promise.make(function(resolve, reject) { + resolve($template.html()); + }); + } + return null; + } + + function promiseTemplateWithAJAX(templateName) { + return promise.make(function(resolve, reject) { var templatesDir = '/templates'; var templateUrl = templatesDir + '/' + templateName + '.tpl'; var templateString; @@ -83,7 +83,7 @@ App.Util = (function(jQuery) { } return { - loadTemplate: loadTemplate, + promiseTemplate: promiseTemplate, initPresenter : initPresenter, initContentPresenter: initContentPresenter, parseComplexRouteArgs: parseComplexRouteArgs,