fix(profile): profile image upload on new version of chrome

polonel · Feb 26, 2022 · cb72e75 · cb72e75
1 parent 881a919
commit cb72e75
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 50 deletions.
diff --git a/src/controllers/accounts.js b/src/controllers/accounts.js
@@ -14,9 +14,8 @@
 
 var async = require('async')
 var _ = require('lodash')
-var winston = require('winston')
+var winston = require('../logger')
 var userSchema = require('../models/user')
-var groupSchema = require('../models/group')
 var permissions = require('../permissions')
 var emitter = require('../emitter')
 var xss = require('xss')
@@ -164,7 +163,7 @@ accountsController.profile = function (req, res) {
   }
 
   var content = {}
-  content.title = 'Profile'
+  content.title = 'Profile 1'
   content.nav = 'profile'
 
   content.data = {}
@@ -460,7 +459,7 @@ accountsController.uploadImage = function (req, res) {
   var fs = require('fs')
   var path = require('path')
   var Busboy = require('busboy')
-  var busboy = new Busboy({
+  var busboy = Busboy({
     headers: req.headers,
     limits: {
       files: 1,
@@ -476,7 +475,9 @@ accountsController.uploadImage = function (req, res) {
     if (fieldname === 'username') object.username = val
   })
 
-  busboy.on('file', function (fieldname, file, filename, encoding, mimetype) {
+  busboy.on('file', function (name, file, info) {
+    const filename = info.filename
+    const mimetype = info.mimeType
     if (mimetype.indexOf('image/') === -1) {
       error = {
         status: 400,

diff --git a/src/public/js/angularjs/controllers/accounts.js b/src/public/js/angularjs/controllers/accounts.js
@@ -13,54 +13,60 @@
  */
 
 define(['angular', 'underscore', 'jquery'], function (angular, _, $) {
-  return angular.module('trudesk.controllers.accounts', []).controller('accountsCtrl', function ($scope, $timeout) {
-    $scope.selectAccountsImport = function (event, type) {
-      if ($(event.currentTarget).hasClass('card-disabled')) {
-        return false
-      }
+  return angular
+    .module('trudesk.controllers.accounts', [])
+    .controller('accountsCtrl', function ($scope, $timeout, $document) {
+      $scope.selectAccountsImport = function (event, type) {
+        if ($(event.currentTarget).hasClass('card-disabled')) {
+          return false
+        }
 
-      switch (type) {
-        case 'csv':
-          $('#csv_wizard_card').removeClass('uk-hidden')
-          $('#json-import-selector').addClass('card-disabled')
-          $('#ldap-import-selector').addClass('card-disabled')
-          break
-        case 'json':
-          $('#json_wizard_card').removeClass('uk-hidden')
-          $('#csv-import-selector').addClass('card-disabled')
-          $('#ldap-import-selector').addClass('card-disabled')
-          break
-        case 'ldap':
-          $('#ldap_wizard_card').removeClass('uk-hidden')
-          $('#csv-import-selector').addClass('card-disabled')
-          $('#json-import-selector').addClass('card-disabled')
+        switch (type) {
+          case 'csv':
+            $('#csv_wizard_card').removeClass('uk-hidden')
+            $('#json-import-selector').addClass('card-disabled')
+            $('#ldap-import-selector').addClass('card-disabled')
+            break
+          case 'json':
+            $('#json_wizard_card').removeClass('uk-hidden')
+            $('#csv-import-selector').addClass('card-disabled')
+            $('#ldap-import-selector').addClass('card-disabled')
+            break
+          case 'ldap':
+            $('#ldap_wizard_card').removeClass('uk-hidden')
+            $('#csv-import-selector').addClass('card-disabled')
+            $('#json-import-selector').addClass('card-disabled')
+        }
       }
-    }
-
-    $scope.resetWizardSelection = function () {
-      $('#csv_wizard_card').addClass('uk-hidden')
-      $('#json_wizard_card').addClass('uk-hidden')
-      $('#ldap_wizard_card').addClass('uk-hidden')
 
-      $('#csv-import-selector').removeClass('card-disabled')
-      $('#json-import-selector').removeClass('card-disabled')
-      $('#ldap-import-selector').removeClass('card-disabled')
-    }
+      $scope.resetWizardSelection = function () {
+        $('#csv_wizard_card').addClass('uk-hidden')
+        $('#json_wizard_card').addClass('uk-hidden')
+        $('#ldap_wizard_card').addClass('uk-hidden')
 
-    $scope.accountEditPic = function () {
-      throttledAccountPicClick()
-    }
+        $('#csv-import-selector').removeClass('card-disabled')
+        $('#json-import-selector').removeClass('card-disabled')
+        $('#ldap-import-selector').removeClass('card-disabled')
+      }
 
-    function throttledAccountPicClick () {
-      $timeout(function () {
+      $scope.accountEditPic = function () {
+        // throttledAccountPicClick()
         var $profileImageInput = $('#profileImageInput')
-        $profileImageInput.on('click', function (event) {
-          // This function is a firefox hack to stop it from spawning 100000 file dialogs
-          event.stopPropagation()
+        $scope.$apply(function () {
+          $profileImageInput.trigger('click')
         })
+      }
+
+      function throttledAccountPicClick () {
+        $timeout(function () {
+          var $profileImageInput = $('#profileImageInput')
+          $profileImageInput.on('click', function (event) {
+            // This function is a firefox hack to stop it from spawning 100000 file dialogs
+            event.stopPropagation()
+          })
 
-        $profileImageInput.trigger('click')
-      }, 0)
-    }
-  })
+          $profileImageInput.trigger('click')
+        }, 0)
+      }
+    })
 })
diff --git a/src/views/subviews/profile.hbs b/src/views/subviews/profile.hbs
@@ -22,8 +22,8 @@
                     <form id="aUploadImageForm" class="form nomargin uk-clearfix" enctype="multipart/form-data">
                         <input type="hidden" name="_id" value="{{data.account._id}}" />
                         <input type="hidden" name="username" value="{{data.account.username}}" />
-                        <div class="largeProfilePic cursor-pointer hoverEffect" style="position: absolute; left: 35px; top: 0;" ng-click="accountEditPic()">
-                            <input id="profileImageInput" name="aProfile_{{data.account.username}}" type="file" value="{{data.account.image}}" style="display: none;" />
+                        <div class="largeProfilePic cursor-pointer hoverEffect" style="position: absolute; left: 35px; top: 0;" onclick="onProfileImageClick()">
+                            <input id="profileImageInput" name="aProfile_{{data.account.username}}" type="file" value="{{data.account.image}}" style="visibility: hidden; height: 0; width: 0" />
                             {{#if data.account.image}}
                                 <img id="profileImage" data-userid="{{data.account._id}}" src="/uploads/users/{{data.account.image}}" alt="{{data.account.username}}"/>
                             {{else}}
@@ -147,6 +147,8 @@
 
 {{#contentFor 'js-plugins'}}
     <script type="text/javascript">
-
+        function onProfileImageClick() {
+            document.getElementById('profileImageInput').click()
+        }
     </script>
 {{/contentFor}}