From 6f5db128ba361d7b6fc047a03ba05eb85cd81596 Mon Sep 17 00:00:00 2001
From: nikita <nikita.kulshreshtha@ebix.com>
Date: Fri, 30 Sep 2016 17:04:34 +0530
Subject: [PATCH] Refs: #7808

---
 400-SOURCECODE/AIAHTML5.Web/index.html | 91 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++----------
 1 file changed, 81 insertions(+), 10 deletions(-)

diff --git a/400-SOURCECODE/AIAHTML5.Web/index.html b/400-SOURCECODE/AIAHTML5.Web/index.html
index 5a6f29e..341d3da 100644
--- a/400-SOURCECODE/AIAHTML5.Web/index.html
+++ b/400-SOURCECODE/AIAHTML5.Web/index.html
@@ -41,6 +41,35 @@
 
     <!--Annotation Toolbar: Jcanvas-->
     <style>
+
+
+        .ActiveFormattingButtonClass {
+            background-color: #1B92D0 !important;
+        }
+
+        .Edittext-btn-css {
+            background: #4B4B4B;
+            padding: 4px;
+            cursor: pointer;
+            margin-right: 2px;
+        }
+
+        /*.italic-btn-css {
+            background: #4B4B4B;
+            padding: 4px;
+            cursor: pointer;
+            margin-right: 2px;
+        }*/
+
+        .underline-btn-css {
+            background: #4B4B4B;
+            padding: 4px;
+            cursor: pointer;
+            margin-right: 5px;
+        }
+
+
+
         .activebtncolor {
             background-color: #1B92D0 !important;
             border-color: #1B92D0 !important;
@@ -537,14 +566,14 @@
                                 <option>72</option>
                             </select>
                             <span style="vertical-align:middle;">
-                                <span id="text-bold" style="background: #4B4B4B;padding:4px;cursor:pointer;margin-right:2px;">
+                                <span id="text-bold" class="Edittext-btn-css">
                                     <i aria-hidden="true" class="fa fa-bold" style="color: #fff"></i>
                                 </span>
-                                <span id="text-italic" style="background: #4B4B4B; padding: 4px; cursor: pointer; margin-right: 2px;">
+                                <span id="text-italic" class="Edittext-btn-css">
                                     <i class="fa fa-italic" aria-hidden="true" style="color: #fff"></i>
 
                                 </span>
-                                <span id="text-underline" style="background: #4B4B4B; padding: 4px; cursor: pointer; margin-right: 5px;">
+                                <span id="text-underline" class="underline-btn-css">
                                     <i class="fa fa-underline" aria-hidden="true" style="color: #fff"></i>
                                 </span>
                             </span>
@@ -555,15 +584,15 @@
                             </div>
 
                             <span style="vertical-align:middle;">
-                                <span id="text-left" style="background: #4B4B4B;padding:4px;cursor:pointer;margin-right:2px;">
+                                <span id="text-left" class="Edittext-btn-css">
                                     <i aria-hidden="true" class="fa fa-align-left" style="color: #fff"></i>
                                 </span>
-                                <span id="text-center" style="background: #4B4B4B; padding: 4px; cursor: pointer; margin-right: 2px;">
+                                <span id="text-center" class="Edittext-btn-css">
                                     <i class="fa fa-align-center" aria-hidden="true" style="color: #fff"></i>
 
 
                                 </span>
-                                <span id="text-right" style="background: #4B4B4B; padding: 4px; cursor: pointer; margin-right: 5px;">
+                                <span id="text-right" class="underline-btn-css">
                                     <i class="fa fa-align-right" aria-hidden="true" style="color: #fff"></i>
 
 
@@ -1207,41 +1236,83 @@
 
             $("#text-left").on('click', function () {
 
+                //Annotation: Formatting buttons color is not change when select.
+
+                $("#text-center").removeClass("ActiveFormattingButtonClass");
+                $("#text-right").removeClass("ActiveFormattingButtonClass");
+                $("#text-left").addClass("ActiveFormattingButtonClass");
                 $("#text_area").css("text-align", "left");
 
+
             });
 
 
             $("#text-center").on('click', function () {
 
+                //Annotation: Formatting buttons color is not change when select.
+
+                $("#text-right").removeClass("ActiveFormattingButtonClass");
+                $("#text-left").removeClass("ActiveFormattingButtonClass");
+                $("#text-center").addClass("ActiveFormattingButtonClass");
                 $("#text_area").css("text-align", "center");
 
+
             });
 
 
             $("#text-right").on('click', function () {
 
-                $("#text_area").css("text-align", "right");
+                //Annotation: Formatting buttons color is not change when select.
 
+                $("#text-left").removeClass("ActiveFormattingButtonClass");
+                $("#text-center").removeClass("ActiveFormattingButtonClass");
+                $("#text-right").addClass("ActiveFormattingButtonClass");
+                $("#text_area").css("text-align", "right");
             });
 
 
             $("#text-bold").on('click', function () {
 
-                $("#text_area").css("font-weight", "bold");
+                //Annotation: Formatting buttons color is not change when select.
+                $("#text-bold").toggleClass("ActiveFormattingButtonClass");
+
+                if ($("#text-bold").hasClass("ActiveFormattingButtonClass")) {
+                    $("#text_area").css("font-weight", "bold");
+                }
+                else {
+                    $("#text_area").css("font-weight", "normal");
+                }
+
 
             });
 
             $("#text-italic").on('click', function () {
 
-                $("#text_area").css("font-style", "italic");
+                //Annotation: Formatting buttons color is not change when select.
+                $("#text-italic").toggleClass("ActiveFormattingButtonClass");
+                if ($("#text-italic").hasClass("ActiveFormattingButtonClass")) {
+                    $("#text_area").css("font-style", "italic");
+                }
+                else {
+                    $("#text_area").css("font-style", "normal");
+                }
+
 
             });
 
             $("#text-underline").on('click', function () {
 
-                $("#text_area").css("text-decoration", "underline");
+                //Annotation: Formatting buttons color is not change when select.
+                $("#text-underline").toggleClass("ActiveFormattingButtonClass");
+
+                if ($("#text-underline").hasClass("ActiveFormattingButtonClass")) {
+                    $("#text_area").css("text-decoration", "underline");
+                }
+                else {
+                    $("#text_area").css("text-decoration", "none");
+                }
 
+                
             });
 
 
--
libgit2 0.21.4