Jason Jordan
120 lines
3.8 KiB
JavaScript
120 lines
3.8 KiB
JavaScript
import { Controller } from "@hotwired/stimulus";
|
|
|
|
export default class extends Controller {
|
|
static targets = ["preview", "previewContainer", "logoSelect", "logofield", "initialLogoFile"];
|
|
|
|
async connect() {
|
|
console.log(this.logofieldTarget.value)
|
|
if (this.logofieldTarget.value.includes("Logo.")) {
|
|
const response = await fetch(`/card_logo_files/${this.logofieldTarget.value}/image`); // Fetch the binary data
|
|
const blob = await response.blob();
|
|
const objectUrl = URL.createObjectURL(blob);
|
|
this.previewTarget.src = objectUrl;
|
|
this.previewContainerTarget.classList.remove("hidden");
|
|
}
|
|
// Remember to revoke the URL when the controller is disconnected if necessary
|
|
// this.disconnect = () => URL.revokeObjectURL(objectUrl);
|
|
}
|
|
|
|
uploadLogo(event) {
|
|
console.log('in uploadLogo');
|
|
event.preventDefault()
|
|
const file = event.target.files[0];
|
|
if (!file) return;
|
|
|
|
const logoType = event.params.type
|
|
|
|
let newFileName = file.name
|
|
if (logoType == "network") {
|
|
console.log("n " + newFileName);
|
|
newFileName = this.determineNetworkFilename(file)
|
|
this.addOptionToSelect(newFileName)
|
|
} else if (logoType == "employer") {
|
|
newFileName = this.determineEmployerFilename(file)
|
|
this.logofieldTarget.value = newFileName;
|
|
}
|
|
|
|
this.previewFile(file);
|
|
|
|
// this.uploadLogoToServer(file);
|
|
|
|
|
|
}
|
|
|
|
previewFile(file) {
|
|
console.log('in previewFile');
|
|
const reader = new FileReader();
|
|
reader.onload = (e) => {
|
|
this.previewTarget.src = e.target.result;
|
|
this.previewContainerTarget.classList.remove("hidden");
|
|
};
|
|
reader.readAsDataURL(file);
|
|
}
|
|
|
|
async uploadLogoToServer(file) {
|
|
console.log('in uploadLogoToServer');
|
|
const formData = new FormData();
|
|
formData.append("card_logo_file[logo_file]", file);
|
|
formData.append("card_logo_file[logo_type]", "employer");
|
|
|
|
const csrfToken = document.querySelector("meta[name='csrf-token']").content;
|
|
|
|
try {
|
|
const response = await fetch("/card_logo_files/", {
|
|
method: "POST",
|
|
headers: {
|
|
"X-CSRF-Token": csrfToken
|
|
},
|
|
body: formData
|
|
});
|
|
|
|
if (response.ok) {
|
|
console.log('Upload successful!')
|
|
} else {
|
|
console.error("Failed to track event.");
|
|
}
|
|
} catch (error) {
|
|
console.error("Network error:", error);
|
|
}
|
|
}
|
|
|
|
addOptionToSelect(name) {
|
|
const blankOptionIndex = 0;
|
|
const newOption = new Option(name, name, true, true)
|
|
|
|
if (this.logoSelectTarget.options.length > blankOptionIndex + 1) {
|
|
this.logoSelectTarget.insertBefore(newOption, this.logoSelectTarget.options[blankOptionIndex + 1]);
|
|
} else {
|
|
this.logoSelectTarget.appendChild(newOption);
|
|
}
|
|
|
|
this.logoSelectTarget.value = name;
|
|
}
|
|
|
|
determineNetworkFilename(file) {
|
|
const fileExtension = file.name.split('.').pop();
|
|
const primaryNetworkName = prompt("Enter the name for the primary network (Usually 'Cigna' or 'MedCost':");
|
|
const secondaryNetworkName = prompt("Enter the name for the primary network (ex: Health Partners):");
|
|
const logoFilename = this.titleizeText(primaryNetworkName).concat(this.titleizeText(secondaryNetworkName)).concat("Logo.").concat(fileExtension).replaceAll(' ', '');
|
|
|
|
return logoFilename
|
|
}
|
|
|
|
determineEmployerFilename(file) {
|
|
const fileExtension = file.name.split('.').pop();
|
|
const employerName = prompt("Enter the name for the new Employer (minus any 'The's, 'LLC', or 'Health Plan'):");
|
|
const logoFilename = this.titleizeText(employerName).concat("Logo.").concat(fileExtension).replaceAll(' ', '');
|
|
|
|
return logoFilename
|
|
}
|
|
|
|
titleizeText(text) {
|
|
const titleized = text.toLowerCase();
|
|
|
|
return titleized.replace(/(^|\s)\S/g, function(match) {
|
|
return match.toUpperCase();
|
|
});
|
|
}
|
|
}
|
|
|