image stuff

composer.json

@@ -19,7 +19,7 @@
         "nesbot/carbon": "^1.21",
         "swiftmailer/swiftmailer": "^5.4",
         "corneltek/cliframework": "^3.0",
-        "illuminate/filesystem": "^5.2",
+        "illuminate/filesystem": "5.2.*",
         "erusev/parsedown": "^1.6",
         "matto1990/lastfm-api": "^1.5"
     },

composer.lock

@@ -4,8 +4,8 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#composer-lock-the-lock-file",
         "This file is @generated automatically"
     ],
-    "hash": "13c2ef04ff1ab1ec56de6ba0e0b6d618",
+    "hash": "f80eee61bfc9c25c95de8858dddc2fd0",
-    "content-hash": "0271a89a85f0cb235b06b4473e71a45c",
+    "content-hash": "e23f85e335836f19c5757923cf9f69c4",
     "packages": [
         {
             "name": "corneltek/class-template",
@@ -258,35 +258,35 @@
         },
         {
             "name": "doctrine/annotations",
-            "version": "v1.2.7",
+            "version": "v1.3.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/doctrine/annotations.git",
-                "reference": "f25c8aab83e0c3e976fd7d19875f198ccf2f7535"
+                "reference": "30e07cf03edc3cd3ef579d0dd4dd8c58250799a5"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/doctrine/annotations/zipball/f25c8aab83e0c3e976fd7d19875f198ccf2f7535",
+                "url": "https://api.github.com/repos/doctrine/annotations/zipball/30e07cf03edc3cd3ef579d0dd4dd8c58250799a5",
-                "reference": "f25c8aab83e0c3e976fd7d19875f198ccf2f7535",
+                "reference": "30e07cf03edc3cd3ef579d0dd4dd8c58250799a5",
                 "shasum": ""
             },
             "require": {
                 "doctrine/lexer": "1.*",
-                "php": ">=5.3.2"
+                "php": "^5.6 || ^7.0"
             },
             "require-dev": {
                 "doctrine/cache": "1.*",
-                "phpunit/phpunit": "4.*"
+                "phpunit/phpunit": "^5.6.1"
             },
             "type": "library",
             "extra": {
                 "branch-alias": {
-                    "dev-master": "1.3.x-dev"
+                    "dev-master": "1.4.x-dev"
                 }
             },
             "autoload": {
-                "psr-0": {
+                "psr-4": {
-                    "Doctrine\\Common\\Annotations\\": "lib/"
+                    "Doctrine\\Common\\Annotations\\": "lib/Doctrine/Common/Annotations"
                 }
             },
             "notification-url": "https://packagist.org/downloads/",
@@ -322,20 +322,20 @@
                 "docblock",
                 "parser"
             ],
-            "time": "2015-08-31 12:32:49"
+            "time": "2016-10-24 11:45:47"
         },
         {
             "name": "doctrine/cache",
-            "version": "v1.6.0",
+            "version": "v1.6.1",
             "source": {
                 "type": "git",
                 "url": "https://github.com/doctrine/cache.git",
-                "reference": "f8af318d14bdb0eff0336795b428b547bd39ccb6"
+                "reference": "b6f544a20f4807e81f7044d31e679ccbb1866dc3"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/doctrine/cache/zipball/f8af318d14bdb0eff0336795b428b547bd39ccb6",
+                "url": "https://api.github.com/repos/doctrine/cache/zipball/b6f544a20f4807e81f7044d31e679ccbb1866dc3",
-                "reference": "f8af318d14bdb0eff0336795b428b547bd39ccb6",
+                "reference": "b6f544a20f4807e81f7044d31e679ccbb1866dc3",
                 "shasum": ""
             },
             "require": {
@@ -392,7 +392,7 @@
                 "cache",
                 "caching"
             ],
-            "time": "2015-12-31 16:37:02"
+            "time": "2016-10-29 11:16:17"
         },
         {
             "name": "doctrine/collections",
@@ -1167,16 +1167,16 @@
         },
         {
             "name": "paypal/rest-api-sdk-php",
-            "version": "1.9.0",
+            "version": "1.10.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/paypal/PayPal-PHP-SDK.git",
-                "reference": "97e5102dc8e8a3c1ee954aa067505671caa65b59"
+                "reference": "f87c4306cccf31be9acea71a55c4978a7f77afcf"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/paypal/PayPal-PHP-SDK/zipball/97e5102dc8e8a3c1ee954aa067505671caa65b59",
+                "url": "https://api.github.com/repos/paypal/PayPal-PHP-SDK/zipball/f87c4306cccf31be9acea71a55c4978a7f77afcf",
-                "reference": "97e5102dc8e8a3c1ee954aa067505671caa65b59",
+                "reference": "f87c4306cccf31be9acea71a55c4978a7f77afcf",
                 "shasum": ""
             },
             "require": {
@@ -1212,7 +1212,7 @@
                 "rest",
                 "sdk"
             ],
