Conditions | 1 |
Paths | 1 |
Total Lines | 51 |
Lines | 0 |
Ratio | 0 % |
Changes | 1 | ||
Bugs | 0 | Features | 0 |
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
1 | /** global: GLSR */ |
||
2 | ;(function() { |
||
3 | |||
4 | 'use strict'; |
||
5 | |||
6 | var Excerpts = function( el ) { // HTMLElement |
||
7 | this.init_( el || document ); |
||
8 | }; |
||
9 | |||
10 | Excerpts.prototype = { |
||
11 | config: { |
||
12 | hiddenClass: 'glsr-hidden', |
||
13 | hiddenTextSelector: '.glsr-hidden-text', |
||
14 | readMoreClass: 'glsr-read-more', |
||
15 | visibleClass: 'glsr-visible', |
||
16 | }, |
||
17 | |||
18 | /** @return void */ |
||
19 | createLinks_: function( el ) { // HTMLElement |
||
20 | var readMoreSpan = document.createElement( 'span' ); |
||
21 | var readmoreLink = document.createElement( 'a' ); |
||
22 | readmoreLink.setAttribute( 'href', '#' ); |
||
23 | readmoreLink.setAttribute( 'data-text', el.getAttribute( 'data-show-less' )); |
||
24 | readmoreLink.innerHTML = el.getAttribute( 'data-show-more' ); |
||
25 | readmoreLink.addEventListener( 'click', this.onClick_.bind( this )); |
||
26 | readMoreSpan.setAttribute( 'class', this.config.readMoreClass ); |
||
27 | readMoreSpan.appendChild( readmoreLink ); |
||
28 | el.parentNode.insertBefore( readMoreSpan, el.nextSibling ); |
||
29 | }, |
||
30 | |||
31 | /** @return void */ |
||
32 | onClick_: function( ev ) { // MouseEvent |
||
33 | ev.preventDefault(); |
||
34 | var el = ev.target; |
||
35 | var hiddenNode = el.parentNode.previousSibling; |
||
36 | var text = el.getAttribute( 'data-text' ); |
||
37 | hiddenNode.classList.toggle( this.config.hiddenClass ); |
||
38 | hiddenNode.classList.toggle( this.config.visibleClass ); |
||
39 | el.setAttribute( 'data-text', el.innerText ); |
||
40 | el.innerText = text; |
||
41 | }, |
||
42 | |||
43 | init_: function( el ) { // HTMLElement |
||
44 | var excerpts = el.querySelectorAll( this.config.hiddenTextSelector ); |
||
45 | for( var i = 0; i < excerpts.length; i++ ) { |
||
46 | this.createLinks_( excerpts[i] ); |
||
47 | } |
||
48 | }, |
||
49 | }; |
||
50 | |||
51 | GLSR.Excerpts = Excerpts; |
||
52 | })(); |
||
53 |