Completed
Pull Request — master (#3325)
by Emanuele
11:19
created

theme.js ➔ elk_addButton   F

Complexity

Conditions 23

Size

Total Lines 26
Code Lines 16

Duplication

Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
cc 23
eloc 16
dl 0
loc 26
rs 0
c 0
b 0
f 0

How to fix   Complexity   

Complexity

Complex classes like theme.js ➔ elk_addButton often do a lot of different things. To break such a class down, we need to identify a cohesive component within that class. A common approach to find such a component is to look for fields/methods that share the same prefixes, or suffixes.

Once you have determined the fields that belong together, you can apply the Extract Class refactoring. If the component makes sense as a sub-class, Extract Subclass is also a candidate, and is often faster.

1
/*!
2
 * @name      ElkArte Forum
3
 * @copyright ElkArte Forum contributors
4
 * @license   BSD http://opensource.org/licenses/BSD-3-Clause
5
 *
6
 * This file contains code covered by:
7
 * copyright:	2011 Simple Machines (http://www.simplemachines.org)
8
 * license:		BSD, See included LICENSE.TXT for terms and conditions.
9
 *
10
 * @version 1.1
11
 */
12
13
/**
14
 * This file contains javascript associated with the current theme
15
 */
16
17
$(function() {
18
	// Menu drop downs
19
	if (use_click_menu)
0 ignored issues
show
Best Practice introduced by
If you intend to check if the variable use_click_menu is declared in the current environment, consider using typeof use_click_menu === "undefined" instead. This is safe if the variable is not actually declared.
Loading history...
20
		$('#main_menu, ul.admin_menu, ul.sidebar_menu, ul.poster, ul.quickbuttons, #sort_by').superclick({speed: 150, animation: {opacity:'show', height:'toggle'}, speedOut: 0, activeClass: 'sfhover'});
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
21
	else
22
		$('#main_menu, ul.admin_menu, ul.sidebar_menu, ul.poster, ul.quickbuttons, #sort_by').superfish({delay : 300, speed: 175, hoverClass: 'sfhover'});
23
24
	// Smooth scroll to top.
25
	$("a[href='#top']").on("click", function(e) {
26
		e.preventDefault();
27
		$("html,body").animate({scrollTop: 0}, 1200);
28
	});
29
30
	// Smooth scroll to bottom.
31
	$("a[href='#bot']").on("click", function(e) {
32
		e.preventDefault();
33
34
		// Don't scroll all the way down to the footer, just the content bottom
35
		var link = $('#bot'),
36
			link_y = link.height();
37
38
		$("html,body").animate({scrollTop:link.offset().top + link_y - $(window).height()}, 1200);
39
	});
40
41
	// Tooltips
42
	if ((!is_mobile && !is_touch) || use_click_menu)
0 ignored issues
show
Best Practice introduced by
If you intend to check if the variable is_touch is declared in the current environment, consider using typeof is_touch === "undefined" instead. This is safe if the variable is not actually declared.
Loading history...
Best Practice introduced by
If you intend to check if the variable is_mobile is declared in the current environment, consider using typeof is_mobile === "undefined" instead. This is safe if the variable is not actually declared.
Loading history...
43
		$('.preview').SiteTooltip({hoverIntent: {sensitivity: 10, interval: 750, timeout: 50}});
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
44
45
	// Find all nested linked images and turn off the border
46
	$('a.bbc_link img.bbc_img').parent().css('border', '0');
47
48
	// Fix code blocks so they are as compact as possible
49
	if (typeof elk_codefix === 'function')
0 ignored issues
show
Bug introduced by
The variable elk_codefix seems to be never declared. If this is a global, consider adding a /** global: elk_codefix */ comment.

This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.

To learn more about declaring variables in Javascript, see the MDN.

Loading history...
50
		elk_codefix();
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
51
52
	// Enable the ... page expansion
53
	$('.expand_pages').expand_pages();
54
55
	// Collapsible fieldsets, pure candy
56
	$(document).on('click', 'legend', function() {
57
		$(this).siblings().slideToggle("fast");
58
		$(this).parent().toggleClass("collapsed");
59
	});
60
61
	$('legend', function () {
62
		if ($(this).data('collapsed'))
63
			$(this).click();
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
64
	});
65
66
	// Spoiler
67
	$('.spoilerheader').click(function() {
68
		$(this).next().children().slideToggle("fast");
69
	});
70
71
	// Attachment thumbnail expand on click, you can turn off this namespaced click
72
	// event with $('[data-lightboximage]').off('click.elk_lb');
73
	$('[data-lightboximage]').on('click.elk_lb', function(e) {
74
		e.preventDefault();
75
		expandThumbLB($(this).data('lightboximage'), $(this).data('lightboxmessage'));
76
	});
77
78
	// BBC [img] element toggle for height and width styles of an image.
79
	$('img').each(function() {
80
		// Not a resized image? Skip it.
81
		if ($(this).hasClass('bbc_img resized') === false)
82
			return true;
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
83
84
		$(this).css({'cursor': 'pointer'});
85
86
		// Note to addon authors, if you want to enable your own click events to bbc images
87
		// you can turn off this namespaced click event with $("img").off("click.elk_bbc")
88
		$(this).on( "click.elk_bbc", function() {
89
			var $this = $(this);
90
91
			// No saved data, then lets set it to auto
92
			if ($.isEmptyObject($this.data('bbc_img')))
93
			{
94
				$this.data('bbc_img', {
95
					width: $this.css('width'),
96
					height: $this.css('height'),
97
					'max-width': $this.css('max-width'),
98
					'max-height': $this.css('max-height')
99
				});
100
				$this.css({'width': $this.css('width') === 'auto' ? null : 'auto'});
101
				$this.css({'height': $this.css('height') === 'auto' ? null : 'auto'});
102
103
				// Override default css to allow the image to expand fully, add a div to expand in
104
				$this.css({'max-height': 'none'});
105
				$this.css({'max-width': '100%'});
106
				$this.wrap('<div style="overflow:auto;display:inline-block;"></div>');
107
			}
108
			else
109
			{
110
				// Was clicked and saved, so set it back
111
				$this.css({'width': $this.data("bbc_img").width});
112
				$this.css({'height': $this.data("bbc_img").height});
113
				$this.css({'max-width': $this.data("bbc_img")['max-width']});
114
				$this.css({'max-height': $this.data("bbc_img")['max-height']});
115
116
				// Remove the data
117
				$this.removeData('bbc_img');
118
119
				// Remove the div we added to allow the image to overflow expand in
120
				$this.unwrap();
121
				$this.css({'max-width': '100%'});
122
			}
123
		});
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
124
	});
125
126
	$('.hamburger_30').click(function(e) {
127
		e.preventDefault();
128
		var id = $(this).data('id');
129
		$('#' + id).addClass('visible');
130
		$(this).addClass('visible');
131
	});
132
});
133
134
/**
135
 * Adds a button to the quick topic moderation after a checkbox is selected
136
 *
137
 * @param {string} sButtonStripId
138
 * @param {boolean} bUseImage
139
 * @param {object} oOptions
140
 */
141
function elk_addButton(sButtonStripId, bUseImage, oOptions)
142
{
143
	var oButtonStrip = document.getElementById(sButtonStripId),
144
		aItems = oButtonStrip.getElementsByTagName('span');
145
146
	// Remove the 'last' class from the last item.
147
	if (aItems.length > 0)
148
	{
149
		var oLastSpan = aItems[aItems.length - 1];
150
		oLastSpan.className = oLastSpan.className.replace(/\s*last/, 'position_holder');
151
	}
152
153
	// Add the button.
154
	var oButtonStripList = oButtonStrip.getElementsByTagName('ul')[0],
155
		oNewButton = document.createElement('li'),
156
		oRole = document.createAttribute('role');
157
158
	oRole.value = 'menuitem';
159
	oNewButton.setAttributeNode(oRole);
160
161
	if ('sId' in oOptions)
162
		oNewButton.id = oOptions.sId;
0 ignored issues
show
Coding Style Best Practice introduced by
Curly braces around statements make for more readable code and help prevent bugs when you add further statements.

Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later.

Consider:

if (a > 0)
    b = 42;

If you or someone else later decides to put another statement in, only the first statement will be executed.

if (a > 0)
    console.log("a > 0");
    b = 42;

In this case the statement b = 42 will always be executed, while the logging statement will be executed conditionally.

if (a > 0) {
    console.log("a > 0");
    b = 42;
}

ensures that the proper code will be executed conditionally no matter how many statements are added or removed.

Loading history...
163
	oNewButton.innerHTML = '<a class="linklevel1" href="' + oOptions.sUrl + '" ' + ('sCustom' in oOptions ? oOptions.sCustom : '') + '><span class="last"' + ('sId' in oOptions ? ' id="' + oOptions.sId + '_text"': '') + '>' + oOptions.sText + '</span></a>';
164
165
	oButtonStripList.appendChild(oNewButton);
166
}
167