Merge pull request watson-developer-cloud#100 from vibhasinghal/master

Changes to demo to ....

public/css/style.css

@@ -2530,3 +2530,10 @@ pre[class^="language-"] > code[class^="language-"], pre[class^="language-"] > co
       float: left;
       margin-left: 0;
       margin-right: 1.69492%; } }
+
+.dim {
+    opacity: 0.4;
+    filter: alpha(opacity=40); /* msie */
+}
+
+.show { }

public/data/review.txt

@@ -0,0 +1 @@
+I was asked to sign a third party contract a week out from stay. If it wasn't an 8 person group that took a lot of wrangling I would have cancelled the booking straight away. Bathrooms - there are no stand alone bathrooms. Please consider this - you have to clear out the main bedroom to use that bathroom. Other option is you walk through a different bedroom to get to its en-suite. Signs all over the apartment - there are signs everywhere - some helpful - some telling you rules. Perhaps some people like this but It negatively affected our enjoyment of the accommodation. Stairs - lots of them - some had slightly bending wood which caused a minor injury.

public/data/tweets.txt

@@ -0,0 +1,12 @@
+I hate these new features On #ThisPhone after the update.
+I hate #ThisPhoneCompany products, you'd have to torture me to get me to use #ThisPhone.
+The emojis in #ThisPhone are stupid.
+#ThisPhone is the worst phone I've ever had - ever.
+#ThisPhone is a useless, stupid waste of money.
+#ThisPhone stop cheating customers, lost all respect SHAME on u.
+I'm worried my #ThisPhone is going to overheat like my brother's did.
+#ThisPhoneCompany really let me down... my new phone won't even turn on.
+Loving the colors in my #ThisPhone pictures.
+Honestly I just love the look of the new #ThisPhone.
+Wonderful #ThisPhone app delivers on all fronts, with excellent audio, gapless playback, collaborative playlists, and features for runners.
+

public/js/demo.js

