Widget: Support for inline seating plan

[raphaelm]

Okay, so this is an experimental idea. We've had some complaints that the widget does not show the seating plan directly, but instead always opens its overlay for the seating plan.

With our ongoing work of rewriting our seating plan renderer, we have a well-capsuled seating component now which we could properly embed in the widget.

However, I'm very unsure as to how to do that without giving up our loose coupling between pretix and pretix-seating. First, pretix-seating is not open source. Second, we actually know of people running their own seating plugin instead of pretix-seating. So I'd prefer to keep the louse coupling.

That leaves us with two approaches:

• The widget itself gets a plugin system. Might be interesting but could get very complex.
• We just use iframes here as well.

This PR implements the second idea. It has some advantages, such as keeping a small interface between pretix and pretix-seating, but one large disadvantage: The seating part of the widget is not accessible through CSS. The buttons will look different (I first tried to fix that by just working without a second button but that would require refactoring our seat validation), and we can work around part of it with some conditional background:transparent statements that I have not yet added, but it will always look slightly off since it's using different fonts etc.

For these reasons and for backwards compatibility I declared it opt-in. Still better than nothing for many users!

Do we want to follow this approach further, the other approach, or none at all?

Internal note: See also https://code.rami.io/pretix/pretix-seating/-/merge_requests/12

[codecov]

Codecov Report

Merging #2997 (3b62737) into master (d3698b3) will decrease coverage by 0.00%.
The diff coverage is 25.00%.

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #2997      +/-   ##
==========================================
- Coverage   77.96%   77.95%   -0.01%     
==========================================
  Files         398      398              
  Lines       53167    53170       +3     
==========================================
  Hits        41450    41450              
- Misses      11717    11720       +3     

Impacted Files	Coverage Δ
src/pretix/presale/views/event.py	73.53% <25.00%> (-0.57%)	⬇️

[vchrisb]

It would be great to have an inline seating plan, even if it is (not yet) perfect.
Would it maybe possible to add some css options on the pretix side? Similar to "shop design" settings?

[wiffbi]

What if we embed the seating-plan through its web-components directly? Custom-Seating-Plan plugins would not work right away as they hook into /seatingframe/-URL I guess, but that could be worked around by overwriting our web-components with their own custom web-components? We could even go so far as in creating a new web-component <pretix-seating-select>, which is basically a wrapper around our three web components. Custom seating plugins would then just need to create a web component, which is just a wrapper around an iframe, which embeds the /seatingiframe/-URL. As a fallback during that transition for custom seating plugins, when the <pretix-seating-select> element is not defined, we could just show the button as it is today. So basically something like this:

<pretix-seating-select plan="…" event="…" …>
    <script> … translation JSON goes here … </script>
    <!-- the following is HTMLs fallback mechanism and will show the button 
         when the custom element pretix-seating-select is not defined -->
    <p><button>Open seatingplan</button></p>
</pretix-seating-select>

Or instead of the button show the iframe with /seatingiframe/-URL as a fallback? Problem though is the new postMessage-machnism that you added to the buy-button. So maybe to keep it simple just use the open-seatingplan-button as fallback?