Krombacher-23 (#964)

* Update devapp1.yml

* not switching scene on context menu open (#968)

* Issue 967 Stage visibility (#969)

* Update package.json

* Update README.md

* not switching scene on context menu open (#968)

* fix stage visibility not persisted on table switch

* stop removing stream automatically on disconnect (#976)

* place avatar on top jitsi window (#978)

* Change message noti when sendding email (#979)

* change american flag to british flag (#983)

* resize avatar on top jitsi window (#980)

* Remove Shape, Media, Stream out of media list filter (#989)

* wait 3 minute

* fix playwright test

* Remove Stream in edit, add stream in filter (#993)

* remove shape

* change american flag to british flag

* Fix send email (#994)

* certbot renew for all three types of servers

* Dependeabot Security updates. (#998)

* Bump moment from 2.29.1 to 2.29.4 in /ui/dashboard (#997)

Bumps [moment](https://github.com/moment/moment) from 2.29.1 to 2.29.4.
- [Release notes](https://github.com/moment/moment/releases)
- [Changelog](https://github.com/moment/moment/blob/develop/CHANGELOG.md)
- [Commits](moment/moment@2.29.1...2.29.4)

---
updated-dependencies:
- dependency-name: moment
  dependency-type: direct:production
...

Signed-off-by: dependabot[bot] <support@github.com>

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

* Bump terser from 4.8.0 to 4.8.1 in /ui/dashboard (#996)

Bumps [terser](https://github.com/terser/terser) from 4.8.0 to 4.8.1.
- [Release notes](https://github.com/terser/terser/releases)
- [Changelog](https://github.com/terser/terser/blob/master/CHANGELOG.md)
- [Commits](terser/terser@v4.8.0...v4.8.1)

---
updated-dependencies:
- dependency-name: terser
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

Co-authored-by: TuyetGiang <30744004+TuyetGiang@users.noreply.github.com>
Co-authored-by: Giang <giang281197@gmail.com>
Co-authored-by: gloriajw <aagg@comcast.net>
Co-authored-by: Willadsen, Gloria (CNTR) <Gloria.Willadsen@Intelsat.com>
Co-authored-by: gloriajw <gloriajw@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

.github/workflows/devapp1.yml

@@ -6,7 +6,7 @@ name: DEVAPP1 CI
 on:
  # Triggers the workflow on push or approved pull request on R1-2021 branch
  push:
- branches: [ Stiegl-22 ]
+ branches: [ Krombacher-23 ]
 
  # Allows you to run this workflow manually from the Actions tab
  workflow_dispatch:
@@ -32,7 +32,7 @@ jobs:
  script: |
  cd /home/upstage/upstage/ui/dashboard/
  git fetch
- git checkout Stiegl-22
+ git checkout Krombacher-23
  git pull
  yarn
  yarn build:dev

.github/workflows/playwright-dev.yml

@@ -0,0 +1,30 @@
+name: Playwright Tests
+on:
+ push:
+ branches: [ Stiegl-22 ]
+ pull_request:
+ branches: [ Stiegl-22 ]
+jobs:
+ test:
+ timeout-minutes: 60
+ runs-on: ubuntu-latest
+ steps:
+ - uses: actions/checkout@v2
+ - uses: actions/setup-node@v2
+ with:
+ node-version: '14.x'
+ - name: Install dependencies
+ working-directory: ./ui/dashboard
+ run: yarn
+ - name: Install Playwright Browsers
+ working-directory: ./ui/dashboard
+ run: npx playwright install --with-deps
+ - name: Run Playwright tests
+ working-directory: ./ui/dashboard
+ run: yarn playwright test
+ - uses: actions/upload-artifact@v2
+ if: always()
+ with:
+ name: playwright-report
+ path: ui/dashboard/playwright-report/
+ retention-days: 30

.github/workflows/playwright.yml

@@ -1,9 +1,9 @@
 name: Playwright Tests
 on:
  push:
- branches: [ main, Stiegl-22 ]
+ branches: [ main ]
  pull_request:
- branches: [ main, Stiegl-22 ]
+ branches: [ main ]
 jobs:
  test:
  timeout-minutes: 60

README.md

@@ -1,6 +1,6 @@
 # UpStage
 
-[![CI](https://github.com/upstage-org/upstage/actions/workflows/devapp1.yml/badge.svg)](https://github.com/upstage-org/upstage/actions/workflows/app1.yml)
+[![CI](https://github.com/upstage-org/upstage/actions/workflows/devapp1.yml/badge.svg)](https://github.com/upstage-org/upstage/actions/workflows/devapp1.yml) [![CI](https://github.com/upstage-org/upstage/actions/workflows/playwright.yml/badge.svg)](https://github.com/upstage-org/upstage/actions/workflows/playwright.yml)
 
 UpStage is a platform for cyberformance - remote players combine digital media in real-time for an online audience. All you need is a web browser!
 

mail/mail_utils.py

@@ -58,9 +58,9 @@ def create_email(to, subject, html, filenames=[], cc=[], bcc=[], sender=EMAIL_HO
  msg = MIMEMultipart('fixed')
  with ScopedSession() as local_db_session:
  subject_prefix = local_db_session.query(Config).filter(
- Config.name == 'EMAIL_SUBJECT_PREFIX').first().value
+ Config.name == 'EMAIL_SUBJECT_PREFIX').first()
  if subject_prefix:
- subject = f'{subject_prefix}: {subject}'
+ subject = f'{subject_prefix.value}: {subject}'
  msg.preamble = subject
  msg['Subject'] = subject
  msg['From'] = f'{EMAIL_HOST_DISPLAY_NAME} <{sender}>'
@@ -108,7 +108,7 @@ def push_mail_info_to_queue(email_info):
  db[MONGODB_COLLECTION_EMAIL].insert_one(
  email_info if isinstance(email_info, dict) else email_info.__dict__)
  client.close()
- app.logger('Push email success')
+ app.logger.info('Push email success')
  except Exception as e:
  app.logger.error(f'Failed to push email to queue: {e}')
 

run_mail_queue.py

@@ -17,21 +17,21 @@ def __init__(self, logger, total_sleep_time, function_list):
 
  def wait_for_all_then_repeat(self):
  async def rerun_these_forever(loop):
- start_time = arrow.utcnow().timestamp()
+ start_time = arrow.utcnow().timestamp
  while True:
  '''
  Subtract the run time from the total sleep time, so we don't slip.
  '''
  sleep_time = self.total_sleep_time - \
- (arrow.utcnow().timestamp() - start_time)
+ (arrow.utcnow().timestamp - start_time)
  if sleep_time <= 0:
  self.logger.error(
  "Timer diff was negative, sleeping for 30 seconds")
  sleep_time = 30
  await asyncio.sleep(sleep_time)
  self.logger.info(
  f"Rerunning these processes: {pprint.pformat([x for x in self.function_list])}")
- start_time = arrow.utcnow().timestamp()
+ start_time = arrow.utcnow().timestamp
  await asyncio.wait(
  [loop.create_task(f()) for f in self.function_list]
  )

stage/schema.py

@@ -297,7 +297,7 @@ def mutate(self, info, stage_id):
  attribute = local_db_session.query(StageAttributeModel).filter(
  StageAttributeModel.stage_id == _id, StageAttributeModel.name == 'visibility').first()
  if attribute is not None:
- attribute.description = True if not attribute.description else False
+ attribute.description = True if not attribute.description else ''
  else:
  attribute = StageAttributeModel(
  stage_id=_id,

system/prod/certbot_renew_script.sh

@@ -0,0 +1,57 @@
+#!/bin/bash
+
+CERTBOT=`whereis certbot | awk '{print $2}'`
+DOMAIN=SET_THIS_TO_THE_FULL_DOMAIN_NAME_NOT_HOSTNAME
+
+#STREAMING_SERVER=
+#STREAMING_SERVER=1
+#SVC_SERVER=
+#SVC_SERVER=1
+#APP_SERVER=
+APP_SERVER=1
+
+CERTCHECK_FILE=/etc/letsencrypt/live/${DOMAIN}/cert.pem
+if [[ -n ${SVC_SERVER} ]]
+then
+ OTHER_COPY=/etc/mosquitto/ca_certificates/cert.pem
+else
+ OTHER_COPY=
+fi
+
+now_seconds=`date +%s`
+sleep 2
+$CERTBOT renew
+
+# See if certs were updated. certbot doesn't always return a 0 status when expected.
+# So ignore return code issued by certbot and do our own check.
+mod_seconds=`/usr/bin/stat -c %Y $CERTCHECK_FILE`
+
+if [[ $now_seconds -lt $mod_seconds ]]
+then
+ echo "Updating..."
+ systemctl reload nginx
+ if [[ -n ${SVC_SERVER} ]]
+ then
+ other_seconds=`/usr/bin/stat -c %Y $OTHER_COPY`
+ if [[ $other_seconds -lt $mod_seconds ]]
+ then
+ cd /etc/letsencrypt/live/${DOMAIN}
+ cp * /etc/mosquitto/ca_certificates
+ chown -R mosquitto:mosquitto /etc/mosquitto/ca_certificates
+ systemctl reload mosquitto.service >> /var/log/le-renew.log 2>&1
+ fi
+ fi
+else
+ echo "No update."
+fi
+
+if [[ -n ${APP_SERVER} ]]
+then
+ echo "Restarting anyway in case the svc1 server certs were updated."
+ systemctl restart upstage.service >> /var/log/le-renew.log 2>&1
+ systemctl restart event_archive.service >> /var/log/le-renew.log 2>&1
+elif [[ -n ${STREAMING_SERVER} ]]
+then
+ echo "Restarting our nodejs streaming service, in case streaming1 server certs were updated. This does not restart jitsi-videobridge, which uses its own cert files"
+ systemctl restart upstage-streaming.service >> /var/log/le-renew.log 2>&1
+fi

ui/dashboard/package.json

@@ -1,7 +1,7 @@
 {
  "name": "dashboard",
- "version": "1.22.0",
- "versionAlias": "Stiegl-22",
+ "version": "1.23.0",
+ "versionAlias": "Krombacher-23",
  "license": "GPL-3.0",
  "private": true,
  "scripts": {

ui/dashboard/src/components/LanguageSelector.vue

@@ -13,7 +13,7 @@
 <script setup>
 import Dropdown from './form/Dropdown.vue';
 const flags = {
- en: '🇺🇸',
+ en: '🇬🇧',
  de: '🇩🇪',
  vn: '🇻🇳',
 }

ui/dashboard/src/components/objects/Meeting/index.vue

@@ -2,7 +2,8 @@
  <div>
  <Object :object="meeting">
  <template #render>
- <div class="frame" :style="{ width: object.w + 'px', height: object.h + 'px' }">
+ <div id="meeting-room" class="frame" :style="{ width: object.w + 'px', height: object.h + 'px' }"
+ :class="activeMovable ? 'disable-pointer' : ''">
  <Loading v-if="loading" height="100%" />
  <div class="room" ref="room"></div>
  </div>
@@ -49,7 +50,9 @@ export default {
  console.log(api)
  })
 
- return { meeting, room };
+ const activeMovable = computed(() => store.getters["stage/activeMovable"]);
+
+ return { meeting, room, activeMovable };
  },
 };
 </script>
@@ -68,4 +71,8 @@ export default {
  height: 100%;
  }
 }
+
+.disable-pointer {
+ pointer-events: none;
+}
 </style>

ui/dashboard/src/components/objects/Streamer/index.vue

@@ -130,14 +130,7 @@ export default {
  if (props.object.isRTMP) {
  const fullUrl = computed(() => getSubsribeLink(props.object.url));
  useCatchup(video);
- const { playable } = useFlv(video, fullUrl);
-
- watch(playable, value => {
- console.log("playable", value);
- if (!value) {
- store.dispatch("stage/deleteObject", props.object);
- }
- })
+ useFlv(video, fullUrl);
  }
 
  const clip = (shape) => {

ui/dashboard/src/components/stage/Toolbox/Skeleton.vue

@@ -68,10 +68,12 @@ export default {
  "text",
  JSON.stringify({ object: props.data, isReal: props.real, nodrop: props.nodrop })
  );
+ document.getElementById('meeting-room').classList.add('disable-pointer')
  emit("dragstart", e);
  };
 
  const dragend = () => {
+ document.getElementById('meeting-room').classList.remove('disable-pointer')
  if (props.real) {
  store.commit("stage/SET_ACTIVE_MOVABLE", null);
  }

ui/dashboard/src/store/modules/cache.js

@@ -31,6 +31,12 @@ export default {
  },
  SET_STAGE_LIST(state, list) {
  state.stageList = list
+ },
+ UPDATE_STAGE_VISIBILITY(state, { stageId, visibility }) {
+ const stage = state.stageList.find(s => s.id === stageId);
+ if (stage) {
+ stage.visibility = visibility;
+ }
  }
  },
  actions: {

ui/dashboard/src/views/backstage/Admin/EmailNotification.vue

@@ -84,12 +84,22 @@ const send = async () => {
  if (!selectedRecipients.length && !additionalReceivers.value.trim() && !selectedBccs.length && !additionalBcc.value.trim()) {
  return notification.error('Please select at least one player or provide an email address');
  }
- await save(`Notification has been successfully sent to ${selectedRecipients.map(u => u.displayName || u.username).join(', ')}${additionalReceivers.value.trim() ? ` and ${additionalReceivers.value.trim()}` : ''}!`, {
- subject: subject.value,
- body: body.value,
- recipients: selectedRecipients.map(p => p.email).join(',').concat(additionalReceivers.value ? `,${additionalReceivers.value}` : ''),
- bcc: selectedBccs.map(p => p.email).join(',').concat(additionalBcc.value ? `,${additionalBcc.value}` : ''),
- })
+ await save(
+ `Notification has been successfully sent to ${selectedRecipients
+ .map((u) => u.displayName || u.username)
+ .concat([additionalReceivers.value.trim()])
+ .concat(selectedBccs.map((u) => u.displayName || u.username))
+ .concat([additionalBcc.value.trim()])
+ .filter(e => e)
+ .join(", ")
+ }!`,
+ {
+ subject: subject.value,
+ body: body.value,
+ recipients: selectedRecipients.map(p => p.email).join(',').concat(additionalReceivers.value ? `,${additionalReceivers.value}` : ''),
+ bcc: selectedBccs.map(p => p.email).join(',').concat(additionalBcc.value ? `,${additionalBcc.value}` : ''),
+ }
+ )
 }
 </script>
 

ui/dashboard/src/views/backstage/StageManagement/General.vue

@@ -149,6 +149,7 @@ export default {
  const store = useStore();
  const router = useRouter();
  const stage = inject("stage");
+ const clearCache = inject("clearCache");
 
  const form = reactive({
  fileLocation: '',
@@ -192,6 +193,12 @@ export default {
  try {
  await mutation();
  notification.success("Stage updated successfully!");
+ store.commit('cache/UPDATE_STAGE_VISIBILITY', {
+ stageId: form.id,
+ visibility: form.visibility
+ })
+ console.log(clearCache);
+ clearCache();
  } catch (error) {
  notification.error(error);
  }

ui/dashboard/src/views/backstage/StageManagement/index.vue

@@ -67,12 +67,13 @@ export default {
  props: ["id"],
  components: { Loading },
  setup: (props) => {
- const { nodes, loading, fetch, data, refresh } = useRequest(
+ const { nodes, loading, fetch, data, refresh, clearCache } = useRequest(
  stageGraph.getStage
  );
  const stage = useFirst(nodes);
  provide("stage", stage);
  provide("refresh", refresh);
+ provide("clearCache", clearCache);
  watch(
  () => props.id,
  () => {

ui/dashboard/tests/foyer.spec.ts

@@ -2,6 +2,7 @@ import test, { expect } from "@playwright/test";
 
 test.beforeEach(async ({ page }) => {
  await page.goto("https://dev-app1.upstage.live");
+ await new Promise(f => setTimeout(f, 3000));
 })
 
 test.describe('Foyer', () => {

ui/dashboard/tests/stage.spec.ts

@@ -2,11 +2,12 @@ import test, { expect } from "@playwright/test";
 
 test.beforeEach(async ({ page }) => {
  await page.goto("https://dev-app1.upstage.live/demo");
+ await new Promise(f => setTimeout(f, 3000));
 })
 
 test.describe('Demo Stage', () => {
  test('should have live status', async ({ page }) => {
- const status = await page.locator('.status-text').innerText();
+ const status = await page.locator('.status-text').innerText(); 
  await expect(status.toUpperCase()).toEqual('LIVE')
  })
-})
+})

ui/studio/src/components/LanguageSelector.vue

@@ -10,7 +10,7 @@
 
 <script setup>
 const flags = {
- en: '🇺🇸',
+ en: '🇬🇧',
  de: '🇩🇪',
  vn: '🇻🇳',
 }

ui/studio/src/components/media/MediaFilter.vue

@@ -184,7 +184,7 @@ const VNodes = (_: any, { attrs }: { attrs: any }) => {
  </a-select>
  <a-select allowClear showArrow filterOption mode="tags" style="min-width: 128px" placeholder="Media types"
  :loading="loading" v-model:value="types"
- :options="result ? result.mediaTypes.edges.map(e => ({ value: e.node.name, label: capitalize(e.node.name) })) : []">
+ :options="result ? result.mediaTypes.edges.filter(e => !['shape', 'media'].includes(e.node.name.toLowerCase())).map(e => ({ value: e.node.name, label: capitalize(e.node.name) })) : []">
  </a-select>
  <a-select allowClear showArrow :filterOption="handleFilterStageName" mode="tags" style="min-width: 160px"
  placeholder="Stages assigned" :loading="loading" v-model:value="stages"

ui/studio/src/components/media/MediaForm/index.vue

@@ -153,7 +153,9 @@ const { result, loading } = useQuery<StudioGraph>(gql`
 `, null, { fetchPolicy: "cache-only" })
 const mediaTypes = computed(() => {
  if (result.value?.mediaTypes) {
- return result.value.mediaTypes.edges.map(({ node }) => ({ label: capitalize(node.name), value: node.name }))
+ return result.value.mediaTypes.edges
+ .filter(({ node }) => !(editingMediaResult.value ? ['media', 'stream', 'shape'] : ['media', 'shape']).includes(node.name.toLowerCase()))
+ .map(({ node }) => ({ label: capitalize(node.name), value: node.name }))
  }
  return []
 })