Skip to content
This repository was archived by the owner on Feb 22, 2024. It is now read-only.

Add binary-styles for consistency in style, rework header and layout with flexbox #3

Closed
wants to merge 1 commit into from
Closed

Add binary-styles for consistency in style, rework header and layout with flexbox #3

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
225 changes: 113 additions & 112 deletions bot.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,10 @@
<meta charset="utf-8">
<title>Binary Bot</title>
<link href="www/css/bot.css" rel="stylesheet" />
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css" type="text/css" media="screen">
<link rel="stylesheet" href="bower_components/Tourist.js/tourist.css" type="text/css" media="screen">
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://style.binary.com/binary.css"/>
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css" type="text/css" media="screen">
<link rel="stylesheet" href="bower_components/Tourist.js/tourist.css" type="text/css" media="screen">

<link rel="apple-touch-icon" sizes="57x57" href="https://static.binary.com/images/favicons/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="114x114" href="https://static.binary.com/images/favicons/apple-touch-icon-114x114.png">
Expand All @@ -23,124 +25,123 @@
<link rel="icon" type="image/png" sizes="32x32" href="https://static.binary.com/images/favicons/favicon-32x32.png">
</head>
<body id="drop_zone">
<div id="center"></div>
<div class="toolbox">
<div class="intro-file-management">
<span data-i18n-text="Open Block file"></span> <input title="Open an already saved XML file and retrieve its blocks" type="file" id="files" accept=".xml">
<button title="Save the blocks as a XML file" onclick="Bot.saveXml()" data-i18n-text="Save Blocks"></button>
</div>
<div class="intro-token">
<button title="Add your tokens to the bot" onclick="Bot.addAccount()" data-i18n-text="Add Token"></button>
</div>
<div class="intro-undo-redo">
<button title="Undo the changes (Ctrl+Z)" onclick="Bot.undo()" data-i18n-text="Undo"></button>
<button title="Redo the changes (Ctrl+Shift+Z)" onclick="Bot.redo()" data-i18n-text="Redo"></button>
</div>
<div class="intro-summary">
<button title="Open the summary panel" onclick="Bot.showSummary()" data-i18n-text="Summary"></button>
</div>
<div class="intro-run-stop">
<button title="Run the blocks" id="runButton" onclick="Bot.run()" data-i18n-text="Run"></button>
<button title="Stop the blocks" id="stopButton" data-i18n-text="Reset"></button>
</div>
</div>
<div class="logout"><button onclick="Bot.server.logout()" data-i18n-text="Logout"></button></div>
<div class="help">
<span class="language-select" style="display: none">
<select id="language">
<option value="zh_tw">繁體中文</option>
<option value="de">Deutsch</option>
<option value="id">Bahasa Indonesia</option>
<option value="zh_cn">简体中文</option>
<option value="it">Italiano</option>
<option value="vi">Vietnamese</option>
<option value="ar">Arabic</option>
<option value="pl">Polish</option>
<option value="ru">Русский</option>
<option value="pt">Português</option>
<option value="es">Español</option>
<option value="fr">Français</option>
<option value="en" selected="selected">English</option>
</select>
</span>
<span class="tutorialList">
<span data-i18n-text="Tours:"></span>
<select id="tours">
<option value="welcome" data-i18n-text="Welcome!"></option>
<option value="introduction" data-i18n-text="Introduction"></option>
</select>
</span>
<button id="tutorialButton" data-i18n-text="Go!"></button>
</div>
<div id="blocklyDiv"></div>
<div id="summaryPanel">
<div class="exitPanel"><p>x</p></div>
<div class="content">
<h4>
<span data-i18n-text="Summary"></span>
</h4>
<table id="summaryDisplay">
<thead>
<tr>
<th data-i18n-text="No. of runs"></th>
<th data-i18n-text="Total Stake"></th>
<th data-i18n-text="Total Payout"></th>
<th data-i18n-text="Total Profit/Loss"></th>
<th data-i18n-text="Balance"></th>
</tr>
</thead>
<tbody>
<tr>
<td class="numOfRuns"></td>
<td class="totalStake"></td>
<td class="totalPayout"></td>
<td class="totalProfit"></td>
<td class="balance"></td>
</tr>
</tbody>
</table>
<h4>
<span data-i18n-text="Trades"></span>
</h4>
<div class="table-scroll">
<table id="tradesDisplay">
<thead>
<tr>
<th><span data-i18n-text="Number"></span></th>
<th><span data-i18n-text="Reference"></span></th>
<th><span data-i18n-text="TradeType"></span></th>
<th><span data-i18n-text="Entry Spot"></span></th>
<th><span data-i18n-text="Exit Spot"></span></th>
<th><span data-i18n-text="Buy Price"></span></th>
<th><span data-i18n-text="Final Price"></span></th>
<th><span data-i18n-text="Profit/Loss"></span></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<div id="chart"></div>
</div>
</div>

