isort

deploy/docker/entrypoint.sh

@@ -28,7 +28,8 @@ else
 fi
 
 # We should do this only for folders that have a different owner, since it is an expensive operation
-find /home/mediacms.io/ ! \( -user www-data -group $TARGET_GID \) -exec chown www-data:$TARGET_GID {} +
+# Also ignoring .git folder to fix this issue https://github.com/mediacms-io/mediacms/issues/934
+find /home/mediacms.io/mediacms ! \( -path "*.git*" \) -exec chown www-data:$TARGET_GID {} +
 
 chmod +x /home/mediacms.io/mediacms/deploy/docker/start.sh /home/mediacms.io/mediacms/deploy/docker/prestart.sh
 

docker-compose-dev.yaml

@@ -57,7 +57,7 @@ services:
       POSTGRES_DB: mediacms
       TZ: Europe/London
     healthcheck:
-      test: ["CMD-SHELL", "pg_isready", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
+      test: ["CMD-SHELL", "pg_isready -d $${POSTGRES_DB} -U $${POSTGRES_USER}", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
       interval: 10s
       timeout: 5s
       retries: 5

docker-compose-http-proxy.yaml

@@ -78,7 +78,7 @@ services:
       POSTGRES_DB: mediacms
       TZ: Europe/London
     healthcheck:
-      test: ["CMD-SHELL", "pg_isready", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
+      test: ["CMD-SHELL", "pg_isready -d $${POSTGRES_DB} -U $${POSTGRES_USER}", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
       interval: 10s
       timeout: 5s
       retries: 5

docker-compose-https-proxy.yaml

@@ -80,7 +80,7 @@ services:
       POSTGRES_DB: mediacms
       TZ: Europe/London
     healthcheck:
-      test: ["CMD-SHELL", "pg_isready", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
+      test: ["CMD-SHELL", "pg_isready -d $${POSTGRES_DB} -U $${POSTGRES_USER}", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
       interval: 10s
       timeout: 5s
       retries: 5

docker-compose-letsencrypt.yaml

@@ -100,7 +100,7 @@ services:
       POSTGRES_DB: mediacms
       TZ: Europe/London
     healthcheck:
-      test: ["CMD-SHELL", "pg_isready", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
+      test: ["CMD-SHELL", "pg_isready -d $${POSTGRES_DB} -U $${POSTGRES_USER}", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
       interval: 30s
       timeout: 10s
       retries: 5

docker-compose-named-volumes.yaml

@@ -76,7 +76,7 @@ services:
       POSTGRES_DB: mediacms
       TZ: Europe/London
     healthcheck:
-      test: ["CMD-SHELL", "pg_isready", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
+      test: ["CMD-SHELL", "pg_isready -d $${POSTGRES_DB} -U $${POSTGRES_USER}", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
       interval: 30s
       timeout: 10s
       retries: 5

docker-compose.yaml

@@ -72,7 +72,7 @@ services:
       POSTGRES_DB: mediacms
       TZ: Europe/London
     healthcheck:
-      test: ["CMD-SHELL", "pg_isready", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
+      test: ["CMD-SHELL",  "pg_isready -d $${POSTGRES_DB} -U $${POSTGRES_USER}", "--host=db", "--dbname=$POSTGRES_DB", "--username=$POSTGRES_USER"]
       interval: 10s
       timeout: 5s
       retries: 5

docs/admins_docs.md

@@ -19,6 +19,7 @@
 - [16. Frequently Asked Questions](#16-frequently-asked-questions)
 - [17. Cookie consent code](#17-cookie-consent-code)
 - [18. Disable encoding and show only original file](#18-disable-encoding-and-show-only-original-file)
+- [19. Rounded corners on videos](#19-rounded-corners)
 
 ## 1. Welcome
 This page is created for MediaCMS administrators that are responsible for setting up the software, maintaining it and making modifications.
@@ -778,4 +779,15 @@ When videos are uploaded, they are getting encoded to multiple resolutions, a pr
 DO_NOT_TRANSCODE_VIDEO = True
 ```
 
-This will disable the transcoding process and only the original file will be shown. Note that this will also disable the sprites file creation, so you will not have the preview thumbnails on the video player.
+This will disable the transcoding process and only the original file will be shown. Note that this will also disable the sprites file creation, so you will not have the preview thumbnails on the video player.
+
+## 19. Rounded corners on videos
+
+By default the video player and media items are now having rounded corners, on larger screens (not in mobile). If you don't like this change, remove the `border-radius` added on the following files:
+
+```
+frontend/src/static/css/_extra.css
+frontend/src/static/js/components/list-item/Item.scss
+frontend/src/static/js/components/media-page/MediaPage.scss
+```
+you now have to re-run the frontend build in order to see the changes (check docs/dev_exp.md)

files/views.py

@@ -598,14 +598,15 @@ class MediaDetail(APIView):
         media = self.get_object(friendly_token)
         if isinstance(media, Response):
             return media
-
         serializer = MediaSerializer(media, data=request.data, context={"request": request})
         if serializer.is_valid():
-            if request.data.get('media_file'):
+            serializer.save(user=request.user)
-                media_file = request.data["media_file"]
+            # no need to update the media file itself, only the metadata
-                serializer.save(user=request.user, media_file=media_file)
+            # if request.data.get('media_file'):
-            else:
+            #    media_file = request.data["media_file"]
-                serializer.save(user=request.user)
+            #    serializer.save(user=request.user, media_file=media_file)
+            # else:
+            #    serializer.save(user=request.user)
             return Response(serializer.data, status=status.HTTP_201_CREATED)
         return Response(serializer.errors, status=status.HTTP_400_BAD_REQUEST)
 

frontend/packages/player/dist/mediacms-player.css

@@ -61,8 +61,8 @@
 /* SPACES */
 /* ANIMATIONS */
 /* FUNCTIONS */
-/*@function calc_($expression) {
+/*@function calc_($expression) {
-    @return $expression;
+    @return $expression;
 }*/
 /*  ANIMATION KEYFRAMES */
 @keyframes onHoverFullscreenToggle {
@@ -232,11 +232,11 @@
   outline-color: rgba(0, 0, 0, 0);
   outline-color: transparent;
   /* Doesn't work properly in Safari browser.*/
-  /*&.vjs-loading-video {
+  /*&.vjs-loading-video {
-        video {
+        video {
-            opacity: 0;
+            opacity: 0;
-            visibility: hidden;
+            visibility: hidden;
-        }
+        }
     }*/ }
   .video-js.vjs-mediacms video {
     width: 100%;
@@ -321,11 +321,11 @@
     display: none;
     font-size: 0.8125em;
     z-index: +1;
-    /*display:block;
+    /*display:block;
-        opacity: 0;
+        opacity: 0;
-        height:0;
+        height:0;
-        visibility: hidden;
+        visibility: hidden;
-        @include transition( opacity 0.25s cubic-bezier(0.0,0.0,0.2,1) );
+        @include transition( opacity 0.25s cubic-bezier(0.0,0.0,0.2,1) );
         will-change:height;*/ }
     .video-js.vjs-mediacms .vjs-settings-panel .vjs-setting-panel-title > [role='button'] {
       position: relative; }
@@ -337,8 +337,8 @@
       outline: 0; }
     .video-js.vjs-mediacms .vjs-settings-panel.vjs-visible-panel {
       display: block;
-      /*opacity: 1;
+      /*opacity: 1;
-            visibility: visible;
+            visibility: visible;
             height:auto;*/ }
     .video-js.vjs-mediacms .vjs-settings-panel .vjs-settings-panel-inner {
       display: block;
@@ -679,7 +679,7 @@
   .video-js.vjs-mediacms .vjs-volume-panel .vjs-volume-control.vjs-slider-active.vjs-volume-horizontal {
     transition: width 0.2s linear;
     transition-delay: 0.15s;
-    /* transition: width 0s linear;
+    /* transition: width 0s linear;
             transition-delay: 0s; */ }
   .video-js.vjs-mediacms .vjs-actions-anim {
     -webkit-user-select: none;
@@ -986,31 +986,31 @@
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     white-space: normal;
-    /*@-moz-document url-prefix() {
+    /*@-moz-document url-prefix() {
-
+
-        position: relative;
+        position: relative;
-        padding-right: $font-size * 1.1;
+        padding-right: $font-size * 1.1;
-        overflow: hidden;
+        overflow: hidden;
-
+
-        &:before {
+        &:before {
-            background-color: $bg-color;
+            background-color: $bg-color;
-            bottom: 0;
+            bottom: 0;
-            position: absolute;
+            position: absolute;
-            right: 0;
+            right: 0;
-            float: right;
+            float: right;
-            text-align:right;
+            text-align:right;
-            content: '\2026';
+            content: '\2026';
-            width: $font-size * 1.1;
+            width: $font-size * 1.1;
-        }
+        }
-
+
-        &:after {
+        &:after {
-            content: '';
+            content: '';
-            position: absolute;
+            position: absolute;
-            height: 100%;
+            height: 100%;
-            width: 100%;
+            width: 100%;
-            z-index: +1;
+            z-index: +1;
-            background: $bg-color;
+            background: $bg-color;
-        }
+        }
     }*/
     color: #eee; }
     .video-js.vjs-mediacms .vjs-corner-layer .title-link:hover {
@@ -1057,28 +1057,28 @@
   .video-js.vjs-mediacms:hover .vjs-big-play-button {
     background-color: #009933; }
 
-/* @-webkit-keyframes vjs-poster-reveal {
+/* @-webkit-keyframes vjs-poster-reveal {
-    0%{
+    0%{
-        opacity:0;
+        opacity:0;
-    }
+    }
-    40%{
+    40%{
-        opacity:0;
+        opacity:0;
-    }
+    }
-    100%{
+    100%{
-        opacity:1;
+        opacity:1;
-    }
+    }
-}
+}
-
+
-@keyframes vjs-poster-reveal {
+@keyframes vjs-poster-reveal {
-    0%{
+    0%{
-        opacity:0;
+        opacity:0;
-    }
+    }
-    40%{
+    40%{
-        opacity:0;
+        opacity:0;
-    }
+    }
-    100%{
+    100%{
-        opacity:1;
+        opacity:1;
-    }
+    }
 } */
 .video-js.vjs-mediacms .vjs-progress-control .vjs-mouse-display .vjs-time-tooltip,
 .video-js.vjs-mediacms .vjs-preview-thumb .vjs-preview-thumb-time-display {

frontend/packages/vjs-plugin/dist/mediacms-vjs-plugin.css

@@ -61,8 +61,8 @@
 /* SPACES */
 /* ANIMATIONS */
 /* FUNCTIONS */
-/*@function calc_($expression) {
+/*@function calc_($expression) {
-    @return $expression;
+    @return $expression;
 }*/
 /*  ANIMATION KEYFRAMES */
 @keyframes onHoverFullscreenToggle {
@@ -232,11 +232,11 @@
   outline-color: rgba(0, 0, 0, 0);
   outline-color: transparent;
   /* Doesn't work properly in Safari browser.*/
-  /*&.vjs-loading-video {
+  /*&.vjs-loading-video {
-        video {
+        video {
-            opacity: 0;
+            opacity: 0;
-            visibility: hidden;
+            visibility: hidden;
-        }
+        }
     }*/ }
   .video-js.vjs-mediacms video {
     width: 100%;
@@ -321,11 +321,11 @@
     display: none;
     font-size: 0.8125em;
     z-index: +1;
-    /*display:block;
+    /*display:block;
-        opacity: 0;
+        opacity: 0;
-        height:0;
+        height:0;
-        visibility: hidden;
+        visibility: hidden;
-        @include transition( opacity 0.25s cubic-bezier(0.0,0.0,0.2,1) );
+        @include transition( opacity 0.25s cubic-bezier(0.0,0.0,0.2,1) );
         will-change:height;*/ }
     .video-js.vjs-mediacms .vjs-settings-panel .vjs-setting-panel-title > [role='button'] {
       position: relative; }
@@ -337,8 +337,8 @@
       outline: 0; }
     .video-js.vjs-mediacms .vjs-settings-panel.vjs-visible-panel {
       display: block;
-      /*opacity: 1;
+      /*opacity: 1;
-            visibility: visible;
+            visibility: visible;
             height:auto;*/ }
     .video-js.vjs-mediacms .vjs-settings-panel .vjs-settings-panel-inner {
       display: block;
@@ -679,7 +679,7 @@
   .video-js.vjs-mediacms .vjs-volume-panel .vjs-volume-control.vjs-slider-active.vjs-volume-horizontal {
     transition: width 0.2s linear;
     transition-delay: 0.15s;
-    /* transition: width 0s linear;
+    /* transition: width 0s linear;
             transition-delay: 0s; */ }
   .video-js.vjs-mediacms .vjs-actions-anim {
     -webkit-user-select: none;
@@ -986,31 +986,31 @@
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     white-space: normal;
-    /*@-moz-document url-prefix() {
+    /*@-moz-document url-prefix() {
-
+
-        position: relative;
+        position: relative;
-        padding-right: $font-size * 1.1;
+        padding-right: $font-size * 1.1;
-        overflow: hidden;
+        overflow: hidden;
-
+
-        &:before {
+        &:before {
-            background-color: $bg-color;
+            background-color: $bg-color;
-            bottom: 0;
+            bottom: 0;
-            position: absolute;
+            position: absolute;
-            right: 0;
+            right: 0;
-            float: right;
+            float: right;
-            text-align:right;
+            text-align:right;
-            content: '\2026';
+            content: '\2026';
-            width: $font-size * 1.1;
+            width: $font-size * 1.1;
-        }
+        }
-
+
-        &:after {
+        &:after {
-            content: '';
+            content: '';
-            position: absolute;
+            position: absolute;
-            height: 100%;
+            height: 100%;
-            width: 100%;
+            width: 100%;
-            z-index: +1;
+            z-index: +1;
-            background: $bg-color;
+            background: $bg-color;
-        }
+        }
     }*/
     color: #eee; }
     .video-js.vjs-mediacms .vjs-corner-layer .title-link:hover {
@@ -1057,28 +1057,28 @@
   .video-js.vjs-mediacms:hover .vjs-big-play-button {
     background-color: #009933; }
 
-/* @-webkit-keyframes vjs-poster-reveal {
+/* @-webkit-keyframes vjs-poster-reveal {
-    0%{
+    0%{
-        opacity:0;
+        opacity:0;
-    }
+    }
-    40%{
+    40%{
-        opacity:0;
+        opacity:0;
-    }
+    }
-    100%{
+    100%{
-        opacity:1;
+        opacity:1;
-    }
+    }
-}
+}
-
+
-@keyframes vjs-poster-reveal {
+@keyframes vjs-poster-reveal {
-    0%{
+    0%{
-        opacity:0;
+        opacity:0;
-    }
+    }
-    40%{
+    40%{
-        opacity:0;
+        opacity:0;
-    }
+    }
-    100%{
+    100%{
-        opacity:1;
+        opacity:1;
-    }
+    }
 } */
 .video-js.vjs-mediacms .vjs-progress-control .vjs-mouse-display .vjs-time-tooltip,
 .video-js.vjs-mediacms .vjs-preview-thumb .vjs-preview-thumb-time-display {

frontend/src/static/css/_extra.css

@@ -0,0 +1,15 @@
+body {
+  /* THIS is not a good way to handle this, and a proper refactoring needs to be performed
+    This allows bigger images of media on listings for large screens
+    It would be great to adapt to other sizes, but this requires a good refaftoring
+     */
+
+  @media screen and (min-width: 2200px) {
+      --default-item-width: 342px !important;
+      --default-max-item-width: 342px !important;
+      --default-item-margin-right-width: 17px !important;
+      --default-item-margin-bottom-width: 27px !important;
+  }
+}
+
+

frontend/src/static/js/components/list-item/Item.scss

@@ -13,6 +13,11 @@
 
 .item-thumb,
 a.item-thumb {
+
+  @media screen and (min-width: 480px) {
+    border-radius: 10px;
+  }
+
   position: relative;
   display: block;
   height: auto;

frontend/src/static/js/components/media-actions/MediaMoreOptionsIcon.jsx

@@ -22,7 +22,7 @@ function downloadOptions(mediaData, allowDownload) {
       if (Object.keys(encodingsInfo[k]).length) {
         for (g in encodingsInfo[k]) {
           if (encodingsInfo[k].hasOwnProperty(g)) {
-            if ('success' === encodingsInfo[k][g].status && 100 === encodingsInfo[k][g].progress) {
+            if ('success' === encodingsInfo[k][g].status && 100 === encodingsInfo[k][g].progress && null !== encodingsInfo[k][g].url) {
               options[encodingsInfo[k][g].title] = {
                 text: k + ' - ' + g.toUpperCase() + ' (' + encodingsInfo[k][g].size + ')',
                 link: formatInnerLink(encodingsInfo[k][g].url, site.url),

frontend/src/static/js/components/media-page/MediaPage.scss

@@ -530,7 +530,14 @@
   }
 }
 
+.viewer-container .player-container {
+  @media screen and (min-width: 480px) {
+    border-radius: 10px;
+  }
+}
+
 .viewer-container .player-container.audio-player-container {
+
   @media screen and (min-width: 480px) {
     padding-top: 0.75 * 56.25%;
   }

static/css/_extra.css

@@ -0,0 +1,15 @@
+body {
+  /* THIS is not a good way to handle this, and a proper refactoring needs to be performed
+    This allows bigger images of media on listings for large screens
+    It would be great to adapt to other sizes, but this requires a good refaftoring
+     */
+
+  @media screen and (min-width: 2200px) {
+      --default-item-width: 342px !important;
+      --default-max-item-width: 342px !important;
+      --default-item-margin-right-width: 17px !important;
+      --default-item-margin-bottom-width: 27px !important;
+  }
+}
+
+

uploader/fineuploader.py

@@ -1,4 +1,7 @@
+import os
+import re
 import shutil
+import uuid
 from io import StringIO
 from os.path import join
 
@@ -7,12 +10,26 @@ from django.conf import settings
 from . import utils
 
 
+def is_valid_uuid_format(uuid_string):
+    pattern = re.compile(r'^[a-f0-9]{8}-[a-f0-9]{4}-4[a-f0-9]{3}-[89ab][a-f0-9]{3}-[a-f0-9]{12}$', re.IGNORECASE)
+    return bool(pattern.match(uuid_string))
+
+
 class BaseFineUploader(object):
     def __init__(self, data, *args, **kwargs):
         self.data = data
-        self.total_filesize = data.get("qqtotalfilesize")
         self.filename = data.get("qqfilename")
         self.uuid = data.get("qquuid")
+
+        if not is_valid_uuid_format(self.uuid):
+            # something nasty client side could be happening here
+            # generate new uuid to ensure this is uuid
+            # not sure if this will work with the chunked uploads though
+            self.uuid = uuid.uuid4()
+
+        self.filename = os.path.basename(self.filename)
+        # avoid possibility of passing a fake path here
+
         self.file = data.get("qqfile")
         self.storage_class = settings.FILE_STORAGE
         self.real_path = None
@@ -50,7 +67,11 @@ class ChunkedFineUploader(BaseFineUploader):
         self.total_parts = data.get("qqtotalparts")
         if not isinstance(self.total_parts, int):
             self.total_parts = 1
-        self.part_index = data.get("qqpartindex")
+        qqpartindex = data.get("qqpartindex")
+        if not isinstance(qqpartindex, int):
+            # something nasty client side could be happening here
+            qqpartindex = 0
+        self.part_index = qqpartindex
 
     @property
     def chunks_path(self):
@@ -75,6 +96,7 @@ class ChunkedFineUploader(BaseFineUploader):
     def combine_chunks(self):
         # implement the same behaviour.
         self.real_path = self.storage.save(self._full_file_path, StringIO())
+
         with self.storage.open(self.real_path, "wb") as final_file:
             for i in range(self.total_parts):
                 part = join(self.chunks_path, str(i))