JavaScript Komponente per Plugin erweitern

Hallo zusammen, ich möchte gerne die filterComponent JS Komponente des Reponsive-Themes in einem Projekt erweitern. Kann ich das über ein Plugin machen? Wie gehe ich am besten vor? Mein konkreter Fall: Ich möchte gerne dem User die Möglichkeit geben, Freitext ein in Filter Attribut einzugeben. Dazu habe ich ein eigenes Template für mein FacetResult angegeben und gebe dort nun ein Text-Input Feld aus. Wenn ich in die Datei: themes/Frontend/Responsive/frontend/_public/src/js/jquery.filter-component.js nun folgendes einfüge: /\*\* \* text component \*/ 'text': { compOpts: { textInputSelector: 'input[type="text"]' }, initComponent: function() { var me = this; me.$textInputs = me.$el.find(me.opts.textInputSelector); me.registerComponentEvents(); }, registerComponentEvents: function() { var me = this; me.\_on(me.$textInputs, 'change keydown paste input', function(event) { me.onChange(event); }); } } funktioniert es auch soweit. Nun die Frage: kann ich das auch sauber machen, ohne die Core-Dateien zu überschreiben? Wie wäre da der Ansatz? Kann ich die JS Komponente de-registrieren und eine eigene registrieren? Viele Grüße, Constantin

Schau dir mal die update Function an innerhalb der state-manager.js /\*\* \* @public \* @chainable \* @method updatePlugin \* @param {String} selector \* @param {String} pluginName \* @returns {StateManager} \*/ updatePlugin: function (selector, pluginName) { var me = this, state = me.\_currentState, pluginConfigs = me.\_plugins[state][selector] || {}, pluginNames = (typeof pluginName === 'string') ? [pluginName] : Object.keys(pluginConfigs), len = pluginNames.length, i = 0; for (; i \< len; i++) { me.\_initPlugin(selector, pluginNames[i]); } return me; },

1 „Gefällt mir“

Hallo kayyy, danke dir schonmal für die Antwort - mir fehlt aber noch völlig der Ansatz. Angenommen ich verwende das ganz normale Reponsive Template verwende und meine JS zusätzlich registrieren will - wie mache ich das? Im alten Template hätte ich einfach eine Template-Datei eingebunden, die in der header.tpl einen Block appended - aber wie registriere ich überhaupt eine JS Datei nach der neuen Logik? EDIT: Ok, in dem Dev-Docs findet man was. https://devdocs.shopware.com/developers … ate-guide/ /\*\* \* Provide the file collection for js files \* \* @param Enlight\_Event\_EventArgs $args \* @return \Doctrine\Common\Collections\ArrayCollection \*/ public function addJsFiles(Enlight\_Event\_EventArgs $args) { $jsFiles = array(\_\_DIR\_\_ . '/Views/responsive/frontend/\_public/src/js/script.js'); return new Doctrine\Common\Collections\ArrayCollection($jsFiles); } So könnte ich meine eigene JS Datei einbinden - aber wie gehe ich hier genau mit dem Update des State Managers um? Hier wäre ich nochmal dankbar für einen Tipp. Viele Grüße, Constantin

[quote=“dreitags”]aber wie gehe ich hier genau mit dem Update des State Managers um?[/quote] Hallo zusammen, könnte mir jemand hier nochmal eine Hilfestellung geben?

Das update ist ja nur dafür da das bestehende Plugin zu Updaten. Bspw die collapse function oder dergleichen. Ansonsten musst du entsprechend dein eigenes Plugin für den State Manager schreiben. Steht auch in den dev docs drinne.