Feature Request: background-image property to set the background image at full size

[nagarjunredla]

It would be awesome if the element had a property to set the background image for the scroll header panel when at full size.
Example:
<paper-scroll-header-panel background-image="{{imageUrl}}"></paper-scroll-header-panel>

This would let users easily change the background image when the header is at full size. Makes work a lot easier.
Like on the Google Play Store App (The header image in the app description page):
https://www.youtube.com/watch?v=G6rUYfc33JQ

The other styles for background when condensed could still be added with mixins, since they probably don't need to change as much as the image, and because including the other properties would probably complicate it.

I tried to search if people have figured out a way to do it but couldn't find any examples, so posting it here. Since we're setting it to --paper-scroll-header-panel-full-header I'm currently changing it this way in PSK (Thanks @David-Mulder for showing the right way):
document.querySelector('paper-scroll-header-panel').customStyle["--paper-scroll-header-panel-full-header"] = "background-image : url(path/to/image);";
document.querySelector('paper-scroll-header-panel').updateStyles();
Plunker: https://plnkr.co/edit/Fivmzd?p=preview

[David-Mulder]

Just noting that you should use customStyle for this, that way you don't end up piercing in to the shadows.

[nagarjunredla]

Thanks! Updated the code.