Vaadin 7 + Touchkit + Phonegap

Flow
1

Hello,

I am at this point pretty well versed in desktop Vaadin development. However, I need to accomplish the following in a new app:

  • Inline videos in a Vaadin app
  • User comments while viewing video
  • Capture video

On the desktop side, this isn’t very hard with Vaadin, and works well. ​Unfortunately iOS requires a “native” app to play videos in line. (All web videos open in full screen mode on iPhones and therefore videos can’t have CSS filters applied)

Based on the above, it seems like Vaadin+Phonegap might be a good route to take. However, I am not finding any good examples on how to integrate the two. Is anyone aware of an example project (perhaps on gitHub) that integrates Vaadin Touchkit with Phonegap to access the camera and display video?

If anyone can offer some help, I’d appreciate it.

2

Update:

I found
this github page
 and hooked it up to the latest Parking Demo. Everything seems to work fine, and made a pretty convincing app on Android and iOS.

However, I am still having issues with autoplaying video. Here’s what I’ve appended to the parking demo:

[code]
VVideo video = new VVideo();

    VideoElement element = Document.get().createVideoElement();

    element.setAttribute("id", "luupeVideo");

    element.setAttribute("webkit-playsinline", "");

    element.setAttribute("loop", "");

    video.setMediaElement(element);

    video.addSource(

            "source.mp4"
            "video/mp4");

    video.setAutoplay(true);

    video.setWidth("100%");

    video.setHeight("100%");

    innerLayout.add(video);

[/code]According to the source, the video is configured correctly, and should play fine. I’ve also enabled the following in Phonegap:

<preference name="AllowInlineMediaPlayback" value="true" />

Anyone with out there have tips on how to get the video to play inline automatically?