Completed
Push — master ( f17009...2e0c84 )
by Ankit
03:20
created

public/assests/js/index.js   C

Complexity

Total Complexity 58
Complexity/F 2.32

Size

Lines of Code 462
Function Count 25

Duplication

Duplicated Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
cc 0
nc 1
dl 0
loc 462
rs 5.4871
c 0
b 0
f 0
wmc 58
mnd 3
bc 68
fnc 25
bpm 2.72
cpm 2.32
noi 10

23 Functions

Rating   Name   Duplication   Size   Complexity  
A conn.onopen 0 4 1
A index.js ➔ sidebarRequest 0 3 1
A index.js ➔ width 0 7 2
B index.js ➔ updateConversation 0 63 6
A index.js ➔ newConversation 0 17 1
A index.js ➔ compose 0 8 1
A index.js ➔ searchResult 0 15 2
A index.js ➔ myFunction 0 9 1
A index.js ➔ show_search 0 6 1
B index.js ➔ createSidebarElement 0 31 3
A index.js ➔ reply 0 23 2
D conn.onmessage 0 48 10
A index.js ➔ init 0 3 1
C index.js ➔ mobile 0 35 7
A index.js ➔ previous 0 7 1
A index.js ➔ SideBar 0 9 2
B index.js ➔ setConversationDetails 0 31 3
A index.js ➔ firstConversation 0 3 1
A index.js ➔ mob_hide 0 7 1
A index.js ➔ search_choose 0 18 2
B index.js ➔ composeResult 0 33 3
A index.js ➔ composeChoose 0 15 2
B index.js ➔ startDictation 0 24 2

How to fix   Complexity   

Complexity

