{"id":14402,"date":"2026-06-19T09:46:37","date_gmt":"2026-06-19T07:46:37","guid":{"rendered":"https:\/\/store.algosyntax.com\/?post_type=download&#038;p=14402"},"modified":"2026-06-19T12:26:42","modified_gmt":"2026-06-19T10:26:42","slug":"midi-ui-rhythm-bundle","status":"publish","type":"download","link":"https:\/\/store.algosyntax.com\/marketplace\/unreal-engine\/midi-ui-rhythm-bundle\/","title":{"rendered":"MIDI Engine UI &amp; Rhythm Bundle"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"14402\" class=\"elementor elementor-14402\" data-elementor-post-type=\"download\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6a1544c e-flex e-con-boxed e-con e-parent\" data-id=\"6a1544c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bf08a1d elementor-widget elementor-widget-heading\" data-id=\"bf08a1d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">MIDI Engine UI &amp; Rhythm Bundle<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-01f7c67 elementor-widget elementor-widget-text-editor\" data-id=\"01f7c67\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>MIDI Engine UI &amp; Rhythm Bundle combines <a href=\"https:\/\/store.algosyntax.com\/marketplace\/unreal-engine\/midi-engine\/\"><strong>MidiEngine<\/strong><\/a> and <a href=\"https:\/\/store.algosyntax.com\/marketplace\/unreal-engine\/umg-musical-grids\/\"><strong>UMG Musical Grids<\/strong><\/a> to give Unreal Engine developers both the MIDI backend and the musical UI foundation needed for rhythm games, MIDI visualizers, piano-roll interfaces, sequencers, music editors, and runtime music tools.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d543dbe elementor-widget elementor-widget-image\" data-id=\"d543dbe\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"1920\" height=\"1080\" src=\"https:\/\/store.algosyntax.com\/wp-content\/uploads\/edd\/marketplace\/unreal-engine\/midi-ui-rhythm-bundle\/midi-ui-rhythm-bundle-banner3.jpg\" class=\"attachment-full size-full wp-image-14435\" alt=\"\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-347323d e-con-full e-flex e-con e-child\" data-id=\"347323d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-85e5275 elementor-widget elementor-widget-heading\" data-id=\"85e5275\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Buy MIDI Engine UI &amp; Rhythm Bundle<\/h2>\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7d7e4e5 e-con-full e-flex e-con e-child\" data-id=\"7d7e4e5\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-307a159 elementor-widget__width-initial elementor-widget elementor-widget-asx-edd-buy-dropdown\" data-id=\"307a159\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"asx-edd-buy-dropdown.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t        <style>\n            #asx-edd-buy-307a159.asx-edd-buy {\n                display: block;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-form {\n                display: inline-flex;\n                flex-direction: column;\n                align-items: flex-start;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-form .asx-edd-buy-button {\n                align-self: flex-start;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-button {\n                display: inline-flex;\n                align-items: center;\n                justify-content: center;\n                vertical-align: middle;\n                line-height: 1.2;\n                border-width: 1px;\n                border-style: solid;\n                text-decoration: none;\n                box-sizing: border-box;\n                cursor: pointer;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-button:hover,\n            #asx-edd-buy-307a159 .asx-edd-buy-button:focus {\n                text-decoration: none;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-icon,\n            #asx-edd-buy-307a159 .asx-edd-buy-owned-icon,\n            #asx-edd-buy-307a159 .asx-edd-buy-pre-price-text,\n            #asx-edd-buy-307a159 .asx-edd-buy-price,\n            #asx-edd-buy-307a159 .asx-edd-buy-discount-text,\n            #asx-edd-buy-307a159 .asx-edd-buy-original-price,\n            #asx-edd-buy-307a159 .asx-edd-buy-post-price-text,\n            #asx-edd-buy-307a159 .asx-edd-buy-owned-text {\n                display: inline-flex;\n                align-items: center;\n                line-height: inherit;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-icon,\n            #asx-edd-buy-307a159 .asx-edd-buy-owned-icon {\n                justify-content: center;\n                flex: 0 0 auto;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-icon i,\n            #asx-edd-buy-307a159 .asx-edd-buy-icon svg,\n            #asx-edd-buy-307a159 .asx-edd-buy-owned-icon i,\n            #asx-edd-buy-307a159 .asx-edd-buy-owned-icon svg {\n                display: block;\n                line-height: 1;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-original-price {\n                text-decoration: line-through;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-label {\n                display: block;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-select {\n                max-width: 100%;\n                border-width: 1px;\n                border-style: solid;\n                box-sizing: border-box;\n            }\n        <\/style>\n        <div id=\"asx-edd-buy-307a159\" class=\"asx-edd-buy\">        <style>\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-dropdown {\n                position: relative;\n                display: inline-flex;\n                flex-direction: column;\n                max-width: 100%;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-trigger {\n                display: inline-flex;\n                align-items: center;\n                justify-content: space-between;\n                gap: 12px;\n                max-width: 100%;\n                border-width: 1px;\n                border-style: solid;\n                box-sizing: border-box;\n                cursor: pointer;\n                text-align: left;\n                line-height: 1.2;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-trigger-content,\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-content,\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-price-line {\n                display: inline-flex;\n                flex-wrap: wrap;\n                line-height: inherit;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-trigger-content,\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-content {\n                align-items: var(--asx-edd-buy-option-align-items, flex-start);\n                justify-content: var(--asx-edd-buy-option-justify-content, flex-start);\n                text-align: var(--asx-edd-buy-option-text-align, left);\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-price-line {\n                align-items: center;\n                justify-content: var(--asx-edd-buy-price-line-justify-content, flex-start);\n                column-gap: var(--asx-edd-buy-price-line-column-gap, 8px);\n                row-gap: 0;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-trigger-content {\n                min-width: 0;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-trigger-arrow {\n                display: inline-flex;\n                align-items: center;\n                justify-content: center;\n                flex: 0 0 auto;\n                line-height: 1;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-panel {\n                position: absolute;\n                top: calc(100% + var(--asx-edd-buy-panel-top-gap, 6px));\n                left: 0;\n                z-index: 1000;\n                display: flex;\n                flex-direction: column;\n                min-width: 100%;\n                max-height: var(--asx-edd-buy-panel-max-height, 280px);\n                overflow-y: auto;\n                border-width: 1px;\n                border-style: solid;\n                box-sizing: border-box;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-panel[hidden] {\n                display: none !important;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option {\n                display: flex;\n                width: 100%;\n                border: 0;\n                cursor: pointer;\n                text-align: left;\n                box-sizing: border-box;\n                line-height: 1.2;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-content {\n                width: 100%;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-name,\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-price,\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-discount,\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-original-price,\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-owned-badge,\n            #asx-edd-buy-307a159 .asx-edd-buy-discount-text,\n            #asx-edd-buy-307a159 .asx-edd-buy-original-price {\n                display: inline-flex;\n                align-items: center;\n                line-height: inherit;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-original-price,\n            #asx-edd-buy-307a159 .asx-edd-buy-original-price {\n                text-decoration: line-through;\n            }\n\n            #asx-edd-buy-307a159 .asx-edd-buy-custom-option-owned-badge {\n                font-size: 0.85em;\n            }\n        <\/style>\n        <form class=\"asx-edd-buy-form\" method=\"get\" action=\"https:\/\/store.algosyntax.com\/checkout\/\"><input type=\"hidden\" name=\"edd_action\" value=\"add_to_cart\"><input type=\"hidden\" name=\"download_id\" value=\"14402\"><input id=\"asx-edd-buy-selected-price-307a159\" class=\"asx-edd-buy-selected-price-id\" type=\"hidden\" name=\"edd_options[price_id]\" value=\"1\"><label class=\"asx-edd-buy-label\" for=\"asx-edd-buy-custom-trigger-307a159\">License<\/label><div id=\"asx-edd-buy-custom-dropdown-307a159\" class=\"asx-edd-buy-custom-dropdown\" data-active-price-id=\"1\"><button id=\"asx-edd-buy-custom-trigger-307a159\" class=\"asx-edd-buy-custom-trigger\" type=\"button\" aria-haspopup=\"listbox\" aria-expanded=\"false\" aria-controls=\"asx-edd-buy-custom-panel-307a159\"><span class=\"asx-edd-buy-custom-trigger-content\"><span class=\"asx-edd-buy-custom-option-content\"><span class=\"asx-edd-buy-custom-option-name\">Individual<\/span><span class=\"asx-edd-buy-custom-option-price-line\"><span class=\"asx-edd-buy-custom-option-original-price\">&#036;200.00<\/span><span class=\"asx-edd-buy-custom-option-price\">&#036;100.00<\/span><span class=\"asx-edd-buy-custom-option-discount\">-50%<\/span><\/span><\/span><\/span><span class=\"asx-edd-buy-custom-trigger-arrow\" aria-hidden=\"true\">\u25be<\/span><\/button><div id=\"asx-edd-buy-custom-panel-307a159\" class=\"asx-edd-buy-custom-panel\" role=\"listbox\" aria-labelledby=\"asx-edd-buy-custom-trigger-307a159\" hidden><button id=\"asx-edd-buy-custom-dropdown-307a159-option-0\" class=\"asx-edd-buy-custom-option is-selected\" type=\"button\" role=\"option\" aria-selected=\"true\" data-price-id=\"1\" data-is-owned=\"no\" data-price-text=\"&#036;100.00\" data-discount-text=\"-50%\" data-original-price-text=\"&#036;200.00\"><span class=\"asx-edd-buy-custom-option-content\"><span class=\"asx-edd-buy-custom-option-name\">Individual<\/span><span class=\"asx-edd-buy-custom-option-price-line\"><span class=\"asx-edd-buy-custom-option-original-price\">&#036;200.00<\/span><span class=\"asx-edd-buy-custom-option-price\">&#036;100.00<\/span><span class=\"asx-edd-buy-custom-option-discount\">-50%<\/span><\/span><\/span><\/button><button id=\"asx-edd-buy-custom-dropdown-307a159-option-1\" class=\"asx-edd-buy-custom-option\" type=\"button\" role=\"option\" aria-selected=\"false\" data-price-id=\"2\" data-is-owned=\"no\" data-price-text=\"&#036;150.00\" data-discount-text=\"-50%\" data-original-price-text=\"&#036;300.00\"><span class=\"asx-edd-buy-custom-option-content\"><span class=\"asx-edd-buy-custom-option-name\">Studio<\/span><span class=\"asx-edd-buy-custom-option-price-line\"><span class=\"asx-edd-buy-custom-option-original-price\">&#036;300.00<\/span><span class=\"asx-edd-buy-custom-option-price\">&#036;150.00<\/span><span class=\"asx-edd-buy-custom-option-discount\">-50%<\/span><\/span><\/span><\/button><button id=\"asx-edd-buy-custom-dropdown-307a159-option-2\" class=\"asx-edd-buy-custom-option\" type=\"button\" role=\"option\" aria-selected=\"false\" data-price-id=\"3\" data-is-owned=\"no\" data-price-text=\"&#036;300.00\" data-discount-text=\"-50%\" data-original-price-text=\"&#036;600.00\"><span class=\"asx-edd-buy-custom-option-content\"><span class=\"asx-edd-buy-custom-option-name\">Enterprise<\/span><span class=\"asx-edd-buy-custom-option-price-line\"><span class=\"asx-edd-buy-custom-option-original-price\">&#036;600.00<\/span><span class=\"asx-edd-buy-custom-option-price\">&#036;300.00<\/span><span class=\"asx-edd-buy-custom-option-discount\">-50%<\/span><\/span><\/span><\/button><\/div><\/div><button class=\"asx-edd-buy-button\" type=\"submit\" data-owned-url=\"https:\/\/store.algosyntax.com\/account\/\" data-buy-button-template=\"&lt;span class=&quot;asx-edd-buy-icon&quot; aria-hidden=&quot;true&quot;&gt;&lt;svg aria-hidden=&quot;true&quot; class=&quot;e-font-icon-svg e-fab-paypal&quot; viewBox=&quot;0 0 384 512&quot; xmlns=&quot;http:\/\/www.w3.org\/2000\/svg&quot;&gt;&lt;path d=&quot;M111.4 295.9c-3.5 19.2-17.4 108.7-21.5 134-.3 1.8-1 2.5-3 2.5H12.3c-7.6 0-13.1-6.6-12.1-13.9L58.8 46.6c1.5-9.6 10.1-16.9 20-16.9 152.3 0 165.1-3.7 204 11.4 60.1 23.3 65.6 79.5 44 140.3-21.5 62.6-72.5 89.5-140.1 90.3-43.4.7-69.5-7-75.3 24.2zM357.1 152c-1.8-1.3-2.5-1.8-3 1.3-2 11.4-5.1 22.5-8.8 33.6-39.9 113.8-150.5 103.9-204.5 103.9-6.1 0-10.1 3.3-10.9 9.4-22.6 140.4-27.1 169.7-27.1 169.7-1 7.1 3.5 12.9 10.6 12.9h63.5c8.6 0 15.7-6.3 17.4-14.9.7-5.4-1.1 6.1 14.4-91.3 4.6-22 14.3-19.7 29.3-19.7 71 0 126.4-28.8 142.9-112.3 6.5-34.8 4.6-71.4-23.8-92.6z&quot;&gt;&lt;\/path&gt;&lt;\/svg&gt;&lt;\/span&gt;&lt;span class=&quot;asx-edd-buy-pre-price-text&quot;&gt;Paypal&lt;\/span&gt;\" data-owned-button-template=\"&lt;span class=&quot;asx-edd-buy-icon asx-edd-buy-owned-icon&quot; aria-hidden=&quot;true&quot;&gt;&lt;svg aria-hidden=&quot;true&quot; class=&quot;e-font-icon-svg e-fas-download&quot; viewBox=&quot;0 0 512 512&quot; xmlns=&quot;http:\/\/www.w3.org\/2000\/svg&quot;&gt;&lt;path d=&quot;M216 0h80c13.3 0 24 10.7 24 24v168h87.7c17.8 0 26.7 21.5 14.1 34.1L269.7 378.3c-7.5 7.5-19.8 7.5-27.3 0L90.1 226.1c-12.6-12.6-3.7-34.1 14.1-34.1H192V24c0-13.3 10.7-24 24-24zm296 376v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h146.7l49 49c20.1 20.1 52.5 20.1 72.6 0l49-49H488c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z&quot;&gt;&lt;\/path&gt;&lt;\/svg&gt;&lt;\/span&gt;&lt;span class=&quot;asx-edd-buy-owned-text&quot;&gt;View in Library&lt;\/span&gt;\"><span class=\"asx-edd-buy-icon\" aria-hidden=\"true\"><svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fab-paypal\" viewBox=\"0 0 384 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M111.4 295.9c-3.5 19.2-17.4 108.7-21.5 134-.3 1.8-1 2.5-3 2.5H12.3c-7.6 0-13.1-6.6-12.1-13.9L58.8 46.6c1.5-9.6 10.1-16.9 20-16.9 152.3 0 165.1-3.7 204 11.4 60.1 23.3 65.6 79.5 44 140.3-21.5 62.6-72.5 89.5-140.1 90.3-43.4.7-69.5-7-75.3 24.2zM357.1 152c-1.8-1.3-2.5-1.8-3 1.3-2 11.4-5.1 22.5-8.8 33.6-39.9 113.8-150.5 103.9-204.5 103.9-6.1 0-10.1 3.3-10.9 9.4-22.6 140.4-27.1 169.7-27.1 169.7-1 7.1 3.5 12.9 10.6 12.9h63.5c8.6 0 15.7-6.3 17.4-14.9.7-5.4-1.1 6.1 14.4-91.3 4.6-22 14.3-19.7 29.3-19.7 71 0 126.4-28.8 142.9-112.3 6.5-34.8 4.6-71.4-23.8-92.6z\"><\/path><\/svg><\/span><span class=\"asx-edd-buy-pre-price-text\">Paypal<\/span><\/button><\/form>        <script>\n            (function() {\n                function updateOptionalTextElement(wrapper, selector, text) {\n                    var element = wrapper.querySelector(selector);\n\n                    if (!element) {\n                        return;\n                    }\n\n                    element.textContent = text || '';\n\n                    if (text) {\n                        element.style.display = 'inline-flex';\n                    } else {\n                        element.style.display = 'none';\n                    }\n                }\n\n                function setPanelOpen(trigger, panel, isOpen) {\n                    if (isOpen) {\n                        panel.hidden = false;\n                        trigger.setAttribute('aria-expanded', 'true');\n                        return;\n                    }\n\n                    panel.hidden = true;\n                    trigger.setAttribute('aria-expanded', 'false');\n                }\n\n                function focusOption(options, index) {\n                    if (!options.length) {\n                        return;\n                    }\n\n                    if (index < 0) {\n                        index = options.length - 1;\n                    }\n\n                    if (index >= options.length) {\n                        index = 0;\n                    }\n\n                    options[index].focus();\n                }\n\n                function getOptionIndex(options, option) {\n                    for (var i = 0; i < options.length; i++) {\n                        if (options[i] === option) {\n                            return i;\n                        }\n                    }\n\n                    return -1;\n                }\n\n                function bindCustomEddBuyDropdown() {\n                    var wrapper = document.getElementById('asx-edd-buy-307a159');\n                    var dropdown = document.getElementById('asx-edd-buy-custom-dropdown-307a159');\n                    var trigger = document.getElementById('asx-edd-buy-custom-trigger-307a159');\n                    var panel = document.getElementById('asx-edd-buy-custom-panel-307a159');\n                    var hiddenInput = document.getElementById('asx-edd-buy-selected-price-307a159');\n\n                    if (!wrapper || !dropdown || !trigger || !panel || !hiddenInput) {\n                        return;\n                    }\n\n                    var form = wrapper.querySelector('.asx-edd-buy-form');\n                    var buyButton = wrapper.querySelector('.asx-edd-buy-button');\n                    var triggerContent = trigger.querySelector('.asx-edd-buy-custom-trigger-content');\n                    var options = Array.prototype.slice.call(panel.querySelectorAll('.asx-edd-buy-custom-option'));\n\n                    if (!form || !buyButton || !triggerContent || !options.length) {\n                        return;\n                    }\n\n                    function closeDropdown() {\n                        setPanelOpen(trigger, panel, false);\n                    }\n\n                    function openDropdown() {\n                        setPanelOpen(trigger, panel, true);\n                    }\n\n                    function getSelectedOption() {\n                        return panel.querySelector('.asx-edd-buy-custom-option.is-selected') || options[0];\n                    }\n\n                    function optionIsOwned(option) {\n                        return !!option && 'yes' === option.getAttribute('data-is-owned');\n                    }\n\n                    function redirectToOwnedUrl() {\n                        var ownedUrl = buyButton.getAttribute('data-owned-url') || '';\n\n                        if (ownedUrl) {\n                            window.location.href = ownedUrl;\n                        }\n                    }\n\n                    function setButtonOwnedMode(isOwned) {\n                        if (isOwned) {\n                            buyButton.setAttribute('type', 'button');\n                            buyButton.classList.add('asx-edd-buy-owned-button');\n                            buyButton.innerHTML = buyButton.getAttribute('data-owned-button-template') || '';\n                            return;\n                        }\n\n                        buyButton.setAttribute('type', 'submit');\n                        buyButton.classList.remove('asx-edd-buy-owned-button');\n                        buyButton.innerHTML = buyButton.getAttribute('data-buy-button-template') || buyButton.innerHTML;\n                    }\n\n                    function updateBuyButtonPriceParts(option) {\n                        var priceElement = wrapper.querySelector('.asx-edd-buy-price');\n\n                        if (priceElement) {\n                            priceElement.textContent = option.getAttribute('data-price-text') || '';\n                        }\n\n                        updateOptionalTextElement(wrapper, '.asx-edd-buy-discount-text', option.getAttribute('data-discount-text') || '');\n                        updateOptionalTextElement(wrapper, '.asx-edd-buy-original-price', option.getAttribute('data-original-price-text') || '');\n                    }\n\n                    function selectOption(option, shouldFocusTrigger) {\n                        if (!option) {\n                            return;\n                        }\n\n                        var optionContent = option.querySelector('.asx-edd-buy-custom-option-content');\n\n                        if (!optionContent) {\n                            return;\n                        }\n\n                        hiddenInput.value = option.getAttribute('data-price-id') || '';\n                        dropdown.setAttribute('data-active-price-id', hiddenInput.value);\n                        triggerContent.innerHTML = optionContent.innerHTML;\n\n                        options.forEach(function(otherOption) {\n                            var isSelected = otherOption === option;\n\n                            if (isSelected) {\n                                otherOption.classList.add('is-selected');\n                                otherOption.setAttribute('aria-selected', 'true');\n                            } else {\n                                otherOption.classList.remove('is-selected');\n                                otherOption.setAttribute('aria-selected', 'false');\n                            }\n                        });\n\n                        if (optionIsOwned(option)) {\n                            setButtonOwnedMode(true);\n                        } else {\n                            setButtonOwnedMode(false);\n                            updateBuyButtonPriceParts(option);\n                        }\n\n                        closeDropdown();\n\n                        if (shouldFocusTrigger) {\n                            trigger.focus();\n                        }\n                    }\n\n                    trigger.addEventListener('click', function() {\n                        setPanelOpen(trigger, panel, panel.hidden);\n                    });\n\n                    trigger.addEventListener('keydown', function(event) {\n                        if ('ArrowDown' === event.key || 'ArrowUp' === event.key) {\n                            event.preventDefault();\n                            openDropdown();\n\n                            var selectedOption = getSelectedOption();\n                            var selectedIndex = getOptionIndex(options, selectedOption);\n\n                            if ('ArrowDown' === event.key) {\n                                focusOption(options, selectedIndex + 1);\n                            } else {\n                                focusOption(options, selectedIndex - 1);\n                            }\n                        }\n\n                        if ('Enter' === event.key || ' ' === event.key) {\n                            event.preventDefault();\n                            setPanelOpen(trigger, panel, panel.hidden);\n                        }\n\n                        if ('Escape' === event.key) {\n                            closeDropdown();\n                        }\n                    });\n\n                    options.forEach(function(option) {\n                        option.addEventListener('click', function() {\n                            selectOption(option, true);\n                        });\n\n                        option.addEventListener('keydown', function(event) {\n                            var currentIndex = getOptionIndex(options, option);\n\n                            if ('ArrowDown' === event.key) {\n                                event.preventDefault();\n                                focusOption(options, currentIndex + 1);\n                            }\n\n                            if ('ArrowUp' === event.key) {\n                                event.preventDefault();\n                                focusOption(options, currentIndex - 1);\n                            }\n\n                            if ('Enter' === event.key || ' ' === event.key) {\n                                event.preventDefault();\n                                selectOption(option, true);\n                            }\n\n                            if ('Escape' === event.key) {\n                                event.preventDefault();\n                                closeDropdown();\n                                trigger.focus();\n                            }\n                        });\n                    });\n\n                    buyButton.addEventListener('click', function(event) {\n                        if (!optionIsOwned(getSelectedOption())) {\n                            return;\n                        }\n\n                        event.preventDefault();\n                        redirectToOwnedUrl();\n                    });\n\n                    form.addEventListener('submit', function(event) {\n                        if (!optionIsOwned(getSelectedOption())) {\n                            return;\n                        }\n\n                        event.preventDefault();\n                        redirectToOwnedUrl();\n                    });\n\n                    document.addEventListener('click', function(event) {\n                        if (dropdown.contains(event.target)) {\n                            return;\n                        }\n\n                        closeDropdown();\n                    });\n\n                    selectOption(getSelectedOption(), false);\n                }\n\n                if (document.readyState === 'loading') {\n                    document.addEventListener('DOMContentLoaded', bindCustomEddBuyDropdown);\n                } else {\n                    bindCustomEddBuyDropdown();\n                }\n            })();\n        <\/script>\n        <\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ed3bd78 elementor-widget elementor-widget-button\" data-id=\"ed3bd78\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/store.algosyntax.com\/digital-assets-licenses\/\" target=\"_blank\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-external-link-alt\" viewBox=\"0 0 512 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M432,320H400a16,16,0,0,0-16,16V448H64V128H208a16,16,0,0,0,16-16V80a16,16,0,0,0-16-16H48A48,48,0,0,0,0,112V464a48,48,0,0,0,48,48H400a48,48,0,0,0,48-48V336A16,16,0,0,0,432,320ZM488,0h-128c-21.37,0-32.05,25.91-17,41l35.73,35.73L135,320.37a24,24,0,0,0,0,34L157.67,377a24,24,0,0,0,34,0L435.28,133.32,471,169c15,15,41,4.5,41-17V24A24,24,0,0,0,488,0Z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">About License Types<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a6318b4 e-flex e-con-boxed e-con e-child\" data-id=\"a6318b4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-620815d elementor-widget elementor-widget-text-editor\" data-id=\"620815d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Latest Version: V1.1<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0a6dda6 elementor-widget elementor-widget-text-editor\" data-id=\"0a6dda6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Supported Engine Versions: UE 5.7 , 5.8\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0384f16 e-flex e-con-boxed e-con e-parent\" data-id=\"0384f16\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9c54380 elementor-widget elementor-widget-text-editor\" data-id=\"9c54380\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p class=\"isSelectedEnd\">MidiEngine handles the MIDI side: importing MIDI files, playing them back, broadcasting MIDI events, triggering virtual instruments, integrating with MetaSounds, and driving gameplay or visuals from musical data.<br \/><br \/><\/p><p class=\"isSelectedEnd\">UMG Musical Grids handles the UI side: drawing music-aware grid layouts in UMG, converting pointer input into beats and bars, supporting musical quantization, rendering playheads, and providing the grid foundation for piano rolls, sequencers, clip editors, rhythm editors, and other music-based interfaces.<br \/><br \/><\/p><p>Together, they give you a practical starting point for building MIDI-driven tools and rhythm-based projects without creating the playback system and musical UI layer from scratch.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-302c9f3 e-flex e-con-boxed e-con e-parent\" data-id=\"302c9f3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-febca6d elementor-widget elementor-widget-heading\" data-id=\"febca6d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">What this Bundle is for<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9f89367 elementor-widget elementor-widget-text-editor\" data-id=\"9f89367\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p class=\"isSelectedEnd\">MidiEngine handles the MIDI side: importing MIDI files, playing them back, broadcasting MIDI events, triggering virtual instruments, integrating with MetaSounds, and driving gameplay or visuals from musical data.<\/p><p class=\"isSelectedEnd\">UMG Musical Grids handles the UI side: drawing music-aware grid layouts in UMG, converting pointer input into beats and bars, supporting musical quantization, rendering playheads, and providing the grid foundation for piano rolls, sequencers, clip editors, rhythm editors, and other music-based interfaces.<\/p><p>Together, they give you a practical starting point for building MIDI-driven tools and rhythm-based projects without creating the playback system and musical UI layer from scratch.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-96c8a74 e-flex e-con-boxed e-con e-parent\" data-id=\"96c8a74\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0f8f186 elementor-widget elementor-widget-heading\" data-id=\"0f8f186\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">What is included<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-51766c4 elementor-widget elementor-widget-heading\" data-id=\"51766c4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">MidiEngine<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d5740b4 elementor-widget elementor-widget-text-editor\" data-id=\"d5740b4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p class=\"isSelectedEnd\">MidiEngine provides the MIDI backend.<\/p><p class=\"isSelectedEnd\">Use it to import MIDI files, play MIDI patterns, broadcast MIDI notes and events, control playback, trigger virtual instruments, and connect musical data to Unreal Engine systems.<\/p><p class=\"isSelectedEnd\">It is useful when you need MIDI data to drive audio, gameplay, animation, visual effects, rhythm-game objects, or custom music systems.<\/p><p class=\"isSelectedEnd\">Key areas include:<\/p><ul data-spread=\"false\"><li>MIDI file import<\/li><li>MIDI playback<\/li><li>MIDI event broadcasting<\/li><li>MIDI event listening<\/li><li>Playback controls such as play, pause, resume, stop, and seek<\/li><li>Virtual instrument support<\/li><li>MetaSounds integration<\/li><li>Sequencer integration<\/li><li>3D Rhythm game templates<\/li><li>Multiple playhead support for ahead-of-time event triggering<\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8d830a5 elementor-align-left elementor-widget elementor-widget-button\" data-id=\"8d830a5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/store.algosyntax.com\/marketplace\/unreal-engine\/midi-engine\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">MIDI Engine<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1e4c42a elementor-widget elementor-widget-heading\" data-id=\"1e4c42a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">UMG Musical Grids<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-98f69fe elementor-widget elementor-widget-text-editor\" data-id=\"98f69fe\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p class=\"isSelectedEnd\">UMG Musical Grids provides the musical UI layer.<\/p><p class=\"isSelectedEnd\">Use it to build UMG widgets that understand bars, beats, subdivisions, quantization, snapping, pointer positions, and playhead rendering.<\/p><p class=\"isSelectedEnd\">It is useful when you need a visual grid for music editing, rhythm editing, piano rolls, sequencers, timelines, or beat-based UI.<\/p><p class=\"isSelectedEnd\">Key areas include:<\/p><ul data-spread=\"false\"><li>Bar and beat grid generation<\/li><li>Beat subdivisions<\/li><li>Time signature support<\/li><li>Grid quantization<\/li><li>Movement and resize snapping<\/li><li>Pointer events reported in beats and bars<\/li><li>Quantized and unquantized pointer positions<\/li><li>Playhead cursor rendering<\/li><li>Optional pitch grid support<\/li><li>Designer-editable line, label, tick, and background styling<\/li><li>Blueprint and C++ friendly API<\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7036d17 elementor-align-left elementor-widget elementor-widget-button\" data-id=\"7036d17\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/store.algosyntax.com\/marketplace\/unreal-engine\/umg-musical-grids\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">UMG Musical Grids<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-28a7538 elementor-widget elementor-widget-heading\" data-id=\"28a7538\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">UMG Piano Keys<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-160925d elementor-widget elementor-widget-text-editor\" data-id=\"160925d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p class=\"isSelectedEnd\">A Free Bonus!! You can&#8217;t build piano rolls without piano keys. This system simply Draws Interactive Piano Keys in UMG. Use them however you see fit.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6c2340b elementor-align-left elementor-widget elementor-widget-button\" data-id=\"6c2340b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/store.algosyntax.com\/marketplace\/unreal-engine\/umg-piano-keys\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">UMG Piano Keys<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>MIDI Engine UI &amp; Rhythm Bundle MIDI Engine UI &amp; Rhythm Bundle combines MidiEngine and UMG Musical Grids to give Unreal Engine developers both the MIDI backend and the musical UI foundation needed for rhythm games, MIDI visualizers, piano-roll interfaces, sequencers, music editors, and runtime music tools. Buy MIDI Engine UI &amp; Rhythm Bundle LicenseIndividual&#036;200.00&#036;100.00-50%\u25beIndividual&#036;200.00&#036;100.00-50%Studio&#036;300.00&#036;150.00-50%Enterprise&#036;600.00&#036;300.00-50%Paypal [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":14435,"template":"elementor_header_footer","edd-categories":[11,4],"edd-tags":[137],"class_list":["post-14402","download","type-download","status-publish","has-post-thumbnail","hentry","download_category-code-plugins","download_category-unreal-engine","download_tag-bundle","entry","has-media","edd-download","edd-download-cat-code-plugins","edd-download-cat-unreal-engine","edd-download-tag-bundle"],"acf":[],"_links":{"self":[{"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/edd-downloads\/14402","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/edd-downloads"}],"about":[{"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/types\/download"}],"author":[{"embeddable":true,"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/users\/1"}],"version-history":[{"count":2,"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/edd-downloads\/14402\/revisions"}],"predecessor-version":[{"id":14451,"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/edd-downloads\/14402\/revisions\/14451"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/media\/14435"}],"wp:attachment":[{"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/media?parent=14402"}],"wp:term":[{"taxonomy":"download_category","embeddable":true,"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/edd-categories?post=14402"},{"taxonomy":"download_tag","embeddable":true,"href":"https:\/\/store.algosyntax.com\/asx-rest\/wp\/v2\/edd-tags?post=14402"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}