appointments.js
5 days ago
attendees.js
5 days ago
colorManipulation.js
5 days ago
customer.js
5 days ago
date.js
5 days ago
defaultCustomize.js
5 days ago
employee.js
5 days ago
events.js
5 days ago
formFieldsTemplates.js
5 days ago
formatting.js
5 days ago
helper.js
5 days ago
image.js
5 days ago
integrationApple.js
5 days ago
integrationGoogle.js
5 days ago
integrationOutlook.js
5 days ago
integrationStripe.js
5 days ago
integrationZoom.js
5 days ago
licence.js
5 days ago
phone.js
5 days ago
pricing.js
5 days ago
recurring.js
5 days ago
responsive.js
5 days ago
scrollElements.js
5 days ago
settings.js
5 days ago
translationsElementPlus.js
5 days ago
utilHeaderHeight.js
5 days ago
image.js
81 lines
| 1 | let usedColors = [] |
| 2 | let colors = [ |
| 3 | '1788FB', |
| 4 | '4BBEC6', |
| 5 | 'FBC22D', |
| 6 | 'FA3C52', |
| 7 | 'D696B8', |
| 8 | '689BCA', |
| 9 | '26CC2B', |
| 10 | 'FD7E35', |
| 11 | 'E38587', |
| 12 | '774DFB', |
| 13 | '31CDF3', |
| 14 | '6AB76C', |
| 15 | 'FD5FA1', |
| 16 | 'A697C5', |
| 17 | ] |
| 18 | |
| 19 | function usePictureLoad(baseUrls, entity, isPerson) { |
| 20 | if (entity !== null) { |
| 21 | let name = isPerson === true ? entity.firstName + ' ' + entity.lastName : entity.name |
| 22 | if (typeof name !== 'undefined') { |
| 23 | entity.pictureThumbPath = entity.pictureThumbPath || imageFromText(baseUrls, name) |
| 24 | return entity.pictureThumbPath |
| 25 | } |
| 26 | } |
| 27 | } |
| 28 | |
| 29 | function getNameInitials(name) { |
| 30 | return name |
| 31 | .split(' ') |
| 32 | .map((s) => s.charAt(0)) |
| 33 | .join('') |
| 34 | .toUpperCase() |
| 35 | .substring(0, 3) |
| 36 | .replace(/[^\w\s]/g, '') |
| 37 | } |
| 38 | |
| 39 | function imageFromText(baseUrls, name, entity = {}, error = false) { |
| 40 | let initials = getNameInitials(name) |
| 41 | let colorIndex = Math.floor(Math.random() * colors.length) |
| 42 | let colorHex = colors[colorIndex] |
| 43 | usedColors.push(colors[colorIndex]) |
| 44 | colors.splice(colorIndex, 1) |
| 45 | if (colors.length === 0) { |
| 46 | colors = usedColors |
| 47 | usedColors = [] |
| 48 | } |
| 49 | if (error) { |
| 50 | if (entity.firstName) { |
| 51 | return baseUrls.wpAmeliaPluginURL + 'public/img/default-employee.svg' |
| 52 | } |
| 53 | if (entity.latitude) { |
| 54 | return baseUrls.wpAmeliaPluginURL + 'public/img/default-location.svg' |
| 55 | } |
| 56 | return baseUrls.wpAmeliaPluginURL + 'public/img/default-service.svg' |
| 57 | } |
| 58 | |
| 59 | // Make canvas |
| 60 | const canvas = document.createElement('canvas') |
| 61 | canvas.width = 100 |
| 62 | canvas.height = 100 |
| 63 | const ctx = canvas.getContext('2d') |
| 64 | |
| 65 | // Draw background color |
| 66 | ctx.fillStyle = `#${colorHex}` // Background color |
| 67 | ctx.fillRect(0, 0, canvas.width, canvas.height) |
| 68 | |
| 69 | // Draw initials text |
| 70 | ctx.font = '40px Arial' |
| 71 | ctx.fillStyle = '#ffffff' // Text color |
| 72 | ctx.textAlign = 'center' |
| 73 | ctx.textBaseline = 'middle' |
| 74 | ctx.fillText(initials, canvas.width / 2, canvas.height / 2) |
| 75 | |
| 76 | // Convert canvas to data URL (as image source) |
| 77 | return canvas.toDataURL('image/png') |
| 78 | } |
| 79 | |
| 80 | export { usePictureLoad, getNameInitials } |
| 81 |