added effects to front; resize image before applying effect

app/Http/Business/EffectsBusiness.php

@@ -27,6 +27,8 @@ class EffectsBusiness extends LuBusiness {
             self::notFound("Effect does not exist");
         }
 
+        ImagesBusiness::prepareImage($data->getImage());
+
         /**
          * @var $filter AbstractFilter
          */

app/Http/Business/ImagesBusiness.php

@@ -42,6 +42,12 @@ class ImagesBusiness extends LuBusiness {
         echo file_get_contents($dbo->getPath());
         exit;
     }
+    
+    public static function prepareImage(\Imagick $image)
+    {
+        $image->scaleImage(420, 420, true);
+        $image->setImageFormat(self::IMAGES_FORMAT);
+    }
 
     public static function upload(ImageUploadDbo $image, LuticateUsersDbo $_user)
     {
@@ -55,9 +61,9 @@ class ImagesBusiness extends LuBusiness {
         if (is_null($dbo->getName()) || $dbo->getName() === "") {
             $dbo->setName(Carbon::now()->toW3cString());
         }
+        
+        self::prepareImage($image->getImage());
 
-        $image->getImage()->scaleImage(420, 420, true);
-        $image->getImage()->setImageFormat(self::IMAGES_FORMAT);
         try
         {
             $image->getImage()->writeImage($path);

public/app/controllers/upload.controller.js

@@ -3,6 +3,17 @@ angular.module('app')
         function($scope, $state, $mdDialog, EffectsBusiness, ImagesBusiness, luticateAuthCache, errorDialogMd) {
 
             $scope.image = null;
+
+            $scope.effects = [
+                {
+                    name: "Black and White",
+                    id: "BlackAndWhite"
+                },
+                {
+                    name: "GrayScale",
+                    id: "GrayScale"
+                }
+            ];
             
             var promiseImage = {
                 id: "promiseImage",

public/app/views/upload.html

@@ -1,6 +1,11 @@
 <div layout="column" layout-fill layout-align="top center">
 
     <h1>Upload</h1>
+
+    <div class="col-xs12" ng-show="image != null">
+        <md-button ng-repeat="effect in effects" ng-click="applyEffect(effect.id, null)">{{effect.name}}</md-button>
+    </div>
+
     <div ng-show="isUploadVisible()" class="col-xs-6" lu-busy="imageView">
 
         <div class="center-block">