Fixed FF issue with image resize.

app/assets/javascripts/app/controllers/_profile/avatar.js.coffee

@@ -108,25 +108,27 @@ class Index extends App.Controller
   storeImage: (src) =>
 
     # store avatar globally
-    params =
+    @oldDataUrl = src
-      avatar_full: src
-
-    # add resized image
-    avatar = new App.ImageService( src )
-    params['avatar_resize'] = avatar.toDataURLForAvatar( 'auto', 160 )
 
     # store on server site
-    @ajax(
+    store = (newDataUrl) =>
-      id:   'avatar_new'
+      @ajax(
-      type: 'POST'
+        id:   'avatar_new'
-      url:  @apiPath + '/users/avatar'
+        type: 'POST'
-      data: JSON.stringify( params )
+        url:  @apiPath + '/users/avatar'
-      processData: true
+        data: JSON.stringify(
-      success: (data, status, xhr) =>
+          avatar_full:   @oldDataUrl
-        avatarHolder = $(App.view('profile/avatar-holder')( src: src, avatar: data.avatar ) )
+          avatar_resize: newDataUrl
-        @avatarGallery.append(avatarHolder)
+        )
-        @pick avatarHolder.find('.avatar')
+        processData: true
-    )
+        success: (data, status, xhr) =>
+          avatarHolder = $(App.view('profile/avatar-holder')( src: src, avatar: data.avatar ) )
+          @avatarGallery.append(avatarHolder)
+          @pick avatarHolder.find('.avatar')
+      )
+
+    # add resized image
+    App.ImageService.resizeForAvatar( src, 'auto', 160, store )
 
   onUpload: (event) =>
     callback = @storeImage

app/assets/javascripts/app/controllers/getting_started.js.coffee

