Comments (5)
Hotspot areas can already have an associated audio file which can either be played via inline player or when the area is clicked. Playing on mousemove should also be possible. On touch devices there would probably need to be a fallback to play on touch. Finally, there would have to be an editor option to activate this behavior for audio hotspots.
Something similar can already now be accomplished by using a hover video. But silly iOS autoplay restrictions prevent it from working on mobile.
from pageflow-linkmap-page.
What we would really like is to have a Page Link area but with an optional atmo audio, purely for the background. We understand that it won't work on iOS, but for desktop it should be fine. When someone hovers, a small hint of what's to be expected can start playing.
Possible with current software, or easy to add? I would expect there to be a third tab in this editor screen, very much like the existing atmo audio functionality.
from pageflow-linkmap-page.
Technically that should not be too hard. My main concern is configuration complexity for the user since the page type already now is sort of a swiss knife. So on a conceptual level, there would need to be a proposal that
- takes the different hot spot types into consideration
- integrates with the existing atmo functionality including the existing options to turn down or pause the atmo when a audio hotspot is playing
- takes the different hover image/video variants into account
from pageflow-linkmap-page.
it takes the different hot spot types into consideration
We would like to add it exclusively to the hotspot type 'page link'. The same options could apply as with a hotspot pagetype where an audio link is added. If there is an atmo audio playing on hover, it can be muted, keep on playing or keep on playing at a lower volume. So that menu could remain the same I figure?
integrates with the existing atmo functionality including the existing options to turn down or pause the atmo when a audio hotspot is playing
Yes, see up
takes the different hover image/video variants into account
In case an atmo audio-file is added to a pagelink hotspot area, then this overrides the audio from the hover or panorama video (like an audio-link in a hotspot page does).
Does this makes sense to you as a proposal? We would love to get it working since in our view it adds significant persuasive suspense and playful anticipation to the story, so the hasty web user actually wants to stay with the production and click on the stories.
from pageflow-linkmap-page.
That sound's reasonable. So I think the following things would need to be done:
- Add an
input
for anatmo_audio_file_id
attribute to theEditAreaView
that is only visible when target type is"page"
- Ensure that the id of that file is supplied as a data attribute for the area tag. Maybe the
data-audio-file
attribute can even be reused with an additional attribute indicatingplay-on-hover
is active. - Ensure that these data attributes are correctly updated inside the editor
- Enhance the audio player to also trigger playback on
mouseenter
/mouseleave
if theplay-on-hover
attribute is present such that the audio players controller can take care of fading to the passed audio file. That way we can use the existing fade-atmo-integration etc.
This is a pretty rough outline and maybe I'm missing important issues. But it should at least help to give you some pointers into the code.
Last of all it would be really really great if we could get the (embarrassingly small) test suite to run on Travis. For that I'll need to publish the pageflow-support
gem, which at the moment is linked via path
in the Gemfile
. If you point it to the spec/support
directory of your pageflow
checkout, it should work, though.
from pageflow-linkmap-page.
Related Issues (9)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from pageflow-linkmap-page.