Version 1.2.5

- Implemented player profiling based on hotsapi.net (show possible battle-tags and picks for players) - Various small bugfixes
ForsakenNGS · Aug 1, 2019 · ed0a3a4 · ed0a3a4
1 parent c8f6229
commit ed0a3a4
Show file tree

Hide file tree

Showing 15 changed files with 229 additions and 43 deletions.
diff --git a/gui/app.css b/gui/app.css
@@ -1,13 +1,20 @@
 .navbar-main-menu {
-  -webkit-user-select: none;
-  -webkit-app-region: drag;
+    -webkit-user-select: none;
+    -webkit-app-region: drag;
 }
+
 .navbar-main-menu .navbar-nav {
-  -webkit-app-region: no-drag;
+    -webkit-app-region: no-drag;
 }
+
 .navbar-main-menu .navbar-brand-icon {
-  height: 32px;
+    height: 32px;
 }
+
+.popover {
+    max-width: 600px;
+}
+
 .content {
     position: absolute;
     overflow: auto;
@@ -16,48 +23,59 @@
     top: 60px;
     bottom: 0;
 }
+
 .talents {
     position: absolute;
     left: 0;
     right: 0;
     bottom: 0;
     top: 0;
 }
+
 .replay-list tr i.fa.fa-plus-circle {
     display: inline;
 }
+
 .replay-list tr i.fa.fa-minus-circle {
     display: none;
 }
+
 .replay-list tr + tr.details {
     display: none;
 }
+
 .replay-list tr.expanded i.fa.fa-plus-circle {
     display: none;
 }
+
 .replay-list tr.expanded i.fa.fa-minus-circle {
     display: inline;
 }
+
 .replay-list tr.expanded + tr.details {
     display: table-row;
 }
+
 .main-flex {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
 }
+
 .main-flex .center-area {
     overflow: auto;
 }
+
 .player-hero-none {
     display: inline-block;
     min-height: 58px;
     font-size: 28px;
     text-align: center;
     background: #000000;
 }
+
 .ban-hero-none {
     display: inline-block;
     min-height: 58px;
@@ -66,10 +84,12 @@
     text-align: center;
     background: #000000;
 }
+
 .team-blue .card,
 .team-read .card {
     min-width: 92px;
 }
+
 .team-blue-bans .card-img-top,
 .team-red-bans .card-img-top {
     height: 64px;
@@ -81,6 +101,7 @@
     width: 80px;
     position: relative;
 }
