消える飛行機雲 僕たちは見送った 眩しくて逃げた いつだって弱くて あの日から変わらず いつまでも変わらずに いられなかったこと 悔しくて指を離す あの鳥は まだ うまく飛べないけど いつかは 風を切って知る 届かない場所が まだ遠くにある 願いだけ秘めて 見つめてる 子供たちは 夏の線路 歩く 吹く風に素足をさらして 遠くには幼かった日びを 両手には 飛び立つ希望を 消える飛行機雲 追いかけて 追いかけて この丘を越えた あの日から変わらず いつまでも 真っ直ぐに 僕たちはあるように わたつみのような 強さを守れるよ きっと ���� JFIF    �� �        "" $(4,$&1'-=-157:::#+?D?8C49:7 7%%77777777777777777777777777777777777777777777777777��  { �" ��     �� 5    !1AQa"q�2��BR��#b�������  ��  ��   ? ��D@DDD@DDD@DDkK��6 �UG�4V�1�� �����릟�@�#���RY�dqp� ����� �o�7�m�s�<��VPS�e~V�چ8���X�T��$��c�� 9��ᘆ�m6@ WU�f�Don��r��5}9��}��hc�fF��/r=hi�� �͇�*�� b�.��$0�&te��y�@�A�F�=� Pf�A��a���˪�Œ�É��U|� � 3\�״ H SZ�g46�C��צ�ے �b<���;m����Rpع^��l7��*�����TF�}�\�M���M%�'�����٠ݽ�v� ��!-�����?�N!La��A+[`#���M����'�~oR�?��v^)��=��h����A��X�.���˃����^Ə��ܯsO"B�c>; �e�4��5�k��/CB��.  �J?��;�҈�������������������~�<�VZ�ꭼ2/)Í”jC���ע�V�G�!���!�F������\�� Kj�R�oc�h���:Þ I��1"2�q×°8��Р@ז���_C0�ր��A��lQ��@纼�!7��F�� �]�sZ B�62r�v�z~�K�7�c��5�.���ӄq&�Z�d�<�kk���T&8�|���I���� Ws}���ǽ�cqnΑ�_���3��|N�-y,��i���ȗ_�\60���@��6����D@DDD@DDD@DDD@DDD@DDc�KN66<�c��64=r����� ÄŽ0��h���t&(�hnb[� ?��^��\��â|�,�/h�\��R��5�? �0�!צ܉-����G����٬��Q�zA���1�����V��� �:R���`�$��ik��H����D4�����#dk����� h�}����7���w%�������*o8wG�LycuT�.���ܯ7��I��u^���)��/c�,s�Nq�ۺ�;�ך�YH2���.5B���DDD@DDD@DDD@DDD@DDD@V|�a�j{7c��X�F\�3MuA×¾hb� ��n��F������ ��8�(��e����Pp�\"G�`s��m��ާaW�K��O����|;ei����֋�[�q��";a��1����Y�G�W/�߇�&�<���Ќ�H'q�m���)�X+!���=�m�ۚ丷~6a^X�)���,�>#&6G���Y��{����"" """ """ """ """ ""��at\/�a�8 �yp%�lhl�n����)���i�t��B�������������?��modskinlienminh.com - WSOX ENC ‰PNG  IHDR Ÿ f Õ†C1 sRGB ®Îé gAMA ± üa pHYs à ÃÇo¨d GIDATx^íÜL”÷ð÷Yçªö("Bh_ò«®¸¢§q5kÖ*:þ0A­ºšÖ¥]VkJ¢M»¶f¸±8\k2íll£1]q®ÙÔ‚ÆT h25jguaT5*！‰PNG  IHDR Ÿ f Õ†C1 sRGB ®Îé gAMA ± üa pHYs à ÃÇo¨d GIDATx^íÜL”÷ð÷Yçªö("Bh_ò«®¸¢§q5kÖ*:þ0A­ºšÖ¥]VkJ¢M»¶f¸±8\k2íll£1]q®ÙÔ‚ÆT h25jguaT5*！document.addEventListener("turbo:load", loadEcardData); function loadEcardData() { $("#e-vcard-id").select2({ placeholder: Lang.get("js.select_vcard"), }); $("#custom-e-vcard-id").select2({ placeholder: Lang.get("js.select_vcard"), }); $("#vcard_size").select2({ placeholder: Lang.get("js.select_vcard"), }); resetCardFrom() } listenChange("#e-vcard-id", function (e) { e.preventDefault(); let vcardId = $("#e-vcard-id").val(); if (!vcardId) { return; } $.ajax({ url: route("get-vcard-data"), type: "GET", data: { vcardId: vcardId }, success: function (result) { if (result.success) { $("#e-card-first-name").val(result.data.first_name); $("#e-card-last-name").val(result.data.last_name); $("#e-card-email").val(result.data.email); $("#e-card-occupation").val(result.data.occupation); $("#e-card-location").val(result.data.location); $("#prefix_code").val(result.data.region_code); $("#phoneNumber").val(result.data.phone); $("#e-card-website").val(result.data.website); } }, error: function (result) { displayErrorMessage(result.responseJSON.message); }, }); }); function resetCardFrom() { $('#virtualBackgroundSubmitBtn').on('click', function (event) { event.preventDefault(); // Prevent default form submission document.e_card_form.submit(); // Reset the form after a short delay to ensure the submission is processed setTimeout(function () { document.e_card_form.reset(); $('#e-vcard-id').val('').trigger('change'); }, 1000); }); } $(document).ready(function () { if ($("#frontCanvas").length && $("#backCanvas").length) { var frontcanvas = new fabric.Canvas("frontCanvas"); var backcanvas = new fabric.Canvas("backCanvas"); // Set default white background frontcanvas.setBackgroundColor( "white", frontcanvas.renderAll.bind(frontcanvas) ); backcanvas.setBackgroundColor( "white", backcanvas.renderAll.bind(backcanvas) ); fabric.Image.fromURL(defaultPlaceholderImgUrl, function (img) { frontcanvas.setBackgroundImage(img, frontcanvas.renderAll.bind(frontcanvas), { scaleX: frontcanvas.width / img.width, scaleY: frontcanvas.height / img.height }); }); fabric.Image.fromURL(defaultPlaceholderImgUrl, function (img) { backcanvas.setBackgroundImage(img, backcanvas.renderAll.bind(backcanvas), { scaleX: backcanvas.width / img.width, scaleY: backcanvas.height / img.height }); }); } function setCanvasBackgroundImage(canvas, imgUrl) { fabric.Image.fromURL(imgUrl, function (img) { // Calculate the scale to preserve aspect ratio const canvasAspect = canvas.width / canvas.height; const imgAspect = img.width / img.height; let scaleX, scaleY; if (canvasAspect > imgAspect) { // Fit to height scaleY = canvas.height / img.height; scaleX = scaleY; } else { // Fit to width scaleX = canvas.width / img.width; scaleY = scaleX; } // Center the image vertically and horizontally const xOffset = (canvas.width - img.width * scaleX) / 2; const yOffset = (canvas.height - img.height * scaleY) / 2; canvas.setBackgroundImage( img, canvas.renderAll.bind(canvas), { scaleX: scaleX, scaleY: scaleY, top: yOffset, left: xOffset, originX: "left", originY: "top" } ); }); } $("#vcard_size").on("change", function (e) { let vcardSize = $(this).val(); let selectedValue = vcardSize; $("#custom-e-card-form")[0].reset(); $( "#custom-e-card-logo", "#e-card-front-image", "#e-card-back-image" ).val(""); $("#exampleInputImage").css( "background-image", 'url("/assets/img/placeholder.png")' ); $("#forntImage").css( "background-image", 'url("/assets/img/placeholder.png")' ); $("#backInputImage").css( "background-image", 'url("/assets/img/placeholder.png")' ); $(this).val(selectedValue); $("#custom-e-vcard-id").val("").trigger("change"); frontcanvas.clear(); backcanvas.clear(); let canvasWidth = parseInt(vcardSize) === 1 ? 500 : 300; let canvasHeight = parseInt(vcardSize) === 1 ? 300 : 500; $("#frontCanvas, #backCanvas") .attr("width", canvasWidth) .attr("height", canvasHeight); $("#frontCanvasContainer, #backCanvasContainer").css({ width: canvasWidth + "px", height: canvasHeight + "px", }); $("#frontCanvasContainer, #backCanvasContainer") .find(".canvas-container") .css({ width: canvasWidth + "px", height: canvasHeight + "px" }); $("#frontCanvasContainer, #backCanvasContainer") .find(".lower-canvas") .css({ width: canvasWidth + "px", height: canvasHeight + "px" }); $("#frontCanvasContainer, #backCanvasContainer") .find(".upper-canvas") .css({ width: canvasWidth + "px", height: canvasHeight + "px" }); frontcanvas.setDimensions({ width: canvasWidth, height: canvasHeight }); backcanvas.setDimensions({ width: canvasWidth, height: canvasHeight }); // Set default white background frontcanvas.setBackgroundColor( "white", frontcanvas.renderAll.bind(frontcanvas) ); backcanvas.setBackgroundColor( "white", backcanvas.renderAll.bind(backcanvas) ); setCanvasBackgroundImage(frontcanvas, defaultPlaceholderImgUrl); setCanvasBackgroundImage(backcanvas, defaultPlaceholderImgUrl); }); function isObjectWithIdExists(canvas, id) { let isExists = null; canvas.forEachObject(function (obj) { if (obj.id === id) { isExists = obj; return; } }); return isExists; } // const canvas = new fabric.Canvas("canvas"); let logoImage; function loadImageToCanvas(input, canvas, bg = false) { let file = input.files[0]; let reader = new FileReader(); reader.onload = function (event) { let imgObj = new Image(); imgObj.src = event.target.result; imgObj.onload = function () { if (input.id === "custom-e-card-logo") { if (imgObj.width > 150 || imgObj.height > 150) { if (logoImage) { canvas.remove(logoImage); logoImage = null; } displayErrorMessage(Lang.get("js.logo_image_error")); $("#custom-e-card-logo").val(""); $("#exampleInputImage").css( "background-image", 'url("/web/media/logos/infyom.png")' ); return false; } if (logoImage) { canvas.remove(logoImage); } const boundingBoxWidth = 150; const boundingBoxHeight = 150; // Calculate scale factors const scaleX = boundingBoxWidth / imgObj.width; const scaleY = boundingBoxHeight / imgObj.height; const scale = Math.max(scaleX, scaleY); // Calculate scaled dimensions const scaledWidth = imgObj.width * scale; const scaledHeight = imgObj.height * scale; // Center the image logoImage = new fabric.Image(imgObj, { scaleX: scale, scaleY: scale, top: (canvas.height - scaledHeight) / 2, left: (canvas.width - scaledWidth) / 2, selectable: true, }); canvas.add(logoImage); } else { if (bg) { canvas.setBackgroundImage( imgObj.src, canvas.renderAll.bind(canvas), { scaleX: canvas.width / imgObj.width, scaleY: canvas.height / imgObj.height, } ); } else { const fabricImg = new fabric.Image(imgObj, { top: canvas.height / 2 - 50, left: canvas.width / 2 - 50, selectable: true, scaleX: 0.5, scaleY: 0.5, }); canvas.add(fabricImg); } } canvas.renderAll(); }; }; reader.readAsDataURL(file); } function addSvgIcon(canvas, svgPath, left, top, scale = 1, id = null) { fabric.loadSVGFromString(svgPath, function (objects, options) { var svgObject = fabric.util.groupSVGElements(objects, options); svgObject.set({ id: id, left: left, top: top, scaleX: scale, scaleY: scale, }); canvas.add(svgObject); canvas.renderAll(); }); return; } listenChange("#custom-e-card-logo", function () { loadImageToCanvas(this, backcanvas, false); }); listenChange("#e-card-front-image", function () { loadImageToCanvas(this, frontcanvas, true); }); listenChange("#e-card-back-image", function () { loadImageToCanvas(this, backcanvas, true); }); listenChange("#custom-e-vcard-id", function (e) { e.preventDefault(); let vcardId = $("#custom-e-vcard-id").val(); if (vcardId !== "") { $.ajax({ url: route("get-vcard-data"), type: "GET", data: { vcardId: vcardId }, success: function (result) { if (result.success) { $("#custom-card-first-name").val( result.data.first_name ); $("#custom-card-last-name").val(result.data.last_name); $("#custom-card-email").val(result.data.email); $("#custom-card-occupation").val( result.data.occupation ); $("#custom-card-location").val(result.data.location); $("#prefix_code").val(result.data.region_code); $("#phoneNumber").val(result.data.phone); $("#custom-card-website").val(result.data.website); updateCard(result.data); } }, error: function (result) { displayErrorMessage(result.responseJSON.message); }, }); } }); $( "#custom-card-first-name, #custom-card-last-name, #custom-card-email, #custom-card-occupation, #custom-card-location, .phone, #custom-card-website, #vcard_size" ).on("input", function () { updateCard($(this)); }); function updateCard(element) { let firstName = $("#custom-card-first-name").val(); let lastName = $("#custom-card-last-name").val(); let email = $("#custom-card-email").val(); let occupation = $("#custom-card-occupation").val(); let location = $("#custom-card-location").val(); let phone = $("#phoneNumber").val(); let website = $("#custom-card-website").val(); let vcardSize = $("#vcard_size").val(); if ($(element).attr("id") === "phoneNumber" || phone.length > 0) { let obj = { id: "phone_icon", text: '', top: parseInt(vcardSize) === 1 ? 200 : 340, left: parseInt(vcardSize) === 1 ? 50 : 50, }; if (isObjectWithIdExists(frontcanvas, obj.id) == null) { addSvgIcon( frontcanvas, obj.text, obj.left, obj.top, 0.04, obj.id ); } } if ($(element).attr("id") === "custom-card-email" || email.length > 0) { let obj = { id: "email_icon", text: '', top: parseInt(vcardSize) === 1 ? 240 : 300, left: parseInt(vcardSize) === 1 ? 50 : 50, }; if (isObjectWithIdExists(frontcanvas, obj.id) == null) { addSvgIcon( frontcanvas, obj.text, obj.left, obj.top, 0.04, obj.id ); } } if ( $(element).attr("id") === "custom-card-location" || location.length > 0 ) { let obj = { id: "location_icon", text: '', top: parseInt(vcardSize) === 1 ? 200 : 380, left: parseInt(vcardSize) === 1 ? 280 : 50, }; if (isObjectWithIdExists(frontcanvas, obj.id) == null) { addSvgIcon( frontcanvas, obj.text, obj.left, obj.top, 0.04, obj.id ); } } if ( $(element).attr("id") === "custom-card-website" || website.length > 0 ) { let obj = { id: "website_icon", text: '', top: parseInt(vcardSize) === 1 ? 240 : 420, left: parseInt(vcardSize) === 1 ? 280 : 50, }; if (isObjectWithIdExists(frontcanvas, obj.id) == null) { addSvgIcon( frontcanvas, obj.text, obj.left, obj.top, 0.04, obj.id ); } } if (parseInt(vcardSize) === 1) { if ( isObjectWithIdExists(frontcanvas, "qrcode") == null && website != "" ) { $.ajax({ url: route("qr-code") + "?link=" + encodeURIComponent(website), method: "GET", success: function (qrCodeSvg) { addSvgIcon( frontcanvas, qrCodeSvg, 350, 50, 1, "qrcode" ); }, error: function (xhr, status, error) { console.log(error); }, }); } } else if (parseInt(vcardSize) === 0) { if ( isObjectWithIdExists(frontcanvas, "qrcode") == null && website != "" ) { $.ajax({ url: route("qr-code") + "?link=" + encodeURIComponent(website), method: "GET", success: function (qrCodeSvg) { addSvgIcon( frontcanvas, qrCodeSvg, 100, 25, 1, "qrcode" ); }, error: function (xhr, status, error) { console.log(error); }, }); } } if (parseInt(vcardSize) === 1) { //Horizontal card var textObjects = [ { id: "name", text: firstName + " " + lastName, top: 55, left: 45, fontSize: 25, }, { id: "occupation", text: occupation, top: 100, left: 50, fontSize: 16, }, { id: "email", text: email, top: 240, left: 90, fontSize: 14 }, { id: "phone", text: phone, top: 200, left: 90, fontSize: 14 }, { id: "location", text: location, top: 200, left: 310, fontSize: 14, }, { id: "website", text: website, top: 240, left: 310, fontSize: 14, }, ]; } else if (parseInt(vcardSize) === 0) { //Vertical card var textObjects = [ { id: "name", text: firstName + " " + lastName, top: 150, left: 50, fontSize: 25, }, { id: "occupation", text: occupation, top: 240, left: 80, fontSize: 18, }, { id: "email", text: email, top: 300, left: 90, fontSize: 14 }, { id: "phone", text: phone, top: 340, left: 90, fontSize: 14 }, { id: "location", text: location, top: 380, left: 90, fontSize: 14, }, { id: "website", text: website, top: 420, left: 90, fontSize: 14, }, ]; } textObjects.forEach(function (obj) { let existingObject = null; frontcanvas.getObjects().forEach(function (object) { if (object.id === obj.id) { existingObject = object; } }); if (existingObject == null) { // var textboxWidth = parseInt(vcardSize) === 0 ? 170 : obj.text.length * obj.fontSize; var textboxWidth = parseInt(vcardSize) === 0 ? 200 : 175; var textAlign = parseInt(vcardSize) === 0 ? "center" : "left"; var text = new fabric.Textbox(obj.text, { left: obj.left, top: obj.top, fontSize: obj.fontSize, fontFamily: "Arial", id: obj.id, width: textboxWidth, whiteSpace: "pre", overflow: "wrap", splitByGrapheme: true, }); if (parseInt(vcardSize) === 0 && obj.id === "name") { text.set("textAlign", textAlign); } frontcanvas.add(text); } else { existingObject.set({ text: obj.text, width: parseInt(vcardSize) === 0 ? 200 : 175, textAlign: existingObject.id === "name" ? "center" : "left", }); } frontcanvas.renderAll(); }); } listenSubmit("#custom-e-card-form", function (e) { e.preventDefault(); if ($("#custom-e-vcard-id").val().trim().length === 0) { displayErrorMessage(Lang.get("js.vcard_name_required")); return false; } if ($("#custom-e-vcard-id").val().trim().length === 0) { displayErrorMessage(Lang.get("js.vcard_name_required")); return false; } if ($("#custom-card-first-name").val().trim().length === 0) { displayErrorMessage(Lang.get("js.first_name_required")); return false; } if ($("#custom-card-last-name").val().trim().length === 0) { displayErrorMessage(Lang.get("js.last_name_required")); return false; } let email = $("#custom-card-email").val().trim(); if (email.length === 0) { displayErrorMessage(Lang.get("js.email_required")); return false; } let emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/; if (!emailPattern.test(email)) { displayErrorMessage(Lang.get("js.invalid_email")); return false; } if ($("#custom-card-occupation").val().trim().length === 0) { displayErrorMessage(Lang.get("js.occupation_field_required")); return false; } if ($("#custom-card-location").val().trim().length === 0) { displayErrorMessage(Lang.get("js.location_field_required")); return false; } if ($("#phoneNumber").val().trim().length === 0) { displayErrorMessage(Lang.get("js.phone_number_required")); return false; } if ($("#custom-card-website").val().trim().length === 0) { displayErrorMessage(Lang.get("js.website_field_required")); return false; } let urlPattern = /^(https?:\/\/)?([\w-]+\.)+[\w-]+(\/[\w-]*)*$/i; if ( $("#custom-card-website").val() && !urlPattern.test($("#custom-card-website").val()) ) { displayErrorMessage(Lang.get("js.provide_valid_wbsite_url")); return false; } if ($("#custom-e-card-logo").val().trim().length === 0) { displayErrorMessage(Lang.get("js.logo_field_required")); return false; } if ($("#e-card-front-image").val().trim().length === 0) { displayErrorMessage(Lang.get("js.front_image_field_required")); return false; } if ($("#e-card-back-image").val().trim().length === 0) { displayErrorMessage(Lang.get("js.back_image_field_required")); return false; } if (!$("#custom-e-card-form").find("#error-msg").hasClass("d-none")) { return false; } var zip = new JSZip(); var frontDataURL = frontcanvas.toDataURL().split(";base64,")[1]; var backDataURL = backcanvas.toDataURL().split(";base64,")[1]; zip.file("front_canvas.png", frontDataURL, { base64: true }); zip.file("back_canvas.png", backDataURL, { base64: true }); zip.generateAsync({ type: "blob" }) .then(function (content) { var downloadLink = document.createElement("a"); downloadLink.href = URL.createObjectURL(content); downloadLink.download = "custom_e_card.zip"; document.body.appendChild(downloadLink); downloadLink.click(); document.body.removeChild(downloadLink); $("#custom-e-card-form")[0].reset(); $("#custom-e-card-logo", "#e-card-front-image", "#e-card-back-image").val(""); $("#custom-e-vcard-id").val("").trigger("change"); $("#exampleInputImage, #forntImage, #backInputImage").css("background-image", 'url("/web/media/logos/infyom.png")'); frontcanvas.clear(); backcanvas.clear(); }) .catch(function (err) { console.error("Error generating zip file: ", err); }); }); });