Adding edit stratis number feature, adding fontawesome fonts and fixing button hover effect

Controllers/ApiController.cs

@@ -19,7 +19,7 @@ namespace Stratis.Guru.Controllers
         
         [HttpGet]
         [Route("price")]
-        public ActionResult<object> Price(bool stringify)
+        public ActionResult<object> Price(bool stringify, double amount = 1)
         {
             try
             {
@@ -28,13 +28,13 @@ namespace Stratis.Guru.Controllers
                 {
                     return new TickerApi
                     {
-                        UsdPrice = coinmarketcap.data.quotes.USD.price.ToString("C"),
+                        UsdPrice = (coinmarketcap.data.quotes.USD.price * amount).ToString("C"),
                         Last24Change = (coinmarketcap.data.quotes.USD.percent_change_24h / 100).ToString("P2")
                     };
                 }
                 return new Ticker
                 {
-                    UsdPrice = coinmarketcap.data.quotes.USD.price,
+                    UsdPrice = coinmarketcap.data.quotes.USD.price * amount,
                     Last24Change = coinmarketcap.data.quotes.USD.percent_change_24h / 100
                 };
             }

Views/Home/Index.cshtml

@@ -11,7 +11,7 @@
                     <h1 class="m-0">The <strong>$STRAT</strong> price in realtime.</h1>
                     <h1 class="align-middle">
                         <div class="d-inline-block align-middle">
-                            <span class="click-edit">1 STRAT</span> =
+                            <span class="click-edit" spellcheck="false">1</span> STRAT =
                         </div>
                         <span class="align-middle display-1 font-weight-bold" id="amount">@(Model.UsdPrice.ToString("C2"))</span>
                         <span id="lastchange" class="text-@(Model.Last24Change > 0 ? "success":"danger") font-weight-bold"><sup> @((Model.Last24Change > 0 ? "+":"-")) @(Model.Last24Change.ToString("P2"))</sup></span>
@@ -28,18 +28,33 @@
     <script type="text/javascript">
         $(document).ready(function() {
             var stratisPrice = @Model.UsdPrice;
-            var signalr = new signalR.HubConnectionBuilder().withUrl("/update").build();
-            signalr.on("UpdateTicker", function (message) {
-                $.getJSON("/api/price?stringify=true", function(e) {
+            var stratisAmount = 1;
+            function UpdateTicker() {
+                NProgress.start();
+                $.getJSON("/api/price?stringify=true&amount=" + stratisAmount, function(e) {
                     $("#amount").text(e.usdPrice);
                     $("#lastchange").text(e.last24Change);
+                    NProgress.done(); 
                 });
+            }
+            var signalr = new signalR.HubConnectionBuilder().withUrl("/update").build();
+            signalr.on("UpdateTicker", function (message) {
+                UpdateTicker();
             });
             signalr.start();
 
             $(".click-edit").click(function() {
-                alert("ok");
-            })
+                $(this).prop('contenteditable', true).focus().select();
+            }).on("blur", function() {
+                if ($.isNumeric($(this).text())) {
+                    stratisAmount = $(this).text();
+                    UpdateTicker();
+                } else {
+                    $(this).text("1");
+                    //$(this).text($(this).text());
+                }
+                $div.prop('contenteditable', false);
+            });
         })
     </script>
 }
\ No newline at end of file

wwwroot/css/default.css

@@ -398,7 +398,8 @@ buttons
   cursor: pointer;
 }
 
-.btn-secondary-box:hover {
+.btn-secondary-box:hover,
+.btn-secondary-box:focus {
   border: 1px solid #fff;
   background: none;
   color: #fff;