Merge pull request #10 from aloysius-pgast/dev

Merge dev branch into master
aloysius-pgast · Oct 6, 2017 · 777c460 · 777c460
2 parents b59854e + 62219bc
commit 777c460
Show file tree

Hide file tree

Showing 27 changed files with 490 additions and 18 deletions.
diff --git a/app/exchanges/binance/exchange.js b/app/exchanges/binance/exchange.js
@@ -115,6 +115,7 @@ _tickers(pairs)
                 list[entry.context.pair] = {
                     pair:entry.context.pair,
                     last: parseFloat(entry.value.lastPrice),
+                    priceChangePercent: parseFloat(entry.value.priceChangePercent),
                     sell: parseFloat(entry.value.askPrice),
                     buy: parseFloat(entry.value.bidPrice),
                     high: parseFloat(entry.value.highPrice),
@@ -164,6 +165,7 @@ _tickers(pairs)
 *     "BTC-NEO":{
 *         "pair":"BTC-NEO",
 *         "last":0.00531500,
+*         "priceChangePercent":2.5,
 *         "sell":0.00532000,
 *         "buy":0.00529800,
 *         "high":0.00575600,

diff --git a/app/exchanges/bittrex/exchange.js b/app/exchanges/bittrex/exchange.js
@@ -57,6 +57,7 @@ constructor(config)
 *     "BITCNY-BTC":{
 *         "pair":"BITCNY-BTC",
 *         "last":21802.21999999,
+*         "priceChangePercent":2.5,
 *         "sell":21802.21999999,
 *         "buy":21802.20000021,
 *         "high":23400.00099998,
@@ -102,9 +103,17 @@ tickers(opt)
                     {
                         return;
                     }
+                    let last = parseFloat(entry.Last);
+                    let previousDay = parseFloat(entry.PrevDay);
+                    let percentChange = 0;
+                    if (previousDay > 0)
+                    {
+                        percentChange = ((last/previousDay) - 1) * 100;
+                    }
                     list[entry.MarketName] = {
                         pair:entry.MarketName,
-                        last: parseFloat(entry.Last),
+                        last: last,
+                        priceChangePercent:percentChange,
                         sell: parseFloat(entry.Ask),
                         buy: parseFloat(entry.Bid),
                         high: parseFloat(entry.High),

diff --git a/app/exchanges/poloniex/exchange.js b/app/exchanges/poloniex/exchange.js
@@ -67,6 +67,7 @@ _toExchangePair(pair)
 *     "BTC-BCN":{
 *         "pair":"BTC-BCN",
 *         "last":5.5e-7,
+*         "priceChangePercent":2.390438,
 *         "sell":5.6e-7,
 *         "buy":5.5e-7,
 *         "high":5.8e-7,
@@ -111,6 +112,7 @@ tickers(opt)
                     list[pair] = {
                         pair:pair,
                         last: parseFloat(value.last),
+                        priceChangePercent: parseFloat(value.percentChange) * 100,
                         sell: parseFloat(value.lowestAsk),
                         buy: parseFloat(value.highestBid),
                         high: parseFloat(value.high24hr),

diff --git a/doc/exchanges/binance/tickers.adoc b/doc/exchanges/binance/tickers.adoc
@@ -60,6 +60,10 @@ Result will be a dictionary using pairs as keys
 |float
 |Last trade's price
 
+|{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}priceChangePercent
+|float
+|% Change of price in last 24H (0-100)
+
 |{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}sell
 |float
 |Lowest sell price
@@ -96,6 +100,7 @@ Example for *GET* _/exchanges/binance/tickers_
     "USDT-ETH":{
         "pair":"USDT-ETH",
         "last":203.34,
+        "priceChangePercent":2.6,
         "sell":204.99,
         "buy":203.34,
         "high":261.95,
@@ -106,6 +111,7 @@ Example for *GET* _/exchanges/binance/tickers_
     "USDT-BTC":{
         "pair":"USDT-BTC",
         "last":2996.98,
+        "priceChangePercent":5.4,
         "sell":2996.97,
         "buy":2960,
         "high":3739.82,
@@ -159,6 +165,10 @@ Result will be a dictionary containing a single entry
 |float
 |Last trade's price
 
+|{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}priceChangePercent
+|float
+|% Change of price in last 24H (0-100)
+
 |{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}sell
 |float
 |Lowest sell price
@@ -200,6 +210,7 @@ Example for *GET* _/exchanges/binance/tickers/USDT-BTC
     "USDT-BTC":{
         "pair":"USDT-BTC",
         "last":2996.97,
+        "priceChangePercent":5.4,
         "sell":2996.97,
         "buy":2960,
         "high":3739.82,

diff --git a/doc/exchanges/bittrex/tickers.adoc b/doc/exchanges/bittrex/tickers.adoc
@@ -55,6 +55,10 @@ Result will be a dictionary using pairs as keys
 |float
 |Last trade's price
 
+|{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}priceChangePercent
+|float
+|% Change of price in last 24H (0-100)
+
 |{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}sell
 |float
 |Lowest sell price
@@ -91,6 +95,7 @@ Example for *GET* _/exchanges/bittrex/tickers_
     "BITCNY-BTC":{
         "pair":"BITCNY-BTC",
         "last":22510,
+        "priceChangePercent":5.4,
         "sell":23392.04999994,
         "buy":22510,
         "high":23400,
@@ -101,6 +106,7 @@ Example for *GET* _/exchanges/bittrex/tickers_
     "BTC-1ST":{
         "pair":"BTC-1ST",
         "last":0.00027,
+        "priceChangePercent":-1.2,
         "sell":0.00027,
         "buy":0.00026844,
         "high":0.00030997,
@@ -155,6 +161,10 @@ Result will be a dictionary containing a single entry
 |float
 |Last trade's price
 
+|{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}priceChangePercent
+|float
+|% Change of price in last 24H (0-100)
+
 |{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}sell
 |float
 |Lowest sell price
@@ -196,6 +206,7 @@ Example for *GET* _/exchanges/bittrex/tickers/BTC-1ST_
     "BTC-1ST":{
         "pair":"BTC-1ST",
         "last":0.00027,
+        "priceChangePercent":5.4,
         "sell":0.00027,
         "buy":0.00026844,
         "high":0.00030997,

diff --git a/doc/exchanges/poloniex/tickers.adoc b/doc/exchanges/poloniex/tickers.adoc
@@ -55,6 +55,10 @@ Result will be a dictionary using pairs as keys
 |float
 |Last trade's price
 
+|{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}priceChangePercent
+|float
+|% Change of price in last 24H (0-100)
+
 |{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}sell
 |float
 |Lowest sell price
@@ -91,6 +95,7 @@ Example for *GET* _/exchanges/poloniex/tickers_
     "BTC-BCN":{
         "pair":"BTC-BCN",
         "last":4.2e-7,
+        "priceChangePercent":2.35,
         "sell":4.3e-7,
         "buy":4.2e-7,
         "high":4.7e-7,
@@ -101,6 +106,7 @@ Example for *GET* _/exchanges/poloniex/tickers_
     "BTC-BELA":{
         "pair":"BTC-BELA",
         "last":0.0000625,
+        "priceChangePercent":3.5,
         "sell":0.0000628,
         "buy":0.0000625,
         "high":0.000065,
@@ -155,6 +161,10 @@ Result will be a dictionary containing a single entry
 |float
 |Last trade's price
 
+|{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}priceChangePercent
+|float
+|% Change of price in last 24H (0-100)
+
 |{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}{nbsp}sell
 |float
 |Lowest sell price
@@ -195,6 +205,7 @@ Example for *GET* _/exchanges/poloniex/tickers/BTC-BELA_
 {
     "BTC-BELA":{
         "pair":"BTC-BELA",
+        "priceChangePercent":3.5,
         "last":0.0000625,
         "sell":0.0000628,
         "buy":0.0000625,

diff --git a/doc/ui/img/marketOverview.png b/doc/ui/img/marketOverview.png
diff --git a/doc/ui/index.adoc b/doc/ui/index.adoc
@@ -9,6 +9,7 @@ User interface provides following access to :
 * Open/Completed orders
 * Creation of new orders
 * Balances
+* Market Overview (an overview of all your favourite pairs)
 * Coin Market Cap (top 20 currencies)
 
 .Prices
@@ -31,6 +32,10 @@ image::img/newOrder.png[New Order,400]
 [caption="",link=img/balances.png]
 image::img/balances.png[My Balances,400]
 
+.Market Overview
+[caption="",link=img/marketOverview.png]
+image::img/marketOverview.png[Market Overview,400]
+
 .Coin Market Cap
 [caption="",link=img/coinMarketCap.png]
 image::img/coinMarketCap.png[Coin Market Cap,400]

diff --git a/ui/public/help/marketOverview.md b/ui/public/help/marketOverview.md
@@ -0,0 +1,4 @@
+TIPS:
+* In order to add a _pair_ to your favourites, click on the _star_ icon in the _Prices_ tab
+* Click on any _PAIR_ value to open _Prices_ tab for this _pair_
+* Click on any _LAST_, _BID_ or _ASK_ value to open _Order Books_ tab for this _pair_
diff --git a/ui/public/img/apple-icon-114x114.png b/ui/public/img/apple-icon-114x114.png
diff --git a/ui/public/img/apple-icon-144x144.png b/ui/public/img/apple-icon-144x144.png
diff --git a/ui/public/img/apple-icon-57x57.png b/ui/public/img/apple-icon-57x57.png
diff --git a/ui/public/img/apple-icon-72x72.png b/ui/public/img/apple-icon-72x72.png
diff --git a/ui/public/index.html b/ui/public/index.html
@@ -7,7 +7,11 @@
     <meta name="description" content="My Personal Exchange">
     <meta name="author" content="Aloysius Pendergast">
     <meta name="keyword" content="Trading,Exchanges,Cryptocurrency,Bittrex,Binance,Poloniex">
-    <link rel="shortcut icon" href="img/favicon.png">
+    <link rel="shortcut icon" href="img/favicon.png"/>
+    <link rel="apple-touch-icon" sizes="57x57" href="img/apple-icon-57x57.png"/>
+    <link rel="apple-touch-icon" sizes="72x72" href="img/apple-icon-72x72.png"/>
+    <link rel="apple-touch-icon" sizes="114x114" href="img/apple-icon-114x114.png"/>
+    <link rel="apple-touch-icon" sizes="144x144" href="img/apple-icon-144x144.png"/>
     <title>My Personal Exchange</title>
     <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
   </head>

diff --git a/ui/src/App.js b/ui/src/App.js
@@ -17,6 +17,7 @@ import DashBoard from './views/DashBoard/';
 import TopMenu from './views/TopMenu/';
 
 //-- exchanges views
+import MarketOverview from './views/MarketOverview';
 import Prices from './views/Prices';
 import OrderBooks from './views/OrderBooks';
 import MyOrders from './views/MyOrders';
@@ -129,17 +130,32 @@ _loadRoutes()
             path:path,
             exact:true,
             component:CoinMarketCap
-        })
+        });
+    }
+
+    //-- remaining routes
+    let path;
+
+    // Market Overview (requires local storage)
+    if (window.ctx.hasLocalStorage)
+    {
+        path = '/services/marketOverview';
+        routeRegistry.registerRoute(path, 'marketoverview', true);
+        this._routes.push({
+            path:path,
+            exact:true,
+            component:MarketOverview
+        });
     }
 
     //-- home route is default route
-    let path = '/';
+    path = '/';
     routeRegistry.registerRoute(path, 'home');
     this._routes.push({
         path:path,
         exact:false,
         component:DashBoard
-    })
+    });
 }
 
 componentDidMount()

diff --git a/ui/src/components/CoinMarketCapTickers/CoinMarketCapTickers.js b/ui/src/components/CoinMarketCapTickers/CoinMarketCapTickers.js
@@ -165,8 +165,8 @@ render()
                     <td>{item.name}</td>
                     <td>{item.symbol}</td>
                     <td className="text-right">{price_usd.toFixed(6)}</td>
-                    <td className="text-right"><span className={className_percent_change_24h}>{percent_change_24h.toFixed(2)} %</span></td>
-                    <td className="text-right"><span className={className_percent_change_7d}>{percent_change_7d.toFixed(2)} %</span></td>
+                    <td className="text-right"><span className={className_percent_change_24h}>{percent_change_24h.toFixed(3)} %</span></td>
+                    <td className="text-right"><span className={className_percent_change_7d}>{percent_change_7d.toFixed(3)} %</span></td>
                     <td className="text-right">{parseInt(volume_24h)}</td>
                 </tr>
               })

diff --git a/ui/src/components/CompletedOrders/CompletedOrders.js b/ui/src/components/CompletedOrders/CompletedOrders.js
@@ -137,7 +137,6 @@ render()
           <tbody>
             {
               _.map(this.state.data).map((item, index) => {
-                let url = self._baseUrl + item.pair;
                 return <tr key={index}>
                     <td>{dateTimeHelper.formatDateTime(item.closedTimestamp * 1000)}</td>
                     <td>{orderType(item.orderType)}</td>