Conditions | 10 |
Paths | 56 |
Total Lines | 112 |
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 index.js ➔ updateConversation 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 | var flag = 0; |
||
89 | function updateConversation(arr) { |
||
90 | if(!width()) |
||
91 | { |
||
92 | SidebarRequest(); |
||
93 | } |
||
94 | var ele = document.getElementById("conversation"); |
||
95 | |||
96 | if (arr[0].type == 1) { |
||
97 | ele.innerHTML = ""; |
||
98 | |||
99 | // For showing previous message |
||
100 | if (arr[0].load > 10) { |
||
101 | var txt = $("<a></a>").text("Show Previous Message!"); |
||
102 | var te = $("<div></div>").append(txt); |
||
103 | $("#conversation").append(te); |
||
104 | $("#conversation div").addClass("previous"); |
||
105 | $("#conversation div a").attr({ |
||
106 | "onclick": "previous(this)", |
||
107 | "id": arr[0].username, |
||
108 | "name": arr[0].load |
||
109 | }); |
||
110 | } |
||
111 | |||
112 | for (var i = arr.length - 1; i >= 1; i--) { |
||
113 | // create element |
||
114 | var para = document.createElement("div"); |
||
115 | if (arr[i]["sent_by"] != arr[i]["start"]) |
||
116 | { |
||
117 | para.setAttribute("class", "receiver"); |
||
118 | } |
||
119 | else |
||
120 | { |
||
121 | para.setAttribute("class", "sender"); |
||
122 | } |
||
123 | |||
124 | ele.appendChild(para); |
||
125 | var bre = document.createElement("br"); |
||
126 | bre.setAttribute("style", "clear:both;"); |
||
127 | ele.appendChild(bre); |
||
128 | |||
129 | var info = document.createElement("p"); |
||
130 | var node = document.createTextNode(arr[i]["message"]); |
||
131 | info.appendChild(node); |
||
132 | para.appendChild(info); |
||
133 | |||
134 | var tt = document.createElement("h6"); |
||
135 | var inp = document.createTextNode(arr[i]["time"]); |
||
136 | tt.appendChild(inp); |
||
137 | tt.setAttribute("class", "message_time"); |
||
138 | info.appendChild(tt); |
||
139 | } |
||
140 | |||
141 | $("#chat_heading a").remove("a"); |
||
142 | txt = $("<a></a>").text(arr[0].name); |
||
143 | $("#chat_heading").append(txt); |
||
144 | $("#chat_heading a").attr({ |
||
145 | "href": "http://localhost/openchat/account.php/" + arr[0].username |
||
146 | }); |
||
147 | // Online |
||
148 | if (arr[0]["login_status"] == "1") { |
||
149 | var online = document.createElement("p"); |
||
150 | online.setAttribute("class", "online"); |
||
151 | $("#chat_heading a").append(online); |
||
152 | $("#chat_heading a p").css({ |
||
153 | "float": "right" |
||
154 | }); |
||
155 | } |
||
156 | |||
157 | if (width()) |
||
158 | { |
||
159 | $(".text_icon #text_reply").attr({ |
||
160 | "name": arr[0]["id"] |
||
161 | }); |
||
162 | } |
||
163 | else |
||
164 | { |
||
165 | $("#text_reply").attr({ |
||
166 | "name": arr[0]["id"] |
||
167 | }); |
||
168 | } |
||
169 | ele.scrollTop = ele.scrollHeight; |
||
170 | } else { |
||
171 | ele.innerHTML = ""; |
||
172 | $("#chat_heading a").remove("a"); |
||
173 | |||
174 | txt = $("<a></a>").text(arr[0].name); |
||
175 | $("#chat_heading").append(txt); |
||
176 | $("#chat_heading a").attr({ |
||
177 | "href": "http://localhost/openchat/account.php/" + arr[0].username |
||
178 | }); |
||
179 | |||
180 | if (arr[0]["login_status"] == "1") { |
||
181 | online = document.createElement("p"); |
||
182 | online.setAttribute("class", "online"); |
||
183 | $("#chat_heading a").append(online); |
||
184 | $("#chat_heading a p").css({ |
||
185 | "float": "right" |
||
186 | }); |
||
187 | } |
||
188 | |||
189 | if (width()) { |
||
190 | $(".text_icon #text_reply").attr({ |
||
191 | "name": arr[0]["id"] |
||
192 | }); |
||
193 | } else { |
||
194 | $("#text_reply").attr({ |
||
195 | "name": arr[0]["id"] |
||
196 | }); |
||
197 | } |
||
198 | } |
||
199 | |||
200 | } |
||
201 | |||
446 | console.log("Hello, Contact me at [email protected]"); |
||
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.