Javascript: Viewport bzw. StateManager

Hallo,

in SW5 konnte man über den StateManager in JS ja den Viewport abfragen… wie gehts in SW6? Den StateManager gibts ja wohl nicht…

hab schon versucht, es über new ViewportDetection() zu machen wie im Core. Aber das erzeugt nur Syntaxfehler… ViewportDetection is not defined

Hast du den Helper auch in deinem Javascript importiert?

Schau mal im hier https://github.com/shopware/platform/blob/6.1/src/Storefront/Resources/app/storefront/src/plugin/header/account-menu.plugin.js

@StefanPoensgen‍

ja ich hatte die Zeile eingebunden.

import ViewportDetection from 'src/helper/viewport-detection.helper';

bekomm dann allerdings den Fehler

Uncaught SyntaxError: Cannot use import statement outside a module

 

Gibt es dazu bisher irgendwelche Docs?

Der Fehler steht ja da: Du scheinst es außerhalb eines modules zu verwenden.

Zeig doch einmal den Code, am besten als git Repo damit man helfen kann. 

@Misengo‍ Was suchst du denn genau? Prinzipiell ist das ganz simples Javascript. Das Plugin gibt einfach nur true/false zurück bei den verschiedenen methods. Schaut euch einfach das Plugin an -> https://github.com/shopware/platform/blob/fb4bc791e185512bfde8cd0ea462b0cf527cf82f/src/Storefront/Resources/app/storefront/src/helper/viewport-detection.helper.js#L110-L158

Du hast eigentlich nur die paar methods & getCurrentViewport().

getCurrentViewport() gibt dann entsprechend einfach isXS, isM usw zurück. Und isXS() usw. gibt einfach true/false zurück. Mehr ist es nicht.

“Prinzipiell ganz simpel”, “Mehr ist es nicht”

Könnte, hätte, wollte :smiley: Wäre trotzdem schön hier eine Doku zu haben auf die man auch verweisen kann, bzw. wo man nochmal explizit auf Fettnäpchen hinweist. Gerade wenn man solche Docs / Tutorials macht, fallen oft noch Sachen auf und man hat eine Bestpractice. Komme demnächst zu dem Punkt wo ich es brauche, wenn ich Zeit hab mach ich nen kurzen Beitrag dazu.

könnte Shopware hier bitte noch eine Doku liefern? Mal ganz zu schweigen davon, dass ich Javascript über mein Theme nicht ausgeliefert bekomme… wegen diesem komischen Webpack Zeug…

vielleicht wisst ihr hier ja auch Rat: https://forum.shopware.com/discussion/66305/plugin-javascript-file-wird-nicht-geladen#latest

Unter https://academy.shopware.com/ gibt es im Template Training Advanced (SW6) in dem “Plugin Sticky Header” kurz um ViewportDetection (zum Ende hin).

Hab das allerdings nur kurz mal “durchgesprungen”. Geht in dem Beispiel darum rauszufinden, ob der Viewport ‘XS’, ‘SM’ oder ‘MD’ ist, um ein JS Plugin dann zu laden oder halt nicht.