Merge pull request #355 from willowtreeapps/release/alpha2

Release/v1.0.0-alpha2
willowtreeapps · Aug 2, 2017 · d835769 · d835769
2 parents 304f0cd + 0a3117a
commit d835769
Show file tree

Hide file tree

Showing 53 changed files with 4,590 additions and 538 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,6 +1,7 @@
 /target
 /resources/public/js
 /resources/public/css
+/resources/temp/
 *.log
 .DS_Store
 node_modules/

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -8,14 +8,21 @@ CHANGELOG
 **Bug Fixes**
 * None
 
-## QA (3.27.2017)
+## QA
 **Enhancements**
 * None
 
 **Bug Fixes**
 * None
 
-## Master (3.29.2017)
+## Master
+**Enhancements**
+* None
+
+**Bug Fixes**
+* None
+
+## 1.0.0-alpha2 (8.2.2017)
 **Enhancements**
 * Create Game Modal
     [Emily Seibert][/emily] [#283](https://github.com/willowtreeapps/wombats-web-client/issues/283) [#93](https://github.com/willowtreeapps/wombats-web-client/issues/93)
@@ -39,6 +46,18 @@ CHANGELOG
     [C.P. Dehli][/dehli] [#303](https://github.com/willowtreeapps/wombats-web-client/issues/303)
 * Create Access Keys in Config
     [Emily Seibert][/emily] [#287](https://github.com/willowtreeapps/wombats-web-client/issues/287)
+* Output from simulator is displayed through Ace
+    [Eli Bosley][/eli] [#189](https://github.com/willowtreeapps/wombats-web-client/issues/189)
+* Date picker now shows the current time when opened
+    [Eli Bosley][/eli] [#333](https://github.com/willowtreeapps/wombats-web-client/issues/333)
+* User repositories are selectable through a dropdown.
+    [Eli Bosley][/eli] *No Issue*
+* Simulator redesigned based on updated diagrams
+    [Eli Bosley][/eli] [#289](https://github.com/willowtreeapps/wombats-web-client/issues/289)
+* Pagination displayed on the games list.
+    [Eli Bosley][/eli], [C.P. Dehli][/dehli] [#285](https://github.com/willowtreeapps/wombats-web-client/issues/285)
+* Added ability to delete games as an administrator
+    [Eli Bosley](/elibosley) #[284](https://github.com/willowtreeapps/wombats-web-client/issues/284)
 
 **Bug Fixes**
 * Fixed simulator code editing
@@ -59,6 +78,16 @@ CHANGELOG
     [C.P. Dehli][/dehli] #[307](https://github.com/willowtreeapps/wombats-web-client/issues/307)
 * Fixed Flickering of Canvas
     [CP Dehli](https://github.com/dehli) No issue created.
+* Fixed navigation to games page twice removing query params
+    [Eli Bosley](/elibosley) #[350](https://github.com/willowtreeapps/wombats-web-client/issues/350)
+* Fixed issue with minified Ace editor function calls
+    [Eli Bosley](/elibosley) #[350](https://github.com/willowtreeapps/wombats-web-client/issues/350)
+* CSS Prefixing performed automatically using autoprefixer - this is to help improve browser compatibility
+    [Eli Bosley][/eli] *No Issue*
+* Fixed issue with chat box in Safari
+    [Eli Bosley](/elibosley) *No Issue*
+* Page indicator always displayed correctly below games
+    [Eli Bosley](/elibosley) #[339](https://github.com/willowtreeapps/wombats-web-client/issues/339)
 
 ## 1.0.0-alpha1 (3.10.2017)
 **Enhancements**
@@ -75,3 +104,4 @@ CHANGELOG
 [/dehli]: https://github.com/dehli
 [/emily]: https://github.com/emilyseibert
 [/oconn]: https://github.com/oconn
+[/eli]: https://github.com/elibosley
diff --git a/externs.js b/externs.js
@@ -6,6 +6,11 @@ var ace  = {
     },
     setTheme: function() {},
     on: function() {},
-    getValue: function() {}
+    getValue: function() {},
+    setOptions: function() {},
+    getCursorPosition: function() {},
+    moveCursorToPosition: function() {},
+    resize: function() {},
+    $blockScrolling: {}
   }
 };
diff --git a/less/colors.less b/less/colors.less
@@ -3,6 +3,8 @@
 @white-10: rgba(255, 255, 255, 0.1);
 @white-20: rgba(255, 255, 255, 0.2);
 @white-30: rgba(255, 255, 255, 0.3);
+@white-45: rgba(255, 255, 255, 0.45);
+@white-50: rgba(255, 255, 255, 0.5);
 @white-80: rgba(255, 255, 255, 0.8);
 @white-90: rgba(255, 255, 255, 0.9);
 @white-two: #eeeeee;
@@ -20,6 +22,7 @@
 @background-grey: #333333;
 @hover-grey: #cccccc;
 @card-grey: #222222;
+@simulator-grey: #252525;
 @warm-grey: #a1a1a1;
 
 @wombat-dark-green: #589317;

diff --git a/less/components/cards/game-card.less b/less/components/cards/game-card.less
@@ -1,4 +1,5 @@
 @import "../../colors.less";
+@import "../simple-button.less";
 @import "../../utils/typography.less";
 @import "../../z-index.less";
 
@@ -9,6 +10,7 @@
     display: inline-flex;
     flex-flow: row wrap;
     width: 560px;
+    height: 165px;
     position: relative;
 
     // The link should take up the entire card
@@ -27,6 +29,12 @@
                 display: initial;
             }
         }
+        .game-information {
+            .delete {
+                display: block;
+                z-index: @game-card-delete-button-hover-z-idx;
+            }
+        }
     }
 
     .arena-preview {
@@ -135,6 +143,14 @@
                 }
             }
         }
+        .delete {
+            display: none;
+            .simple-button;
+            position: absolute;
+            right: 5px;
+            bottom: 5px;
+
+        }
     }
 
     &:hover {

diff --git a/less/components/chat-box.less b/less/components/chat-box.less
@@ -6,7 +6,7 @@
 .chat-box {
     display: flex;
     flex-direction: column;
-    flex-wrap: wrap;
+    flex-wrap: nowrap;
     justify-content: flex-end;
     background-color: @card-grey;
 

diff --git a/less/components/modals/wombat-modal.less b/less/components/modals/wombat-modal.less
@@ -0,0 +1,23 @@
+@import "../../colors.less";
+@import "../../objects/label.less";
+@import "../../components/inline-error.less";
+@import "../../utils/typography";
+@import "../../z-index.less";
+
+.modal-container {
+    .modal.add-wombat-modal {
+        overflow: visible;
+        .select-input {
+            ul.option-list {
+                max-height: 500%;
+                overflow: scroll;
+            }
+            .dropdown {
+                p.display-selected.disabled {
+                    background-color: @white-45;
+                }
+
+            }
+        }
+    }
+}
diff --git a/less/components/simulator/controls.less b/less/components/simulator/controls.less
@@ -0,0 +1,78 @@
+@import "../../colors.less";
+@import "../../components/simple-button.less";
+@import "../../utils/typography.less";
+
+@controls-height: 64px;
+@progress-bar-height: 6px;
+
+.simulator-controls {
+    position: relative;
+    bottom: 0;
+    display: flex;
+    width: 100%;
+    flex-grow: 1;
+
+    background-color: @card-grey;
+    .step,
+    .mini-map {
+        .simple-button;
+    }
+    .progress-bar {
+        height: @progress-bar-height;
+        width: inherit;
+        margin-right: 10px;
+        align-self: center;
+        margin-bottom: 3px;
+        position: relative;
+        background-color: @background-grey;
+
+        .filled {
+            background-color: @wombat-green;
+
+            .scrubber {
+                @scrubber-size: 18px;
+                width: @scrubber-size;
+                height: @scrubber-size;
+                background-color: @white;
+                border-radius: 100%;
+                position: absolute;
+                right: -6px;
+                top: -5px;
+                cursor: pointer;
+                cursor: hand;
+            }
+        }
+
+    }
+    .simulator-button {
+        align-self: center;
+        background-color: transparent;
+        border: transparent;
+        outline: none;
+        padding: 0;
+    }
+    .play {
+        margin: 0 10px;
+        .icon-play {
+            width: 44px;
+            height: 44px;
+        }
+    }
+    .settings {
+        margin: 20px;
+        .icon-settings {
+            width: 21px;
+            height: 22px;
+        }
+    }
+    .arrow {
+        margin: 5px;
+        .icon-arrow {
+            width: 22px;
+            height: 22px;
+            &.right {
+                transform: rotate(180deg);
+            }
+        }
+    }
+}
diff --git a/less/components/text-input.less b/less/components/text-input.less
@@ -30,8 +30,7 @@
         }
 
         &:disabled {
-            background-color: @white-90;
-            opacity: 0.5;
+            background-color: @white-45;
         }
 
         &:focus {

diff --git a/less/main.less b/less/main.less
@@ -46,7 +46,8 @@
 @import "components/modals/create-game-modal.less";
 @import "components/modals/join-wombat-modal.less";
 @import "components/modals/winner-modal.less";
-
+@import "components/modals/wombat-modal.less";
+@import "components/simulator/controls.less";
 html {
     font-family: @font-family-primary;
     font-weight: @font-weight-primary;

diff --git a/less/panels/game-play.less b/less/panels/game-play.less
@@ -8,6 +8,7 @@
     height: calc(~"100% - " @navbar-height);
 
     .left-game-play-panel {
+        height: 100%;
         &.disabled {
             #arena-canvas {
                 opacity: 0.3;
@@ -37,7 +38,7 @@
         display: flex;
         flex-direction: column;
         flex-grow: 1;
-
+        height: 100%;
         .top-panel {
             height: 60%;
             padding: 10px 19px;

diff --git a/less/panels/games.less b/less/panels/games.less
@@ -1,9 +1,16 @@
 @import "../colors.less";
+@import "../components/simple-button.less";
 @import "../utils/typography";
+@import "../components/navbar.less";
 @desktop-and-up: ~"only screen and (min-width: 1920px)";
 
 .games-panel {
-    padding: 45px 60px;
+    @padding-top: 45px;
+    padding: @padding-top 60px;
+    @panel-padding: 2 * @padding-top + @navbar-height;
+    min-height: calc(~"100% - " @panel-padding);
+    display: flex;
+    flex-direction: column;
 
     .toggles {
         display: flex;
@@ -69,8 +76,16 @@
     }
 
     .games {
+        display: flex;
+        flex-direction: column;
+        flex-grow: 1;
         padding-top: 60px;
 
+        .games-list,
+        .empty-text {
+            flex-grow: 1;
+        }
+
         .games-list {
             padding: 0;
             margin: 0 auto;
@@ -91,10 +106,49 @@
         .empty-text {
             .bold;
 
+            display: flex;
             color: @white;
             font-size: @font-size-18;
             text-align: center;
-            margin-top: 250px;
+            flex-direction: column;
+            justify-content: center;
+        }
+    }
+
+    .page-toggle {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        margin-top: 65px;
+
+        .nav-link {
+            .simple-button(transparent,
+                           @white,
+                           @white-50,
+                           20px,
+                           20px);
+
+            &.disabled {
+                color: @white-50;
+            }
+        }
+
+        .page {
+            padding: 6px 10px;
+            .simple-button(transparent,
+                           @white,
+                           @white-50,
+                           10px,
+                           10px);
+
+            &.ellipsis {
+                color: @white-50;
+                cursor: default;
+            }
+
+            &.current {
+                background-color: @wombat-green;
+            }
         }
     }
 }