<div class="header inverse">
<div class="toolbox">
<div class="intro-file-management">
<input title="Open an already saved XML file and retrieve its blocks" type="file" id="files" accept=".xml">
<button class="btn-secondary" title="Save the blocks as a XML file" onclick="Bot.saveXml()" data-i18n-text="Save Blocks"></button>
</div>
<div class="intro-token">
<button class="btn-secondary" title="Add your tokens to the bot" onclick="Bot.addAccount()" data-i18n-text="Add Token"></button>
</div>
<div class="intro-undo-redo">
<button class="btn-secondary" title="Undo the changes (Ctrl+Z)" onclick="Bot.undo()" data-i18n-text="Undo"></button>
<button class="btn-secondary" title="Redo the changes (Ctrl+Shift+Z)" onclick="Bot.redo()" data-i18n-text="Redo"></button>
</div>
<div class="intro-summary">
<button class="btn-secondary" title="Open the summary panel" onclick="Bot.showSummary()" data-i18n-text="Summary"></button>
</div>
<div class="intro-run-stop">
<button class="btn-secondary" title="Run the blocks" id="runButton" onclick="Bot.run()" data-i18n-text="Run"></button>
<button class="btn-secondary" title="Stop the blocks" id="stopButton" data-i18n-text="Reset"></button>
</div>
</div>
<div class="logout"><button class="btn-secondary" onclick="Bot.server.logout()" data-i18n-text="Logout"></button></div>
<div class="help">
<span class="language-select" style="display: none">
<select id="language">
<option value="zh_tw">繁體中文</option>
<option value="de">Deutsch</option>
<option value="id">Bahasa Indonesia</option>
<option value="zh_cn">简体中文</option>
<option value="it">Italiano</option>
<option value="vi">Vietnamese</option>
<option value="ar">Arabic</option>
<option value="pl">Polish</option>
<option value="ru">Русский</option>
<option value="pt">Português</option>
<option value="es">Español</option>
<option value="fr">Français</option>
<option value="en" selected="selected">English</option>
</select>
</span>
<span class="tutorialList">
<select id="tours">
<option value="welcome" data-i18n-text="Welcome!"></option>
<option value="introduction" data-i18n-text="Introduction"></option>
</select>
<button class="btn-secondary" id="tutorialButton" data-i18n-text="Watch Tour"></button>
</span>
</div>
</div>
<div class="workspace">
<div id="blocklyDiv"></div>
<div id="summaryPanel">
<div class="exitPanel"><p>x</p></div>
<div class="content">
<h4>
<span data-i18n-text="Summary"></span>
</h4>
<table id="summaryDisplay">
<thead>
<tr>
<th data-i18n-text="No. of runs"></th>
<th data-i18n-text="Total Stake"></th>
<th data-i18n-text="Total Payout"></th>
<th data-i18n-text="Total Profit/Loss"></th>
<th data-i18n-text="Balance"></th>
</tr>
</thead>
<tbody>
<tr>
<td class="numOfRuns"></td>
<td class="totalStake"></td>
<td class="totalPayout"></td>
<td class="totalProfit"></td>
<td class="balance"></td>
</tr>
</tbody>
</table>
<h4>
<span data-i18n-text="Trades"></span>
</h4>
<div class="table-scroll">
<table id="tradesDisplay">
<thead>
<tr>
<th><span data-i18n-text="Number"></span></th>
<th><span data-i18n-text="Reference"></span></th>
<th><span data-i18n-text="TradeType"></span></th>
<th><span data-i18n-text="Entry Spot"></span></th>
<th><span data-i18n-text="Exit Spot"></span></th>
<th><span data-i18n-text="Buy Price"></span></th>
<th><span data-i18n-text="Final Price"></span></th>
<th><span data-i18n-text="Profit/Loss"></span></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<div id="chart"></div>
</div>
</div>
</div>
<script src="node_modules/i18next/i18next.js"></script>
<script src="node_modules/js-sha1/build/sha1.min.js"></script>
<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/react/dist/react.min.js"></script>
<script src="node_modules/binary-live-api/lib/binary-live-api.js"></script>
<script src="node_modules/binary-charts/lib/binary-charts.js"></script>
<script src="node_modules/blockly/blockly_compressed.js"></script>
<script src="node_modules/blockly/blocks_compressed.js"></script>
<script src="node_modules/blockly/javascript_compressed.js"></script>
<script src="bower_components/file-saver.js/FileSaver.js"></script>
<script src="bower_components/underscore/underscore-min.js"></script>
<script src="bower_components/backbone/backbone-min.js"></script>
<script src="bower_components/Tourist.js/tourist.min.js"></script>
<script src="node_modules/blockly/blockly_compressed.js"></script>
<script src="node_modules/blockly/blocks_compressed.js"></script>
<script src="node_modules/blockly/javascript_compressed.js"></script>
<script src="bower_components/file-saver.js/FileSaver.js"></script>
<script src="bower_components/underscore/underscore-min.js"></script>
<script src="bower_components/backbone/backbone-min.js"></script>
<script src="bower_components/Tourist.js/tourist.min.js"></script>
<script src="www/js/vendor/notifyjs/notify.min.js"></script>
<script src="www/js/binary-bot.min.js"></script>
<script src="www/js/after_all.min.js"></script>

