message.js ➔ setConversationDetails - Code Metrics - Inspection of "Fix minor bug" - ankitjain28may/openchat - Measure and Improve Code Quality continuously with Scrutinizer

Completed

Push — master ( 9c2ffd...9edb5e )

by Ankit

created 2017-01-16 14:10 UTC

message.js ➔ setConversationDetails B

↳ Parent: public/assests/js/message.js

Complexity

Conditions	2
Paths	2

Size

Total Lines

Duplication

Lines	0
Ratio	0 %

Importance

Changes	1
Bugs	0	Features	1

Metric	Value
cc	2
c	1
b	0
f	1
nc	2
nop	1
dl	0
loc	36
rs	8.8571


// Websocket Connection Open
var conn = new WebSocket("ws://localhost:8080");



// For First time
function init() {
  conn.send("OpenChat initiated..!");
}

conn.onopen = function() {
  console.log("Connection established!");

  init();
};

// SideBar Load Request
function sidebarRequest() {
  conn.send("Load Sidebar");
}

// Create Sidebar
function createSidebarElement(data, eleId)
{
  // organising content according to time
  $("#"+eleId).html("");
  var condition = data.length;
  for (var i = 0; i < condition; i++)
  {

    var div1 = $("<div></div>").addClass("row sideBar-body");

    div1.attr({
      "id" : data[i].username
    });

    var div2 = $("<div></div>").addClass("col-sm-3 col-xs-3 sideBar-avatar");
    var div3 = $("<div></div>").addClass("avatar-icon");
    var imgElement = $("<img>").attr({
      "src": "../public/assests/img/bg.png"
    });
    div3.append(imgElement);
    div2.append(div3);
    div1.append(div2);

    div2 = $("<div></div>").addClass("col-sm-9 col-xs-9 sideBar-main");
    div3 = $("<div></div>").addClass("row");
    var div4 = $("<div></div>").addClass("col-sm-8 col-xs-8 sideBar-name");
    var spanE = $("<span></span>").addClass("name-meta").text(data[i].name);
    div4.append(spanE);
    div3.append(div4);

    div4 = $("<div></div>").addClass("col-sm-4 col-xs-4 pull-right sideBar-time");
    spanE = $("<span></span>").addClass("time-meta pull-right").text(data[i].time);
     div4.append(spanE);
    div3.append(div4);
    div2.append(div3);

    div1.append(div2);
    $("#"+eleId).append(div1);

    if(eleId === "message" && $("#text_reply").attr("name") == data[i].login_id)
    {
      $("#"+data[i].username).addClass("active");
    }
  }
}


// For updating Sidebar
function SideBar(msg) {
  // Getting Div
  if (msg != null) {
    createSidebarElement(msg, "message");
  }
}

function toConversation() {
  $(".side").addClass("hide");
  $(".message").addClass("show");
  $(".lowerBar").addClass("show");
  $(".reply-emojis").addClass("hide");
  $(".reply-recording").addClass("hide");
}

function toSidebar() {
  $(".side").removeClass("hide");
  $(".message").removeClass("show");
  $(".lowerBar").removeClass("show");
  $(".reply-emojis").removeClass("hide");
  $(".reply-recording").removeClass("hide");
}

function width() {
  if (window.innerWidth < 768) {
    return true;
  }
  return false;
}

// Creating new Conversation or Loading Conversation
function newConversation(element, load)
{

  if(width())
  {
    toConversation();
  }

  var msg = {
    "username": element.id,
    "load": load,
    "newConversation": "Initiated"
  };
  conn.send(JSON.stringify(msg));
}

