From 4b228cccf0618b0b6a44ea4fbce78f9080000507 Mon Sep 17 00:00:00 2001 From: jr-k Date: Sat, 10 Aug 2024 15:14:58 +0200 Subject: [PATCH] wip --- data/www/scss/main.scss | 1 + data/www/scss/pages/_content-composition.scss | 176 +++++++++++++++++ data/www/scss/pages/_content.scss | 177 ------------------ docs/setup-run-on-rpi.md | 2 +- src/service/TemplateRenderer.py | 1 - system/install-studio.sh | 2 +- .../contents/edit-composition.jinja.html | 2 +- 7 files changed, 180 insertions(+), 181 deletions(-) create mode 100644 data/www/scss/pages/_content-composition.scss diff --git a/data/www/scss/main.scss b/data/www/scss/main.scss index 605cd48..4690f5f 100644 --- a/data/www/scss/main.scss +++ b/data/www/scss/main.scss @@ -31,6 +31,7 @@ // Import pages styles @import 'pages/content'; +@import 'pages/content-composition'; @import 'pages/logs'; @import 'pages/node-player'; @import 'pages/playlist'; diff --git a/data/www/scss/pages/_content-composition.scss b/data/www/scss/pages/_content-composition.scss new file mode 100644 index 0000000..a82d797 --- /dev/null +++ b/data/www/scss/pages/_content-composition.scss @@ -0,0 +1,176 @@ +.view-content-edit.view-content-edit-composition main .main-container { + + .page-panel.left-panel { + flex: 1; + + .form-holder { + margin: 20px 20px 20px 10px; + flex: 1; + } + } + + .page-content { + flex: 2; + } + + .page-panel.right-panel { + flex: 1; + } + + .toolbar { + margin: 20px; + } + + .screen-holder { + //display: flex; + //flex-direction: row; + display: flex; + flex-direction: column; + width: 100%; + position: relative; + padding-top: 56.25%; /* 16:9 aspect ratio */ + overflow: hidden; + border-radius: $baseRadius; + outline: 4px solid rgba($gscaleF, .1); + + + .screen { + background-color: #ddd; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + border: none; + + .element { + position: absolute !important; + background-color: #f0f0f0; + outline: 1px solid rgba($black, .5); + text-align: center; + box-sizing: border-box; + + &.focused { + border: none; + outline: 2px solid blue; + z-index: 89 !important; + + .ui-resizable-handle { + display: block; + } + } + + .rotate-handle { + width: 10px; + height: 10px; + background-color: red; + position: absolute; + top: 50%; + right: -15px; + cursor: pointer; + transform: translateY(-50%); + } + + .ui-resizable-handle { + background: black; + border: 1px solid #000; + width: 10px; + height: 10px; + z-index: 90; + display: none; + position: absolute; + + &.ui-resizable-nw { + cursor: nw-resize; + top: -5px; + left: -5px; + } + + &.ui-resizable-ne { + cursor: ne-resize; + top: -5px; + right: -5px; + } + + &.ui-resizable-sw { + cursor: sw-resize; + bottom: -5px; + left: -5px; + } + + &.ui-resizable-se { + cursor: se-resize; + bottom: -5px; + right: -5px; + } + } + } + } + } + + .elements-holder { + align-self: stretch; + + h3 { + font-size: 16px; + font-weight: 500; + color: $gscaleD; + text-decoration: none; + margin: 0 0 20px 0; + + &.divide { + border-top: 1px solid $gscale2; + margin-top: 10px; + padding-top: 20px; + } + } + + .form-elements-list { + background: $gscale2; + padding: 10px; + border-radius: $baseRadius; + + .element-list-item { + cursor: pointer; + padding: 5px; + border: 1px solid #ccc; + margin-bottom: 5px; + + &.focused { + background-color: #d0ebff; + } + } + } + } + + + .form-element-properties { + margin-left: 20px; + padding: 10px; + background-color: #f9f9f9; + border: 1px solid #ccc; + + form { + display: flex; + flex-direction: column; + + label, + input { + margin-bottom: 10px; + } + } + + #elementList { + h3 { + margin: 0 0 10px 0; + } + } + } + + +} + + + + + diff --git a/data/www/scss/pages/_content.scss b/data/www/scss/pages/_content.scss index f21a05d..0ccc9d1 100644 --- a/data/www/scss/pages/_content.scss +++ b/data/www/scss/pages/_content.scss @@ -89,180 +89,3 @@ } } - -.view-content-edit.view-content-edit-composition main .main-container { - - .page-panel.left-panel { - flex: 1; - - .form-holder { - margin: 20px 20px 20px 10px; - flex: 1; - } - } - - .page-content { - flex: 2; - } - - .page-panel.right-panel { - flex: 1; - } - - .toolbar { - margin: 20px; - } - - .screen-holder { - //display: flex; - //flex-direction: row; - display: flex; - flex-direction: column; - width: 100%; - position: relative; - padding-top: 56.25%; /* 16:9 aspect ratio */ - overflow: hidden; - border-radius: $baseRadius; - outline: 4px solid rgba($gscaleF, .1); - - - .screen { - background-color: #ddd; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - border: none; - - .element { - position: absolute !important; - background-color: #f0f0f0; - outline: 1px solid rgba($black, .5); - text-align: center; - box-sizing: border-box; - - &.focused { - border: none; - outline: 2px solid blue; - z-index: 89 !important; - - .ui-resizable-handle { - display: block; - } - } - - .rotate-handle { - width: 10px; - height: 10px; - background-color: red; - position: absolute; - top: 50%; - right: -15px; - cursor: pointer; - transform: translateY(-50%); - } - - .ui-resizable-handle { - background: black; - border: 1px solid #000; - width: 10px; - height: 10px; - z-index: 90; - display: none; - position: absolute; - - &.ui-resizable-nw { - cursor: nw-resize; - top: -5px; - left: -5px; - } - - &.ui-resizable-ne { - cursor: ne-resize; - top: -5px; - right: -5px; - } - - &.ui-resizable-sw { - cursor: sw-resize; - bottom: -5px; - left: -5px; - } - - &.ui-resizable-se { - cursor: se-resize; - bottom: -5px; - right: -5px; - } - } - } - } - } - - .elements-holder { - align-self: stretch; - - h3 { - font-size: 16px; - font-weight: 500; - color: $gscaleD; - text-decoration: none; - margin: 0 0 20px 0; - - &.divide { - border-top: 1px solid $gscale2; - margin-top: 10px; - padding-top: 20px; - } - } - - .form-elements-list { - background: $gscale2; - padding: 10px; - border-radius: $baseRadius; - - .element-list-item { - cursor: pointer; - padding: 5px; - border: 1px solid #ccc; - margin-bottom: 5px; - - &.focused { - background-color: #d0ebff; - } - } - } - } - - - .form-element-properties { - margin-left: 20px; - padding: 10px; - background-color: #f9f9f9; - border: 1px solid #ccc; - - form { - display: flex; - flex-direction: column; - - label, - input { - margin-bottom: 10px; - } - } - - #elementList { - h3 { - margin: 0 0 10px 0; - } - } - } - - -} - - - - - diff --git a/docs/setup-run-on-rpi.md b/docs/setup-run-on-rpi.md index 3f65665..ce82beb 100644 --- a/docs/setup-run-on-rpi.md +++ b/docs/setup-run-on-rpi.md @@ -104,7 +104,7 @@ sudo reboot 1. Just use systemctl `sudo systemctl restart obscreen-player.service` #### How to enable sound -1. First you have to reboot your device with `sudo reboot` +1. First you have to reboot your device if you never did after obscreen player installation; with command `sudo reboot` 2. You have to set audio channel to HDMI `sudo raspi-config nonint do_audio 1` (0 is for jack 3.5 output) --- diff --git a/src/service/TemplateRenderer.py b/src/service/TemplateRenderer.py index 133461a..5c86a8d 100644 --- a/src/service/TemplateRenderer.py +++ b/src/service/TemplateRenderer.py @@ -42,7 +42,6 @@ class TemplateRenderer: external_url=self._model_store.variable().map().get('external_url').as_string().strip('/'), last_pillmenu_fleet=self._model_store.variable().map().get('last_pillmenu_fleet').as_string(), last_pillmenu_security=self._model_store.variable().map().get('last_pillmenu_security').as_string(), - external_url=self._model_store.variable().map().get('external_url').as_string(), track_created=self._model_store.user().track_user_created, track_updated=self._model_store.user().track_user_updated, PORT=self._model_store.config().map().get('port'), diff --git a/system/install-studio.sh b/system/install-studio.sh index 95a7b15..9ab5c82 100755 --- a/system/install-studio.sh +++ b/system/install-studio.sh @@ -42,7 +42,7 @@ usermod -aG plugdev $OWNER # Automount script for external storage # ============================================================ -curl https://raw.githubusercontent.com/jr-k/obscreen/master/system/external-storage/10-obscreen-media-automount.rules | sed "s#/home/pi#$WORKING_DIR#g" | tee /etc/udev/rules.d/10-obscreen-media-automount.rules +curl https://raw.githubusercontent.com/jr-k/obscreen/master/system/external-storage/10-obscreen-media-automount.rules | sed "s#/home/pi#$WORKING_DIR#g" | tee /etc/udev/rules.d/10-obscreen-media-automount.rules udevadm control --reload-rules systemctl restart udev udevadm trigger diff --git a/views/slideshow/contents/edit-composition.jinja.html b/views/slideshow/contents/edit-composition.jinja.html index b39df04..37689be 100644 --- a/views/slideshow/contents/edit-composition.jinja.html +++ b/views/slideshow/contents/edit-composition.jinja.html @@ -15,7 +15,7 @@ - {# #} + {# #} {{ HOOK(H_SLIDESHOW_CONTENT_JAVASCRIPT) }} {% endblock %}