</body>
</html>

3 changes: 2 additions & 1 deletion index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
<meta charset="utf-8">
<title>Welcome to the Binary Bot</title>
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://style.binary.com/binary.css"/>
<link href="www/css/main.css" rel="stylesheet" />

<link rel="apple-touch-icon" sizes="57x57" href="https://static.binary.com/images/favicons/apple-touch-icon-57x57.png">
Expand Down Expand Up @@ -75,7 +76,7 @@ <h1>Binary Bot</h1>
target="_blank">Introduction to Blockly</a>.
</li>
</ul>
<p class="cta"><a class="button" href="bot.html"><span data-i18n-text="Start Now"></span></a></p>
<p class="cta"><a class="btn-primary" href="bot.html" data-i18n-text="Start Now"></a></p>
<div class="contact">
<p><span><span data-i18n-text="Fork this project on"></span> <a href="https://github.com/binary-com/binary-bot" target="_blank">GitHub</a>.</span>&nbsp;&nbsp;&nbsp;&nbsp;<span><span data-i18n-text="Need help?"></span> <a href="https://www.binary.com/contact?l=EN" data-i18n-text="Contact Us"></a>.</span></p>
</div>
Expand Down
4 changes: 2 additions & 2 deletions src/globals/view.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,8 +125,8 @@ Bot.View = function View(on_load) {

Bot.showTrades();

var BinaryChart = window['binary-charts'];
Bot.chart = BinaryChart.createChart('chart', {
var BinaryChart = window['binary-charts'].PlainChart;
Bot.chart = BinaryChart('chart', {
ticks: []
});

Expand Down
56 changes: 19 additions & 37 deletions www/css/bot.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,37 +1,32 @@
html, body {
height: 100%;
margin: 0px;
height: 100%;
margin: 0;
}
body {

backgroun-color: #fff;
font-family: sans-serif;
display: flex;
}
h1 {
font-weight: normal;
font-size: 140%;
}
#drop_zone{
height: 100%;
width: 100%;
.header, .toolbox {
display: flex;
}
.toolbox * {
margin: 2px;
float: left;
.header {
padding: .25rem;
background: #2a3052 !important;
font-size: 14px;
justify-content: space-between;
}
#blocklyDiv{
height: 100%;
width: 100%;
right: 100px;
bottom: 0px;
.header button {
margin-right: .5rem;
}
.help{
float: right;
margin: 2px;
.workspace {
flex: 1;
display: flex;
}
.logout{
float: right;
margin: 2px;
#blocklyDiv {
flex: 1;
}
#center {
position: fixed;
Expand Down Expand Up @@ -68,29 +63,16 @@ h1 {
padding: 15px;
background-color: #EEEEEE;
}
table {
overflow:auto;
width: 100%;
}
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
th, td {
text-align: center !important;
padding: 3px !important;
height: 2em;
}
.table-scroll {
overflow:auto;
overflow: auto;
height: 169px;
}
#chart, #tradesDisplay, #summaryDisplay {
cursor: default;
}
#chart {
height: 270px;
width: 770px;
width: 770px;
}
.draggable{
opacity: 0.75;
Expand Down
Loading
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy