Merge pull request #15 from uglyrobot/video_support

New Video streaming feature

.distignore

@@ -2,7 +2,6 @@
 /.github
 /.wordpress-org
 bin
-build
 node_modules
 tests
 .distignore
@@ -18,3 +17,4 @@ package-lock.json
 phpunit.xml.dist
 README.md
 build-aws3.sh
+webpack.config.js

.github/workflows/assets.yml

@@ -2,15 +2,17 @@ name: Plugin asset/readme update
 on:
   push:
     branches:
-    - master
+      - master
 jobs:
   trunk:
-    name: Push to master
+    name: Push to main
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@master
-    - name: WordPress.org plugin asset/readme update
-      uses: 10up/action-wordpress-plugin-asset-update@stable
-      env:
-        SVN_PASSWORD: ${{ secrets.SVN_PASSWORD }}
-        SVN_USERNAME: ${{ secrets.SVN_USERNAME }}
+      - name: Checkout code
+        uses: actions/checkout@master
+
+      - name: WordPress.org plugin asset/readme update
+        uses: 10up/action-wordpress-plugin-asset-update@stable
+        env:
+          SVN_PASSWORD: ${{ secrets.SVN_PASSWORD }}
+          SVN_USERNAME: ${{ secrets.SVN_USERNAME }}

.github/workflows/main.yml

@@ -1,32 +1,36 @@
-# This is a basic workflow to help you get started with Actions
-
 name: Deploy to WordPress.org
 
 on:
-  push:
-    tags:
-      - '*'
+  release:
+    types: [ published ]
 
 jobs:
-
   build:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v2
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Build the plugin
+        run: |
+          npm install
+          npm run build
 
-    - name: WordPress Plugin Deploy
-      id: deploy
-      uses: 10up/action-wordpress-plugin-deploy@stable
-      with:
-        generate-zip: true
-      env:
-        SVN_USERNAME: ${{ secrets.SVN_USERNAME }}
-        SVN_PASSWORD: ${{ secrets.SVN_PASSWORD }}
+      - name: WordPress Plugin Deploy
+        id: deploy
+        uses: 10up/action-wordpress-plugin-deploy@stable
+        with:
+          generate-zip: true
+        env:
+          SVN_USERNAME: ${{ secrets.SVN_USERNAME }}
+          SVN_PASSWORD: ${{ secrets.SVN_PASSWORD }}
 
-    - name: Create Github release
-      uses: ncipollo/release-action@v1
-      with:
-        artifacts: ${{github.workspace}}/${{ github.event.repository.name }}.zip
-        body: ${{ github.event.head_commit.message }}
-        token: ${{ secrets.GITHUB_TOKEN }}
-        artifactContentType: application/zip
+      - name: Upload release asset
+        uses: actions/upload-release-asset@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          upload_url: ${{ github.event.release.upload_url }}
+          asset_path: ${{ steps.deploy.outputs.zip-path }}
+          asset_name: ${{ github.event.repository.name }}.zip
+          asset_content_type: application/zip

.gitignore

@@ -1,5 +1,6 @@
 /bin/
 /node_modules/
 /build/
+/inc/video/block/build/
 .idea
 .DS_Store

inc/assets/css/admin.css

@@ -13,14 +13,15 @@ body.mobile.modal-open #wpwrap {
 }
 
 .card {
-  margin-top: inherit;
-  padding: inherit;
-  min-width: inherit;
-  max-width: inherit;
-  box-shadow: inherit;
-  background: inherit;
-  box-sizing: inherit;
-  background-color: #ffffff;
+    margin-top: inherit;
+    padding: 0;
+    min-width: inherit;
+    max-width: 100%;
+    box-shadow: inherit;
+    background: inherit;
+    box-sizing: inherit;
+    background-color: #ffffff;
+    width: 100%;
 }
 
 .card-header {
@@ -67,40 +68,46 @@ body.mobile.modal-open #wpwrap {
 }
 
 .btn-info {
-  background-color: #EE7C1E;
-  border-radius: 24px;
-  border-width: 0;
+    background-color: #EE7C1E;
+    border-radius: 24px;
+    border-width: 0;
+    color: #ffffff;
 }
 
 .btn-info:hover, .btn-info:active, .btn-info:focus {
   background-color: rgba(238, 124, 30, 0.7) !important;
   border: none !important;
-  box-shadow: none !important;
+    box-shadow: none !important;
 }
 
 .btn-info:active {
-  background-color: rgba(238, 124, 30, 0.9) !important;
+    background-color: rgba(238, 124, 30, 0.9) !important;
 }
 
 .btn .dashicons {
-  font-size: 1.8rem;
-  line-height: 1;
-  margin-right: 1rem;
+    font-size: 1.5rem;
+    line-height: 1;
+    margin-right: 0.5rem;
 }
 
-.progress {
-  height: 30px;
-  border-radius: 15px;
-  padding: 5px;
+.btn-lg .dashicons {
+    font-size: 1.8rem;
+    margin-right: 1rem;
 }
 
-.progress .progress-bar {
-  background-color: rgba(38, 169, 224, 1);
-  border-radius: 10px;
+#iup-settings-page .progress {
+    height: 30px;
+    border-radius: 15px;
+    padding: 5px;
+}
+
+#iup-settings-page .progress .progress-bar {
+    background-color: rgba(38, 169, 224, 1);
+    border-radius: 10px;
 }
 
-.progress.download .progress-bar {
-  background-color: #EE7C1E;
+#iup-settings-page .progress.download .progress-bar {
+    background-color: #EE7C1E;
 }
 
 .tooltip {
@@ -139,12 +146,8 @@ body.mobile.modal-open #wpwrap {
   font-size: 25px;
 }
 
-.iup-enabled-status .dashicons-cloud-saved {
-  color: rgba(38, 169, 224, 1);
-}
-
-.iup-enabled-status .dashicons-cloud-upload {
-  color: #EE7C1E;
+.iup-enabled-status .dashicons-cloud-saved, .iup-enabled-status .dashicons-video-alt3 {
+    color: rgba(38, 169, 224, 1);
 }
 
 p.lead {
@@ -195,6 +198,56 @@ p.lead {
 }
 
 #iup-collapse-errors .list-group-item {
-  padding: 0.25rem 1.25rem;
-  margin: 0;
+    padding: 0.25rem 1.25rem;
+    margin: 0;
+}
+
+/* --------- Stream Settings--------- */
+#stream-nav-tab {
+    margin-bottom: -0.8rem;
+}
+
+li.nav-item {
+    margin-bottom: 0;
+}
+
+.form-check .form-check-input {
+    margin-top: .25em;
 }
+
+.iup-video-thumb {
+    background-size: cover;
+    background-position: 50% 50%;
+    background-repeat: no-repeat;
+    background-color: #000000;
+}
+
+.uppy-StatusBar {
+    margin-top: 2em;
+}
+
+.uppy-StatusBar-progress {
+    height: 1em;
+    background-color: #26a9e0;
+}
+
+.uppy-StatusBar::before {
+    height: 1em;
+}
+
+.uppy-StatusBar-content {
+    margin-top: 1em;
+}
+
+.uppy-StatusBar-actions {
+    margin-top: 1em;
+}
+
+.uppy-DragDrop-inner {
+    padding: 40px 20px;
+}
+
+.uppy-DragDrop-arrow {
+    width: 40px;
+    height: 40px;
+}