Wedding Invitation
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

emoney-modal.blade.php 3.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. <style>
  2. .copy-link {
  3. color: blue;
  4. text-decoration: underline;
  5. cursor: pointer;
  6. float: right;
  7. }
  8. </style>
  9. <dialog id="emoney" class="modal">
  10. <div class="modal-box w-11/12 max-w-5xl">
  11. <h3 class="text-lg font-bold">Hadiah</h3>
  12. <label class="form-control w-full max-w-xs">
  13. <div class="label">
  14. <span class="label-text">Nama Bank</span>
  15. </div>
  16. <input type="text" value="RHB Bank Berhad" class="input input-bordered input-sm input-accent w-full max-w-xs" disabled/>
  17. </label>
  18. <label class="form-control w-full max-w-xs">
  19. <div class="label">
  20. <span class="label-text">No. Akaun</span>
  21. </div>
  22. <p class="input input-bordered input-sm input-accent w-full max-w-xs">
  23. 15601700275298
  24. <span id="copyText" class="copy-link">(copy)</span>
  25. </p>
  26. <p id="copyMessage" class="text-green-500" style="display:none;">Copied to clipboard!</p>
  27. </label>
  28. <label class="form-control w-full max-w-xs">
  29. <div class="label">
  30. <span class="label-text">Kod QR</span>
  31. </div>
  32. <img src="{{asset('assets/qr-bank.jpeg')}}" alt="">
  33. </label>
  34. <div class="modal-action">
  35. <form method="dialog">
  36. <button class="btn">Tutup</button>
  37. </form>
  38. </div>
  39. </div>
  40. </dialog>
  41. <script>
  42. document.getElementById('copyText').addEventListener('click', function() {
  43. var textToCopy = "15601700275298";
  44. if (navigator.clipboard && window.isSecureContext) {
  45. // navigator.clipboard API method
  46. navigator.clipboard.writeText(textToCopy).then(function() {
  47. var copyMessage = document.getElementById('copyMessage');
  48. copyMessage.style.display = 'block';
  49. setTimeout(function() {
  50. copyMessage.style.display = 'none';
  51. }, 2000);
  52. }).catch(function(error) {
  53. alert('Failed to copy text: ' + error);
  54. });
  55. } else {
  56. // Fallback method for older browsers or non-secure contexts
  57. // Create a temporary textarea element
  58. var tempTextArea = document.createElement('textarea');
  59. tempTextArea.value = textToCopy;
  60. document.body.appendChild(tempTextArea);
  61. // Select the text
  62. tempTextArea.select();
  63. tempTextArea.setSelectionRange(0, 99999); // For mobile devices
  64. try {
  65. document.execCommand('copy');
  66. var copyMessage = document.getElementById('copyMessage');
  67. copyMessage.style.display = 'block';
  68. setTimeout(function() {
  69. copyMessage.style.display = 'none';
  70. }, 2000);
  71. } catch (error) {
  72. alert('Failed to copy text: ' + error);
  73. }
  74. document.body.removeChild(tempTextArea);
  75. }
  76. });
  77. </script>