Merge pull request #456 from smartdevicelink/release/0.11.0

Release 0.11.0
smartdevicelink · Oct 27, 2021 · 47e0ad4 · 47e0ad4
2 parents cd9187d + 576a6fe
commit 47e0ad4
Show file tree

Hide file tree

Showing 83 changed files with 3,796 additions and 503 deletions.
diff --git a/.github/workflows/generic_hmi_build.yml b/.github/workflows/generic_hmi_build.yml
@@ -0,0 +1,33 @@
+# This workflow will do a clean install of node dependencies and build the HMI source code
+name: HMI build check
+
+on:
+  push
+
+jobs:
+  build:
+    strategy:
+      matrix:
+        os: [ubuntu-18.04, ubuntu-20.04]
+    runs-on: ${{ matrix.os }}
+
+    steps:
+    - uses: actions/checkout@v2
+    # Npm build
+    - name: Use Node version 12
+      uses: actions/setup-node@v2
+      with:
+        node-version: '12'
+    - name: Install Dependencies
+      run: npm install
+    - name: Build
+      run: npm run build
+    # Backend server start check
+    - name: Set up Python 3
+      uses: actions/setup-python@v2
+      with:
+        python-version: '3.8.x'
+    - name: Init Submodules
+      run: git -C ${{ github.workspace }} submodule update --init --recursive
+    - name: Test Backend server startup
+      run: timeout -s SIGINT 30s ./deploy_server.sh
diff --git a/README.md b/README.md
@@ -2,7 +2,7 @@
 
 ## Get an instance of SDL Core running
 
