From 496c08c2e3fdb168da1c02e84e3647c03c8c607d Mon Sep 17 00:00:00 2001
From: JAMES ZHANG <jzhang300@us.ibm.com>
Date: Fri, 13 May 2016 02:03:18 -0500
Subject: [PATCH] make tooltip on click instead of hover for #59

---
 public/js/demo.js | 46 ++++++++++++++++++++++++++--------------------
 1 file changed, 26 insertions(+), 20 deletions(-)

diff --git a/public/js/demo.js b/public/js/demo.js
index 8e292d6c..b881e130 100755
--- a/public/js/demo.js
+++ b/public/js/demo.js
@@ -85,7 +85,8 @@ function allReady(thresholds, sampleText) {
       originalText_template = originalTextTemplate.innerHTML,
       sentenceRank_template = sentenceRankTemplate.innerHTML,
       originalTextTooltip_template = originalTextTooltipTemplate.innerHTML,
-      originalTextLegend_template = originalTextLegendTemplate.innerHTML;
+      originalTextLegend_template = originalTextLegendTemplate.innerHTML,
+      lastSentenceID = 0;
 
   /**
    * Callback function for AJAX post to get tone analyzer data
@@ -253,31 +254,36 @@ function allReady(thresholds, sampleText) {
      * interactions
      */
     function bindOriginalTextHoverEvents() {
-      $('.original-text--sentence-container').hover(function(e) {
+      $('.original-text--sentence-container').click(function(e) {
+        e.stopPropagation();
         var id = $(this).data('index');
-        app.currentHoveredOriginalSentence(this);
-        updateOriginalTextTooltip(id);
-        $originalTextTooltipContainer.removeClass('original-text--tooltip-container_hidden');
-        app.isHoveringOriginalText(true);
-        $('.original-text--sentence-container').not('[data-index="'+id+'"]').addClass('original-text--sentence-container_grayed');
-      }, function(e) {
-        $originalTextTooltipContainer.addClass('original-text--tooltip-container_hidden');
-        app.isHoveringOriginalText(false);
-        $('.original-text--sentence-container').removeClass('original-text--sentence-container_grayed');
-      });
-
-      $(document).scroll(function(e) {
-        positionOriginalTextTooltip(e);
+        // if we clicked on same sentence last time, then hide tooltip
+        if (lastSentenceID === id) {
+          $originalTextTooltipContainer.toggleClass('original-text--tooltip-container_hidden');
+        } else {
+          app.currentHoveredOriginalSentence(this);
+          updateOriginalTextTooltip(id);
+          $originalTextTooltipContainer.removeClass('original-text--tooltip-container_hidden');
+          app.isHoveringOriginalText(true);
+          $('.original-text--sentence-container').not('[data-index="'+id+'"]');
+
+          positionOriginalTextTooltip(e);
+        }
+        lastSentenceID = id;
       });
 
-      $originalText.scroll(function(e) {
-        positionOriginalTextTooltip(e);
-        if (app.isHoveringOriginalText())
+      $('body').click(function(e) {
+        if (!$(e.target).hasClass('original-text--sentence-container')) {
           $originalTextTooltipContainer.addClass('original-text--tooltip-container_hidden');
+        }
       });
 
-      $originalText.mousemove(function(e) {
-        positionOriginalTextTooltip(e);
+      $(document).scroll(function(e) {
+        $originalTextTooltipContainer.addClass('original-text--tooltip-container_hidden');
+      });
+      //
+      $('.original-text--texts-container').scroll(function(e) {
+        $originalTextTooltipContainer.addClass('original-text--tooltip-container_hidden');
       });
     }