mirror/php-phpbb
1
0
Fork 0
mirror of https://github.com/phpbb/phpbb.git synced 2025-06-25 04:24:31 +02:00
Code Issues Releases Wiki Activity

[ticket/12982] Refactoring: made most JS nice.

Browse Source 
PHPBB3-12982
This commit is contained in:
Callum Macrae
2014-08-13 22:44:21 +01:00
parent e4e7a8f849
commit 340f48fdeb
3 changed files with 327 additions and 295 deletions
Download Patch File Download Diff File Expand all files Collapse all files

143
phpBB/styles/prosilver/template/ajax.js
View File

@ -1,6 +1,8 @@
/* global phpbb */
(function($) { // Avoid conflicts with other libraries
"use strict";
'use strict';
// This callback will mark all forum icons read
phpbb.addAjaxCallback('mark_forums_read', function(res) {
@ -40,10 +42,10 @@ phpbb.addAjaxCallback('mark_forums_read', function(res) {
/**
* This callback will mark all topic icons read
*
* @param update_topic_links bool Wether "Mark topics read" links should be
* @param update_topic_links bool Whether "Mark topics read" links should be
* updated. Defaults to true.
*/
phpbb.addAjaxCallback('mark_topics_read', function(res, update_topic_links) {
phpbb.addAjaxCallback('mark_topics_read', function(res, updateTopicLinks) {
var readTitle = res.NO_UNREAD_POSTS;
var unreadTitle = res.UNREAD_POSTS;
var iconsArray = {
@ -53,12 +55,12 @@ phpbb.addAjaxCallback('mark_topics_read', function(res, update_topic_links) {
'topic_unread': 'topic_read'
};
var iconsState = ['', '_hot', '_hot_mine', '_locked', '_locked_mine', '_mine'];
var unreadClassSelectors = '';
var unreadClassSelectors;
var classMap = {};
var classNames = [];
if (typeof update_topic_links === 'undefined') {
update_topic_links = true;
if (typeof updateTopicLinks === 'undefined') {
updateTopicLinks = true;
}
$.each(iconsArray, function(unreadClass, readClass) {
@ -88,7 +90,7 @@ phpbb.addAjaxCallback('mark_topics_read', function(res, update_topic_links) {
$('a').has('span.icon_topic_newest').remove();
// Update mark topics read links
if (update_topic_links) {
if (updateTopicLinks) {
$('[data-ajax="mark_topics_read"]').attr('href', res.U_MARK_TOPICS);
}
@ -114,22 +116,22 @@ phpbb.addAjaxCallback('notification.mark_read', function(res) {
/**
* Mark notification popup rows as read.
*
* @param {jQuery} el jQuery object(s) to mark read.
* @param {jQuery} $el jQuery object(s) to mark read.
* @param {int} unreadCount The new unread notifications count.
*/
phpbb.markNotifications = function(el, unreadCount) {
phpbb.markNotifications = function($el, unreadCount) {
// Remove the unread status.
el.removeClass('bg2');
el.find('a.mark_read').remove();
$el.removeClass('bg2');
$el.find('a.mark_read').remove();
// Update the notification link to the real URL.
el.each(function() {
$el.each(function() {
var link = $(this).find('a');
link.attr('href', link.attr('data-real-url'));
});
// Update the unread count.
$('#notification_list_button strong').html(unreadCount);
$('strong', '#notification_list_button').html(unreadCount);
// Remove the Mark all read link if there are no unread notifications.
if (!unreadCount) {
$('#mark_all_notifications').remove();
@ -138,12 +140,12 @@ phpbb.markNotifications = function(el, unreadCount) {
// This callback finds the post from the delete link, and removes it.
phpbb.addAjaxCallback('post_delete', function() {
var el = $(this),
var $this = $(this),
postId;
if (el.attr('data-refresh') === undefined) {
postId = el[0].href.split('&p=')[1];
var post = el.parents('#p' + postId).css('pointer-events', 'none');
if ($this.attr('data-refresh') === undefined) {
postId = $this[0].href.split('&p=')[1];
var post = $this.parents('#p' + postId).css('pointer-events', 'none');
if (post.hasClass('bg1') || post.hasClass('bg2')) {
var posts1 = post.nextAll('.bg1');
post.nextAll('.bg2').removeClass('bg2').addClass('bg1');
@ -194,18 +196,18 @@ phpbb.addAjaxCallback('vote_poll', function(res) {
if (typeof res.success !== 'undefined') {
var poll = $('.topic_poll');
var panel = poll.find('.panel');
var results_visible = poll.find('dl:first-child .resultbar').is(':visible');
var most_votes = 0;
var resultsVisible = poll.find('dl:first-child .resultbar').is(':visible');
var mostVotes = 0;
// Set min-height to prevent the page from jumping when the content changes
var update_panel_height = function (height) {
var updatePanelHeight = function (height) {
var height = (typeof height === 'undefined') ? panel.find('.inner').outerHeight() : height;
panel.css('min-height', height);
};
update_panel_height();
updatePanelHeight();
// Remove the View results link
if (!results_visible) {
if (!resultsVisible) {
poll.find('.poll_view_results').hide(500);
}
@ -221,8 +223,8 @@ phpbb.addAjaxCallback('vote_poll', function(res) {
// Get the votes count of the highest poll option
poll.find('[data-poll-option-id]').each(function() {
var option = $(this);
var option_id = option.attr('data-poll-option-id');
most_votes = (res.vote_counts[option_id] >= most_votes) ? res.vote_counts[option_id] : most_votes;
var optionId = option.attr('data-poll-option-id');
mostVotes = (res.vote_counts[optionId] >= mostVotes) ? res.vote_counts[optionId] : mostVotes;
});
// Update the total votes count
@ -230,28 +232,30 @@ phpbb.addAjaxCallback('vote_poll', function(res) {
// Update each option
poll.find('[data-poll-option-id]').each(function() {
var option = $(this);
var option_id = option.attr('data-poll-option-id');
var voted = (typeof res.user_votes[option_id] !== 'undefined') ? true : false;
var most_voted = (res.vote_counts[option_id] == most_votes) ? true : false;
var percent = (!res.total_votes) ? 0 : Math.round((res.vote_counts[option_id] / res.total_votes) * 100);
var percent_rel = (most_votes == 0) ? 0 : Math.round((res.vote_counts[option_id] / most_votes) * 100);
var $this = $(this);
var optionId = $this.attr('data-poll-option-id');
var voted = (typeof res.user_votes[optionId] !== 'undefined');
var mostVoted = (res.vote_counts[optionId] == mostVotes);
var percent = (!res.total_votes) ? 0 : Math.round((res.vote_counts[optionId] / res.total_votes) * 100);
var percentRel = (mostVotes === 0) ? 0 : Math.round((res.vote_counts[optionId] / mostVotes) * 100);
option.toggleClass('voted', voted);
option.toggleClass('most-votes', most_voted);
$this.toggleClass('voted', voted);
$this.toggleClass('most-votes', mostVoted);
// Update the bars
var bar = option.find('.resultbar div');
var bar_time_lapse = (res.can_vote) ? 500 : 1500;
var new_bar_class = (percent == 100) ? 'pollbar5' : 'pollbar' + (Math.floor(percent / 20) + 1);
var bar = $this.find('.resultbar div');
var barTimeLapse = (res.can_vote) ? 500 : 1500;
var newBarClass = (percent == 100) ? 'pollbar5' : 'pollbar' + (Math.floor(percent / 20) + 1);
setTimeout(function () {
bar.animate({width: percent_rel + '%'}, 500).removeClass('pollbar1 pollbar2 pollbar3 pollbar4 pollbar5').addClass(new_bar_class);
bar.html(res.vote_counts[option_id]);
bar.animate({width: percentRel + '%'}, 500)
.removeClass('pollbar1 pollbar2 pollbar3 pollbar4 pollbar5')
.addClass(newBarClass)
.html(res.vote_counts[optionId]);
var percent_txt = (!percent) ? res.NO_VOTES : percent + '%';
option.find('.poll_option_percent').html(percent_txt);
}, bar_time_lapse);
var percentText = percent ? percent + '%' : res.NO_VOTES;
$this.find('.poll_option_percent').html(percentText);
}, barTimeLapse);
});
if (!res.can_vote) {
@ -259,30 +263,31 @@ phpbb.addAjaxCallback('vote_poll', function(res) {
}
// Display "Your vote has been cast." message. Disappears after 5 seconds.
var confirmation_delay = (res.can_vote) ? 300 : 900;
poll.find('.vote-submitted').delay(confirmation_delay).slideDown(200, function() {
if (results_visible) {
update_panel_height();
var confirmationDelay = (res.can_vote) ? 300 : 900;
poll.find('.vote-submitted').delay(confirmationDelay).slideDown(200, function() {
if (resultsVisible) {
updatePanelHeight();
}
$(this).delay(5000).fadeOut(500, function() {
resize_panel(300);
resizePanel(300);
});
});
// Remove the gap resulting from removing options
setTimeout(function() {
resize_panel(500);
resizePanel(500);
}, 1500);
var resize_panel = function (time) {
var panel_height = panel.height();
var inner_height = panel.find('.inner').outerHeight();
var resizePanel = function (time) {
var panelHeight = panel.height();
var innerHeight = panel.find('.inner').outerHeight();
if (panel_height != inner_height) {
panel.css({'min-height': '', 'height': panel_height}).animate({height: inner_height}, time, function () {
panel.css({'min-height': inner_height, 'height': ''});
});
if (panelHeight != innerHeight) {
panel.css({'min-height': '', 'height': panelHeight})
.animate({height: innerHeight}, time, function () {
panel.css({'min-height': innerHeight, 'height': ''});
});
}
};
}
@ -295,20 +300,19 @@ $('.poll_view_results a').click(function(e) {
// Do not follow the link
e.preventDefault();
var poll = $(this).parents('.topic_poll');
var $poll = $(this).parents('.topic_poll');
poll.find('.resultbar, .poll_option_percent, .poll_total_votes').show(500);
poll.find('.poll_view_results').hide(500);
$poll.find('.resultbar, .poll_option_percent, .poll_total_votes').show(500);
$poll.find('.poll_view_results').hide(500);
});
$('[data-ajax]').each(function() {
var $this = $(this),
ajax = $this.attr('data-ajax'),
filter = $this.attr('data-filter'),
fn;
var $this = $(this);
var ajax = $this.attr('data-ajax');
var filter = $this.attr('data-filter');
if (ajax !== 'false') {
fn = (ajax !== 'true') ? ajax : null;
var fn = (ajax !== 'true') ? ajax : null;
filter = (filter !== undefined) ? phpbb.getFunctionByName(filter) : null;
phpbb.ajaxify({
@ -339,10 +343,10 @@ $('.display_post').click(function(e) {
// Do not follow the link
e.preventDefault();
var post_id = $(this).attr('data-post-id');
$('#post_content' + post_id).show();
$('#profile' + post_id).show();
$('#post_hidden' + post_id).hide();
var postId = $(this).attr('data-post-id');
$('#post_content' + postId).show();
$('#profile' + postId).show();
$('#post_hidden' + postId).hide();
});
$('#delete_permanent').click(function () {
@ -361,10 +365,13 @@ $('#delete_permanent').click(function () {
* appropriately changed based on the status of the search panel.
*/
$('#member_search').click(function () {
$('#memberlist_search').slideToggle('fast');
var $memberlistSearch = $('#memberlist_search');
$memberlistSearch.slideToggle('fast');
phpbb.ajaxCallbacks.alt_text.call(this);
// Focus on the username textbox if it's available and displayed
if ($('#memberlist_search').is(':visible')) {
if ($memberlistSearch.is(':visible')) {
$('#username').focus();
}
return false;
@ -373,7 +380,7 @@ $('#member_search').click(function () {
/**
* Automatically resize textarea
*/
$(document).ready(function() {
$(function() {
phpbb.resizeTextArea($('textarea:not(#message-box textarea, .no-auto-resize)'), {minHeight: 75, maxHeight: 250});
phpbb.resizeTextArea($('#message-box textarea'));
});