[WebInterface] multiple fixes

Drakkar-Software · Jun 20, 2024 · eb5e09b · eb5e09b
1 parent 7419c2b
commit eb5e09b
Show file tree

Hide file tree

Showing 12 changed files with 75 additions and 63 deletions.
diff --git a/Services/Interfaces/web_interface/advanced_controllers/strategy_optimizer.py b/Services/Interfaces/web_interface/advanced_controllers/strategy_optimizer.py
@@ -21,6 +21,9 @@
 
 
 def register(blueprint):
+    # strategy optimize is disabled
+    return
+
     @blueprint.route("/strategy-optimizer")
     @blueprint.route('/strategy-optimizer', methods=['GET', 'POST'])
     @login.login_required_when_activated

diff --git a/Services/Interfaces/web_interface/advanced_templates/advanced_evaluator_config.html b/Services/Interfaces/web_interface/advanced_templates/advanced_evaluator_config.html
@@ -8,7 +8,7 @@
 {% endblock additional_style %}
 
 {% block body %}
-<div id="nav-config" class="sticky-top">
+<div id="nav-config">
     <div class="card card-header">
         <h3>
             <span class="float-left">
@@ -20,22 +20,22 @@ <h3>
         </h3>
     </div>
     {% if not current_profile.read_only %}
-        <nav class="navbar nav-tabs navbar-dark primary-color">
+        <div class="navbar nav-tabs navbar-dark primary-color">
             <span class="white-text"> Any configuration change will be applied after OctoBot restarts.</span>
             <ul class="nav mx-auto">
                 <li class="nav-item">
-                    <a class="nav-link btn green waves-effect" id='save-config' href="#" role="tab" update-url="{{ url_for('advanced.evaluator_config') }}">Save</a>
+                    <a class="btn btn-primary waves-effect" id='save-config' href="#" role="tab" update-url="{{ url_for('advanced.evaluator_config') }}">Save</a>
                 </li>
                 <li class="nav-item">
-                    <a class="nav-link btn orange waves-effect" id='reset-config' href="#" role="tab">Reset all</a>
+                    <a class="btn btn-outline-primary waves-effect" id='reset-config' href="#" role="tab">Reset all</a>
                 </li>
             </ul>
             <ul class="nav ml-auto">
                 <li class="nav-item">
-                    <button id='save-config-and-restart' update-url="{{ url_for('advanced.evaluator_config') }}" type="button" class="nav-link btn red waves-effect">Apply changes and restart</button>
+                    <button id='save-config-and-restart' update-url="{{ url_for('advanced.evaluator_config') }}" type="button" class="btn btn-outline-primary waves-effect">Apply changes and restart</button>
                 </li>
             </ul>
-        </nav>
+        </div>
     {% endif %}
 </div>
 <div id="super-container">

diff --git a/Services/Interfaces/web_interface/advanced_templates/advanced_layout.html b/Services/Interfaces/web_interface/advanced_templates/advanced_layout.html
@@ -93,11 +93,6 @@
             <div class="navbar-collapse collapse w-100 order-3 dual-collapse2">
                 <ul class="navbar-nav ml-auto">
                     {% if is_advanced_interface_enabled %}
-                        {% if is_backtesting_enabled %}
-                        <li class="nav-item mx-1 px-0 my-auto {% if 'advanced.strategy_optimizer' == active_page %} active{% endif %}">
-                            <a class="nav-link" href="{{ url_for('advanced.strategy_optimizer') }}">Strategy optimizer</a>
-                        </li>
-                        {% endif %}
                         {% if CAN_INSTALL_TENTACLES %}
                         <li class="nav-item mx-1 px-0 my-auto {% if 'advanced.tentacles' == active_page %} active{% endif %}">
                             <a class="nav-link" href="{{ url_for('advanced.tentacles') }}">Tentacles</a>

diff --git a/Services/Interfaces/web_interface/advanced_templates/advanced_matrix.html b/Services/Interfaces/web_interface/advanced_templates/advanced_matrix.html
@@ -8,33 +8,6 @@ <h1>
         </h1>
     </div>
     <div class="card-body">