// Set Details
function setConversationDetails(details)
{
  $("#conversationHeading").html("");

  var headingEle = $("<div></div>").addClass("col-sm-2 col-md-1 col-xs-3 heading-avatar");
  var headingAva = $("<div></div>").addClass("heading-avatar-icon");
  var headingImg = $("<img>").attr({"src" : "../public/assests/img/ankit.png"});
  headingAva.append(headingImg);
  headingEle.append(headingAva);

  var headingEleName = $("<div></div>").addClass("col-sm-8 col-xs-7 heading-name");
  var headingNameMeta = $("<a></a>").addClass("heading-name-meta").text(details.name);
  headingNameMeta.attr({
    "href": location.href.substring(0, location.href.lastIndexOf("/") + 1) + "account.php/" + details.username
  });
  var headingOnline = $("<span></span>").addClass("heading-online");
  headingOnline.text("");
  if (details.login_status === "1") {
    headingOnline.text("Online");
  }
  headingEleName.append(headingNameMeta);
  headingEleName.append(headingOnline);

  var headingDot = $("<div></div>").addClass("col-sm-1 col-xs-1  heading-dot pull-right");
  var headingDotIcon = $("<i></i>").addClass("fa fa-ellipsis-v fa-2x  pull-right").attr({"aria-hidden" : "true"});
  headingDot.append(headingDotIcon);


  $("#conversationHeading").append(headingEle);
  $("#conversationHeading").append(headingEleName);
  $("#conversationHeading").append(headingDot);

  $("#text_reply").attr({
    "name": details.id
  });
}


// Update Current Conversation
function updateConversation(data)
{

  var ele = document.getElementById("conversation");
  ele.innerHTML = "";

  if (data[0].type === 1) {
    // For showing previous message
    if (data[0].load > 10)
    {
      var divE1 = $("<div></div>").addClass("row message-previous");
      var divE2 = $("<div></div>").addClass("col-sm-12 previous");
      var aElement = $("<a></a>").text("Show Previous Message!");
      aElement.attr({
        "id": data[0].username,
        "name": data[0].load
      });
      divE2.append(aElement);
      divE1.append(divE2);
      $("#conversation").append(divE1);
    }

    for (var i = data.length - 1; i >= 1; i--) {
      // create element
      var divElement1 = $("<div></div>").addClass("row message-body");
      var divElement2 = $("<div></div>").addClass("col-sm-12");
      var divElement3 = $("<div></div>");
      var messageText = $("<div></div>").addClass("message-text").text(data[i].message);
      var spanElement = $("<span></span>").addClass("message-time pull-right").text(data[i].time);

      if (data[i]["sent_by"] !== data[i].start)
      {
       divElement2.addClass("message-main-receiver");
       divElement3.addClass("receiver");
      }
      else
      {
        divElement2.addClass("message-main-sender");
       divElement3.addClass("sender");
      }
      divElement3.append(messageText);
      divElement3.append(spanElement);
      divElement2.append(divElement3);
      divElement1.append(divElement2);
      $("#conversation").append(divElement1);
    }

    setConversationDetails(data[0]);

    ele.scrollTop = ele.scrollHeight;
  } else {
    setConversationDetails(data[0]);
  }
}

// For reply to other messages
function reply() {

  var message = [$("#text_reply").val()];
  var id = $("#text_reply").attr("name");
  $("#text_reply").val("");
  // console.log(message);
  var q = {
    "name": id,
    "reply": message
  };
  conn.send(JSON.stringify(q));
}

function notFound(eleId)
{
  eleId = "#"+eleId;
  $(eleId).text("");
  var divElement = $("<div></div>").addClass("notFound").text("Not Found");
  $(eleId).append(divElement);
}

function composeChoose() {
  var text = document.getElementById("composeText").value;
  if (text !== "")
  {
    var msg =
    {
      "value": text,
      "Compose": "Compose"
    };
    conn.send(JSON.stringify(msg));
  }
  else
  {
    $("#compose").html("");
  }
}

//compose messages
function composeResult(arr)
{
  var ele = document.getElementById("compose");
  ele.innerHTML = "";

  if (arr !== "Not Found")
  {
    createSidebarElement(arr, "compose");
  }
  else
  {
    notFound("compose");
  }
}

