got cropper.js working

members/templates/members/profile_image_edit.html

@@ -70,7 +70,7 @@ <h3 style='text-align:center;'>Edit Your Profile Image:</h3>
    });
 
    $("#profile_image_form").submit(function(){
-     var img = $("#image-preview").cropper('getCroppedCanvas').toDataURL('image/jpeg');
+     var img = $("#image-preview").cropper('getCroppedCanvas').toDataURL().match(/data:image\/(png|jpeg);base64,(.*)$/)[2]
      // add the cropped image data to the form, then submit.
      $("#id_cropped_image_data").val(img);
      return true;

members/views/profile.py

@@ -288,23 +288,24 @@ def edit_pic(request, username):
 @login_required
 @user_passes_test(is_active_member, login_url='member_not_active')
 def edit_photo(request, username):
-    page_message = None
     user=get_object_or_404(User, username=username)
     if not user == request.user and not request.user.is_staff:
         return HttpResponseRedirect(reverse('member_profile', kwargs={'username': request.user.username}))
 
     if request.method == 'POST':
         form = ProfileImageForm(request.POST, request.FILES)
-        # try:
-        #     if form.is_valid():
-        #         form.save()
-        #         return HttpResponseRedirect(reverse('member_profile', kwargs={'username': request.user.username}))
-        # except Exception as e:
-        #     page_message = str(e)
+        try:
+            if form.is_valid():
+                form.save()
+                return HttpResponseRedirect(reverse('member_profile', kwargs={'username': request.user.username}))
+            else:
+                print form
+        except Exception as e:
+            messages.add_message(request, messages.ERROR, "Could not save: %s" % str(e))
     else:
         form = ProfileImageForm()
 
-    context = {'user': user, 'page_message': page_message, 'form': form}
+    context = {'user': user, 'form': form}
     return render(request, 'members/profile_image_edit.html', context)
 
 # Copyright 2016 Office Nomads LLC (http://www.officenomads.com/) Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

nadine/forms.py

@@ -2,21 +2,24 @@
 import datetime
 import base64
 import uuid
+import os
 
 from django import forms
+from django.core.files.base import ContentFile
 from django.forms import modelformset_factory
 from django.forms.formsets import BaseFormSet
 from django.contrib.auth.models import User
 from django.utils.html import strip_tags
 from django.conf import settings
 from django.utils import timezone
+from django.core.files.base import ContentFile
 
 from localflavor.us.us_states import US_STATES
 from localflavor.ca.ca_provinces import PROVINCE_CHOICES
 
 from nadine import email
 from nadine.models.core import HowHeard, Industry, Neighborhood, URLType, GENDER_CHOICES
-from nadine.models.profile import UserProfile, MemberNote
+from nadine.models.profile import UserProfile, MemberNote, user_photo_path
 from nadine.models.membership import Membership, MembershipPlan
 from nadine.models.usage import PAYMENT_CHOICES, CoworkingDay
 from nadine.models.resource import Room
@@ -216,36 +219,23 @@ def get_state_choices():
         return PROVINCE_CHOICES
 
 
-def save_cropped_image(raw_img_data, upload_path):
-    img_data = base64.b64decode(raw_img_data)
-    filename = "%s.jpeg" % upload_path
-
-    with open(filename, 'wb') as f:
-        f.write(img_data)
-        f.close()
-    return filename
-
 class ProfileImageForm(forms.Form):
     username = forms.CharField(required=True, widget=forms.HiddenInput)
     photo = forms.FileField(required=False)
     cropped_image_data = forms.CharField(widget=forms.HiddenInput())
 
     def save(self):
         user = User.objects.get(username=self.cleaned_data['username'])
+        filename = "user_photos/%s.png" % self.cleaned_data['username']
+        raw_img_data = self.cleaned_data['cropped_image_data']
+        if not raw_img_data or len(raw_img_data) == 0:
+            # Nothing to save here
+            return
+        img_data = base64.b64decode(raw_img_data)
+        if user.profile.photo:
+            user.profile.photo.delete()
+        user.profile.photo.save(filename, ContentFile(img_data))
 
-        try:
-            img_data = self.cleaned_data['cropped_image_data']
-            if (not img_data) or img_data is None or len(img_data) == 0:
-                return
-        except:
-            raise forms.ValidationError('No valid image was provided.')
-
-        upload_path = "media/user_photos/%s" % self.cleaned_data['username']
-        relative_file_name = save_cropped_image(img_data, upload_path)
-        self.cleaned_data['image'] = relative_file_name
-        user.profile.photo.delete()
-        user.profile.photo = self.cleaned_data['photo']
-        user.profile.save()
 
 class BaseLinkFormSet(BaseFormSet):
     def clean(self):
@@ -286,6 +276,7 @@ def save(self):
             org = Organization.objects.get(id=self.cleaned_data['org_id'])
             org.save_url(self.cleaned_data['url_type'], self.cleaned_data['url'])
 
+
 class EditProfileForm(forms.Form):
     username = forms.CharField(required=True, widget=forms.HiddenInput)
     first_name = forms.CharField(max_length=100, required=True)