-        <div class="container-fluid alert alert-info mx-0 mt-2" role="alert">
-            <p>
-                <i class="fa-regular fa-lightbulb"></i>
-                The matrix view shows the current value of each active evaluator and strategy.
-            </p>
-            <p>
-                For evaluators and strategies returning a number between -1 and 1 like the RSIMomentumEvaluator or
-                DoubleMovingAverageTrendEvaluator, values are to be understood this way:
-                <ul>
-                    <li>
-                        -1: Strong buy signal
-                    </li>
-                    <li>
-                        Between -1 and 0: Buy signal, the closer to -1 the stronger
-                    </li>
-                    <li>
-                        0: Neutral or undefined
-                    </li>
-                    <li>
-                        Between 0 and 1: Sell signal, the closer to -1 the stronger
-                    </li>
-                    <li>
-                        1: Strong sell signal
-                    </li>
-                </ul>
-            </p>
-        </div>
         <div class="container-fluid row mx-0">
             <div class="col-md-3 mb-3">
                 Evaluators :
@@ -95,6 +68,33 @@ <h1>
             {% endfor %}
           </tbody>
         </table>
+        <div class="container-fluid alert alert-info mx-0 mt-2" role="alert">
+            <p>
+                <i class="fa-regular fa-lightbulb"></i>
+                The matrix view shows the current value of each active evaluator and strategy.
+            </p>
+            <p>
+                For evaluators and strategies returning a number between -1 and 1 like the RSIMomentumEvaluator or
+                DoubleMovingAverageTrendEvaluator, values are to be understood this way:
+                <ul>
+                    <li>
+                        -1: Strong buy signal
+                    </li>
+                    <li>
+                        Between -1 and 0: Buy signal, the closer to -1 the stronger
+                    </li>
+                    <li>
+                        0: Neutral or undefined
+                    </li>
+                    <li>
+                        Between 0 and 1: Sell signal, the closer to -1 the stronger
+                    </li>
+                    <li>
+                        1: Strong sell signal
+                    </li>
+                </ul>
+            </p>
+        </div>
     </div>
 </div>
 

diff --git a/Services/Interfaces/web_interface/advanced_templates/advanced_tentacles.html b/Services/Interfaces/web_interface/advanced_templates/advanced_tentacles.html
@@ -36,8 +36,9 @@ <h2>Installed Tentacles
                         <td class="selectable_tentacle">{{tentacle.name}}</td>
                         <td class="selectable_tentacle">{{tentacle.tentacle_type}}</td>
                         <td class="selectable_tentacle">{{tentacle.version}}</td>
-                        <td class="text-center"><a class="btn fa fa-download waves-effect" onclick="update('{{tentacle.name}}')" data-toggle="tooltip" data-placement="right" title="Update tentacle"></a>
-                            <a class="btn fa fa-trash-alt waves-effect" onclick="uninstall('{{tentacle.name}}')" data-toggle="tooltip" data-placement="right" title="Uninstall tentacle"></a></td>
+                        <td class="text-center">
+                            <a class="btn btn-sm text-primary waves-effect" onclick="update('{{tentacle.name}}')" data-toggle="tooltip" data-placement="right" title="Update tentacle"><i class="fas fa-download"></i></a>
+                            <a class="btn btn-sm text-primary waves-effect" onclick="uninstall('{{tentacle.name}}')" data-toggle="tooltip" data-placement="right" title="Uninstall tentacle"><i class="fas fa-trash-alt"></i></a></td>
                     </tr>
                 {% endfor %}
               </tbody>

