ajax shenanigans
This commit is contained in:
parent
98beef09d0
commit
88256b32fb
4 changed files with 138 additions and 134 deletions
|
@ -1921,6 +1921,26 @@
|
|||
"type": "ADD",
|
||||
"change": "Show person that made the change in the changelog.",
|
||||
"user": "Flashwave"
|
||||
},
|
||||
{
|
||||
"type": "UPD",
|
||||
"change": "Make AJAX object generator more convenient.",
|
||||
"user": "Flashwave"
|
||||
},
|
||||
{
|
||||
"type": "FIX",
|
||||
"change": "Fixed user actions showing up when logged out on viewtopic.",
|
||||
"user": "Flashwave"
|
||||
},
|
||||
{
|
||||
"type": "ADD",
|
||||
"change": "Added AJAX friend actions on viewtopic.",
|
||||
"user": "Flashwave"
|
||||
},
|
||||
{
|
||||
"type": "FIX",
|
||||
"change": "Fixed user actions showing up for deleted users.",
|
||||
"user": "Flashwave"
|
||||
}
|
||||
|
||||
]
|
||||
|
|
|
@ -9,24 +9,25 @@
|
|||
<td class="userpanel">
|
||||
{% if post.user.rank_main > 1 %}<a href="/u/{{ post.user.id }}" class="default username" style="color: {% if post.user.name_colour %}{{ post.user.name_colour }}{% else %}{{ post.rank.colour }}{% endif %};" title="Go to {{ post.user.username }}'s profile">{{ post.user.username }}</a>
|
||||
<img src="/a/{{ post.user.id }}" alt="{{ post.user.username }}" class="avatar" style="box-shadow: 0 3px 7px #{% if post.is_online %}484{% else %}844{% endif %};" />
|
||||
{% else %}
|
||||
<a class="username">[deleted user]</a>
|
||||
{% endif %}
|
||||
<div class="userdata">
|
||||
<div class="usertitle">{% if not post.user.usertitle %}{{ post.rank.title }}{% else %}{{ post.user.usertitle }}{% endif %}</div>
|
||||
<img src="{{ sakura.content_path }}/images/tenshi.png" alt="Tenshi"{% if not post.is_premium %} style="opacity: 0;"{% endif %} /> <img src="{{ sakura.content_path }}/images/flags/{% if post.user.country|lower == 'eu' %}europeanunion{% else %}{{ post.user.country|lower }}{% endif %}.png" alt="{{ post.country }}" />
|
||||
{% if user.checklogin %}
|
||||
<div class="actions">
|
||||
{% if user.data.id == post.user.id %}
|
||||
<a class="fa fa-pencil-square-o" title="Edit this post" href="/forum/post/{{ post.post_id }}/edit"></a>
|
||||
<a class="fa fa-trash" title="Delete this post" href="/forum/post/{{ post.post_id }}/delete"></a>
|
||||
{% else %}
|
||||
{% elseif post.user.rank_main > 1 %}
|
||||
{% if post.is_friend != 0 %}<a class="fa fa-{% if post.is_friend == 2 %}heart{% else %}star{% endif %}" title="You are friends"></a>{% endif %}
|
||||
<a class="fa fa-user-{% if post.is_friend == 0 %}plus{% else %}times{% endif %}" title="{% if post.is_friend == 0 %}Add {{ post.user.username }} as a friend{% else %}Remove friend{% endif %}" href="/friends?{% if post.is_friend == 0 %}add{% else %}remove{% endif %}={{ post.user.id }}&session={{ php.sessionid }}&time={{ php.time }}&redirect=/forum/post/{{ post.post_id }}%23p{{ post.post_id }}&direct=true"></a>
|
||||
<a class="fa fa-user-{% if post.is_friend == 0 %}plus{% else %}times{% endif %} forum-friend-toggle" title="{% if post.is_friend == 0 %}Add {{ post.user.username }} as a friend{% else %}Remove friend{% endif %}" href="/friends?{% if post.is_friend == 0 %}add{% else %}remove{% endif %}={{ post.user.id }}&session={{ php.sessionid }}&time={{ php.time }}&redirect=/forum/post/{{ post.post_id }}&direct=true"></a>
|
||||
<a class="fa fa-flag" title="Report {{ post.user.username }}" href="/u/{{ post.user.id }}/report"></a>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<a class="username">[deleted user]</a>
|
||||
<div class="actions">
|
||||
{% endif %}
|
||||
<a class="fa fa-reply" title="Quote this post" href="/forum/post/{{ post.post_id }}/quote"></a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</td>
|
||||
<td class="post-content">
|
||||
|
|
|
@ -49,118 +49,57 @@
|
|||
|
||||
};
|
||||
|
||||
{% if not user.checklogin and not sakura.lockauth %}
|
||||
|
||||
// Setting the shit so clicking the login link doesn't redirect to /login
|
||||
function initHeaderLoginForm() {
|
||||
|
||||
var headerLoginForm = document.getElementById('headerLoginForm');
|
||||
var createInput = document.createElement('input');
|
||||
var submit = headerLoginForm.querySelector('[type="submit"]');
|
||||
|
||||
createInput.setAttribute('name', 'ajax');
|
||||
createInput.setAttribute('value', 'true');
|
||||
createInput.setAttribute('type', 'hidden');
|
||||
headerLoginForm.appendChild(createInput);
|
||||
|
||||
submit.setAttribute('type', 'button');
|
||||
submit.setAttribute('onclick', 'submitPost(\'headerLoginForm\', true, \'Logging in...\');');
|
||||
|
||||
}
|
||||
|
||||
{% elseif user.checklogin %}
|
||||
|
||||
// Prepare header logout stuff
|
||||
function initHeaderLoginForm() {
|
||||
|
||||
var headerLogoutLink = document.getElementById('headerLogoutLink');
|
||||
|
||||
headerLogoutLink.setAttribute('href', 'javascript:void(0);');
|
||||
headerLogoutLink.setAttribute('onclick', 'doHeaderLogout();');
|
||||
|
||||
}
|
||||
|
||||
function doHeaderLogout() {
|
||||
|
||||
generateForm("headerLogoutForm", {
|
||||
"class": "hidden",
|
||||
"method": "post",
|
||||
"action": "//{{ sakura.url_main }}/logout"
|
||||
},
|
||||
{
|
||||
"mode": "logout",
|
||||
"ajax": "true",
|
||||
"time": "{{ php.time }}",
|
||||
"session": "{{ php.sessionid }}",
|
||||
"redirect": "{{ sakura.currentpage }}"
|
||||
}, "contentwrapper");
|
||||
|
||||
setTimeout(function(){
|
||||
submitPost("headerLogoutForm", true, "Logging out...")
|
||||
}, 10);
|
||||
|
||||
}
|
||||
|
||||
{% endif %}
|
||||
|
||||
{% if php.self == '/profile.php' and user.checklogin and user.data.id != profile.user.id %}
|
||||
|
||||
// Prepare friend toggle
|
||||
function initFriendToggle() {
|
||||
|
||||
var profileFriendToggle = document.getElementById('profileFriendToggle');
|
||||
|
||||
profileFriendToggle.setAttribute('href', 'javascript:void(0);');
|
||||
profileFriendToggle.setAttribute('onclick', 'doFriendToggle();');
|
||||
|
||||
}
|
||||
|
||||
function doFriendToggle() {
|
||||
|
||||
generateForm("doFriendToggle", {
|
||||
"class": "hidden",
|
||||
"method": "post",
|
||||
"action": "//{{ sakura.url_main }}/friends"
|
||||
},
|
||||
{
|
||||
"{% if profile.friend == 0 %}add{% else %}remove{% endif %}": "{{ profile.user.id }}",
|
||||
"ajax": "true",
|
||||
"time": "{{ php.time }}",
|
||||
"session": "{{ php.sessionid }}",
|
||||
"redirect": "{{ sakura.currentpage }}"
|
||||
}, "contentwrapper");
|
||||
|
||||
setTimeout(function(){
|
||||
submitPost("doFriendToggle", true, "{% if profile.friend == 0 %}Adding{% else %}Removing{% endif %} friend...")
|
||||
}, 10);
|
||||
|
||||
}
|
||||
|
||||
{% endif %}
|
||||
|
||||
// Space for things that need to happen onload
|
||||
window.onload = function() {
|
||||
window.addEventListener("load", function() {
|
||||
|
||||
// Alter the go to top button
|
||||
var gotop = document.getElementById('gotop');
|
||||
gotop.setAttribute('href', 'javascript:void(0);');
|
||||
gotop.setAttribute('onclick', 'scrollToTop();');
|
||||
|
||||
// Login form under header and ajax logout
|
||||
initHeaderLoginForm();
|
||||
{% if user.checklogin %}
|
||||
// Convert href to object in logout link
|
||||
prepareAjaxLink('headerLogoutLink', 'submitPost', ', true, "Logging out..."');
|
||||
{% elseif not sakura.lockauth and php.self != '/authenticate.php' %}
|
||||
// Make the header login form dynamic
|
||||
var headerLoginForm = document.getElementById('headerLoginForm');
|
||||
var createInput = document.createElement('input');
|
||||
var submit = headerLoginForm.querySelector('[type="submit"]');
|
||||
|
||||
createInput.setAttribute('name', 'ajax');
|
||||
createInput.setAttribute('value', 'true');
|
||||
createInput.setAttribute('type', 'hidden');
|
||||
headerLoginForm.appendChild(createInput);
|
||||
|
||||
submit.setAttribute('type', 'button');
|
||||
submit.setAttribute('onclick', 'submitPost(\''+ headerLoginForm.action +'\', formToObject(\'headerLoginForm\'), true, \'Logging in...\');');
|
||||
{% endif %}
|
||||
|
||||
{% if user.checklogin %}
|
||||
// Make notification requests (there's a seperate one to make it happen before the first 60 seconds)
|
||||
notifyRequest('{{ php.sessionid }}');
|
||||
setInterval(function(){notifyRequest('{{ php.sessionid }}');}, 60000);
|
||||
|
||||
// Create interval
|
||||
setInterval(function() {
|
||||
notifyRequest('{{ php.sessionid }}');
|
||||
}, 60000);
|
||||
{% endif %}
|
||||
|
||||
{% if php.self == '/profile.php' and user.checklogin and user.data.id != profile.user.id %}
|
||||
initFriendToggle();
|
||||
// Make friend button dynamic
|
||||
prepareAjaxLink('profileFriendToggle', 'submitPost', ', true, "{% if profile.friend == 0 %}Adding{% else %}Removing{% endif %} friend..."');
|
||||
{% endif %}
|
||||
|
||||
{% if php.self == '/viewtopic.php' and user.checklogin %}
|
||||
var forumFriendToggles = document.querySelectorAll('.forum-friend-toggle');
|
||||
|
||||
for(var i in forumFriendToggles) {
|
||||
prepareAjaxLink(forumFriendToggles[i], 'submitPost', ', true, "Please wait..."');
|
||||
}
|
||||
{% endif %}
|
||||
|
||||
{% if php.self == '/authenticate.php' and not sakura.lockauth %}
|
||||
// AJAX Form Submission
|
||||
// AJAX Form Submission
|
||||
var forms = {
|
||||
{% if not auth.changingPass %}
|
||||
"loginForm": 'Logging in...',
|
||||
|
@ -179,7 +118,7 @@
|
|||
form.setAttribute('onkeydown', 'formEnterCatch(event, \''+ submit.id +'\');');
|
||||
|
||||
submit.setAttribute('href', 'javascript:void(0);');
|
||||
submit.setAttribute('onclick', 'submitPost(\''+ i +'\', true, \''+ forms[i] +'\', '+ (i == 'registerForm' ? 'true' : 'false') +');');
|
||||
submit.setAttribute('onclick', 'submitPost(\''+ form.action +'\', formToObject(\''+ i+ '\'), true, \''+ forms[i] +'\', '+ (i == 'registerForm' ? 'true' : 'false') +');');
|
||||
submit.setAttribute('type', 'button');
|
||||
|
||||
var createInput = document.createElement('input');
|
||||
|
@ -190,7 +129,7 @@
|
|||
}
|
||||
{% endif %}
|
||||
|
||||
};
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
@ -426,6 +426,79 @@ function ajaxPost(url, data) {
|
|||
|
||||
}
|
||||
|
||||
// Convert href attribute to an object
|
||||
function prepareAjaxLink(linkId, callback, attrs) {
|
||||
|
||||
// Get the elements
|
||||
var link = typeof linkId === 'object' ? linkId : document.getElementById(linkId);
|
||||
|
||||
// Catch null
|
||||
if(link == null) {
|
||||
|
||||
return;
|
||||
|
||||
}
|
||||
|
||||
// Get the href value
|
||||
var hrefRaw = link.attributes.href.value;
|
||||
|
||||
// Get the action path
|
||||
var action = hrefRaw.split('?')[0];
|
||||
|
||||
// Split the request variables
|
||||
var variablesNotSplit = hrefRaw.split('?')[1].split('&');
|
||||
|
||||
// Create variables object
|
||||
var variables = {};
|
||||
|
||||
// Split the name and values of the variables
|
||||
for(var key in variablesNotSplit) {
|
||||
|
||||
// Split name and value
|
||||
var newVar = variablesNotSplit[key].split('=');
|
||||
|
||||
// Push it into the object
|
||||
variables[newVar[0]] = newVar[1];
|
||||
|
||||
}
|
||||
|
||||
// Add ajax=true
|
||||
variables['ajax'] = true;
|
||||
|
||||
// Update link attributes
|
||||
link.setAttribute('href', 'javascript:void(0);');
|
||||
link.setAttribute('onclick', callback +'(\''+ action +'\', JSON.parse(\''+ JSON.stringify(variables) +'\')'+ (typeof attrs != 'undefined' ? attrs : '') +');');
|
||||
|
||||
}
|
||||
|
||||
// Convert form to an object
|
||||
function formToObject(formId) {
|
||||
|
||||
// Get form data
|
||||
var form = document.getElementById(formId);
|
||||
|
||||
// Make an object for the request parts
|
||||
var requestParts = new Object();
|
||||
|
||||
// Get all children with a name attribute
|
||||
var children = form.querySelectorAll('[name]');
|
||||
|
||||
// Sort children and make them ready for submission
|
||||
for(var i in children) {
|
||||
|
||||
if(typeof children[i] == 'object') {
|
||||
|
||||
requestParts[children[i].name] = ((typeof children[i].type !== "undefined" && children[i].type.toLowerCase() == "checkbox") ? children[i].checked : children[i].value);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Return the object
|
||||
return requestParts;
|
||||
|
||||
}
|
||||
|
||||
// Quickly building a form for god knows what reason
|
||||
function generateForm(formId, formAttr, formData, appendTo) {
|
||||
|
||||
|
@ -488,7 +561,7 @@ function formEnterCatch(key, id) {
|
|||
}
|
||||
|
||||
// Submitting a form using an AJAX POST request
|
||||
function submitPost(formId, busyView, msg, resetCaptchaOnFailure) {
|
||||
function submitPost(action, requestParts, busyView, msg, resetCaptchaOnFailure) {
|
||||
|
||||
// If requested display the busy thing
|
||||
if(busyView) {
|
||||
|
@ -497,37 +570,8 @@ function submitPost(formId, busyView, msg, resetCaptchaOnFailure) {
|
|||
|
||||
}
|
||||
|
||||
// Get form data
|
||||
var form = document.getElementById(formId);
|
||||
|
||||
// Make sure the form id was proper and if not report an error
|
||||
if(form === null) {
|
||||
if(busyView) {
|
||||
ajaxBusyView(true, 'Invalid Form ID, contact the administrator.');
|
||||
setTimeout(function(){ajaxBusyView(false);}, 2000);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// Make an object for the request parts
|
||||
var requestParts = new Object();
|
||||
|
||||
// Get all children with a name attribute
|
||||
var children = form.querySelectorAll('[name]');
|
||||
|
||||
// Sort children and make them ready for submission
|
||||
for(var i in children) {
|
||||
|
||||
if(typeof children[i] == 'object') {
|
||||
|
||||
requestParts[children[i].name] = ((typeof children[i].type !== "undefined" && children[i].type.toLowerCase() == "checkbox") ? children[i].checked : children[i].value);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Submit the AJAX request
|
||||
var request = ajaxPost(form.action, requestParts).split('|');
|
||||
var request = ajaxPost(action, requestParts).split('|');
|
||||
|
||||
// If using the busy view thing update the text displayed to the return of the request
|
||||
if(busyView) {
|
||||
|
|
Reference in a new issue