+
 .provider-heroescounters .heroescounters-hero .heroescounters-sort-value {
     position: absolute;
     bottom: 2px;
@@ -92,12 +113,15 @@
 .provider-hotsdraft .bonus {
     color: #28a745;
 }
+
 .provider-hotsdraft .malus {
     color: #dc3545;
 }
+
 .provider-hotsdraft .hero {
     font-weight: bold;
 }
+
 .provider-hotsdraft .notes {
     font-size: 13px;
     line-height: 14px;
@@ -107,36 +131,44 @@
     height: 100%;
     overflow: auto;
 }
+
 .provider-icyveins iframe {
-    width:100%;
+    width: 100%;
     height: 99%;
 }
+
 .provider-icyveins a {
     color: inherit;
     font-weight: bold;
 }
+
 .provider-icyveins .spell_icon {
     max-height: 20px
 }
+
 .icyveins-hero-build-talents {
     display: flex;
     flex-direction: row;
     justify-content: center;
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier {
     display: flex;
     flex-direction: column;
     margin: 8px;
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier_subtitle {
     text-align: center;
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier_visual {
     display: flex;
     flex-direction: row;
     padding: 8px;
     justify-content: center;
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier_visual .heroes_build_talent_tier_situational,
 .icyveins-hero-build-talents .heroes_build_talent_tier_visual .heroes_build_talent_tier_yes,
 .icyveins-hero-build-talents .heroes_build_talent_tier_visual .heroes_build_talent_tier_no {
@@ -146,30 +178,37 @@
     border-radius: 2px;
     align-self: flex-end;
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier_visual .heroes_build_talent_tier_situational {
     background-color: #ffb100;
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier_visual .heroes_build_talent_tier_yes {
     background-color: #00ff00;
     width: 12px;
     height: 12px;
     align-self: flex-start;
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier_visual .heroes_build_talent_tier_no {
     background-color: rgba(0, 0, 0, 0.75);
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier > .heroes_build_talent_tier_recommended img {
     width: 64px;
     margin-bottom: 8px;
     align-self: center;
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier > .heroes_build_talent_tier_situational {
     position: relative;
     align-self: center;
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier > .heroes_build_talent_tier_situational img {
     width: 40px;
 }
+
 .icyveins-hero-build-talents .heroes_build_talent_tier > .heroes_build_talent_tier_situational .talent_marker.talent_marker_maybe {
     position: absolute;
     left: 50%;

diff --git a/gui/elements/draft.twig.html b/gui/elements/draft.twig.html
@@ -32,10 +32,19 @@ <h3 data-content="map-name">{{ gui.draft.map }}</h3>
 </div>
 <script type="text/javascript">
 jQuery(function() {
+    let playerInitTooltip = function(element) {
+        jQuery(element).find("[data-tooltip=\"player-picks\"]").each(function() {
+            jQuery(this).popover({
+                trigger: 'hover',
+                content: jQuery(this).find("script[data-content=\"player-picks\"]").html(),
+                container: this
+            });
+        });
+    };
     jQuery(document).on("player.init", function(event, element) {
-        jQuery(element).find("[data-toggle=\"tooltip\"]").tooltip();
+        playerInitTooltip(element);
     });
-    jQuery(".main-flex").find("[data-toggle=\"tooltip\"]").tooltip();
+    playerInitTooltip(".main-flex");
 });
 </script>
 {% include "../elements/correction.twig.html" %}

diff --git a/gui/elements/player.twig.html b/gui/elements/player.twig.html
@@ -17,10 +17,10 @@
             <br />
             <small>
                 {{ playerName }}
-                {% if gui.hasPlayerKnownPicks(playerName) %}
-                <a data-toggle="tooltip" data-html="true" data-placement="{% if team == "blue" %}right{% else %}left{% endif %}"
-                    title="<div class='text-left'>Recent picks:{% for playerPick in gui.getPlayerKnownPicks(playerName)|slice(0, 10) %}<br>{{ playerPick[0] }} ({{ playerPick[1] }}){% endfor %}</div>">
+                {% if recentPicks != null %}
+                <a data-html="true" data-tooltip="player-picks" data-placement="{% if team == "blue" %}right{% else %}left{% endif %}">
                     <i class="fa fa-info-circle"></i>
+                    <script data-content="player-picks" type="text/html">{% include "../elements/playerPicks.twig.html" %}</script>
                 </a>
                 {% endif %}
             </small>

diff --git a/gui/elements/playerPicks.twig.html b/gui/elements/playerPicks.twig.html
@@ -0,0 +1,11 @@
+<div class='text-left d-flex text-dark'>
+{% for battleTag, battleTagPicks in recentPicks %}
+    <div class="pr-2">
+        <b>{{ battleTag }}</b>
+        {% for playerPick in battleTagPicks|slice(0, 8) %}
+            <br>
+            {{ playerPick[0] }} ({{ playerPick[1] }})
+        {% endfor %}
+    </div>
+{% endfor %}
+</div>
diff --git a/gui/pages/config.twig.html b/gui/pages/config.twig.html
@@ -74,6 +74,22 @@ <h1>Configuration</h1>
                 <input type="text" class="form-control" id="gameStorageDir" value="{{ gui.config.gameStorageDir }}" >
             </div>
         </div>
+        <div class="form-group row">
+            <label for="googleBigQueryProject" class="col-sm-3 col-form-label">
+                Google BigQuery project id
+            </label>
+            <div class="col">
+                <input type="text" class="form-control" id="googleBigQueryProject" value="{{ gui.config.googleBigQueryProject }}" >
+            </div>
+        </div>
+        <div class="form-group row">
+            <label for="googleBigQueryAuth" class="col-sm-3 col-form-label">
+                Google BigQuery authentification file (for HotsApi.net data access)
+            </label>
+            <div class="col">
+                <input type="text" class="form-control" id="googleBigQueryAuth" value="{{ gui.config.googleBigQueryAuth }}" >
+            </div>
+        </div>
         <div class="form-group row">
             <label class="col-sm-3 col-form-label">
                 Automatic replay upload
@@ -118,6 +134,7 @@ <h1>Configuration</h1>
     jQuery(function() {
 
         const fs = require("fs");
+        const dialog = require('electron').remote.dialog;
 
         // Change language
         jQuery("#language").on("change", function() {
@@ -140,7 +157,19 @@ <h1>Configuration</h1>
             gui.setConfigOption("gameDisplay", value);
         });
         // Change game storage directory
-        jQuery("#gameStorageDir").on("change keyup", function() {
+        jQuery("#gameStorageDir").on("click", function() {
+            let value = jQuery(this).val();
+            let dialogOptions = { properties: ['openDirectory'] };
+            if (value !== "") {
+                dialogOptions.defaultPath = value;
+            }
+            dialog.showOpenDialog(dialogOptions, (result) => {
+                if (typeof result !== "undefined") {
+                    jQuery(this).val(result[0]).trigger("change");
+                }
+            });
+        });
+        jQuery("#gameStorageDir").on("change", function() {
             let value = jQuery(this).val();
             if (fs.existsSync(value)) {
                 gui.setConfigOption("gameStorageDir", (value !== "" ? value : null));
@@ -149,6 +178,33 @@ <h1>Configuration</h1>
                 jQuery(this).addClass("is-invalid").removeClass("is-valid");
             }
         });
+        // Change google BigQuery project id
+        jQuery("#googleBigQueryProject").on("change keyup", function() {
+            let value = jQuery(this).val();
+            gui.setConfigOption("googleBigQueryProject", (value !== "" ? value : null));
+        });
+        // Change google BigQuery authentification file
+        jQuery("#googleBigQueryAuth").on("click", function() {
+            let value = jQuery(this).val();
+            let dialogOptions = { properties: ['openFile'] };
+            if (value !== "") {
+                dialogOptions.defaultPath = value;
+            }
+            dialog.showOpenDialog(dialogOptions, (result) => {
+                if (typeof result !== "undefined") {
+                    jQuery(this).val(result[0]).trigger("change");
+                }
+            });
+        });
+        jQuery("#googleBigQueryAuth").on("change", function() {
+            let value = jQuery(this).val();
+            if (fs.existsSync(value)) {
+                gui.setConfigOption("googleBigQueryAuth", (value !== "" ? value : null));
+                jQuery(this).addClass("is-valid").removeClass("is-invalid");
+            } else {
+                jQuery(this).addClass("is-invalid").removeClass("is-valid");
+            }
+        });
         // Change own player name (for talent suggestions)
         jQuery("#playerName").on("change keyup", function() {
             let value = jQuery(this).val();

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hotsdrafter",
-  "version": "1.2.4",
+  "version": "1.2.5",
   "description": "Predict and support drafts for running hots matches",
   "main": "main.js",
   "scripts": {
@@ -30,16 +30,17 @@
     "@electron-forge/maker-zip": "6.0.0-beta.33",
     "@fortawesome/fontawesome-free": "^5.9.0",
     "electron": "^5.0.6",
-    "electron-builder": "^21.0.15",
-    "electron-forge-maker-appimage": "^21.1.2",
+    "electron-builder": "^21.2.0",
+    "electron-forge-maker-appimage": "^21.2.0",
     "electron-winstaller": "^3.0.4"
   },
   "dependencies": {
     "@electron-forge/publisher-github": "^6.0.0-beta.43",
+    "@google-cloud/bigquery": "^4.1.6",
     "bootstrap": "^4.3.1",
     "cheerio": "^1.0.0-rc.3",
     "electron-squirrel-startup": "^1.0.0",
-    "hots-replay": "^1.0.0",
+    "hots-replay": "^1.0.3",
     "jimp": "^0.6.4",
     "jquery": "^3.4.1",
     "popper.js": "^1.15.0",

diff --git a/src/config.js b/src/config.js
@@ -22,6 +22,8 @@ class Config {
             gameDisplay: null,
             gameStorageDir: null,
             gameImproveDetection: true,
+            googleBigQueryProject: null,
+            googleBigQueryAuth: null,
             uploadProvider_hotsapi: false
         };
         this.visible = false;