-Note: This requires you to use Ubuntu 16.04, 18.04, or 20.04.
+Note: This requires you to use Ubuntu 18.04 or 20.04.
 
 Clone the [SDL Core repository](https://github.com/smartdevicelink/sdl_core) and follow the setup instructions for the project. After the project is built, run an instance of SDL Core in your terminal.
 
@@ -13,10 +13,11 @@ Clone the [SDL Core repository](https://github.com/smartdevicelink/sdl_core) and
 - python3 and pip
 - ffmpeg
 - ffmpeg-python
+- pyopenssl
 
 ```
 sudo apt install chromium-browser ffmpeg python3 python3-pip -y
-python3 -m pip install ffmpeg-python
+python3 -m pip install ffmpeg-python pyopenssl
 ```
 
 Check out [nvm on github](https://github.com/nvm-sh/nvm#installing-and-updating) to learn how to install and use nvm!
@@ -58,6 +59,7 @@ After running the build command, you can launch the Generic HMI in a web browser
 ```
 chromium-browser generic_hmi/build/index.html
 ```
+**NOTE** Chromium is the only supported and tested browser. Browsers built on top of Chromium (Google Chrome) should work but are not officially supported.
 
 ### HMI Backend
 

diff --git a/deploy_server.sh b/deploy_server.sh
@@ -32,24 +32,6 @@ TARGET_SCRIPT="start_server.py"
 TARGET_DIR="./python_websocket/src"
 SOURCE_DIR="./tools"
 
-SwitchSubmoduleVersion(){
-    version=$1
-    if [ -z "$version" ]; then
-        echo "Version number required"
-        return
-    fi
-
-    cwd=$(pwd)
-    cd ${TARGET_DIR}
-    if [[ -z $(git branch --list "v$version") ]]; then # Version branch does not exist
-        git checkout tags/$version -b v$version > /dev/null
-        echo "Using websockets version $version"
-    elif [[ "$(git rev-parse --abbrev-ref HEAD)" != "v$version" ]]; then # Not on version branch
-        git checkout v$version
-    fi
-    cd $cwd
-}
-
 InitSubmodules() {
     git submodule init
     git submodule update
@@ -66,11 +48,6 @@ if ! find $TARGET_DIR -mindepth 1 | read; then
     InitSubmodules
 fi
 
-python_version=$(python3 -V | awk '{print $2}')
-if [[ $? == 0 && "$python_version" < "3.6.0" ]]; then
-    SwitchSubmoduleVersion "7.0"
-fi
-
 echo "Starting HMI Backend service..."
 StartServer
 echo "HMI Backend service was stopped"

diff --git a/package.json b/package.json
@@ -6,8 +6,10 @@
   "dependencies": {
     "node-sass": "^4.14.1",
     "radium": "^0.26.0",
+    "rc-slider": "^9.7.2",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
+    "react-hot-toast": "^2.0.0",
     "react-modal": "^3.11.2",
     "react-redux": "^7.2.0",
     "react-router": "^5.2.0",

diff --git a/public/Flags.js b/public/Flags.js
@@ -7,5 +7,6 @@ window.flags = {
     CoreHost: '127.0.0.1',
     CorePort: 8087,
     CoreWebEngineAppPort: 2020,
-    AppStoreDirectoryUrl: 'https://sdl-webengine-app-store-example.s3.amazonaws.com/app-directory.json'
+    AppStoreDirectoryUrl: 'https://sdl-webengine-app-store-example.s3.amazonaws.com/app-directory.json',
+    StatusUpdateIcon: true
 };
diff --git a/public/index.html b/public/index.html
@@ -3,6 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta

diff --git a/src/css/base/_base.scss b/src/css/base/_base.scss
@@ -15,7 +15,7 @@ body {
 
 .toggle-button {
     margin-top: 20px;
-    width: 140px;
+    width: 120px;
     border: 1px solid color(black);
     border-radius: 2px;
     text-align: center;
@@ -32,7 +32,7 @@ body {
 .shutdown-button {
     margin-top: 20px;
     margin-left: 20px;
-    width: 140px;
+    width: 120px;
     border: 1px solid color(black);
     border-radius: 2px;
     text-align: center;
@@ -61,7 +61,7 @@ body {
 .driver-distraction-button {
     margin-top: 22px;
     margin-left: 20px;
-    width: 150px;
+    width: 135px;
     border-radius: 2px;
     padding: 10px 0;
     float: left;
@@ -87,4 +87,8 @@ body {
     }
 }
 
+.bg-highlighted {
+    background-color: color($secondary-accent-color);
+}
+
 $base-box-shadow: 0 20px 40px 0 rgba(color(black), 0.75);
diff --git a/src/css/base/_themes.scss b/src/css/base/_themes.scss
@@ -3,6 +3,11 @@
         background: color($primary-color);
     }
 
+    .app-bg-color {
+        background: color($primary-color);
+    }
+
+
     .app__header {
         background-image: -webkit-linear-gradient(color($secondary-color), color($primary-color));
         background-image: -o-linear-gradient(color($secondary-color), color($primary-color));
@@ -88,6 +93,10 @@
         background: color(glass);
     }
 
+    .app-bg-color {
+        background: color(glass);
+    }
+
     .app__header {
         background-image: -webkit-linear-gradient(to bottom, #ffffff, rgba(255, 255, 255, 0.0));
         background-image: -o-linear-gradient(to bottom, #ffffff, rgba(255, 255, 255, 0.0));
@@ -166,5 +175,5 @@
 
     .th-divider-color {
       background-color: #000000;
-  }
+}
 }
diff --git a/src/css/components/_alert.scss b/src/css/components/_alert.scss
@@ -8,7 +8,7 @@
     width: $master-width;
     height: $master-height;
     margin: 25px;
-    z-index:1001;
+    z-index: 1001;
 }
 
 .alertModal {
@@ -26,8 +26,7 @@
     outline: none;
     padding: 20px;
     width: 85%;
-
-  }
+}
 
 
 .alert{
@@ -37,6 +36,9 @@
 }
 
 .alert-title {
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
     text-align: center;
 
     p {
@@ -46,13 +48,22 @@
     }
 }
 
+.alert-progressIndicator {
+    width: 40px;
+    height: 40px;
+    background-image: url('../../img/icons/progressIndicator.gif');
+    background-repeat: no-repeat;
+    background-size: 40px;
+    margin-left: 10px;
+}
+
 .alert-top {
     display: flex;
     padding: 30px;
     max-height: calc((#{$master-height} - 75px) * 0.6);
 
     h4 {
-        overflow: scroll;
+        overflow: auto;
     }
 
     img {
@@ -91,6 +102,10 @@
     height: calc((#{$master-height} - 75px) / 2);
     width: 50%;
     text-align: center;
+    p {
+        overflow: hidden;
+        max-width: 100%;
+    }
 }
 
 .alert-buttons{
@@ -100,6 +115,11 @@
     @include flex-wrap(wrap);
     @include align-items(stretch);
     padding: 15px;
+    .soft-button-image, .soft-button-image-static {
+        padding: 5px;
+        max-height: 75px;
+        min-width: 75px;
+    }
 }
 
 .alert-button-1 {
@@ -110,7 +130,13 @@
     border-width: 0.154px;
     border-style: solid;
     margin: 15px;
+    overflow: hidden;
     //align-self: flex-start;
+    p {
+        max-height: 100%;
+        max-width: 100%;
+        overflow: hidden;
+    }
 
     @include display(flex);
     @include align-items(center);
@@ -125,6 +151,11 @@
     border-width: 0.154px;
     border-style: solid;
     margin: 15px;
+    p {
+        max-height: 100%;
+        max-width: 100%;
+        overflow: hidden;
+    }
 
     @include display(flex);
     @include align-items(center);
@@ -140,6 +171,12 @@
     border-width: 0.154px;
     border-style: solid;
     margin: 15px;
+    overflow: hidden;
+    p {
+        max-height: 100%;
+        max-width: 100%;
+        overflow: hidden;
+    }
 
     @include display(flex);
     @include align-items(center);
@@ -154,8 +191,18 @@
     border-width: 0.154px;
     border-style: solid;
     margin: 15px;
+    overflow: hidden;
+    .soft-button-image, .soft-button-image-static {
+        max-height: 50px;
+        min-width: 50px;
+    }
+    p {
+        max-height: 100%;
+        max-width: 100%;
+        overflow: hidden;
+    }
 
     @include display(flex);
     @include align-items(center);
     @include justify-content(center);
-}
+}
diff --git a/src/css/components/_app-header.scss b/src/css/components/_app-header.scss
@@ -12,10 +12,6 @@
 
     div {
         @include flex(1);
-        &:nth-of-type(2) {
-            text-align: center;
-        }
-
         &:nth-of-type(3) {
             text-align: right;
         }
@@ -37,6 +33,11 @@
         text-transform: uppercase;
     }
 
+    .settings-menu svg{
+        @include size(40px);
+        margin-left: 0px;
+    }
+
     .svg-wrap-secondary{
         width: 30px;
         svg{

diff --git a/src/css/components/_appstore-menu.scss b/src/css/components/_appstore-menu.scss
@@ -7,9 +7,6 @@
     flex-direction: column;
 }
 
-::-webkit-scrollbar { 
-    display: none; 
-}
 
 .appstore-menu-item {
     @include display(flex);