mirror of
https://github.com/rr-/szurubooru.git
synced 2025-07-17 08:26:24 +00:00
Added template loading through AJAX
This commit is contained in:
@ -3,6 +3,7 @@ App.Presenters = App.Presenters || {};
|
||||
|
||||
App.Presenters.LoginPresenter = function(
|
||||
jQuery,
|
||||
util,
|
||||
topNavigationPresenter,
|
||||
messagePresenter,
|
||||
auth,
|
||||
@ -13,7 +14,12 @@ App.Presenters.LoginPresenter = function(
|
||||
|
||||
var $el = jQuery('#content');
|
||||
var $messages;
|
||||
var template = _.template(jQuery('#login-form-template').html());
|
||||
var template;
|
||||
|
||||
util.loadTemplate('login-form').then(function(html) {
|
||||
template = _.template(html);
|
||||
render();
|
||||
});
|
||||
|
||||
var eventHandlers = {
|
||||
|
||||
@ -41,8 +47,6 @@ App.Presenters.LoginPresenter = function(
|
||||
if (appState.get('loggedIn'))
|
||||
router.navigateToMainPage();
|
||||
|
||||
render();
|
||||
|
||||
function render() {
|
||||
$el.html(template());
|
||||
$el.find('form').submit(eventHandlers.loginFormSubmit);
|
||||
|
@ -3,6 +3,7 @@ App.Presenters = App.Presenters || {};
|
||||
|
||||
App.Presenters.RegistrationPresenter = function(
|
||||
jQuery,
|
||||
util,
|
||||
topNavigationPresenter,
|
||||
messagePresenter,
|
||||
api) {
|
||||
@ -10,7 +11,12 @@ App.Presenters.RegistrationPresenter = function(
|
||||
topNavigationPresenter.select('register');
|
||||
|
||||
var $el = jQuery('#content');
|
||||
var template = _.template(jQuery('#registration-form-template').html());
|
||||
var template;
|
||||
|
||||
util.loadTemplate('registration-form').then(function(html) {
|
||||
template = _.template(html);
|
||||
render();
|
||||
});
|
||||
|
||||
var eventHandlers = {
|
||||
|
||||
@ -50,8 +56,6 @@ App.Presenters.RegistrationPresenter = function(
|
||||
},
|
||||
};
|
||||
|
||||
render();
|
||||
|
||||
function render() {
|
||||
$el.html(template());
|
||||
$el.find('form').submit(eventHandlers.registrationFormSubmit);
|
||||
|
@ -1,10 +1,15 @@
|
||||
var App = App || {};
|
||||
App.Presenters = App.Presenters || {};
|
||||
|
||||
App.Presenters.TopNavigationPresenter = function(jQuery, appState) {
|
||||
App.Presenters.TopNavigationPresenter = function(util, jQuery, appState) {
|
||||
|
||||
var selectedElement = null;
|
||||
var template = _.template(jQuery('#top-navigation-template').html());
|
||||
var template;
|
||||
|
||||
util.loadTemplate('top-navigation').then(function(html) {
|
||||
template = _.template(html);
|
||||
render();
|
||||
});
|
||||
var $el = jQuery('#top-navigation');
|
||||
|
||||
var eventHandlers = {
|
||||
@ -14,7 +19,6 @@ App.Presenters.TopNavigationPresenter = function(jQuery, appState) {
|
||||
};
|
||||
|
||||
appState.startObserving('loggedIn', 'top-navigation', eventHandlers.loginStateChanged);
|
||||
render();
|
||||
|
||||
function select(newSelectedElement) {
|
||||
selectedElement = newSelectedElement;
|
||||
|
56
public_html/js/Util.js
Normal file
56
public_html/js/Util.js
Normal file
@ -0,0 +1,56 @@
|
||||
var App = App || {};
|
||||
|
||||
App.Util = (function(jQuery) {
|
||||
|
||||
var templateCache = {};
|
||||
|
||||
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 loadTemplateWithAJAX(templateName) {
|
||||
return new Promise(function(resolve, reject) {
|
||||
var templatesDir = '/templates';
|
||||
var templateUrl = templatesDir + '/' + templateName + '.tpl';
|
||||
var templateString;
|
||||
|
||||
$.ajax({
|
||||
url: templateUrl,
|
||||
method: 'GET',
|
||||
success: function(data, textStatus, xhr) {
|
||||
resolve(data);
|
||||
},
|
||||
error: function(xhr, textStatus, errorThrown) {
|
||||
console.log(Error('Error while loading template ' + templateName + ': ' + errorThrown));
|
||||
reject();
|
||||
},
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
loadTemplate: loadTemplate,
|
||||
};
|
||||
});
|
||||
|
||||
App.DI.registerSingleton('util', App.Util);
|
Reference in New Issue
Block a user