@@ -40,13 +40,13 @@ function ready() {
   // load all json data first
   $.when(
     $.ajax('/data/threshold_v0.1.1.json'),
-    $.ajax('/data/customer-call.txt'),
-    $.ajax('/data/corporate-announcement.txt'),
+    $.ajax('/data/tweets.txt'),
+    $.ajax('/data/review.txt'),
     $.ajax('/data/personal-email.txt'))
-    .done(function(thresholds, customerCall, corporateAnnouncement, personalEmail) {
+    .done(function(thresholds, tweets, review, personalEmail) {
       var sampleText = {
-        'customer-call': customerCall[0],
-        'corporate-announcement': corporateAnnouncement[0],
+        'review': review[0],
+        'tweets': tweets[0],
         'email': personalEmail[0],
         'own-text': ''
       };
@@ -141,6 +141,7 @@ function allReady(thresholds, sampleText) {
         score: app.percentagify(item.score, 'Emotion Tone'),
         tooltip: app.toneHash()[item.tone_name].tooltip,
         likeliness:  v1 > v3 ? 'VERY LIKELY' :  v1 > v2 ? 'LIKELY' : 'UNLIKELY',
+        visible:  v1 > v3 ? 'show' :  v1 > v2 ? 'show' : 'dim',
         thresholdLow: app.percentagify(app.thresholds().doc[item.tone_name][0]),
         thresholdHigh: app.percentagify(app.thresholds().doc[item.tone_name][1])
       };
@@ -159,6 +160,7 @@ function allReady(thresholds, sampleText) {
         label: item.tone_name,
         score: app.percentagify(item.score, 'Language Tone'),
         tooltip: app.toneHash()[item.tone_name].tooltip,
+        visible:  v1 > v3 ? 'show' :  v1 > v2 ? 'show' : 'dim',
         likeliness:  v1 > v3 ? 'VERY LIKELY' :  v1 > v2 ? 'LIKELY' : 'UNLIKELY'
       };
     }
@@ -176,7 +178,8 @@ function allReady(thresholds, sampleText) {
         label: item.tone_name,
         score: app.percentagify(item.score, 'Social Tone'),
         tooltip: app.toneHash()[item.tone_name].tooltip,
-        likeliness:  v1 > v3 ? 'VERY LIKELY' :  v1 > v2 ? 'LIKELY' : 'UNLIKELY'
+        likeliness:  v1 > v3 ? 'VERY LIKELY' :  v1 > v2 ? 'LIKELY' : 'UNLIKELY',
+        visible:  v1 > v3 ? 'show' :  v1 > v2 ? 'show' : 'dim'
       };
     }
 
@@ -359,12 +362,12 @@ function allReady(thresholds, sampleText) {
     $emotionGraph.html(_.template(emotionBarGraph_template, {
       items: emotionTone,
       className: 'emotion'
-    }));
+    })); 
 
     $writingGraph.html(_.template(barGraph_template, {
       items: writingTone,
       className: 'writing'
-    }));
+    })); 
 
     $socialGraph.html(_.template(barGraph_template, {
       items: socialTone,
@@ -453,7 +456,7 @@ function allReady(thresholds, sampleText) {
     $output.hide();
     $error.hide();
     scrollTo($input);
-    $('#input-customer-call').trigger('click');
+    $('#input-tweets').trigger('click');
   }
 
   /**

views/index.ejs

@@ -6,7 +6,7 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta name="og:title" content="IBM Watson Tone Analyzer">
-  <meta name="og:description" content="This service uses linguistic analysis to detect and interpret emotions, social tendencies, and language style cues found in text.">
+  <meta name="og:description" content="This service uses linguistic analysis to detect and interpret emotions, social tendencies, and language style cues found in text. Tones detected within the General Purpose Endpoint include joy, fear, sadness, anger, disgust, analytical, confident, tentative, openness, conscientiousness, extraversion, agreeableness, and emotional range.">
   <link rel="shortcut icon" href="/images/favicon.png" type="image/png">
   <link rel="stylesheet" href="css/style.css">
   <link rel="stylesheet" href="css/extra.css">
@@ -52,7 +52,7 @@
                              Tone Analyzer
                     </h1>
           <div class="banner--service-description">
-            This service uses linguistic analysis to detect and interpret emotions, social tendencies, and language style cues found in text.
+             This service uses linguistic analysis to detect and interpret emotions, social tendencies, and language style cues found in text. Tones detected within the General Purpose Endpoint include joy, fear, sadness, anger, disgust, analytical, confident, tentative, openness, conscientiousness, extraversion, agreeableness, and emotional range.
           </div>
         </div>
       </div>
@@ -89,14 +89,15 @@
       <div class="input">
         <h2 class="base--h2">Sample use cases</h2>
         <p class="base--p input--description">Choose an example to learn how you can adjust the tone of your content to change people's perceptions, or improve its effectiveness. <a class="base--a" href="http://www.ibm.com/watson/developercloud/doc/tone-analyzer/index.shtml#usecases" target="new">Learn more</a>.</p>
-        <input role="radio" class="base--radio input--radio" type="radio" id="input-customer-call" name="rb" value="customer-call" checked="true">
-        <label class="base--inline-label input--radio-label" for="input-customer-call">Customer service chat</label>
+        <input role="radio" class="base--radio input--radio" type="radio" id="input-tweets" name="rb" value="tweets" checked="true">
+        <label class="base--inline-label input--radio-label" for="input-tweets">Tweets</label>
+        <input role="radio" class="base--radio input--radio" type="radio" id="input-online-review" name="rb" value="review">
+        <label class="base--inline-label input--radio-label" for="input-online-review">Online Review</label>
         <input role="radio" class="base--radio input--radio" type="radio" id="input-email" name="rb" value="email">
         <label class="base--inline-label input--radio-label" for="input-email">Email message</label>
-        <input role="radio" class="base--radio input--radio" type="radio" id="input-corporate-announcement" name="rb" value="corporate-announcement">
-        <label class="base--inline-label input--radio-label" for="input-corporate-announcement">Corporate announcement</label>
         <input role="radio" class="base--radio input--radio" type="radio" id="input-own-text" name="rb" value="own-text">
         <label class="base--inline-label input--radio-label" for="input-own-text">Your own text</label>
+        <p class="base--p input--description">Analyzing Customer Engagement Data? Try out the <a class="base--a" href="http://customer-engagement-demo.mybluemix.net" target="new">Tone Analyzer Customer Engagement Endpoint</a>.</p>
         <hr class="base--hr input--hr">
         <div class="panel">
           <textarea class="base--textarea input--textarea" rows="7"></textarea>
@@ -145,6 +146,7 @@
             <div class="summary-social-graph bar-graph"></div>
           </div>
         </div>
+<!--
         <div class="summary--row">
           <div class="summary--emotion-description">
             <p class="base--p">The Emotion graph represents the likelihood that an emotion tone is present in the text. <a class="base--a" target="_blank" href="http://www.ibm.com/watson/developercloud/doc/tone-analyzer/understanding-tone.shtml#emotional">Learn more</a>.</p>
@@ -163,16 +165,14 @@
             <input type="radio" checked="false" role="radio" id="class-no" name="document-level" value="no" class="base--radio results-table--input-no">
             <label for="class-no" class="base--inline-label vote results-table--input-no-label">No</label>
           </div>
-          <!------>
           <div class="document-level-thankyou" style="text-align:center">
             <span class="results-table--feedback-thanks">
                         <em class="base--em">Thank You</em>
                       </span>
           </div>
-          <!------>
 
         </div>
-
+-->
         <div class="summary-row">
           <span class="icon-hyperlink summary-view-code-button">
   					<img class="icon icon-code" src="images/icons/code.svg" />
@@ -207,12 +207,14 @@
                 <li class="tab-panels--tab-list-item base--li" role="presentation">
                   <a class="tab-panels--tab base--a active" href="#panel-original-text" aria-controls="panel-original-text" role="tab">In context</a>
                 </li>
+<!--
                 <li class="tab-panels--tab-list-item base--li" role="presentation">
                   <a class="tab-panels--tab base--a" href="#panel-sentence-rank" aria-controls="panel-sentence-rank" role="tab">Ranked by score</a>
                 </li>
                 <li class="tab-panels--tab-list-item base--li" role="presentation">
                   <a class="tab-panels--tab base--a" href="#panel-json" aria-controls="panel-json" role="tab">JSON</a>
                 </li>
+-->
               </ul>
               <div class="sentence-views--tab-content tab-panels--tab-content">
                 <div id="panel-original-text" class="sentence-views--tab-pane tab-panels--tab-pane active" role="tab-panel">
@@ -259,6 +261,7 @@
           <!-- .sentences--sentence-views -->
 
         </div>
+<!--
         <div class="summary--row">
           <div class="results-table--feedback-inputs scl">
             <label><em class="base--em">Do you agree with this result? </em></label>
@@ -273,6 +276,7 @@
             </span>
           </div>
         </div>
+-->
         <!-- .sentences -->
         <div class="output--reset icon-hyperlink">
           <span class="icon icon-reset"></span>
@@ -301,7 +305,7 @@
 
   <script type="text/html" id="emotionBarGraphTemplate">
     <% _.each(items, function(item, key, list) { %>
-      <div class="bar-graph--row summary-<%- className %>-graph--row">
+      <div class="bar-graph--row summary-<%- className %>-graph--row <%- item.visible %>">
         <div class="bar-graph--label-container summary-<%- className %>-graph--label-container">
           <div class="bar-graph--label">
             <p class="base--p">
@@ -332,7 +336,7 @@
 
   <script type="text/html" id="barGraphTemplate">
     <% _.each(items, function(item, key, list) { %>
-      <div class="bar-graph--row">
+      <div class="bar-graph--row <%- item.visible %>">
         <div class="bar-graph--label-container summary-<%- className %>-graph--label-container">
           <div class="bar-graph--label">
             <p class="base--p">