New feature: Added copyText function to admin order view page for copying order details

app/design/adminhtml/default/default/template/page/footer.phtml

@@ -30,5 +30,6 @@
             setLocation('<?php echo $this->getChangeLocaleUrl() ?>locale/'+elem.value+'/<?php echo $this->getRefererParamName() ?>/<?php echo $this->getUrlForReferer() ?>');
         }
     }
-    Event.observe('interface_locale', 'change', setInterfaceLanguage)
+    Event.observe('interface_locale', 'change', setInterfaceLanguage);
+    addCopyIcons();
 </script>

app/design/adminhtml/default/default/template/sales/order/view/info.phtml

@@ -28,7 +28,7 @@ $orderStoreDate = $this->formatDate($_order->getCreatedAtStoreDate(), 'medium',
         endif; ?>
         <div class="entry-edit-head">
         <?php if ($this->getNoUseOrderLink()): ?>
-            <h4 class="icon-head head-account"><?php echo Mage::helper('sales')->__('Order # %s', $this->escapeHtml($_order->getRealOrderId())) ?> (<?php echo $_email ?>)</h4>
+            <h4 class="icon-head head-account" data-copy-text="<?php echo $_order->getRealOrderId() ?>"><?php echo Mage::helper('sales')->__('Order # %s', $this->escapeHtml($_order->getRealOrderId())) ?> (<?php echo $_email ?>)</h4>
         <?php else: ?>
             <a href="<?php echo $this->getViewUrl($_order->getId()) ?>"><?php echo Mage::helper('sales')->__('Order # %s', $this->escapeHtml($_order->getRealOrderId())) ?></a>
             <strong>(<?php echo $_email ?>)</strong>
@@ -114,7 +114,7 @@ $orderStoreDate = $this->formatDate($_order->getCreatedAtStoreDate(), 'medium',
                 </tr>
                 <tr>
                     <td class="label"><label><?php echo Mage::helper('sales')->__('Email') ?></label></td>
-                    <td class="value"><a href="mailto:<?php echo $this->escapeHtml($_order->getCustomerEmail()) ?>"><strong><?php echo $this->escapeHtml($_order->getCustomerEmail()) ?></strong></a></td>
+                    <td class="value"><a href="mailto:<?php echo $this->escapeHtml($_order->getCustomerEmail()) ?>" data-copy-text="<?php echo $_order->getCustomerEmail()?>"><strong><?php echo $this->escapeHtml($_order->getCustomerEmail()) ?></strong></a></td>
                 </tr>
                 <?php if ($_groupName = $this->getCustomerGroupName()) : ?>
                 <tr>

app/design/adminhtml/default/default/template/sales/order/view/tab/info.phtml

@@ -51,6 +51,13 @@
                 <?php  if ($_order->getTracksCollection()->count()) : ?>
                 <a href="#" id="linkId" onclick="popWin('<?php echo $this->helper('shipping')->getTrackingPopupUrlBySalesModel($_order) ?>','trackorder','width=800,height=600,resizable=yes,scrollbars=yes')" title="<?php echo $this->quoteEscape($this->__('Track Order')) ?>"><?php echo $this->__('Track Order') ?></a>
                 <br/>
+                    <?php foreach ($_order->getTracksCollection() as $_track): ?>
+                        <div>
+                            <?php $trackNumber = $_track->getNumber();?>
+                            <strong><?php echo $_track->getTitle() ?></strong>
+                            <span data-copy-text="<?php echo $trackNumber ?>"><?php echo $trackNumber ?></span>
+                        </div> 
+                    <?php endforeach; ?>
                 <?php endif ?>
                 <?php if ($_order->getShippingDescription()): ?>
                     <strong><?php echo $this->escapeHtml($_order->getShippingDescription()) ?></strong>

js/varien/js.js

@@ -703,3 +703,45 @@ function buttonDisabler() {
         button.disabled = true;
     });
 }