Complex classes like public/assests/js/index.js 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;
2
var pre = "";
3
4
// Websocket Connection Open
5
var conn = new WebSocket("ws://localhost:8080");
0 ignored issues
show
Bug introduced by
The variable WebSocket seems to be never declared. If this is a global, consider adding a /** global: WebSocket */ 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...
6
conn.onopen = function () {
7
  // console.log("Connection established!");
8
  init();
9
};
10
11
// On Message
12
conn.onmessage = function(e) {
13
  var msg = JSON.parse(e.data);
14
  console.log(msg);
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...
15
  if (!width())
16
  {
17
    SideBar(msg.sidebar);
18
  }
19
  else
20
  {
21
    if( document.getElementById("conversation").style.display == "none")
22
    {
23
      SideBar(msg.sidebar);
24
    }
25
  }
26
27
  if (msg.initial !== undefined)
28
  {
29
    SideBar(msg.initial);
30
  }
31
32
  if (msg.conversation !== undefined)
33
  {
34
    updateConversation(msg.conversation);
35
  }
36
37
  if(msg.reply !== undefined)
38
  {
39
    var textAreaId = $("#text_reply").attr("name");
40
    if(width())
41
    {
42
      textAreaId = $(".text_icon #text_reply").attr("name");
43
    }
44
    if(msg.reply[0].id === textAreaId)
45
    {
46
      updateConversation(msg.reply);
47
    }
48
  }
49
50
  if (msg.Search !== undefined)
51
  {
52
    searchResult(msg.Search);
53
  }
54
55
  if (msg.Compose !== undefined)
56
  {
57
    composeResult(msg.Compose);
58
  }
59
};
60
61
62
// For First time
63
function init() {
64
  conn.send("OpenChat initiated..!");
65
}
66
67
// For updating Sidebar
68
function SideBar(msg)
69
{
70
  mobile("sidebar");
71
  // Getting Div
72
  if (msg != null)
73
  {
74
    createSidebarElement(msg);
75
  }
76
}
77
78
// SideBar Load Request
79
function sidebarRequest() {
80
  conn.send("Load Sidebar");
81
}
82
83
// Update Current Conversation
84
function updateConversation(data)
85
{
86
87
  if(!width())
88
  {
89
    sidebarRequest();
90
  }
91
92
  var ele = document.getElementById("conversation");
93
  ele.innerHTML = "";
94
95
    if (data[0].type === 1) {
96
      // For showing previous message
97
      if (data[0].load > 10) {
98
        var aElement = $("<a></a>").text("Show Previous Message!");
99
        var divElement = $("<div></div>").append(aElement);
100
        $("#conversation").append(divElement);
101
        $("#conversation div").addClass("previous");
102
        $("#conversation div a").attr({
103
          "onclick": "previous(this)",
104
          "id": data[0].username,
105
          "name": data[0].load
106
        });
107
      }
108
109
      for (var i = data.length - 1; i >= 1; i--) {
110
        // create element
111
        var divElement = document.createElement("div");
0 ignored issues
show
Comprehensibility Naming Best Practice introduced by
The variable divElement already seems to be declared on line 99. Consider using another variable name or omitting the var keyword.

This check looks for variables that are declared in multiple lines. There may be several reasons for this.

In the simplest case the variable name was reused by mistake. This may lead to very hard to locate bugs.

If you want to reuse a variable for another purpose, consider declaring it at or near the top of your function and just assigning to it subsequently so it is always declared.

Loading history...
112
        if (data[i]["sent_by"] !== data[i].start)
113
        {
114
          divElement.setAttribute("class", "receiver");
115
        }
116
        else
117
        {
118
          divElement.setAttribute("class", "sender");
119
        }
120
121
        ele.appendChild(divElement);
122
        var brElement = document.createElement("br");
123
        brElement.setAttribute("style", "clear:both;");
124
        ele.appendChild(brElement);
125
126
        var pElement = document.createElement("p");
127
        var pText = document.createTextNode(data[i].message);
128
        pElement.appendChild(pText);
129
        divElement.appendChild(pElement);
130
131
        var h6Element = document.createElement("h6");
132
        var h6Text = document.createTextNode(data[i].time);
133
        h6Element.appendChild(h6Text);
134
        h6Element.setAttribute("class", "message_time");
135
        pElement.appendChild(h6Element);
136
      }
137
138
      setConversationDetails(data[0]);
139
140
      ele.scrollTop = ele.scrollHeight;
141
    }
142
    else
143
    {
144
      setConversationDetails(data[0]);
145
    }
146
}
147
148
function firstConversation(argument) {
0 ignored issues
show
Unused Code introduced by
The parameter argument is not used and could be removed.

This check looks for parameters in functions that are not used in the function body and are not followed by other parameters which are used inside the function.

Loading history...
149
150
}
151
152
function setConversationDetails(details)
153
{
154
  $("#chat_heading a").remove("a");
155
    var aElement = $("<a></a>").text(details.name);
156
    $("#chat_heading").append(aElement);
157
    $("#chat_heading a").attr({
158
      "href": "http://localhost/openchat/account.php/" + details.username
159
    });
160
161
    if (details.login_status === "1") {
162
      var online = document.createElement("p");
163
      online.setAttribute("class", "online");
164
      $("#chat_heading a").append(online);
165
      $("#chat_heading a p").css({
166
        "float": "right"
167
      });
168
    }
169
170
    if (width())
171
    {
172
      $(".text_icon #text_reply").attr({
173
        "name": details.id
174
      });
175
    }
176
    else
177
    {
178
      $("#text_reply").attr({
179
        "name": details.id
180
      });
181
    }
182
}
183
184
// Creating new Conversation or Loading Conversation
185
function newConversation(element, load)
186
{
187
  mobile("main");
188
  $("#compose_selection").css("visibility", "hidden");
189
  flag = 0;
190
  $("#compose_name").val("");
191
  $("#search_item").val("");
192
  $("#compose_text").hide();
193
194
  var msg = {
195
    "username": element.id,
196
    "load": load,
197
    "newConversation": "Initiated"
198
  };
199
  conn.send(JSON.stringify(msg));
200
201
}
202
203
// For reply to other messages
204
function reply()
205
{
206
  var replyElement = "";
207
  if (width())
208
  {
209
    replyElement = ".text_icon #text_reply";
210
  }
211
  else
212
  {
213
    replyElement = "#text_reply";
214
  }
215
216
  var message = [$(replyElement).val()];
217
  var id = $(replyElement).attr("name");
218
  $(replyElement).val("");
219
  // console.log(message);
220
  var q = {
221
    "name": id,
222
    "reply": message
223
  };
224
  conn.send(JSON.stringify(q));
225
226
}
227
228
// Compose new and direct message to anyone
229
function compose()
230
{
231
  mobile("compose");
232
  flag = 1;
233
  $("#chat_heading a").remove("a");
234
  document.getElementById("conversation").innerHTML = "";
235
  $("#compose_text").show();
236
}
237
238
function composeChoose()
239
{
240
  var text = document.getElementById("compose_name").value;
241
  if (text !== "") {
242
    var msg = {
243
      "value": text,
244
      "Compose": "Compose"
245
    };
246
    conn.send(JSON.stringify(msg));
247
  }
248
  else
249
  {
250
    $("#compose_selection").css("visibility", "hidden");
251
  }
252
}
253
254
//compose messages
255
function composeResult(arr)
256
{
257
  var ele = document.getElementById("suggestion");
258
  ele.innerHTML = "";
259
260
  if (arr !== "Not Found")
261
  {
262
    for (var i = arr.length - 1; i >= 0; i--)
263
    {
264
      var liElement = document.createElement("li");
265
      var aElement = document.createElement("a");
266
      var aText = document.createTextNode(arr[i].name);
267
      aElement.appendChild(aText);
268
      aElement.setAttribute("href", "#");
269
      aElement.setAttribute("onclick", "newConversation(this,10)");
270
      aElement.setAttribute("class", "suggestion");
271
      aElement.setAttribute("id", arr[i].username);
272
      liElement.appendChild(aElement);
273
      ele.appendChild(liElement);
274
    }
275
  }
276
  else
277
  {
278
    var aElement = $("<a></a>").text("Not Found");
0 ignored issues
show
Comprehensibility Naming Best Practice introduced by
The variable aElement already seems to be declared on line 265. Consider using another variable name or omitting the var keyword.

This check looks for variables that are declared in multiple lines. There may be several reasons for this.

In the simplest case the variable name was reused by mistake. This may lead to very hard to locate bugs.

If you want to reuse a variable for another purpose, consider declaring it at or near the top of your function and just assigning to it subsequently so it is always declared.

Loading history...
279
    var liElement = $("<li></li>").append(aElement);
0 ignored issues
show
Comprehensibility Naming Best Practice introduced by
The variable liElement already seems to be declared on line 264. Consider using another variable name or omitting the var keyword.

This check looks for variables that are declared in multiple lines. There may be several reasons for this.

In the simplest case the variable name was reused by mistake. This may lead to very hard to locate bugs.

If you want to reuse a variable for another purpose, consider declaring it at or near the top of your function and just assigning to it subsequently so it is always declared.

Loading history...
280
    $("#suggestion").append(liElement);
281
282
    $("#suggestion li a").attr({
283
      "onclick": "myFunction()"
284
    });
285
  }
286
  $("#compose_selection").css("visibility", "visible");
287
}
288
289
function search_choose()
290
{
291
  var text = $("#search_item").val();
292
  if (text !== "")
293
  {
294
    var msg = {
295
      "value": text,
296
      "search": "search"
297
    };
298
299
    conn.send(JSON.stringify(msg));
300
  }
301
  else
302
  {
303
    conn.send("Load Sidebar");
304
  }
305
306
}
307
308
function searchResult(arr)
309
{
310
  if (arr !== "Not Found")
311
  {
312
    createSidebarElement(arr);
313
  }
314
  else
315
  {
316
    $("#message").text("");
317
    var aElement = $("<a></a>").text("Not Found");
318
    $("#message").append(aElement);
319
    $("#message a").addClass("message");
320
  }
321
322
}
323
324
function createSidebarElement(data)
325
{
326
  // organising content according to time
327
  var ele = document.getElementById('message');
328
  ele.innerHTML = "";
329
  var condition = data.length;
330
  for (var i = 0; i < condition; i++)
331
  {
332
      var aElement = document.createElement("a"); //creating element a
333
      var aText = document.createTextNode(data[i].name);
334
      aElement.appendChild(aText);
335
      aElement.setAttribute("id", data[i].username);
336
      aElement.setAttribute("href", "message.php#" + data[i].username);
337
      aElement.setAttribute("class", "message");
338
      aElement.setAttribute("onclick", "newConversation(this,10)");
339
      ele.appendChild(aElement);
340
341
      // creating element span for showing time
342
      var spanElement = document.createElement("span");
343
      var spanText = document.createTextNode(data[i].time);
344
      spanElement.appendChild(spanText);
345
      spanElement.setAttribute("class", "message_time");
346
      aElement.appendChild(spanElement);
347
348
      if (data[i].login_status === "1") {
349
        var online = document.createElement("div");
350
        online.setAttribute("class", "online");
351
        aElement.appendChild(online);
352
    }
353
  }
354
}
355
356
window.ondblclick = myFunction;
357
358
function myFunction() // Hidden compose message input
359
{
360
  $("#compose_selection").css("visibility", "hidden");
361
  init();
362
  flag = 0;
363
  $("#compose_name").val("");
364
  $("#search_item").val("");
365
  $("#compose_text").hide();
366
}
367
368
function previous(element) // Load previous messages
369
{
370
  mobile("previous");
371
  var user = element.id;
0 ignored issues
show
Unused Code introduced by
The variable user seems to be never used. Consider removing it.
Loading history...
372
  var lo = element.name;
373
  newConversation(element, lo);
374
}
375
376
function mobile(ele)
377
{
378
  if (width()) {
379
    mob_hide();
380
    if (ele == "main") {
381
      $(".sidebar").hide();
382
      $(".mob-reply").show();
383
      $(".chat_name").show();
384
      $(".chat_name #chat_heading").show();
385
      if (pre == "") {
386
        $(".main div").remove("div");
387
        $(".main br").remove("br");
388
        $(".chat_name #chat_heading a").remove("a");
389
      }
390
      $(".main").show();
391
    }
392
    if (ele == "compose") {
393
      $(".chat_name").show();
394
      $(".chat_name .compose_text").show();
395
      $(".sidebar").hide();
396
      $("#compose_selection").show();
397
    }
398
    if (ele == "sidebar") {
399
      $(".sidebar").show();
400
    }
401
    if (ele == "previous")
402
    {
403
      pre = "1";
404
    }
405
    else
406
    {
407
      pre = "";
408
    }
409
  }
410
}
411
412
function show_search() {
413
  // console.log("HE0");
414
  mob_hide();
415
  $(".search_message").show();
416
  $(".sidebar").show();
417
}
418
419
function mob_hide() {
420
  $(".search_message").hide();
421
  $(".sidebar").hide();
422
  $(".main").hide();
423
  $(".chat_name").hide();
424
  $(".mob-reply").hide();
425
}
426
427
function width() {
428
  if (window.innerWidth < 500)
429
  {
430
    return true;
431
  }
432
  return false;
433
}
434
435
// Audio Recognization
436
437
function startDictation() {
438
439
  if (window.hasOwnProperty("webkitSpeechRecognition")) {
440
441
    var recognition = new webkitSpeechRecognition();
0 ignored issues
show
Bug introduced by
The variable webkitSpeechRecognition seems to be never declared. If this is a global, consider adding a /** global: webkitSpeechRecognition */ 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...
Coding Style Best Practice introduced by
By convention, constructors like webkitSpeechRecognition should be capitalized.
Loading history...
442
443
    recognition.continuous = false;
444
    recognition.interimResults = false;
445
446
    recognition.lang = "en-IN";
447
    recognition.start();
448
449
    recognition.onresult = function(e) {
450
      document.getElementById("text_reply").value = e.results[0][0].transcript;
451
      recognition.stop();
452
      reply();
453
    };
454
455
    recognition.onerror = function() {
456
      recognition.stop();
457
    }
458
459
  }
460
}
461
462
console.log("Hello, Contact me at [email protected]");
0 ignored issues
show
Debugging Code introduced by
console.log looks like debug code. Are you sure you do not want to remove it?
Loading history...