diff --git a/Services/Interfaces/web_interface/static/css/style.css b/Services/Interfaces/web_interface/static/css/style.css
@@ -433,12 +433,13 @@ footer.page-footer {
 .community-bot-stats-label {
   font-weight: bold;
   font-size: x-large;
-    color: var(--mdb-primary)
+  color: var(--mdb-primary);
 }
 
 .community-bot-stats {
   font-size: large;
-  background-color: #C62828;
+  color: var(--mdb-button-color);
+  background-color: var(--mdb-secondary-500);
 }
 
 .package_row_image {
@@ -649,4 +650,8 @@ table.dataTable tfoot th {
 
 .introjs-tooltip {
   background-color: rgba(000, 0, 0, 0.9);
+}
+
+.introjs-tooltip-title {
+  color: #fff;  /* avoid using h1 color */
 }
diff --git a/Services/Interfaces/web_interface/static/js/common/candlesticks.js b/Services/Interfaces/web_interface/static/js/common/candlesticks.js
@@ -314,7 +314,8 @@ function create_layout(graph_title){
         yaxis2: {
             domain: [0.2, 1],
             autorange: true,
-            title: 'Price'
+            title: 'Price',
+            gridcolor: getTextColor(),
         },
         paper_bgcolor: 'rgba(0,0,0,0)',
         plot_bgcolor: 'rgba(0,0,0,0)',

diff --git a/Services/Interfaces/web_interface/static/js/common/cst.js b/Services/Interfaces/web_interface/static/js/common/cst.js
@@ -35,7 +35,7 @@ const secondary_badge = "badge-secondary";
 const primary_badge = "badge-primary";
 const modified_badge = "badge-modified";
 const modified_class = "warning-color";
-const selected_item_class = "primary-color";
+const selected_item_class = "selected-item";
 const disabled_item_class = "d-none";
 const hidden_class = "d-none";
 const disabled_class = "disabled-item";

diff --git a/Services/Interfaces/web_interface/templates/backtesting.html b/Services/Interfaces/web_interface/templates/backtesting.html
@@ -21,7 +21,7 @@ <h2>Backtesting
     </div>
     <div class="card-body">
         {% if data_files %}
-            <table class="table table-striped table-sm table-responsive-lg" id="dataFilesTable">
+            <table class="table table-striped table-sm table-responsive-xs" id="dataFilesTable">
               <caption>Select data file(s) to use</caption>
               <thead>
                 <tr>
@@ -59,13 +59,6 @@ <h2>Backtesting
                 {% endfor %}
               </tbody>
             </table>
-            <div class="d-flex justify-content-center">
-                <a href="{{ url_for('data_collector') }}"
-                   id="data-collector-link"
-                   class="btn btn-outline-info waves-effect">
-                    <i class="fa fa-cloud-download-alt"></i> Get historical data
-                </a>
-            </div>
             {% if activated_trading_mode and activated_trading_mode.is_backtestable() %}
                 <div class="container-fluid row mx-0 mt-lg-4">
                     <div class="row col-12 col-md-3">
@@ -75,17 +68,24 @@ <h2>Backtesting
                         </div>
                     </div>
                     <div class="row justify-content-center">
-                        <div class="col-2 my-auto">
+                        <div class="offset-md-4 col-12 col-md-2 my-auto">
                             Start Date :
                             <input type="date" class="datepicker" id="startDate">
                         </div>
-                        <div class="col-2 my-auto">
+                        <div class="col-12 col-md-2 my-auto">
                             End Date :
                             <input type="date" class="datepicker" id="endDate">
                         </div>
+                        <div class="col-12 col-md-4 my-auto text-center">
+                            <a href="{{ url_for('data_collector') }}"
+                               id="data-collector-link"
+                               class="btn btn-outline-info waves-effect">
+                                <i class="fa fa-cloud-download-alt"></i> Get historical data
+                            </a>
+                        </div>
                     </div>
                     <div class="row justify-content-center mt-2">
-                        <div class="col-4 my-auto text-center">
+                        <div class="my-auto text-center">
                             <button type="button" id="startBacktesting" class="btn btn-lg btn-primary waves-effect ml-auto"
                                 start-url="/backtesting?action_type=start_backtesting&amp;source=backtesting">Start backtesting</button>
                         </div>

diff --git a/Services/Interfaces/web_interface/templates/components/community/bot_selector.html b/Services/Interfaces/web_interface/templates/components/community/bot_selector.html
@@ -5,7 +5,7 @@ <h4>
     </h4>
     <div id="bot-selector" data-update-url="{{ url_for('api.select_bot') }}">
         {% for bot in all_user_bots %}
-        <div class="row">
+        <div class="row my-2">
             <div class="col-8">
                 {{ bot["name"] }}
             </div>

diff --git a/Services/Interfaces/web_interface/templates/components/config/evaluator_card.html b/Services/Interfaces/web_interface/templates/components/config/evaluator_card.html
@@ -2,7 +2,7 @@
 
 {% macro config_evaluator_card(startup_config, evaluator_name, info, config_type, strategy=False, include_modal=True) %}
     <a href="#" onclick="return false;"
-       class="col-md-6 col-lg-4 list-group-item list-group-item-action waves-effect {{ 'd-none' if strategy }} {{'list-group-item-success' if info['activation'] else 'list-group-item-light'}} config-element hover_anim"
+       class="col-md-6 col-lg-4 p-1 rounded list-group-item waves-effect {{ 'd-none' if strategy }} {{'list-group-item-success' if info['activation'] else 'list-group-item-light'}} config-element"
        id={{ evaluator_name }} name={{ evaluator_name }}
        config-type="{{config_type}}" config-key={{evaluator_name}} current-value={{info['activation']}} config-value={{info['activation']}} startup-config-value={{startup_config[evaluator_name]}}
        requirements="{{info['requirements']}}"
@@ -16,12 +16,15 @@
             </i>
         </span>
         {% endif %}
-        {{ evaluator_name }}
+        <span class="ps-2">
+            {{ evaluator_name }}
+        </span>
+
         <span class="float-right">
             <span class="badge {{'badge-warning' if (evaluator_name in startup_config and startup_config[evaluator_name] != info['activation']) else ('badge-success' if info['activation'] else 'badge-secondary')}}">
                 {{('Activation pending restart' if info['activation'] else 'Deactivation pending restart') if (evaluator_name in startup_config and startup_config[evaluator_name] != info['activation']) else ('Activated' if info['activation'] else 'Deactivated')}}
             </span>
-            <button class="btn btn-outline-primary btn-md waves-effect" data-toggle="modal" data-target="#{{evaluator_name}}Modal" no-activation-click="true"><i class="fa fa-info-circle" no-activation-click="true"></i></button>
+            <button class="btn btn-outline-primary btn-md waves-effect" data-toggle="modal" data-target="#{{evaluator_name}}Modal" no-activation-click="true"><i class="fas fa-cog" no-activation-click="true"></i></button>
         </span>
     </a>
     {% if include_modal %}
@@ -31,13 +34,15 @@
 
 {% macro tentacle_evaluator_card(startup_config, evaluator_name, info, config_type, strategy=False) %}
     <a href="#" onclick="return false;"
-       class="col-md-6 col-lg-4 list-group-item list-group-item-action waves-effect {{'list-group-item-success' if info['activation'] else 'list-group-item-light'}} config-element hover_anim"
+       class="col-md-6 col-lg-4 p-1 rounded list-group-item waves-effect {{'list-group-item-success' if info['activation'] else 'list-group-item-light'}} config-element hover_anim"
        id={{evaluator_name}} name={{ evaluator_name }}
        config-type={{config_type}} config-key={{evaluator_name}} current-value={{info['activation']}} config-value={{info['activation']}} startup-config-value={{startup_config[evaluator_name]}}
        requirements="{{info['requirements']}}"
        default-elements="{{info['default-config']}}"
        requirements-min-count="{{info['requirements-min-count']}}">
-        {{ evaluator_name }}
+        <span class="ps-2">
+            {{ evaluator_name }}
+        </span>
         <span class="float-right">
             <span class="badge {{'badge-warning' if startup_config[evaluator_name] != info['activation'] else ('badge-success' if info['activation'] else 'badge-secondary')}}">
                 {{('Activation pending restart' if info['activation'] else 'Deactivation pending restart') if startup_config[evaluator_name] != info['activation'] else ('Activated' if info['activation'] else 'Deactivated')}}

diff --git a/Services/Interfaces/web_interface/templates/components/config/tentacle_card.html b/Services/Interfaces/web_interface/templates/components/config/tentacle_card.html
@@ -2,12 +2,14 @@
 
 {% macro config_tentacle_card(name, info, can_be_disabled) %}
     <a href="#" onclick="return false;"
-       class="col-md-6 col-lg-4 list-group-item list-group-item-action waves-effect {{'list-group-item-success' if info['activation'] else 'list-group-item-light'}} config-element hover_anim"
+       class="col-md-6 col-lg-4 p-1 rounded list-group-item waves-effect {{'list-group-item-success' if info['activation'] else 'list-group-item-light'}} config-element"
        id="{{ name }}" name="{{ name }}"
        config-type="tentacle_config" config-key={{name}} current-value={{info['activation']}} config-value={{info['activation']}} startup-config-value={{info['startup_config']}}
        {{ "no-activation-click='true'" if not can_be_disabled}}
     >
-        {{ name }}
+        <span class="ps-2">
+            {{ name }}
+        </span>
         <span class="float-right">
             <span class="badge {{'badge-warning' if info['startup_config'] != info['activation'] else ('badge-success' if info['activation'] else 'badge-secondary')}}">
                 {{('Activation pending restart' if info['activation'] else 'Deactivation pending restart') if info['startup_config'] != info['activation'] else ('Activated' if info['activation'] else 'Deactivated')}}