diff --git a/.vs/AAWeb/v15/.suo b/.vs/AAWeb/v15/.suo index 07bce4d56..4214dc4e9 100644 Binary files a/.vs/AAWeb/v15/.suo and b/.vs/AAWeb/v15/.suo differ diff --git a/Order.js b/Order.js deleted file mode 100644 index c9556873b..000000000 --- a/Order.js +++ /dev/null @@ -1,18 +0,0 @@ - - -function newOrder(id, type, rate, amountA, amountB, datetimeIn, datetimeOut) { - - var order = { - id: id, - rate: rate, - amountA: amountA, - amountB: amountB, - type: type, - datetimeIn: datetimeIn, - datetimeOut: datetimeOut - }; - - return order; - -} - diff --git a/OrderBook.js b/OrderBook.js deleted file mode 100644 index a84484aa0..000000000 --- a/OrderBook.js +++ /dev/null @@ -1,135 +0,0 @@ - - -function newOrderBook() { - - /* - - The order book object mantains the information of an order book of a certain market. - - It is initially empty until it receives a request for orders from any of its clients. It tries to serve the request with already existing orders, - in case that request was done before, and if it wasnt, then it makes the request to a Server object and store the orders received. - - */ - - var orders = new Map(); // Here we store all the orders that we received from the server. - var marketId; - var server; - var datetimeRange; - var lastRangeLoaded; - - var orderBook = { - setDatetimeRange: setDatetimeRange, - getOrdersOf: getOrdersOf, - initialize: initialize - }; - - return orderBook; - - function initialize(market) { - - marketId = market; - - /* First we initialize the server that will allow us to retrieve data. */ - - server = newFileServer(); - server.initialize(); - - } - - function setDatetimeRange(newDatetimeRange) { - - datetimeRange = newDatetimeRange; - - lastRangeLoaded = false; - - orders = new Map(); - - } - - - function getOrdersOf(datetime, callBackFunction) { - - /* - - Someone is requesting the order book to get updated with information of the datime provided. We request here the new - information the server knows about this datetime, but only if this information we dont have it already. - - */ - - if (lastRangeLoaded !== true) { - - server.getOrderBook(datetimeRange.begin, datetimeRange.end, marketId, onServerResponded); - - } else { - - respondToCaller(); - - } - - - function onServerResponded(resultSet) { - - lastRangeLoaded = true; - - /* - - Fresh data about the order book has just arrived from the server. We need to take it an put it in the right way. - - */ - - addOrders(resultSet); - - respondToCaller(); - - } - - - - - function addOrders(resultSet) { - - - var totalRows = Object.keys(resultSet).length; - - for (var i = 1; i <= totalRows; i++) { - - var row = resultSet["row " + i]; - - /* We move the information from the result set to an order object, and use that from now on. */ - - var order = newOrder(row.Id, row.Type, row.Rate, row.AmountA, row.AmountB, new Date(row.DatetimeIn), new Date(row.DatetimeOut)); - - orders.set(order.id, order); - - } - - } - - - function respondToCaller() { - - var ordersForDatetime = []; - - /* We are ready to create an array of the orders for the date requested. For this we need to scan the whole Order Book. */ - - for (var order of orders.values()) { - - var valueOfDatetimeIn = order.datetimeIn.valueOf(); - var valueOfDatetimeOut = order.datetimeOut.valueOf(); - var valueOfDatetime = datetime.valueOf(); - - if (valueOfDatetimeIn <= valueOfDatetime && valueOfDatetimeOut > valueOfDatetime) { - - ordersForDatetime.push(order); - - } - - } - - callBackFunction(ordersForDatetime); - - } - - } - -} \ No newline at end of file diff --git a/OrderBookChart.js b/OrderBookChart.js deleted file mode 100644 index 3efc23091..000000000 --- a/OrderBookChart.js +++ /dev/null @@ -1,111 +0,0 @@ - -function newOrderBookChart() { - - /* - - This object is responsible for putting all the pieces together that forms an order book chart. These pieces so far are: - - 1. A snapshot object, with the orders valid for a certain Datetime. - 2. A Depht chart object, that is the one that actually plots the chart. - 3. The container that allows this object to be dragged around and zoomed in or out. - - */ - - var datetime; - var datetimeRange; - - var orderBookChart = { - setDatetime: setDatetime, - setDatetimeRange: setDatetimeRange, - container: undefined, - draw: draw, - getContainer: getContainer, - initialize: initialize - }; - - var container = newContainer(); - container.initialize(); - orderBookChart.container = container; - - container.displacement.containerName = "Order Book Chart"; - container.frame.containerName = "Order Book Chart"; - - var orderBookDephChart = newOrderBookDephChart(); - var orderBookSnapShot = newOrderBookSnapShot(); - - var marketId; - - return orderBookChart; - - function initialize(market) { - - marketId = market; - - /* We initialize first the Book Depth object. */ - - orderBookDephChart.container.frame.width = this.container.frame.width * 0.90; - orderBookDephChart.container.frame.height = this.container.frame.height * 0.90; - - orderBookDephChart.container.frame.position.x = this.container.frame.width * 0.05; - orderBookDephChart.container.frame.position.y = this.container.frame.height * 0.05; - - orderBookDephChart.container.displacement.parentDisplacement = this.container.displacement; - orderBookDephChart.container.frame.parentFrame = this.container.frame; - - orderBookDephChart.container.parentContainer = this.container; - - orderBookDephChart.initialize(marketId); - - /* Then we initialize the Snap Shot object. */ - - orderBookSnapShot.initialize(marketId); - - orderBookSnapShot.eventHandler.listenToEvent('Order Added', orderBookDephChart.addOrder, undefined); - orderBookSnapShot.eventHandler.listenToEvent('Order Removed', orderBookDephChart.removeOrder, undefined); - - } - - function getContainer(point) { - - var container; - - /* First we check if this point is inside this space. */ - - if (this.container.frame.isThisPointHere(point) === true) { - - return this.container; - - } else { - - /* This point does not belong to this space. */ - - return undefined; - } - - } - - - function setDatetime(newDatetime) { - - datetime = newDatetime; - orderBookSnapShot.setDatetime(datetime); - - } - - - function setDatetimeRange(newDatetimeRange) { - - datetimeRange = newDatetimeRange; - orderBookSnapShot.setDatetimeRange(datetimeRange); - - } - - function draw() { - - this.container.frame.draw(); - orderBookDephChart.draw(); - - } - -} - diff --git a/OrderBookDepthChart.js b/OrderBookDepthChart.js deleted file mode 100644 index d28c7562c..000000000 --- a/OrderBookDepthChart.js +++ /dev/null @@ -1,464 +0,0 @@ - -function newOrderBookDephChart() { - - /* - - This object represents the Depth chart and is able to mainain the information needed to plot it and to draw it on the canvas. - - */ - - var timeLineCoordinateSystem = newTimeLineCoordinateSystem(); - - var orderBookDephChart = { - addOrder: addOrder, - removeOrder: removeOrder, - container: undefined, - draw: draw, - getContainer: getContainer, - initialize: initialize - }; - - var aggBidOrders = newAggregatedOrdersArray(); - var aggAskOrders = newAggregatedOrdersArray(); - - var container = newContainer(); - container.initialize(); - orderBookDephChart.container = container; - - container.displacement.containerName = "Order Book Depth Chart"; - container.frame.containerName = "Order Book Depth Chart"; - - var bidPoints = []; - var askPoints = []; - - var marketId; - - return orderBookDephChart; - - - function initialize(market) { - - marketId = market; - - aggBidOrders.initialize(); - aggAskOrders.initialize(); - - aggBidOrders.setSortOrder('descending'); - aggAskOrders.setSortOrder('ascending'); - - aggBidOrders.eventHandler.listenToEvent('Array Changed', onBidArrayChanged, undefined); - aggAskOrders.eventHandler.listenToEvent('Array Changed', onAskArrayChanged, undefined); - - } - - - function getContainer(point) { - - var container; - - /* First we check if this point is inside this space. */ - - if (this.container.frame.isThisPointHere(point) === true) { - - return this.container; - - } else { - - /* This point does not belong to this space. */ - - return undefined; - } - - } - - function addOrder(order) { - - if (order.type === 'Bid') { - - aggBidOrders.addOrder(order); - - } else { - - aggAskOrders.addOrder(order); - - } - } - - function removeOrder(order) { - - if (order.type === 'Bid') { - - aggBidOrders.removeOrder(order); - - } else { - - aggAskOrders.removeOrder(order); - - } - } - - function onBidArrayChanged(array) { - - /* In order to avoid glinches while plotting the information of the array, we use a copy of the original that is constantly manipulated. */ - - newArray = array.slice(); - bidPoints = newArray; - - recalculateScale(); - - } - - function onAskArrayChanged(array) { - - /* In order to avoid glinches while plotting the information of the array, we use a copy of the original that is constantly manipulated. */ - - newArray = array.slice(); - askPoints = newArray; - - recalculateScale(); - - } - - - function draw() { - - if (bidPoints.length > 0 || askPoints.length > 0) { - - - drawAxis(); - - drawBackground(); - - plotChart(); - - - } - - } - - - function drawBackground() { - - var market = markets.get(marketId); - var label = market.assetA + " " + market.assetB; - - var fontSize = 50;//+ orderBookDephChart.container.zoom.level(); - - browserCanvasContext.font = fontSize + 'px verdana'; - - /* Now we transform x on the actual coordinate on the canvas. */ - - var point = { - x: orderBookDephChart.container.frame.width / 2 - (label.length / 2) * fontSize / 2, - y: orderBookDephChart.container.frame.height * 3 / 8 - }; - - point = transformThisPoint(point, orderBookDephChart.container); - - browserCanvasContext.fillStyle = 'rgba(190, 190, 190, 0.25)'; - - browserCanvasContext.fillText(label, point.x, point.y); - - } - - function plotChart() { - - /* - - This function is responsible for plotting the chart onto the browser canvas. - - */ - - /* The first part of this function will plot BIDs, the second one will plot the ASKs. */ - - if (bidPoints.length > 0) { - - /* We calculate the first points of the chart. These are not points representing orders, but the lower part of the hill plotted. */ - - var maxBasePoint = { - x: 0 , - y: orderBookDephChart.container.frame.height * 5 / 7 - }; - - var minBasePoint = { - x: (bidPoints[0].rate - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, // We take the first Order Rate on the array for this. - y: orderBookDephChart.container.frame.height * 5 / 7 - }; - - maxBasePoint = transformThisPoint(maxBasePoint, orderBookDephChart.container); - minBasePoint = transformThisPoint(minBasePoint, orderBookDephChart.container); - - /* Lets start the drawing. */ - - browserCanvasContext.beginPath(); - browserCanvasContext.moveTo(minBasePoint.x, minBasePoint.y); - - var progressiveSum = 0; - - var point = minBasePoint; - - for (var i = 0; i < bidPoints.length; i++) { - - if (bidPoints[i].rate >= timeLineCoordinateSystem.min.x && bidPoints[i].rate <= timeLineCoordinateSystem.max.x) { - - progressiveSum = progressiveSum + bidPoints[i].amountSum; - - point = { - x: (bidPoints[i].rate - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, - y: orderBookDephChart.container.frame.height * 5 / 7 - progressiveSum * timeLineCoordinateSystem.scale.y - }; - - var rawPosition = { - x: point.x, - y: point.y - }; - - point = transformThisPoint(point, orderBookDephChart.container); - - browserCanvasContext.lineTo(point.x, point.y); - - } - } - - browserCanvasContext.lineTo(maxBasePoint.x, point.y); - browserCanvasContext.lineTo(maxBasePoint.x, maxBasePoint.y); - browserCanvasContext.lineTo(minBasePoint.x, minBasePoint.y); - browserCanvasContext.closePath(); - browserCanvasContext.fillStyle = 'rgba(130, 180, 30, 0.50)'; - browserCanvasContext.fill(); - browserCanvasContext.strokeStyle = 'rgba(50, 130, 30, 0.50)'; - browserCanvasContext.lineWidth = 2; - browserCanvasContext.stroke(); - - browserCanvasContext.closePath(); - - } - - /* Ok, Now it is the turn of the ASKs, following is the code that plots them on the chart. */ - - - if (askPoints.length > 0) { - - /* We calculate the first point of the chart */ - - var maxBasePoint = { - x: (timeLineCoordinateSystem.max.x - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, - y: orderBookDephChart.container.frame.height * 5 / 7 - }; - - var minBasePoint = { - x: (askPoints[0].rate - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, // We take the first Order Rate on the array for this. - y: orderBookDephChart.container.frame.height * 5 / 7 - }; - - maxBasePoint = transformThisPoint(maxBasePoint, orderBookDephChart.container); - minBasePoint = transformThisPoint(minBasePoint, orderBookDephChart.container); - - /* Lets start the drawing. */ - - browserCanvasContext.beginPath(); - browserCanvasContext.moveTo(minBasePoint.x, minBasePoint.y); - - var progressiveSum = 0; - var point = minBasePoint; - - for (var i = 0; i < askPoints.length; i++) { - - if (askPoints[i].rate >= timeLineCoordinateSystem.min.x && askPoints[i].rate <= timeLineCoordinateSystem.max.x) { - - progressiveSum = progressiveSum + askPoints[i].amountSum; - - point = { - x: (askPoints[i].rate - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, - y: orderBookDephChart.container.frame.height * 5 / 7 - progressiveSum * timeLineCoordinateSystem.scale.y - }; - - point = transformThisPoint(point, orderBookDephChart.container); - - browserCanvasContext.lineTo(point.x, point.y); - - } - - } - - browserCanvasContext.lineTo(maxBasePoint.x, point.y); - browserCanvasContext.lineTo(maxBasePoint.x, maxBasePoint.y); - browserCanvasContext.lineTo(minBasePoint.x, minBasePoint.y); - browserCanvasContext.closePath(); - browserCanvasContext.fillStyle = 'rgba(180, 130, 30, 0.50)'; - browserCanvasContext.fill(); - browserCanvasContext.strokeStyle = 'rgba(130, 50, 30, 0.50)'; - browserCanvasContext.lineWidth = 2; - browserCanvasContext.stroke(); - - browserCanvasContext.closePath(); - } - - } - - - function drawAxis() { - - var step = (timeLineCoordinateSystem.max.x - timeLineCoordinateSystem.min.x) / 10; - - var decimals; - - /* Lets identify how many decimals are needed to be displayed. To do that we will chekck when is the first time that two consecutives points in the timeLineCoordinateSystem are different. */ - - for (var j = 0; j < 10; j++) { - - var diff = (timeLineCoordinateSystem.min.x + step * 2).toFixed(j) - (timeLineCoordinateSystem.min.x + step * 1).toFixed(j); - - if (diff !== 0 && decimals === undefined) { - decimals = j; - } - } - - for (var i = 1; i < 10 ; i++) { - - var point = { - x: timeLineCoordinateSystem.min.x + step * i, - y: orderBookDephChart.container.frame.height * 6 / 7 - }; - - - browserCanvasContext.fillStyle = 'rgba(10, 10, 10, 1)'; - - fontSize = 8; - - browserCanvasContext.font = fontSize + 'px verdana'; - - /* Se the label */ - - var label = point.x.toFixed(decimals); - - /* Now we transform x on the actual coordinate on the canvas. */ - - point.x = (point.x - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x; // Now x represent a coordinate on the canvas. - - point = orderBookDephChart.container.frame.frameThisPoint(point); - point = orderBookDephChart.container.displacement.displaceThisPoint(point); - - browserCanvasContext.fillText(label, point.x, point.y); - - } - } - - - function recalculateScale() { - - /* Since the range of the data might change, we must calculate the timeLineCoordinateSystem everytime new data arrives. */ - - var minBidRate = bidPoints[bidPoints.length - 1]; - var maxBidRate = bidPoints[0]; - - var minValue = { - x: 1, - y: 1 - }; - - var maxValue = { - x: 1, - y: 1 - }; - - if (bidPoints.length > 0) { - - /* X AXIS: - - We calculate the min value on x on the plot in this way: - - 1. We calculate the sum of all orders. - 2. Then we find which orders are included in the 75% of the total sum. - 3. The last order included will contain the minimun rate we need for the chart. - - Regarding the maximun, we just take ask orders that mirrors the bids orders only. - - */ - - var sum = 0; - - for (var i = 0; i < bidPoints.length; i++) { - - sum = sum + bidPoints[i].amountSum; - - } - - - target = sum * 0.75; - sum = 0; - lastOrder = bidPoints[0]; - - for (var i = 0; i < bidPoints.length; i++) { - - sum = sum + bidPoints[i].amountSum; - - if (sum < target) { - lastOrder = bidPoints[i]; - } - - } - - var minBidRate = lastOrder.rate; - var maxBidRate = bidPoints[0].rate; - - minValue.x = minBidRate; - maxValue.x = maxBidRate + (maxBidRate - minBidRate); - - /* Y AXIS: - - Now that we know which orders are included on the plot, we must see which is the highest value of - all of them. The highest value can be either at an ask, or at a bid order side of the chart. - - */ - - var selectedItem = bidPoints[0]; - var currentMax = 0; - var sum = 0; - - for (var i = 0; i < bidPoints.length; i++) { - - if (bidPoints[i].rate >= minValue.x && bidPoints[i].rate <= maxValue.x) { - - sum = sum + bidPoints[i].amountSum; - - } - - } - - currentMax = sum; - var sum = 0; - - for (var i = 0; i < askPoints.length; i++) { - - if (askPoints[i].rate >= minValue.x && askPoints[i].rate <= maxValue.x) { - - sum = sum + askPoints[i].amountSum; - - } - - } - - if (currentMax < sum) { - - currentMax = sum; - - } - - minValue.y = 0; - maxValue.y = currentMax; - - } - - timeLineCoordinateSystem.initialize( - minValue, - maxValue, - orderBookDephChart.container.frame.width, - orderBookDephChart.container.frame.height - orderBookDephChart.container.frame.height * 5 / 7 - ); - - - } - -} - diff --git a/OrderBookFilesCursor.js b/OrderBookFilesCursor.js deleted file mode 100644 index 8a87bb3b4..000000000 --- a/OrderBookFilesCursor.js +++ /dev/null @@ -1,140 +0,0 @@ - -function newOrderBookFilesCursor() { - - const CURSOR_SIZE = 1440 * 2; - - let orderBookFiles = new Map; - let cursorDate = new Date(INITIAL_DATE); - - let orderBookFilesCursor = { - setDatetime: setDatetime, - orderBookFiles: undefined, - initialize: initialize - } - - orderBookFilesCursor.orderBookFiles = orderBookFiles; - - let marketId; - let exchangeId; - - let server = newFileServer(); - - let working = false; - - return orderBookFilesCursor; - - function initialize(exchange, market) { - - marketId = market; - exchangeId = exchange; - - server.initialize(); - - } - - function setDatetime(datetime) { - - cursorDate = datetime; - - //if (working === false) { - - getFiles(); - - working = true - - collectGarbage(); - - //} - } - - function getFiles(callBackFunction) { - - let i = 0; - let j = 0; - - let dateString; - - getNextFile(); - - function getNextFile() { - - let targetDate = new Date(cursorDate); - targetDate.setMinutes(targetDate.getMinutes() + j); - - if (j === 0) { j++; } - else { - if (j < 0) { - j = -j; - j++; - } - else { - j = -j; - } - } - - dateString = targetDate.getFullYear() + '-' + pad(targetDate.getMonth() + 1, 2) + '-' + pad(targetDate.getDate(), 2) + '-' + pad(targetDate.getHours(), 2) + '-' + pad(targetDate.getMinutes(), 2); - - if (orderBookFilesCursor.orderBookFiles.get(dateString) === undefined) { - - server.getAggregattedOrderBook(exchangeId, marketId, targetDate, newOrderBookFilesReady) - - } else { - - controlLoop(); - } - - } - - function newOrderBookFilesReady(dailyFileReceived) { - - orderBookFilesCursor.orderBookFiles.set(dateString, dailyFileReceived); - - controlLoop(); - - } - - function controlLoop() { - - i++; - - if (i < CURSOR_SIZE) { - - getNextFile(); - - } - - else { - - if (callBackFunction !== undefined) { - - callBackFunction(); - } - - working = false; - - } - } - } - - function collectGarbage() { - - date = removeTime(cursorDate); - - let minDate = date.valueOf() - CURSOR_SIZE / 2 * 60 * 1000; - let maxDate = date.valueOf() + CURSOR_SIZE / 2 * 60 * 1000; - - for (let key of orderBookFilesCursor.orderBookFiles.keys()) { - - let keyDate = new Date(key + ':00'); - - if (keyDate.valueOf() < minDate || keyDate.valueOf() > maxDate) { - - orderBookFilesCursor.orderBookFiles.delete(key); - - } - - } - - } - -} \ No newline at end of file diff --git a/OrderBookSnapShot.js b/OrderBookSnapShot.js deleted file mode 100644 index 4f9576fe4..000000000 --- a/OrderBookSnapShot.js +++ /dev/null @@ -1,107 +0,0 @@ - -function newOrderBookSnapShot() { - - /* - - This object contains an mantains a snapshot of an order book, which is defined as a collection of all orders valid at a certain moment in time. - Everytime someone sets a new datetime, it goes to an OrderBook object and request new orders for this datetime. At the same time it removes all - orders that are not valid in that new datetime. - - For each new order that adds or removes from the snapshot, it raises an event that can be consumed by subscribers. - - */ - - var orderBook = newOrderBook(); // This is the order book object that is going to provide us with the orders when we shall need them. - - var snapshotOrders = new Map(); // These are the orders that are only valid for the time the chart is plotting right now. - - var datetime; - var datetimeRange; - - var marketId; - - var orderBookSnapShot = { - eventHandler: undefined, - getDatetime: getDatetime, - setDatetime: setDatetime, - setDatetimeRange: setDatetimeRange, - initialize: initialize - }; - - orderBookSnapShot.eventHandler = newEventHandler(); - - return orderBookSnapShot; - - - function initialize(market) { - - marketId = market; - - this.eventHandler.initialize(); - - orderBook.initialize(marketId); - - } - - function getDatetime() { - - return datetime; - - } - - function setDatetime(newDatetime) { - - datetime = newDatetime; - - /* We need to check that all orders that do not belong to this time period must be removed from the snapshot. */ - - removeOutOfTimeOrders(); - - /* We also have to get the orders from the order book that belongs to this period and we dont have.*/ - - orderBook.getOrdersOf(newDatetime, addNewOrders); - } - - function setDatetimeRange(newDatetimeRange) { - - datetimeRange = newDatetimeRange; - orderBook.setDatetimeRange(datetimeRange); - - } - - function addNewOrders(ordersToAdd) { - - for (var i = 0; i < ordersToAdd.length; i++) { - - order = ordersToAdd[i]; - - var existingOrder = snapshotOrders.get(order.id); - - if (existingOrder === undefined) { - - snapshotOrders.set(order.id, order); - orderBookSnapShot.eventHandler.raiseEvent('Order Added', order); - - } - - } - - } - - function removeOutOfTimeOrders() { - - for (var [id, order] of snapshotOrders) { - - if (order.datetimeIn.valueOf() > datetime.valueOf() || order.datetimeOut.valueOf() <= datetime.valueOf()) { - - snapshotOrders.delete(id); - - orderBookSnapShot.eventHandler.raiseEvent('Order Removed', order); - - } - - } - - } - -} \ No newline at end of file diff --git a/Panels/OrderBookPanel.js b/Panels/OrderBookPanel.js deleted file mode 100644 index f80dc5a32..000000000 --- a/Panels/OrderBookPanel.js +++ /dev/null @@ -1,437 +0,0 @@ - -function newOrderBookPanel() { - - var orderBookPanel = { - onCurrentOrderBookChanged: onCurrentOrderBookChanged, - container: undefined, - draw: draw, - getContainer: getContainer, - initialize: initialize - }; - - var container = newContainer(); - container.initialize(); - orderBookPanel.container = container; - - container.displacement.containerName = "Order Book Panel"; - container.frame.containerName = "Order Book Panel"; - - let currentOrderBook; - let server; - - var timeLineCoordinateSystem = newTimeLineCoordinateSystem(); - - return orderBookPanel; - - function initialize() { - - orderBookPanel.container.frame.width = 400; - orderBookPanel.container.frame.height = 300; - - orderBookPanel.container.frame.position.x = 0; - orderBookPanel.container.frame.position.y = viewPort.visibleArea.bottomLeft.y - orderBookPanel.container.frame.height; - - server = newFileServer(); - server.initialize(); - - - - } - - - - function getContainer(point) { - - var container; - - /* First we check if this point is inside this space. */ - - if (this.container.frame.isThisPointHere(point, true) === true) { - - return this.container; - - } else { - - /* This point does not belong to this space. */ - - return undefined; - } - - } - - - - function onZoomChanged(event) { - - - - - } - - function onDragFinished() { - - - - - } - - - function getOrderBook() { - - server.getOrderBook(exchangeId, marketId, onFileReady); - - function onFileReady(file) { - - currentOrderBook = file; - recalculateScale(); - - viewPort.eventHandler.listenToEvent("Zoom Changed", onZoomChanged); - canvas.eventHandler.listenToEvent("Drag Finished", onDragFinished); - - } - - } - - - - function onCurrentOrderBookChanged(orderBooksMap) { - - currentOrderBook = [[], []]; - - for (let key of orderBooksMap.keys()) { - - let orderBookPosition = orderBooksMap.get(key); - - let position = [orderBookPosition.rate, (orderBookPosition.open + orderBookPosition.close) / 2]; - - if (orderBookPosition.type === 'bid') { - - currentOrderBook[1].push(position); - - } - - if (orderBookPosition.type === 'ask') { - - currentOrderBook[0].push(position); - - } - - } - - recalculateScale(); - - } - - - function draw() { - - return; // Do not show for now, under construction. - - this.container.frame.draw(false, false, true); - - plotCurrentOrderBook(); - - } - - - - function recalculateScale() { - - let bidPoints = currentOrderBook[1]; - let askPoints = currentOrderBook[0]; - let position; - - /* Since the range of the data might change, we must calculate the timeLineCoordinateSystem everytime new data arrives. */ - - var minBidRate = bidPoints[bidPoints.length - 1]; - var maxBidRate = bidPoints[0]; - - var minValue = { - x: 1, - y: 1 - }; - - var maxValue = { - x: 1, - y: 1 - }; - - if (bidPoints.length > 0) { - - /* X AXIS: - - We calculate the min value on x on the plot in this way: - - 1. We calculate the sum of all orders. - 2. Then we find which orders are included in the 75% of the total sum. - 3. The last order included will contain the minimun rate we need for the chart. - - Regarding the maximun, we just take ask orders that mirrors the bids orders only. - - */ - - var sum = 0; - - for (var i = 0; i < bidPoints.length; i++) { - - position = { - rate: bidPoints[i][0], - amount: bidPoints[i][1] - }; - - sum = sum + position.amount; - - } - - - target = sum * 0.75; - sum = 0; - lastOrder = bidPoints[0]; - - for (var i = 0; i < bidPoints.length; i++) { - - position = { - rate: bidPoints[i][0], - amount: bidPoints[i][1] - }; - - sum = sum + position.amount; - - if (sum < target) { - lastOrder = position; - } - - } - - position = { - rate: bidPoints[0][0], - amount: bidPoints[0][1] - }; - - var minBidRate = lastOrder.rate; - var maxBidRate = position.rate; - - minValue.x = minBidRate; - maxValue.x = maxBidRate + (maxBidRate - minBidRate); - - /* Y AXIS: - - Now that we know which orders are included on the plot, we must see which is the highest value of - all of them. The highest value can be either at an ask, or at a bid order side of the chart. - - */ - - - - var selectedItem = position; - var currentMax = 0; - var sum = 0; - - for (var i = 0; i < bidPoints.length; i++) { - - position = { - rate: bidPoints[i][0], - amount: bidPoints[i][1] - }; - - if (position.rate >= minValue.x && position.rate <= maxValue.x) { - - sum = sum + position.amount; - - } - - } - - currentMax = sum; - var sum = 0; - - for (var i = 0; i < askPoints.length; i++) { - - position = { - rate: askPoints[i][0], - amount: askPoints[i][1] - }; - - if (position.rate >= minValue.x && position.rate <= maxValue.x) { - - sum = sum + position.amount; - - } - - } - - if (currentMax < sum) { - - currentMax = sum; - - } - - minValue.y = 0; - maxValue.y = currentMax; - - } - - timeLineCoordinateSystem.initialize( - minValue, - maxValue, - orderBookPanel.container.frame.width, - orderBookPanel.container.frame.height - orderBookPanel.container.frame.height * 5 / 7 - ); - } - - - - function plotCurrentOrderBook() { - - if (currentOrderBook === undefined) { return; } - - let bidPoints = currentOrderBook[1]; - let askPoints = currentOrderBook[0]; - - let position; - - /* The first part of this function will plot BIDs, the second one will plot the ASKs. */ - - if (bidPoints.length > 0) { - - /* We calculate the first points of the chart. These are not points representing positions on the order book, but the lower part of the hill plotted. */ - - position = { - rate: bidPoints[0][0], - amount: bidPoints[0][1] - }; - - var maxBasePoint = { - x: 0, - y: orderBookPanel.container.frame.height * 5 / 7 - }; - - var minBasePoint = { - x: (position.rate - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, // We take the first Order Rate on the array for this. - y: orderBookPanel.container.frame.height * 5 / 7 - }; - - maxBasePoint = orderBookPanel.container.frame.frameThisPoint(maxBasePoint); - minBasePoint = orderBookPanel.container.frame.frameThisPoint(minBasePoint); - - /* Lets start the drawing. */ - - browserCanvasContext.beginPath(); - browserCanvasContext.moveTo(minBasePoint.x, minBasePoint.y); - - var progressiveSum = 0; - - var point = minBasePoint; - - for (var i = 0; i < bidPoints.length; i++) { - - position = { - rate: bidPoints[i][0], - amount: bidPoints[i][1] - }; - - if (position.rate >= timeLineCoordinateSystem.min.x && position.rate <= timeLineCoordinateSystem.max.x) { - - progressiveSum = progressiveSum + position.amount; - - point = { - x: (position.rate - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, - y: orderBookPanel.container.frame.height * 5 / 7 - progressiveSum * timeLineCoordinateSystem.scale.y - }; - - point = orderBookPanel.container.frame.frameThisPoint(point); - - browserCanvasContext.lineTo(point.x, point.y); - - } - } - - browserCanvasContext.lineTo(maxBasePoint.x, point.y); - browserCanvasContext.lineTo(maxBasePoint.x, maxBasePoint.y); - browserCanvasContext.lineTo(minBasePoint.x, minBasePoint.y); - browserCanvasContext.closePath(); - browserCanvasContext.fillStyle = 'rgba(130, 180, 30, 0.50)'; - browserCanvasContext.fill(); - browserCanvasContext.strokeStyle = 'rgba(50, 130, 30, 0.50)'; - browserCanvasContext.lineWidth = 2; - browserCanvasContext.stroke(); - - browserCanvasContext.closePath(); - - } - - - if (askPoints.length > 0) { - - position = { - rate: askPoints[0][0], - amount: askPoints[0][1] - }; - - /* We calculate the first point of the chart */ - - var maxBasePoint = { - x: (timeLineCoordinateSystem.max.x - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, - y: orderBookPanel.container.frame.height * 5 / 7 - }; - - var minBasePoint = { - x: (position.rate - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, // We take the first Order Rate on the array for this. - y: orderBookPanel.container.frame.height * 5 / 7 - }; - - maxBasePoint = orderBookPanel.container.frame.frameThisPoint(maxBasePoint); - minBasePoint = orderBookPanel.container.frame.frameThisPoint(minBasePoint); - - /* Lets start the drawing. */ - - browserCanvasContext.beginPath(); - browserCanvasContext.moveTo(minBasePoint.x, minBasePoint.y); - - var progressiveSum = 0; - var point = minBasePoint; - - for (var i = 0; i < askPoints.length; i++) { - - position = { - rate: askPoints[i][0], - amount: askPoints[i][1] - }; - - if (position.rate >= timeLineCoordinateSystem.min.x && position.rate <= timeLineCoordinateSystem.max.x) { - - progressiveSum = progressiveSum + position.amount; - - point = { - x: (position.rate - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, - y: orderBookPanel.container.frame.height * 5 / 7 - progressiveSum * timeLineCoordinateSystem.scale.y - }; - - point = orderBookPanel.container.frame.frameThisPoint(point); - - browserCanvasContext.lineTo(point.x, point.y); - - } - - } - - browserCanvasContext.lineTo(maxBasePoint.x, point.y); - browserCanvasContext.lineTo(maxBasePoint.x, maxBasePoint.y); - browserCanvasContext.lineTo(minBasePoint.x, minBasePoint.y); - browserCanvasContext.closePath(); - browserCanvasContext.fillStyle = 'rgba(180, 130, 30, 0.50)'; - browserCanvasContext.fill(); - browserCanvasContext.strokeStyle = 'rgba(130, 50, 30, 0.50)'; - browserCanvasContext.lineWidth = 2; - browserCanvasContext.stroke(); - - browserCanvasContext.closePath(); - } - - - - } - - -} - diff --git a/PriceChart.js b/PriceChart.js deleted file mode 100644 index 3bb676a80..000000000 --- a/PriceChart.js +++ /dev/null @@ -1,205 +0,0 @@ - -function newPriceChart() { - - var trades = []; - - var timeLineCoordinateSystem = newTimeLineCoordinateSystem(); - - var datetime; - var datetimeRange; - - var priceChart = { - setDatetime: setDatetime, - setDatetimeRange: setDatetimeRange, - container: undefined, - draw: draw, - getContainer: getContainer, - initialize: initialize - }; - - var container = newContainer(); - container.initialize(); - priceChart.container = container; - - container.displacement.containerName = "Price Chart"; - container.frame.containerName = "Price Chart"; - - var marketId; - var exchangeId; - var marketTrades; - - return priceChart; - - function initialize(exchange, market, trades) { - - marketId = market; - exchangeId = exchange; - marketTrades = trades; - - } - function getContainer(point) { - - var container; - - /* First we check if this point is inside this space. */ - - if (this.container.frame.isThisPointHere(point) === true) { - - return this.container; - - } else { - - /* This point does not belong to this space. */ - - return undefined; - } - - } - - - function setDatetime(newDatetime) { - - datetime = newDatetime; - - } - - - - function setDatetimeRange(newDatetimeRange) { - - datetimeRange = newDatetimeRange; - - trades = []; - - marketTrades.getTradesByDateRange(datetimeRange, onTradesReady); - - function onTradesReady(tradesReceived) { - - trades = tradesReceived; - - recalculateScale(); - splitTrades(); - } - } - - - - function draw() { - - this.container.frame.draw(); - - drawBackground(); - - plotPriceChart(); - } - - - - function recalculateScale() { - - var minValue = { - x: 10000000000000, - y: 10000000000000 - }; - - var maxValue = { - x: 0, - y: 0 - }; - - for (var i = 0; i < trades.length; i++) { - - var trade = trades[i]; - - var datetime = trade.datetime.valueOf(); - - if (minValue.x > datetime) { - minValue.x = datetime; - } - - if (maxValue.x < datetime) { - maxValue.x = datetime; - } - - var rate = trade.rate; - - if (minValue.y > rate) { - minValue.y = rate; - } - - if (maxValue.y < rate) { - maxValue.y = rate; - } - - } - - timeLineCoordinateSystem.initialize( - minValue, - maxValue, - priceChart.container.frame.width, - priceChart.container.frame.height - ); - - } - - - function plotPriceChart() { - - if (trades.length > 0) { - - var firstPoint = { - x: (trades[0].datetime.valueOf() - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, - y: priceChart.container.frame.height - (trades[0].rate - timeLineCoordinateSystem.min.y) * timeLineCoordinateSystem.scale.y - }; - - firstPoint = transformThisPoint(firstPoint, priceChart.container); - - browserCanvasContext.moveTo(firstPoint.x, firstPoint.y); - - for (var i = 0; i < trades.length; i++) { - - var trade = trades[i]; - - point = { - x: (trade.datetime.valueOf() - timeLineCoordinateSystem.min.x) * timeLineCoordinateSystem.scale.x, - y: priceChart.container.frame.height - (trade.rate - timeLineCoordinateSystem.min.y) * timeLineCoordinateSystem.scale.y - }; - - point = transformThisPoint(point, priceChart.container); - browserCanvasContext.lineTo(point.x, point.y); - - } - - browserCanvasContext.strokeStyle = 'rgba(30, 30, 200, 0.50)'; - browserCanvasContext.lineWidth = 1; - browserCanvasContext.stroke(); - - } - } - - - function drawBackground() { - - var market = markets.get(marketId); - var label = market.assetA + " " + market.assetB; - - var fontSize = 50;//+ priceChart.container.zoom.level(); - - browserCanvasContext.font = fontSize + 'px verdana'; - - /* Now we transform x on the actual coordinate on the canvas. */ - - var point = { - x: priceChart.container.frame.width / 2 - label.length / 2 * fontSize / 2, - y: priceChart.container.frame.height * 3 / 8 - }; - - point = transformThisPoint(point, priceChart.container); - - browserCanvasContext.fillStyle = 'rgba(190, 190, 190, 0.25)'; - - browserCanvasContext.fillText(label, point.x, point.y); - - } -} - diff --git a/Project.njsproj b/Project.njsproj index d012c9cb2..90e27cade 100644 --- a/Project.njsproj +++ b/Project.njsproj @@ -90,17 +90,9 @@ - - - - - - - - Code @@ -115,8 +107,6 @@ - - diff --git a/Trade.js b/Trade.js deleted file mode 100644 index 4f1e041ae..000000000 --- a/Trade.js +++ /dev/null @@ -1,16 +0,0 @@ - - -function newTrade(id, type, rate, amountA, amountB, datetime) { - - var trade = { - id: id, - type: type, - rate: rate, - amountA: amountA, - amountB: amountB, - datetime: datetime - }; - - return trade; - -} \ No newline at end of file diff --git a/TradesCursor.js b/TradesCursor.js deleted file mode 100644 index daddde5be..000000000 --- a/TradesCursor.js +++ /dev/null @@ -1,38 +0,0 @@ - -function newTradesCursor() { - - let trades = []; - - let tradesCursor = { - eventHandler: undefined, - newTradesReady: newTradesReady, - trades: undefined, - initialize: initialize - } - - tradesCursor.trades = trades; - - let marketId; - let exchangeId; - let marketTrades; - - tradesCursor.eventHandler = newEventHandler(); - - return tradesCursor; - - function initialize(exchange, market, marketTrades) { - - marketId = market; - exchangeId = exchange; - marketTrades = marketTrades; - - } - - function newTradesReady(tradesReceived) { - - tradesCursor.trades = tradesReceived; - tradesCursor.eventHandler.raiseEvent("Trades Changed", undefined); - - } - -} \ No newline at end of file diff --git a/index.html b/index.html index 41fd26a43..99e98e881 100644 --- a/index.html +++ b/index.html @@ -30,20 +30,12 @@ - - - - - - - - @@ -58,7 +50,6 @@ -