+
+/**
+ * Adds copy icons to elements that have the class 'copy-text'
+ */
+function addCopyIcons() {
+    if (navigator.clipboard === undefined) {
+        return;
+    }
+
+    const copyTexts = document.querySelectorAll('[data-copy-text]');
+    copyTexts.forEach(copyText => {
+        const iconElement = createCopyIconElement();
+        copyText.parentNode.appendChild(iconElement);
+    });
+}
+
+/**
+ * @return {HTMLElement} The created copy icon element
+ */
+function createCopyIconElement() {
+    const copyIcon = document.createElement('span');
+    copyIcon.classList.add('icon-copy');
+    copyIcon.setAttribute('onclick', 'copyText(event)');
+    copyIcon.setAttribute('title', Translator.translate('Copy text to clipboard'));
+
+    return copyIcon;
+}
+
+/**
+ * Copies the text from the data-text attribute of the clicked element to the clipboard
+ *
+ * @param {Event} event - The event object triggered by the click event
+ */
+function copyText(event) {
+    const copyIcon = event.currentTarget;
+    const copyText = copyIcon.previousElementSibling.getAttribute('data-copy-text');
+    navigator.clipboard.writeText(copyText);
+    copyIcon.classList.add('icon-copy-copied');
+    setTimeout(() => {
+        copyIcon.classList.remove('icon-copy-copied');
+    }, 1000);
+}

skin/adminhtml/default/openmage/scss/override.scss

@@ -1160,3 +1160,24 @@ img[src$='grid-cal.gif'] {
 .emph, .accent {
   color: $color_action !important;
 }
+
+.icon-copy {
+  display: inline-block;
+  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 111.07 122.88"><path d="M97.67 20.81h0l.01.02a13.38 13.38 0 0 1 9.46 3.93 13.32 13.32 0 0 1 3.9 9.42h.02v.02 75.28.01h-.02c-.01 3.68-1.51 7.03-3.93 9.46a13.32 13.32 0 0 1-9.42 3.9v.02h-.02-59.19-.01v-.02c-3.69-.01-7.04-1.5-9.46-3.93a13.37 13.37 0 0 1-3.91-9.42h0V34.2v-.01h.02c.01-3.69 1.52-7.04 3.94-9.46 2.41-2.4 5.73-3.9 9.42-3.91v-.02h.02l59.17.01h0zM.02 75.38L0 13.39v-.01h.02a13.44 13.44 0 0 1 3.93-9.46A13.37 13.37 0 0 1 13.37.01V0h.02 59.19c7.69 0 8.9 9.96.01 10.16H13.4h-.02v-.02c-.88 0-1.68.37-2.27.97-.59.58-.96 1.4-.96 2.27h.02v.01 3.17 58.81c0 8.26-10.15 8.72-10.15.01h0zm100.89 34.11V34.2v-.02h.02c0-.87-.37-1.68-.97-2.27-.59-.58-1.4-.96-2.28-.96v.02h-.01-59.19-.02v-.02c-.88 0-1.68.38-2.27.97-.59.58-.96 1.4-.96 2.27h.02v.01 75.28.02h-.02c0 .88.38 1.68.97 2.27s1.4.96 2.27.96v-.02h.01 59.19.02v.02c.87 0 1.68-.38 2.27-.97.59-.58.96-1.4.96-2.27h-.01 0 0 0z" fill-rule="evenodd"/></svg>');
+  background-repeat: no-repeat;
+  background-size: contain;
+  cursor: pointer;
+  width: 12px;
+  height: 12px;
+  margin: 2px 0 0 2px;
+}
+
+.entry-edit-head .icon-copy {
+  width: 16px;
+  height: 16px;
+  margin: 8px 0 0 5px;
+}
+
+.icon-copy-copied {
+  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 30 30"><path d="M26.98 5.99a1 1 0 0 0-.687.303L11 21.586l-6.293-6.293a1 1 0 1 0-1.414 1.414l7 7a1 1 0 0 0 1.414 0l16-16a1 1 0 0 0-.727-1.717z"/></svg>');
+}