| Conditions | 24 |
| Total Lines | 142 |
| Code Lines | 79 |
| Lines | 0 |
| Ratio | 0 % |
| Changes | 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:
Complex classes like ImageViewerPlugin.js ➔ ImageViewerPlugin 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 | /** |
||
| 5 | function ImageViewerPlugin() { |
||
| 6 | "use strict"; |
||
| 7 | |||
| 8 | var imgElement = undefined, |
||
|
|
|||
| 9 | self = this, |
||
| 10 | rotation = 0, |
||
| 11 | currentPage = 1; |
||
| 12 | |||
| 13 | function initCSS() { |
||
| 14 | /*var pluginCSS; |
||
| 15 | |||
| 16 | pluginCSS = (document.createElementNS(document.head.namespaceURI, 'style')); |
||
| 17 | pluginCSS.setAttribute('media', 'screen, print, handheld, projection'); |
||
| 18 | pluginCSS.setAttribute('type', 'text/css'); |
||
| 19 | pluginCSS.appendChild(document.createTextNode(ImageViewerPlugin_css)); |
||
| 20 | document.head.appendChild(pluginCSS); |
||
| 21 | */ |
||
| 22 | } |
||
| 23 | |||
| 24 | function initButtons() { |
||
| 25 | var leftToolbar = document.getElementById('toolbarLeft'); |
||
| 26 | // hide unused elements |
||
| 27 | document.getElementById("navButtons").style.display = 'none'; |
||
| 28 | document.getElementById("pageNumberLabel").style.display = 'none'; |
||
| 29 | document.getElementById("pageNumber").style.display = 'none'; |
||
| 30 | document.getElementById("numPages").style.display = 'none'; |
||
| 31 | leftToolbar.style.visibility = "visible"; |
||
| 32 | |||
| 33 | var buttonSeperator = document.createElement("div"); |
||
| 34 | buttonSeperator.setAttribute('class', 'splitToolbarButtonSeparator'); |
||
| 35 | |||
| 36 | var rotateLeft = document.createElement("button"); |
||
| 37 | rotateLeft.setAttribute('class', 'toolbarButton pageDown flipHorizontal'); |
||
| 38 | rotateLeft.setAttribute('title', 'Rotate left'); |
||
| 39 | |||
| 40 | var rotateRight = document.createElement("button"); |
||
| 41 | rotateRight.setAttribute('class', 'toolbarButton pageDown'); |
||
| 42 | rotateRight.setAttribute('title', 'Rotate right'); |
||
| 43 | |||
| 44 | leftToolbar.appendChild(rotateLeft); |
||
| 45 | leftToolbar.appendChild(buttonSeperator); |
||
| 46 | leftToolbar.appendChild(rotateRight); |
||
| 47 | |||
| 48 | // Attach events to the above buttons |
||
| 49 | rotateLeft.addEventListener('click', function () { |
||
| 50 | imageRotateLeft(); |
||
| 51 | }); |
||
| 52 | rotateRight.addEventListener('click', function () { |
||
| 53 | imageRotateRight(); |
||
| 54 | }); |
||
| 55 | } |
||
| 56 | |||
| 57 | function imageRotateLeft() { |
||
| 58 | if ( rotation <= 0 ) { |
||
| 59 | rotation = 360; |
||
| 60 | } |
||
| 61 | rotation -= 90; |
||
| 62 | |||
| 63 | document.getElementById("image").className = 'rotate' + rotation; |
||
| 64 | } |
||
| 65 | |||
| 66 | function imageRotateRight() { |
||
| 67 | if ( rotation >= 360 ) { |
||
| 68 | rotation = 0; |
||
| 69 | } |
||
| 70 | rotation += 90; |
||
| 71 | |||
| 72 | document.getElementById("image").className = 'rotate' + rotation; |
||
| 73 | } |
||
| 74 | |||
| 75 | this.initialize = function ( viewerElement, documentUrl ) { |
||
| 76 | // If the URL has a fragment (#...), try to load the file it represents |
||
| 77 | imgElement = document.createElement("img"); |
||
| 78 | imgElement.setAttribute('src', documentUrl); |
||
| 79 | imgElement.setAttribute('alt', 'na'); |
||
| 80 | imgElement.setAttribute('id', 'image'); |
||
| 81 | |||
| 82 | viewerElement.appendChild(imgElement); |
||
| 83 | viewerElement.style.overflow = "auto"; |
||
| 84 | |||
| 85 | self.onLoad(); |
||
| 86 | |||
| 87 | initCSS(); |
||
| 88 | initButtons(); |
||
| 89 | }; |
||
| 90 | |||
| 91 | this.isSlideshow = function () { |
||
| 92 | return false; |
||
| 93 | }; |
||
| 94 | |||
| 95 | this.onLoad = function () { |
||
| 96 | }; |
||
| 97 | |||
| 98 | this.fitToWidth = function ( width ) { |
||
| 99 | imgElement.width = width; |
||
| 100 | }; |
||
| 101 | |||
| 102 | this.fitToHeight = function ( height ) { |
||
| 103 | imgElement.height = height; |
||
| 104 | }; |
||
| 105 | |||
| 106 | this.fitToPage = function ( width, height ) { |
||
| 107 | imgElement.width = width; |
||
| 108 | }; |
||
| 109 | |||
| 110 | this.fitSmart = function ( width ) { |
||
| 111 | imgElement.width = width; |
||
| 112 | }; |
||
| 113 | |||
| 114 | this.getZoomLevel = function () { |
||
| 115 | return imgElement.width / imgElement.naturalWidth; |
||
| 116 | }; |
||
| 117 | |||
| 118 | this.setZoomLevel = function ( value ) { |
||
| 119 | imgElement.width = value * imgElement.naturalWidth; |
||
| 120 | }; |
||
| 121 | |||
| 122 | // return a list of tuples (pagename, pagenode) |
||
| 123 | this.getPages = function () { |
||
| 124 | return [1, 2]; |
||
| 125 | }; |
||
| 126 | |||
| 127 | this.showPage = function ( n ) { |
||
| 128 | if ( n === currentPage ) { |
||
| 129 | imgElement.parentNode.scrollTop -= 100; |
||
| 130 | } else { |
||
| 131 | imgElement.parentNode.scrollTop += 100; |
||
| 132 | } |
||
| 133 | }; |
||
| 134 | |||
| 135 | this.getPluginName = function () { |
||
| 136 | return "ImageViewerPlugin"; |
||
| 137 | }; |
||
| 138 | |||
| 139 | this.getPluginVersion = function () { |
||
| 140 | return "From Source"; |
||
| 141 | }; |
||
| 142 | |||
| 143 | this.getPluginURL = function () { |
||
| 144 | return "https://grommunio.com"; |
||
| 145 | }; |
||
| 146 | } |
||
| 147 |