Преглед изворни кода

Implemented web upload
Closes #50 and #70

Sergio Brighenti пре 5 година
родитељ
комит
310b40767c

+ 1 - 0
app/Factories/ViewFactory.php

@@ -33,6 +33,7 @@ class ViewFactory
         $twig->addGlobal('alerts', $container->get('session')->getAlert());
         $twig->addGlobal('session', $container->get('session')->all());
         $twig->addGlobal('current_lang', $container->get('lang')->getLang());
+        $twig->addGlobal('maxUploadSize', stringToBytes(ini_get('post_max_size')));
         $twig->addGlobal('PLATFORM_VERSION', PLATFORM_VERSION);
 
         $twig->addFunction(new TwigFunction('route', 'route'));

+ 1 - 1
app/Web/Lang.php

@@ -85,7 +85,7 @@ class Lang
             $dict = include $file;
 
             $count = count($dict) - 1;
-            $percent = round(($count / $default) * 100);
+            $percent = min(round(($count / $default) * 100), 100);
 
             $languages[str_replace('.lang.php', '', basename($file))] = "[{$percent}%] ".$dict['lang'];
         }

+ 1 - 0
resources/lang/en.lang.php

@@ -101,4 +101,5 @@ return [
     'lang_set' => 'System language enforced to "%s"',
     'prerelease_channel' => 'Prerelease Channel',
     'no_upload_token' => 'You don\'t have a personal upload token. (Generate one and try again)',
+    'drop_to_upload' => 'Click or drop your files here to upload.',
 ];

+ 1 - 0
resources/lang/it.lang.php

@@ -101,4 +101,5 @@ return [
     'lang_set' => 'Lingua di sistema applicata a "%s"',
     'prerelease_channel' => 'Canale prerelease',
     'no_upload_token' => 'Non hai un token personale per l\'upload associato. (Generane uno e riprova)',
+    'drop_to_upload' => 'Clicca o lascia i tuoi file qui per caricarli.',
 ];

+ 8 - 4
resources/templates/base.twig

@@ -19,16 +19,20 @@
     <link href="{{ asset('/static/plyr/plyr.css') }}" rel="stylesheet">
     <link href="{{ asset('/static/dropzone/dropzone.min.css') }}" rel="stylesheet">
     <link href="{{ asset('/static/app/app.css') }}" rel="stylesheet">
-    <script>window.AppConfig = {'base_url': '{{ config.base_url }}', 'lang': {'publish': '{{ lang('publish') }}', 'hide': '{{ lang('hide') }}'}}</script>
+    <script>
+        window.AppConfig = {
+            'base_url': '{{ config.base_url }}',
+            'max_upload_size': {{ maxUploadSize }},
+            'lang': {'publish': '{{ lang('publish') }}', 'hide': '{{ lang('hide') }}', 'dropzone': '{{ lang('drop_to_upload') }}'}
+        }
+    </script>
     {% block head %}{% endblock %}
 </head>
 <body class="bg-light">
 {% block content %}{% endblock %}
 {% block footer %}
     <div class="container-fluid footer" style="display: none; font-size: 0.8rem">
-        <div class="text-muted">Proudly powered by <a href="https://github.com/SergiX44/XBackBone">XBackBone{% if session.admin %} v{{ PLATFORM_VERSION }}{% endif %}</a>
-                                — <i class="fas fa-fw fa-balance-scale"></i> AGPL v3.0
-        </div>
+        <div class="text-muted">Proudly powered by <a href="https://github.com/SergiX44/XBackBone">XBackBone{% if session.admin %} v{{ PLATFORM_VERSION }}{% endif %}</a> — <i class="fas fa-fw fa-balance-scale"></i> AGPL v3.0</div>
     </div>
 {% endblock %}
 <script src="{{ asset('/static/jquery/jquery.min.js') }}"></script>

+ 1 - 1
resources/templates/upload/public.twig

@@ -63,7 +63,7 @@
                         </div>
                     </div>
                 {% elseif type is same as ('audio') %}
-                    <div class="media-player">
+                    <div class="media-player media-audio">
                         <audio id="player" autoplay controls loop preload="auto">
                             <source src="{{ urlFor('/' ~ media.user_code ~ '/' ~ media.code ~ '.' ~ extension ~ '/raw') }}" type="{{ media.mimetype }}">
                             Your browser does not support HTML5 audio.

+ 21 - 2
src/css/app.css

@@ -82,18 +82,37 @@ body {
     text-align: right;
 }
 
-@media (min-width: 576px) {
+@media (max-width: 576px) {
     .media-player {
         width: 100%;
         margin-right: auto;
         margin-left: auto;
     }
+
+    .media-audio {
+        margin-top: 40vh;
+    }
 }
 
 @media (min-width: 768px) {
     .media-player {
-        width: 78%;
+        width: 77%;
         margin-right: auto;
         margin-left: auto;
+
+    }
+
+    .media-audio {
+        margin-top: 50vh;
     }
+}
+
+.dropzone {
+    min-height: 300px;
+    border: 2px dashed rgba(0, 0, 0, 0.3);
+    padding: 20px 20px;
+}
+
+.dropzone .dz-image {
+    border-radius: .25rem !important;
 }

+ 6 - 10
src/js/app.js

@@ -1,10 +1,11 @@
 var app = {
-    init: function() {
+    init: function () {
         Dropzone.options.uploadDropzone = {
             paramName: 'upload',
-            maxFilesize: 2, // MB
-            accept: function(file, done) {
-                done('test');
+            maxFilesize: window.AppConfig.max_upload_size / Math.pow(1024, 2), // MB
+            dictDefaultMessage: window.AppConfig.lang.dropzone,
+            error: function (file, response) {
+                this.defaultOptions.error(file, response.message);
             }
         };
     },
@@ -24,12 +25,7 @@ var app = {
         });
 
         new ClipboardJS('.btn-clipboard');
-
-        var player = new Plyr($('#player'));
-        player.on('ready', function () {
-            player.volume = 0.5;
-            console.log('Player ready.');
-        });
+        new Plyr($('#player'));
 
         $('.footer').fadeIn(600);