function searchChoose() {
  var text = $("#searchText").val();
  if (text !== "") {
    var msg = {
      "value": text,
      "search": "search"
    };

    conn.send(JSON.stringify(msg));
  }
  else
  {
    sidebarRequest();
  }

}

function searchResult(arr) {
  if (arr !== "Not Found") {
    createSidebarElement(arr, "message");
  }
  else
  {
    notFound("message");
  }

}

// Load previous messages
function previous(element)
{
  var user = element.id;

  var lo = element.name;
  newConversation(element, lo);
}

function hideComposeScreen() {
  $(".side-two").css({
    "left": "-100%"
  });
}

// Audio Recognization

function startDictation() {

  if (window.hasOwnProperty("webkitSpeechRecognition")) {

    var recognition = new webkitSpeechRecognition();


    recognition.continuous = false;
    recognition.interimResults = false;

    recognition.lang = "en-IN";
    recognition.start();

    recognition.onresult = function(e) {
      document.getElementById("text_reply").value = e.results[0][0].transcript;
      recognition.stop();
      reply();
    };

    recognition.onerror = function() {
      recognition.stop();
    }

  }
}


// On Message
conn.onmessage = function(e)
{
  var msg = JSON.parse(e.data);
  // console.log(msg);
  if (!width())
  {
    SideBar(msg.sidebar);
  } else
  {
    if (!$(".side").hasClass("hide")) {
      SideBar(msg.sidebar);
    }
  }

  if (msg.initial !== undefined) {
    SideBar(msg.initial);
  }

  if (msg.conversation !== undefined) {
    updateConversation(msg.conversation);
  }

  if (msg.reply !== undefined) {
    var textAreaId = $("#text_reply").attr("name");
    if (msg.reply[0].id === textAreaId) {
      updateConversation(msg.reply);
    }
  }

  if (msg.Search !== undefined) {
    searchResult(msg.Search);
  }

  if (msg.Compose !== undefined) {
    composeResult(msg.Compose);
  }
};

// Event Listeners
$(document).ready(function(){
  $("body").on("click", ".sideBar-body", function() {
    newConversation(this,10);
    hideComposeScreen();
  });

  $("body").on("click", ".reply-send",
   function() {
    reply();
  });

  $("body").on("click", ".reply-recording",
   function() {
    startDictation();
  });

  $("body").on("click", ".lowerBar-recording",
   function() {
    startDictation();
  });

  $("body").on("click", ".lowerBar-back",
   function() {
    toSidebar();
    sidebarRequest();
  });

  $("body").on("click", ".previous a",
   function() {
    previous(this);
  });

  $("body").on("keyup", "#searchText",
   function() {
    searchChoose();
  });

  $("body").on("keyup", "#composeText",
   function() {
    composeChoose();
  });

  $(".heading-compose").click(function() {
    $(".side-two").css({
      "left": "0"
    });
  });

  $(".newMessage-back").click(function() {
    hideComposeScreen();
  });

});

console.log("Hello, Contact me at [email protected]");


1
2			// Websocket Connection Open
3			var conn = new WebSocket("ws://localhost:8080");
			0 ignored issues – show Bug introduced 2017-01-09 19:33 UTC by Report Bug Copy Issue Report 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...
