From 631cbcb718ec4dc45b4be7ff3bf1ca962c970812 Mon Sep 17 00:00:00 2001
From: dignajar <dignajar@gmail.com>
Date: Sat, 2 Jan 2016 19:51:12 -0300
Subject: [PATCH] Profile picture png format

---
 kernel/admin/themes/default/css/default.css |  11 ++
 kernel/admin/themes/default/index.php       |   6 +-
 kernel/admin/themes/default/init.php        | 183 +++++++-------------
 kernel/admin/views/edit-user.php            |  10 +-
 kernel/ajax/uploader.php                    |   6 +-
 kernel/helpers/image.class.php              |  64 +++----
 kernel/user.class.php                       |  11 ++
 7 files changed, 122 insertions(+), 169 deletions(-)

diff --git a/kernel/admin/themes/default/css/default.css b/kernel/admin/themes/default/css/default.css
index 8cd02bac..3ee4bdc4 100644
--- a/kernel/admin/themes/default/css/default.css
+++ b/kernel/admin/themes/default/css/default.css
@@ -274,6 +274,17 @@ button.delete-button:hover {
 
 /* ----------- BLUDIT PROFILE PICTURE ----------- */
 
+#bludit-profile-picture-drag-drop {
+	width: 100%;
+	padding: 15px 0;
+}
+
+#bludit-profile-picture-progressbar {
+	display: none;
+	margin: 15px 0 0;
+	width: 100%;
+}
+
 /* ----------- LOGIN FORM ----------- */
 
 div.login-box > h1 {
diff --git a/kernel/admin/themes/default/index.php b/kernel/admin/themes/default/index.php
index f0b79527..94432b29 100644
--- a/kernel/admin/themes/default/index.php
+++ b/kernel/admin/themes/default/index.php
@@ -102,9 +102,9 @@ $(document).ready(function() {
 		<ul class="uk-navbar-nav">
 		<li class="uk-parent" data-uk-dropdown>
 			<?php
-				$profilePictureSrc = HTML_PATH_ADMIN_THEME_IMG.'default.jpg';
-				if(file_exists(PATH_UPLOADS_PROFILES.$Login->username().'.jpg')) {
-					$profilePictureSrc = HTML_PATH_UPLOADS_PROFILES.$Login->username().'.jpg';
+				$profilePictureSrc = HTML_PATH_ADMIN_THEME_IMG.'default.png';
+				if(file_exists(PATH_UPLOADS_PROFILES.$Login->username().'.png')) {
+					$profilePictureSrc = HTML_PATH_UPLOADS_PROFILES.$Login->username().'.png';
 				}
 			?>
 			<a href="<?php echo HTML_PATH_ADMIN_ROOT.'edit-user/'.$Login->username() ?>">
diff --git a/kernel/admin/themes/default/init.php b/kernel/admin/themes/default/init.php
index 318f1ff0..50dbb86f 100644
--- a/kernel/admin/themes/default/init.php
+++ b/kernel/admin/themes/default/init.php
@@ -354,145 +354,80 @@ $(document).ready(function() {
 		echo $html.$script;
 	}
 
-	public static function uploader()
-	{
-		global $L;
-
-		$html = '
-		<div id="upload-drop" class="uk-placeholder uk-text-center">
-		<i class="uk-icon-cloud-upload uk-icon-medium uk-text-muted uk-margin-small-right"></i>'.$L->g('Upload Image').'<br><a class="uk-form-file">'.$L->g('Drag and drop or click here').'<input id="upload-select" type="file"></a>
-		</div>
-
-		<div id="progressbar" class="uk-progress uk-hidden">
-		<div class="uk-progress-bar" style="width: 0%;">0%</div>
-		</div>
-		';
-
-		$html .= '<select id="jsimageList" class="uk-width-1-1" size="10">';
-		$imagesList = Filesystem::listFiles(PATH_UPLOADS,'*','*',true);
-		foreach($imagesList as $file) {
-			$html .= '<option value="">'.basename($file).'</option>';
-		}
-		$html .= '</select>';
-
-		$html .= '
-		<div class="uk-form-row uk-margin-top">
-		<button id="jsaddImage" class="uk-button uk-button-primary" type="button"><i class="uk-icon-angle-double-left"></i> '.$L->g('Insert Image').'</button>
-		</div>
-		';
-
-		$html .= '
-		<script>
-		$(document).ready(function() {
-
-			$("#jsaddImage").on("click", function() {
-				var filename = $("#jsimageList option:selected").text();
-				if(!filename.trim()) {
-					return false;
-				}
-				var textareaValue = $("#jscontent").val();
-				$("#jscontent").val(textareaValue + "<img src=\""+filename+"\" alt=\"\">" + "\n");
-			});
-
-			$(function()
-			{
-				var progressbar = $("#progressbar");
-				var bar = progressbar.find(".uk-progress-bar");
-				var settings =
-				{
-					type: "json",
-					action: "'.HTML_PATH_ADMIN_ROOT.'ajax/uploader",
-					allow : "*.(jpg|jpeg|gif|png)",
-
-					loadstart: function() {
-						bar.css("width", "0%").text("0%");
-						progressbar.removeClass("uk-hidden");
-					},
-
-					progress: function(percent) {
-						percent = Math.ceil(percent);
-						bar.css("width", percent+"%").text(percent+"%");
-					},
-
-					allcomplete: function(response) {
-						bar.css("width", "100%").text("100%");
-						setTimeout(function() { progressbar.addClass("uk-hidden"); }, 250);
-						$("#jsimageList").prepend("<option value=\'"+response.filename+"\' selected=\'selected\'>"+response.filename+"</option>");
-					},
-
-					notallowed: function(file, settings) {
-						alert("'.$L->g('Supported image file types').' "+settings.allow);
-					}
-				};
-
-				var select = UIkit.uploadSelect($("#upload-select"), settings);
-				var drop = UIkit.uploadDrop($("#upload-drop"), settings);
-			});
-
-		});
-		</script>';
-
-		echo $html;
-	}
-
 	public static function profileUploader($username)
 	{
 		global $L;
 
-		$html = '
-		<div id="jsprogressBar" class="uk-progress uk-hidden">
+$html = '<!-- BLUDIT PROFILE UPLOADER -->';
+
+$html .= '
+<div id="bludit-profile-picture">
+
+	<div id="bludit-profile-picture-image">';
+
+	if(file_exists(PATH_UPLOADS_PROFILES.$username.'.png')) {
+		$html .= '<img class="uk-border-rounded" src="'.HTML_PATH_UPLOADS_PROFILES.$username.'.png" alt="Profile picture">';
+	}
+	else {
+		$html .= '<div class="uk-block uk-border-rounded uk-block-muted uk-block-large">'.$L->g('Profile picture').'</div>';
+	}
+
+$html .= '
+	</div>
+
+	<div id="bludit-profile-picture-progressbar" class="uk-progress">
 		<div class="uk-progress-bar" style="width: 0%;">0%</div>
-		</div>
+	</div>
 
-		<div id="upload-drop" class="uk-placeholder uk-text-center">
-		<i class="uk-icon-cloud-upload uk-margin-small-right"></i>'.$L->g('Upload Image').'<br><a class="uk-form-file">'.$L->g('Drag and drop or click here').'<input id="upload-select" type="file"></a>
-		</div>
-		';
+	<div id="bludit-profile-picture-drag-drop" class="uk-form-file uk-placeholder uk-text-center">
+		<div>'.$L->g('Upload image').'</div>
+		<div style="font-size:0.8em;">'.$L->g('Drag and drop or click here').'<input id="bludit-profile-picture-file-select" type="file"></div>
+	</div>
 
-		$html .= '
-		<script>
-		$(document).ready(function() {
+</div>
+';
 
-			$(function()
-			{
-				var progressbar = $("#jsprogressBar");
-				var bar = progressbar.find(".uk-progress-bar");
-				var settings =
-				{
-					type: "json",
-					action: "'.HTML_PATH_ADMIN_ROOT.'ajax/uploader",
-					allow : "*.(jpg|jpeg|gif|png)",
-					params: {"type":"profilePicture", "username":"'.$username.'"},
+$script = '
+<script>
+$(document).ready(function() {
 
-					loadstart: function() {
-						bar.css("width", "0%").text("0%");
-						progressbar.removeClass("uk-hidden");
-					},
+	var settings =
+	{
+		type: "json",
+		action: HTML_PATH_ADMIN_ROOT+"ajax/uploader",
+		allow : "*.(jpg|jpeg|gif|png)",
+		params: {"type":"profilePicture", "username":"'.$username.'"},
 
-					progress: function(percent) {
-						percent = Math.ceil(percent);
-						bar.css("width", percent+"%").text(percent+"%");
-					},
+		loadstart: function() {
+			$("#bludit-profile-picture-progressbar").find(".uk-progress-bar").css("width", "0%").text("0%");
+			$("#bludit-profile-picture-progressbar").show();
+		},
 
-					allcomplete: function(response) {
-						bar.css("width", "100%").text("100%");
-						progressbar.addClass("uk-hidden");
-						$("#jsprofilePicture").html("<img class=\"uk-border-rounded\" src=\"'.HTML_PATH_UPLOADS_PROFILES.$username.'.jpg\">");
-					},
+		progress: function(percent) {
+			percent = Math.ceil(percent);
+			$("#bludit-profile-picture-progressbar").find(".uk-progress-bar").css("width", percent+"%").text(percent+"%");
+		},
 
-					notallowed: function(file, settings) {
-						alert("'.$L->g('Supported image file types').' "+settings.allow);
-					}
-				};
+		allcomplete: function(response) {
+			$("#bludit-profile-picture-progressbar").find(".uk-progress-bar").css("width", "100%").text("100%");
+			$("#bludit-profile-picture-progressbar").hide();
 
-				var select = UIkit.uploadSelect($("#upload-select"), settings);
-				var drop = UIkit.uploadDrop($("#upload-drop"), settings);
-			});
+			$("#bludit-profile-picture-image").html("<img class=\"uk-border-rounded\" src=\"'.HTML_PATH_UPLOADS_PROFILES.$username.'.png?time='.time().'\">");
+		},
 
-		});
-		</script>';
+		notallowed: function(file, settings) {
+			alert("'.$L->g('Supported image file types').' "+settings.allow);
+		}
+	};
 
-		echo $html;
+	UIkit.uploadSelect($("#bludit-profile-picture-file-select"), settings);
+	UIkit.uploadDrop($("#bludit-profile-picture-drag-drop"), settings);
+
+});
+</script>
+';
+
+		echo $html.$script;
 	}
 
 }
\ No newline at end of file
diff --git a/kernel/admin/views/edit-user.php b/kernel/admin/views/edit-user.php
index de550f9f..ac8d2a55 100644
--- a/kernel/admin/views/edit-user.php
+++ b/kernel/admin/views/edit-user.php
@@ -129,16 +129,8 @@ if( ($Login->role()==='admin') && ($_User->username()!='admin') ) {
 HTML::formClose();
 
 echo '</div>';
-echo '<div class="uk-width-3-10" style="margin-top: 50px; text-align: center;">';
 
-echo '<div id="jsprofilePicture">';
-if(file_exists(PATH_UPLOADS_PROFILES.$_User->username().'.jpg')) {
-	echo '<img class="uk-border-rounded" src="'.HTML_PATH_UPLOADS_PROFILES.$_User->username().'.jpg" alt="">';
-}
-else {
-	echo '<div class="uk-block uk-border-rounded uk-block-muted uk-block-large">'.$L->g('Profile picture').'</div>';
-}
-echo '</div>';
+echo '<div class="uk-width-3-10" style="margin-top: 50px; text-align: center;">';
 
 HTML::profileUploader($_User->username());
 
diff --git a/kernel/ajax/uploader.php b/kernel/ajax/uploader.php
index e8c5fe7a..dbb626e0 100644
--- a/kernel/ajax/uploader.php
+++ b/kernel/ajax/uploader.php
@@ -38,10 +38,10 @@ if($type=='profilePicture')
 {
 	// Resize and crop profile image.
 	$username = Sanitize::html($_POST['username']);
-	$tmpName = $username.'.jpg';
+	$tmpName = $username.'.png';
 	$Image = new Image();
-	$Image->setImage(PATH_TMP.'original'.'.'.$fileExtension, '200', '200', 'crop');
-	$Image->saveImage(PATH_UPLOADS_PROFILES.$tmpName, 100, true);
+	$Image->setImage(PATH_TMP.'original'.'.'.$fileExtension, '400', '400', 'crop');
+	$Image->saveImage(PATH_UPLOADS_PROFILES.$tmpName, 100, false, true);
 }
 // --- OTHERS ---
 else {
diff --git a/kernel/helpers/image.class.php b/kernel/helpers/image.class.php
index b9db4d38..db70ae74 100644
--- a/kernel/helpers/image.class.php
+++ b/kernel/helpers/image.class.php
@@ -19,7 +19,7 @@ class Image {
 		$this->resizeImage($newWidth, $newHeight, $option);
 	}
 
-	public function saveImage($savePath, $imageQuality="100", $forceJPG=false)
+	public function saveImage($savePath, $imageQuality="100", $forceJPG=false, $forcePNG=false)
 	{
 		$extension = strtolower(pathinfo($savePath, PATHINFO_EXTENSION));
 
@@ -28,42 +28,46 @@ class Image {
 
 		$path_complete = $filename.'.'.$extension;
 
-		if($forceJPG) {
-			imagejpeg($this->imageResized, $filename.'.jpg', $imageQuality);
+		if($forcePNG) {
+			$extension = 'png';
 		}
-		else
+		elseif($forceJPG) {
+			$extension = 'jpg';
+		}
+
+		switch($extension)
 		{
-			switch($extension)
-			{
-				case 'jpg':
-				case 'jpeg':
-					if (imagetypes() & IMG_JPG) {
-						imagejpeg($this->imageResized, $path_complete, $imageQuality);
-					}
-					break;
+			case 'jpg':
+			case 'jpeg':
+				// Checking for JPG support
+				if (imagetypes() & IMG_JPG) {
+					imagejpeg($this->imageResized, $path_complete, $imageQuality);
+				}
+				break;
 
-				case 'gif':
-					if (imagetypes() & IMG_GIF) {
-						imagegif($this->imageResized, $path_complete);
-					}
-					break;
+			case 'gif':
+				// Checking for GIF support
+				if (imagetypes() & IMG_GIF) {
+					imagegif($this->imageResized, $path_complete);
+				}
+				break;
 
-				case 'png':
-					// *** Scale quality from 0-100 to 0-9
-					$scaleQuality = round(($imageQuality/100) * 9);
+			case 'png':
+				// *** Scale quality from 0-100 to 0-9
+				$scaleQuality = round(($imageQuality/100) * 9);
 
-					// *** Invert quality setting as 0 is best, not 9
-					$invertScaleQuality = 9 - $scaleQuality;
+				// *** Invert quality setting as 0 is best, not 9
+				$invertScaleQuality = 9 - $scaleQuality;
 
-					if (imagetypes() & IMG_PNG) {
-						 imagepng($this->imageResized, $path_complete, $invertScaleQuality);
-					}
-					break;
+				// Checking for PNG support
+				if (imagetypes() & IMG_PNG) {
+					 imagepng($this->imageResized, $path_complete, $invertScaleQuality);
+				}
+				break;
 
-				default:
-					// *** No extension - No save.
-					break;
-			}
+			default:
+				// Fail extension detection
+				break;
 		}
 
 		imagedestroy($this->imageResized);
diff --git a/kernel/user.class.php b/kernel/user.class.php
index 0b80c92a..f75456ca 100644
--- a/kernel/user.class.php
+++ b/kernel/user.class.php
@@ -81,4 +81,15 @@ class User
 		return $this->getField('instagramUsername');
 	}
 
+	public function profilePicture($absolute=true)
+	{
+		$filename = $this->getField('username').'.png';
+
+		if($absolute) {
+			return HTML_PATH_UPLOADS_PROFILES.$filename;
+		}
+
+		return $filename;
+	}
+
 }
\ No newline at end of file