-            "time": "2016-10-21 18:07:19"
+            "time": "2016-10-27 21:14:38"
         },
         {
             "name": "phroute/phroute",
@@ -1566,16 +1566,16 @@
         },
         {
             "name": "symfony/translation",
-            "version": "v3.1.5",
+            "version": "v3.1.6",
             "source": {
                 "type": "git",
                 "url": "https://github.com/symfony/translation.git",
-                "reference": "93013a18d272e59dab8e67f583155b78c68947eb"
+                "reference": "ff1285087397d2f64041b35e591f3025881c90cd"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/symfony/translation/zipball/93013a18d272e59dab8e67f583155b78c68947eb",
+                "url": "https://api.github.com/repos/symfony/translation/zipball/ff1285087397d2f64041b35e591f3025881c90cd",
-                "reference": "93013a18d272e59dab8e67f583155b78c68947eb",
+                "reference": "ff1285087397d2f64041b35e591f3025881c90cd",
                 "shasum": ""
             },
             "require": {
@@ -1626,20 +1626,20 @@
             ],
             "description": "Symfony Translation Component",
             "homepage": "https://symfony.com",
-            "time": "2016-09-06 11:02:40"
+            "time": "2016-10-18 04:30:12"
         },
         {
             "name": "twig/twig",
-            "version": "v1.26.1",
+            "version": "v1.27.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/twigphp/Twig.git",
-                "reference": "a09d8ee17ac1cfea29ed60c83960ad685c6a898d"
+                "reference": "3c6c0033fd3b5679c6e1cb60f4f9766c2b424d97"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/twigphp/Twig/zipball/a09d8ee17ac1cfea29ed60c83960ad685c6a898d",
+                "url": "https://api.github.com/repos/twigphp/Twig/zipball/3c6c0033fd3b5679c6e1cb60f4f9766c2b424d97",
-                "reference": "a09d8ee17ac1cfea29ed60c83960ad685c6a898d",
+                "reference": "3c6c0033fd3b5679c6e1cb60f4f9766c2b424d97",
                 "shasum": ""
             },
             "require": {
@@ -1652,7 +1652,7 @@
             "type": "library",
             "extra": {
                 "branch-alias": {
-                    "dev-master": "1.26-dev"
+                    "dev-master": "1.27-dev"
                 }
             },
             "autoload": {
@@ -1687,7 +1687,7 @@
             "keywords": [
                 "templating"
             ],
-            "time": "2016-10-05 18:57:41"
+            "time": "2016-10-25 19:17:17"
         }
     ],
     "packages-dev": [],

resources/assets/less/yuuno/main.less

@@ -9,6 +9,7 @@
 @import "dropdown";
 @import "np";
 @import "dialogue";