4
5
6			// For First time
7			function init() {
8			conn.send("OpenChat initiated..!");
9			}
10
11			conn.onopen = function() {
12			console.log("Connection established!");
			0 ignored issues – show Debugging Code introduced 2017-01-09 19:33 UTC by Report Bug Copy Issue Report `console.log` looks like debug code. Are you sure you do not want to remove it? Loading history...
13			init();
14			};
15
16			// SideBar Load Request
17			function sidebarRequest() {
18			conn.send("Load Sidebar");
19			}
20
21			// Create Sidebar
22			function createSidebarElement(data, eleId)
23			{
24			// organising content according to time
25			$("#"+eleId).html("");
26			var condition = data.length;
27			for (var i = 0; i < condition; i++)
28			{
29
30			var div1 = $("<div></div>").addClass("row sideBar-body");
31
32			div1.attr({
33			"id" : data[i].username
34			});
35
36			var div2 = $("<div></div>").addClass("col-sm-3 col-xs-3 sideBar-avatar");
37			var div3 = $("<div></div>").addClass("avatar-icon");
38			var imgElement = $("<img>").attr({
39			"src": "../public/assests/img/bg.png"
40			});
41			div3.append(imgElement);
42			div2.append(div3);
43			div1.append(div2);
44
45			div2 = $("<div></div>").addClass("col-sm-9 col-xs-9 sideBar-main");
46			div3 = $("<div></div>").addClass("row");
47			var div4 = $("<div></div>").addClass("col-sm-8 col-xs-8 sideBar-name");
48			var spanE = $("<span></span>").addClass("name-meta").text(data[i].name);
49			div4.append(spanE);
50			div3.append(div4);
51
52			div4 = $("<div></div>").addClass("col-sm-4 col-xs-4 pull-right sideBar-time");
53			spanE = $("<span></span>").addClass("time-meta pull-right").text(data[i].time);
54			div4.append(spanE);
55			div3.append(div4);
56			div2.append(div3);
57
58			div1.append(div2);
59			$("#"+eleId).append(div1);
60
61			if(eleId === "message" && $("#text_reply").attr("name") == data[i].login_id)
62			{
63			$("#"+data[i].username).addClass("active");
64			}
65			}
66			}
67
68
69			// For updating Sidebar
70			function SideBar(msg) {
71			// Getting Div
72			if (msg != null) {
73			createSidebarElement(msg, "message");
74			}
75			}
76
77			function toConversation() {
78			$(".side").addClass("hide");
79			$(".message").addClass("show");
80			$(".lowerBar").addClass("show");
81			$(".reply-emojis").addClass("hide");
82			$(".reply-recording").addClass("hide");
83			}
84
85			function toSidebar() {
86			$(".side").removeClass("hide");
87			$(".message").removeClass("show");
88			$(".lowerBar").removeClass("show");
89			$(".reply-emojis").removeClass("hide");
90			$(".reply-recording").removeClass("hide");
91			}
92
93			function width() {
94			if (window.innerWidth < 768) {
95			return true;
96			}
97			return false;
98			}
99
100			// Creating new Conversation or Loading Conversation
101			function newConversation(element, load)
102			{
103
104			if(width())
105			{
106			toConversation();
107			}
108
109			var msg = {
110			"username": element.id,
111			"load": load,
112			"newConversation": "Initiated"
113			};
114			conn.send(JSON.stringify(msg));
115			}
116
117			// Set Details
118			function setConversationDetails(details)
119			{
120			$("#conversationHeading").html("");
121
122			var headingEle = $("<div></div>").addClass("col-sm-2 col-md-1 col-xs-3 heading-avatar");
123			var headingAva = $("<div></div>").addClass("heading-avatar-icon");
124			var headingImg = $("<img>").attr({"src" : "../public/assests/img/ankit.png"});
125			headingAva.append(headingImg);
126			headingEle.append(headingAva);
127
128			var headingEleName = $("<div></div>").addClass("col-sm-8 col-xs-7 heading-name");
129			var headingNameMeta = $("<a></a>").addClass("heading-name-meta").text(details.name);
130			headingNameMeta.attr({
131			"href": location.href.substring(0, location.href.lastIndexOf("/") + 1) + "account.php/" + details.username
132			});
133			var headingOnline = $("<span></span>").addClass("heading-online");
134			headingOnline.text("");
135			if (details.login_status === "1") {
136			headingOnline.text("Online");
137			}
138			headingEleName.append(headingNameMeta);
139			headingEleName.append(headingOnline);
140
141			var headingDot = $("<div></div>").addClass("col-sm-1 col-xs-1 heading-dot pull-right");
142			var headingDotIcon = $("<i></i>").addClass("fa fa-ellipsis-v fa-2x pull-right").attr({"aria-hidden" : "true"});
143			headingDot.append(headingDotIcon);
144
145
146			$("#conversationHeading").append(headingEle);
147			$("#conversationHeading").append(headingEleName);
148			$("#conversationHeading").append(headingDot);
149
150			$("#text_reply").attr({
151			"name": details.id
152			});
153			}
154
155
156			// Update Current Conversation
157			function updateConversation(data)
158			{
159
160			var ele = document.getElementById("conversation");
161			ele.innerHTML = "";
162
163			if (data[0].type === 1) {
164			// For showing previous message
165			if (data[0].load > 10)
166			{
167			var divE1 = $("<div></div>").addClass("row message-previous");
168			var divE2 = $("<div></div>").addClass("col-sm-12 previous");
169			var aElement = $("<a></a>").text("Show Previous Message!");
170			aElement.attr({
171			"id": data[0].username,
172			"name": data[0].load
173			});
174			divE2.append(aElement);
175			divE1.append(divE2);
176			$("#conversation").append(divE1);
177			}
178
179			for (var i = data.length - 1; i >= 1; i--) {
180			// create element
181			var divElement1 = $("<div></div>").addClass("row message-body");
182			var divElement2 = $("<div></div>").addClass("col-sm-12");
183			var divElement3 = $("<div></div>");
184			var messageText = $("<div></div>").addClass("message-text").text(data[i].message);
185			var spanElement = $("<span></span>").addClass("message-time pull-right").text(data[i].time);
186
187			if (data[i]["sent_by"] !== data[i].start)
188			{
189			divElement2.addClass("message-main-receiver");
190			divElement3.addClass("receiver");
191			}
192			else
193			{
194			divElement2.addClass("message-main-sender");
195			divElement3.addClass("sender");
196			}
197			divElement3.append(messageText);
198			divElement3.append(spanElement);
199			divElement2.append(divElement3);
200			divElement1.append(divElement2);
201			$("#conversation").append(divElement1);
202			}
203
204			setConversationDetails(data[0]);
205
206			ele.scrollTop = ele.scrollHeight;
207			} else {
208			setConversationDetails(data[0]);
209			}
210			}
211
212			// For reply to other messages
213			function reply() {
214
215			var message = [$("#text_reply").val()];
216			var id = $("#text_reply").attr("name");
217			$("#text_reply").val("");
218			// console.log(message);
219			var q = {
220			"name": id,
221			"reply": message
222			};
223			conn.send(JSON.stringify(q));
224			}
225
226			function notFound(eleId)
227			{
228			eleId = "#"+eleId;
229			$(eleId).text("");
230			var divElement = $("<div></div>").addClass("notFound").text("Not Found");
231			$(eleId).append(divElement);
232			}
233
234			function composeChoose() {
235			var text = document.getElementById("composeText").value;
236			if (text !== "")
237			{
238			var msg =
239			{
240			"value": text,
241			"Compose": "Compose"
242			};
243			conn.send(JSON.stringify(msg));
244			}
245			else
246			{
247			$("#compose").html("");
248			}
249			}
250
251			//compose messages
252			function composeResult(arr)
253			{
254			var ele = document.getElementById("compose");
255			ele.innerHTML = "";
256
257			if (arr !== "Not Found")
258			{
259			createSidebarElement(arr, "compose");
260			}
261			else
262			{
263			notFound("compose");
264			}
265			}
266
267			function searchChoose() {
268			var text = $("#searchText").val();
269			if (text !== "") {
270			var msg = {
271			"value": text,
272			"search": "search"
273			};
274
275			conn.send(JSON.stringify(msg));
276			}
277			else
278			{
279			sidebarRequest();
280			}
281
282			}
283
284			function searchResult(arr) {
285			if (arr !== "Not Found") {
286			createSidebarElement(arr, "message");
287			}
288			else
289			{
290			notFound("message");
291			}
292
293			}
294
295			// Load previous messages
296			function previous(element)
297			{
298			var user = element.id;
			0 ignored issues – show Unused Code introduced 2017-01-09 19:33 UTC by Report Bug Copy Issue Report The variable `user` seems to be never used. Consider removing it. Loading history...
299			var lo = element.name;
300			newConversation(element, lo);
301			}
302
303			function hideComposeScreen() {
304			$(".side-two").css({
305			"left": "-100%"
306			});
307			}
308
309			// Audio Recognization
310
311			function startDictation() {
312
313			if (window.hasOwnProperty("webkitSpeechRecognition")) {
314
315			var recognition = new webkitSpeechRecognition();
			0 ignored issues – show Bug introduced 2017-01-09 19:33 UTC by Report Bug Copy Issue Report 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 2017-01-09 19:33 UTC by Report Bug Copy Issue Report By convention, constructors like `webkitSpeechRecognition` should be capitalized. Loading history...
316
317			recognition.continuous = false;
318			recognition.interimResults = false;
319
320			recognition.lang = "en-IN";
321			recognition.start();
322
323			recognition.onresult = function(e) {
324			document.getElementById("text_reply").value = e.results[0][0].transcript;
325			recognition.stop();
326			reply();
327			};
328
329			recognition.onerror = function() {
330			recognition.stop();
331			}
332
333			}
334			}
335
336
337			// On Message
338			conn.onmessage = function(e)
339			{
340			var msg = JSON.parse(e.data);
341			// console.log(msg);
342			if (!width())
343			{
344			SideBar(msg.sidebar);
345			} else
346			{
347			if (!$(".side").hasClass("hide")) {
348			SideBar(msg.sidebar);
349			}
350			}
351
352			if (msg.initial !== undefined) {
353			SideBar(msg.initial);
354			}
355
356			if (msg.conversation !== undefined) {
357			updateConversation(msg.conversation);
358			}
359
360			if (msg.reply !== undefined) {
361			var textAreaId = $("#text_reply").attr("name");
362			if (msg.reply[0].id === textAreaId) {
363			updateConversation(msg.reply);
364			}
365			}
366
367			if (msg.Search !== undefined) {
368			searchResult(msg.Search);
369			}
370
371			if (msg.Compose !== undefined) {
372			composeResult(msg.Compose);
373			}
374			};
375
376			// Event Listeners
377			$(document).ready(function(){
378			$("body").on("click", ".sideBar-body", function() {
379			newConversation(this,10);
380			hideComposeScreen();
381			});
382
383			$("body").on("click", ".reply-send",
384			function() {
385			reply();
386			});
387
388			$("body").on("click", ".reply-recording",
389			function() {
390			startDictation();
391			});
392
393			$("body").on("click", ".lowerBar-recording",
394			function() {
395			startDictation();
396			});
397
398			$("body").on("click", ".lowerBar-back",
399			function() {
400			toSidebar();
401			sidebarRequest();
402			});
403
404			$("body").on("click", ".previous a",
405			function() {
406			previous(this);
407			});
408
409			$("body").on("keyup", "#searchText",
410			function() {
411			searchChoose();
412			});
413
414			$("body").on("keyup", "#composeText",
415			function() {
416			composeChoose();
417			});
418
419			$(".heading-compose").click(function() {
420			$(".side-two").css({
421			"left": "0"
422			});
423			});
424
425			$(".newMessage-back").click(function() {
426			hideComposeScreen();
427			});
428
429			});
430
431			console.log("Hello, Contact me at [email protected]");
			0 ignored issues – show Debugging Code introduced 2017-01-09 19:33 UTC by Report Bug Copy Issue Report `console.log` looks like debug code. Are you sure you do not want to remove it? Loading history...

ankitjain28may / openchat

Push — master ( 9c2ffd...9edb5e )

message.js ➔ setConversationDetails B

Complexity

Size

Duplication

Importance

Duplication Side-by-Side

Filter issues like