@@ -25,11 +25,11 @@ class Index extends App.ControllerContent
 
     # get data
     @ajax(
-      id:    'getting_started',
+      id:          'getting_started'
-      type:  'GET',
+      type:        'GET'
-      url:   @apiPath + '/getting_started',
+      url:         @apiPath + '/getting_started'
-      processData: true,
+      processData: true
-      success: (data, status, xhr) =>
+      success:     (data, status, xhr) =>
 
         # redirect to login if master user already exists
         if @Config.get('system_init_done')
@@ -81,6 +81,11 @@ class Admin extends App.ControllerContent
       processData: true
       success: (data, status, xhr) =>
 
+        # check if user got created right now
+        #if true
+        #  @navigate '#getting_started/base'
+        #  return
+
         # redirect to login if master user already exists
         if @Config.get('system_init_done')
           @navigate '#login'
@@ -251,42 +256,41 @@ class Base extends App.ControllerContent
 
   submit: (e) =>
     e.preventDefault()
-
-    # get params
-    params = @formParam(e.target)
-
-    # add logo
-    params['logo'] = @logoPreview.attr('src')
-
-    # add resized image
-    if params['logo']
-      resizeLogo = new App.ImageService( params['logo'] )
-      params['logo_resize'] = resizeLogo.toDataURLForApp( @logoPreview.width(), @logoPreview.height() )
-
     @hideAlerts()
     @disable(e)
 
-    @ajax(
+    # get params
-      id:   'getting_started_base'
+    @params = @formParam(e.target)
-      type: 'POST'
+
-      url:  @apiPath + '/getting_started/base'
+    # add logo
-      data: JSON.stringify( params )
+    @params.logo = @logoPreview.attr('src')
-      processData: true
+
-      success: (data, status, xhr) =>
+    store = (logoResizeDataUrl) =>
-        if data.result is 'ok'
+      @params.logo_resize = logoResizeDataUrl
-          for key, value of data.settings
+      @ajax(
-            App.Config.set( key, value )
+        id:          'getting_started_base'
-          if App.Config.get('system_online_service')
+        type:        'POST'
-            @navigate 'getting_started/channel/email_pre_configured'
+        url:         @apiPath + '/getting_started/base'
+        data:        JSON.stringify(@params)
+        processData: true
+        success:     (data, status, xhr) =>
+          if data.result is 'ok'
+            for key, value of data.settings
+              App.Config.set( key, value )
+            if App.Config.get('system_online_service')
+              @navigate 'getting_started/channel/email_pre_configured'
+            else
+              @navigate 'getting_started/channel'
           else
-            @navigate 'getting_started/channel'
+            for key, value of data.messages
-        else
+              @showAlert( key, value )
-          for key, value of data.messages
+            @enable(e)
-            @showAlert( key, value )
+        fail: =>
           @enable(e)
-      fail: =>
+      )
-        @enable(e)
+
-    )
+    # add resized image
+    App.ImageService.resizeForAvatar( @params.logo, @logoPreview.width(), @logoPreview.height(), store )
 
   hideAlerts: =>
     @$('.form-group').removeClass('has-error')

app/assets/javascripts/app/lib/app_post/image_service.js.coffee

@@ -1,59 +1,57 @@
 class App.ImageService
-  constructor: (url) ->
-    @orgDataURL = url
 
-  src: (url) =>
+  @resizeForAvatar: (dataURL, x, y, callback) =>
-    @orgDataURL = url
+    if @checkUrl(dataURL)
+      callback(dataURL)
+    else
+      @resize( dataURL, x, y, 2, 'image/jpeg', 0.7, callback )
 
-  resize: ( x = 'auto', y = 'auto', sizeFactor = 1) =>
+  @toDataURLForApp: (dataURL, x, y, callback) =>
-    @canvas  = document.createElement('canvas')
+    if @checkUrl(dataURL)
-    context = @canvas.getContext('2d')
+      callback(dataURL)
+    else
+      @resize( dataURL, x, y, 2, 'image/png', 0.7, callback )
+
+  @resize: ( dataURL, x = 'auto', y = 'auto', sizeFactor = 1, type, quallity, callback) =>
 
     # load image from data url
-    imageObject     = new Image()
+    imageObject = new Image()
-    imageObject.src = @orgDataURL
+    imageObject.onload = =>
-    imageWidth      = imageObject.width
+      imageWidth  = imageObject.width
-    imageHeight     = imageObject.height
+      imageHeight = imageObject.height
+      if y is 'auto' && x is 'auto'
+        x = imageWidth
+        y = imageHeight
 
-    if y is 'auto' && x is 'auto'
+      # get auto dimensions
-      x = imageWidth
+      if y is 'auto'
-      y = imageHeight
+        factor = imageWidth / x
+        y = imageHeight / factor
 
-    # get auto dimensions
+      if x is 'auto'
-    if y is 'auto'
+        factor = imageWidth / y
-      factor = imageWidth / x
+        x = imageHeight / factor
-      y = imageHeight / factor
 
-    if x is 'auto'
+      if x < imageWidth || y < imageHeight
-      factor = imageWidth / y
+        x = x * sizeFactor
-      x = imageHeight / factor
+        y = y * sizeFactor
 
-    if x < imageWidth || y < imageHeight
+      # create canvas and set dimensions
-      x = x * sizeFactor
+      canvas        = document.createElement('canvas')
-      y = y * sizeFactor
+      canvas.width  = x
+      canvas.height = y
 
-    # set canvas dimensions
+      # draw image on canvas and set image dimensions
-    @canvas.width  = x
+      context = canvas.getContext('2d')
-    @canvas.height = y
+      context.drawImage( imageObject, 0, 0, x, y )
 
-    # draw image on canvas and set image dimensions
+      # execute callback with resized image
-    context.drawImage( imageObject, 0, 0, x, y )
+      newDataUrl = canvas.toDataURL( type, quallity )
-    @canvas
+      callback(newDataUrl)
 
-  checkUrl: =>
+    # load image from data url
+    imageObject.src = dataURL
+
+  @checkUrl: (dataURL) ->
     ignore = /\.svg$/i
-    ignore.test( @orgDataURL )
+    ignore.test( dataURL )
-
-  toDataURL: (type, quallity = 1) =>
-    #@resize()
-    @canvas.toDataURL( type, quallity )
-
-  toDataURLForAvatar: ( x, y ) =>
-    return if @checkUrl()
-    @resize( x, y, 2 )
-    @toDataURL( 'image/jpeg', 0.7 )
-
-  toDataURLForApp: ( x, y ) =>
-    return if @checkUrl()
-    @resize( x, y, 2 )
-    @toDataURL( 'image/png', 0.7 )