+@import "uploader";
 
 /*
  * Animation Keyframes
@@ -1035,7 +1036,6 @@ a.default:active {
     height: 200px;
     background: no-repeat center center / cover transparent;
     width: 100%;
-    display: flex;
     align-items: center;
     border-bottom: 1px solid #9475b2;
 }
@@ -1047,6 +1047,15 @@ a.default:active {
     width: 100%;
     display: flex;
     align-items: center;
+
+    // hackjob
+    pointer-events: none;
+    position: relative;
+    top: -100%;
+
+    > * {
+        pointer-events: auto;
+    }
 }
 
 .new-profile .new-profile-avatar {

resources/assets/less/yuuno/uploader.less

@@ -0,0 +1,24 @@
+.uploader__label {
+    display: block;
+    text-align: right;
+    width: 100%;
+    height: 100%;
+    color: #fff;
+    font-size: 3em;
+    line-height: 1.4em;
+    transition: background .2s;
+
+    &:hover {
+        background: fade(#000, 50%);
+
+        &:before {
+            margin: 10px;
+            font-family: FontAwesome;
+            content: "\f044";
+        }
+    }
+}
+
+.uploader {
+    display: none;
+}

resources/assets/typescript/Sakura/AJAX.ts

@@ -8,6 +8,7 @@ namespace Sakura
         private Headers: any;
         private URL: string;
         private Send: string = null;
+        private FormData: FormData = null;
         private Asynchronous: boolean = true;
 
         // Prepares the XMLHttpRequest and stuff
@@ -42,7 +43,7 @@ namespace Sakura
                 }
             }
 
-            this.Request.send(this.Send);
+            this.Request.send(this.FormData || this.Send);
         }
 
         // Stop
@@ -74,6 +75,11 @@ namespace Sakura
             this.Send = data;
         }
 
+        // Set form data
+        public SetFormData(data: FormData): void {
+            this.FormData = data;
+        }
+
         // Get response
         public Response(): string {
             return this.Request.responseText;

resources/views/yuuno/profile/images.twig

@@ -1,10 +1,3 @@
-<h1>Avatar</h1>
-<form enctype="multipart/form-data" method="post" action="{{ route('user.avatar', user.id) }}" style="margin: 1em">
-    <input type="hidden" name="MAX_FILE_SIZE" value="{{ config('file.avatar.max_file_size') }}">
-    <input type="hidden" name="session" value="{{ session_id() }}">
-    <input type="file" name="file">
-    <button>upload</button>
-</form>
 <h1>Background</h1>
 <form enctype="multipart/form-data" method="post" action="{{ route('user.background', user.id) }}" style="margin: 1em">
     <input type="hidden" name="MAX_FILE_SIZE" value="{{ config('file.background.max_file_size') }}">
@@ -12,10 +5,3 @@
     <input type="file" name="file">
     <button>upload</button>
 </form>
-<h1>Header</h1>
-<form enctype="multipart/form-data" method="post" action="{{ route('user.header', user.id) }}" style="margin: 1em">
-    <input type="hidden" name="MAX_FILE_SIZE" value="{{ config('file.header.max_file_size') }}">
-    <input type="hidden" name="session" value="{{ session_id() }}">
-    <input type="file" name="file">
-    <button>upload</button>
-</form>

resources/views/yuuno/user/profile.twig

@@ -138,6 +138,33 @@
             // Set the new to active
             newMode.className = 'profile-mode-current';
         }
+
+        function handleImageChange(elem, cont) {
+            var ajax = new Sakura.AJAX(),
+                target = elem.getAttribute('data-target'),
+                formData = new FormData(),
+                file = elem.files[0];
+
+            formData.append('session', Sakura.Config.SessionId);
+            formData.append('file', file, file.name);
+            ajax.SetFormData(formData);
+            ajax.SetUrl(target);
+            ajax.AddCallback(200, function () {
+                var result = ajax.JSON();
+
+                if (result.error) {
+                    var diag = new Sakura.Dialogue;
+                    diag.Text = result.error;
+                    diag.AddCallback(Sakura.DialogueButton.Ok, function () {
+                        this.Close();
+                    });
+                    diag.Display();
+                }
+
+                cont.style.backgroundImage = "url('" + target + "?" + Date.now() + ")";
+            });
+            ajax.Start(Sakura.HTTPMethod.POST);
+        }
     </script>
     {% endif %}
 {% endblock %}
@@ -160,8 +187,15 @@
         <div class="content new-profile">
             <div class="new-profile-container">
                 <div class="new-profile-header" style="background-image: url({{ route('user.header', profile.id) }});">
+                    <label class="uploader__label">
+                        <input type="file" data-target="{{ route('user.header', user.id) }}" class="uploader" onchange="handleImageChange(this, this.parentElement.parentElement)">
+                    </label>
                     <div class="new-profile-info">
-                        <div class="default-avatar-setting new-profile-avatar" style="background-image: url({{ route('user.avatar', profile.id) }}); box-shadow: 0 0 5px #{% if profile.isOnline %}484{% else %}844{% endif %};"></div>
+                        <div class="default-avatar-setting new-profile-avatar" style="background-image: url({{ route('user.avatar', profile.id) }}); box-shadow: 0 0 5px #{% if profile.isOnline %}484{% else %}844{% endif %};">
+                            <label class="uploader__label">
+                                <input type="file" data-target="{{ route('user.avatar', user.id) }}" class="uploader" onchange="handleImageChange(this, this.parentElement.parentElement)">
+                            </label>
+                        </div>
                         <div class="new-profile-username">
                             <h1 style="color: {{ profile.colour }}; text-shadow: 0 0 7px {% if profile.colour != 'inherit' %}{{ profile.colour }}{% else %}#222{% endif %}; padding: 0 0 2px;" {% if profile.getUsernameHistory %} title="Known as {{ profile.getUsernameHistory[0].username_old }} before {{ profile.getUsernameHistory[0].change_time|date(config('general.date_format')) }}." {% endif %}>{{ profile.username }}</h1>
                             {% if profile.isPremium %}<img src="/images/tenshi.png" alt="Tenshi" style="vertical-align: middle;"> {% endif %}<img src="/images/flags/{{ profile.country|lower }}.png" alt="{{ profile.country }}" style="vertical-align: middle;" title="{{ profile.country(true) }}"> <span style="font-size: .8em;">{{ profile.title }}</span>