Video width distorted

  • I'm having trouble with my video's width -- it seems to be stretched too wide (or squeezed too short) -- whichever the case may be, it does not match the raw video source.

    http://jakesiemer.com/projects/pano/Beach_Scene.mp4


    vs.

    http://jakesiemer.com/projects/pano/


    If I can figure out how to get this working I am ready to pay for a license for my company.

    Thanks!

  • Hi,

    you want to play the video as flat element fitted fully inside the window frame, right?

    In this case it wouldn't be necessary to define the video as pano.

    Here a simpler solution - try this xml instead of your current one:

    Best regards,
    Klaus

  • That would definitely work, however, I need it to leverage the pano plugin because thats the only configuration that bypasses the video limitations on iOS (playing video inline instead of fullscreen). Is there a way to have the pano plugin display the video flat and in original aspect ratio?

  • Hi,

    that would be possible too:

    Best regards,
    Klaus

  • Hi,

    the reason is your poster image - it has a different size (1920x960) and also a different image content.

    The size for the video will be taken either from the poster image or from the video itself - depending on what will get loaded first.

    That means - either use a correct poster image or just remove it (the posterurl) from the xml.

    Best regards,
    Klaus

  • Ok, I updated the poster image and now all is working... Thanks!

    A couple more questions if you don't mind...

    1. In my original demo (http://jakesiemer.com/projects/pano/index.bak.rev-a.htm) I had the video take up the entire screen (no black bars) while still maintaining the aspect ratio. Is this also possible with the current XML code you have provided? I tried putting it in my current demo and it's not working. Any help would be much appreciated. (source code for this technique was found here: Flat Video Full size)

    2. On the iPhone the video loop is not working. Is there a workaround to get video looping on iPhone?

    3. I have been able to swap video sources pretty easily using the playvideo() function, however, how do I set both regular and iOS sources in the same call and let the plugin decide which is best?

    Also, I talked with my boss today and he is ready to fork over the money for the license. I did want to ask, if we buy the license will it remove the "krpano demo" text over my page, or do I also have to buy the no branding license?

    Thanks for all your help!

  • Hi,

    1. Yes, that's possible - take the xml example from above and change:

    Code
    <view ... limitview="fullrange" />

    to:

    Code
    <view ... limitview="range" />


    and

    Code
    if(video_aspectratio GT screen_aspectratio,

    to:

    Code
    if(video_aspectratio LT screen_aspectratio,


    2. That's an iOS bug related to the video encoding. Try encoding the video with an other tool (e.g. ffmpeg should work).


    3. Use if() checks and the device object - e.g.

    Code
    if(device.iphone, playvideo(...));

    About the license - yes, with a normal krpano license there will be no demo logo and no watermarks anymore. The optional and additional branding free license is for removing the 'about krpano' from the context menu.

    Best regards,
    Klaus

  • Perfect, that new code works.

    Still unable to encode the video for iPhone to enable looping. I used FFMPEG and it still doesn't work. Can you tell me what encoding settings I might use to make it work?

    Thanks!

  • Thanks, but I tried every setting imaginable, and not a single video that I encoded allowed for looping on iPhone. It would be amazing if you could share your encoding settings with me!

    Thanks!

  • Hi,

    for the videos on the krpano video pano page I've used these ffmpeg settings for the 1024x512 iOS videos:

    Code
    -r 30 -g 90 -movflags faststart -c:v libx264 -profile:v baseline -level 3.1 -crf 25 -maxrate 1250k

    Best regards,
    Klaus

  • Unfortunately I still have not been able to encode a working example using those settings. Any other ideas?

    Also, I have my playpause_image UI element -- once the video has been successfully played I would like to hide this UI element. I was thinking of swapping the source with a blank spacer pixel, but I cannot get it working.

    I tried executing this line of code:
    set(layer[interface_playpause_image].style, interface_nullimage);


    <!-- BASE SPRITE-SHEET IMAGES STYLES -->
    <style name="interface_pauseimage" url="%CURRENTXML%/../images/UI_Play-Pause.png" />
    <style name="interface_nullimage" url="%CURRENTXML%/../images/UI_Spacer-Pixel.png" />

    <!-- THE STARTUP/INFO PLAY/PAUSE BUTTON -->
    <layer
    name="interface_playpause_image"
    zorder="1"
    style="interface_pauseimage"
    crop="0|0|200|200"
    onovercrop="0|200|200|200"
    ondowncrop="0|200|200|200"
    align="center"
    visible="false"
    alpha="0.0"
    scale="1.5"
    />

    Is there any other way to hide the UI element?

  • Project is here: (will use KRPano when the iPhone/iPod user agent is detected)

    http://content.frontgate.com/projects/sebastian/

    Problem is this:

    Unfortunately I still have not been able to encode a working example using those settings. Any other ideas?

    Also, I have my playpause_image UI element -- once the video has been successfully played I would like to hide this UI element. I was thinking of swapping the source with a blank spacer pixel, but I cannot get it working.

    I tried executing this line of code:
    set(layer[interface_playpause_image].style, interface_nullimage);


    < !-- BASE SPRITE-SHEET IMAGES STYLES -->
    < style name="interface_pauseimage" url="%CURRENTXML%/../images/UI_Play-Pause.png" />
    < style name="interface_nullimage" url="%CURRENTXML%/../images/UI_Spacer-Pixel.png" />

    < !-- THE STARTUP/INFO PLAY/PAUSE BUTTON -->
    < layer
    name="interface_playpause_image"
    zorder="1"
    style="interface_pauseimage"
    crop="0|0|200|200"
    onovercrop="0|200|200|200"
    ondowncrop="0|200|200|200"
    align="center"
    visible="false"
    alpha="0.0"
    scale="1.5"
    />

    Is there any other way to hide the UI element?

  • Code
    Problem is this:
    
    
    Unfortunately I still have not been able to encode a working example using those settings. Any other ideas?

    Working how?

    You can't have videos on iphone with interactivity. It's not possible.
    I can't find your krpano anywhere on that site.

    https://krpano.com/plugins/videoplayer/#onvideocomplete


    Code
    .... onvideocomplete="tween(layer[interface_playpause_image].alpha,0);"
  • Code
    Problem is this:
    
    
    Unfortunately I still have not been able to encode a working example using those settings. Any other ideas?

    Working how?

    You can't have videos on iphone with interactivity. It's not possible.
    I can't find your krpano anywhere on that site.

    https://krpano.com/plugins/videoplayer/#onvideocomplete


    Code
    .... onvideocomplete="tween(layer[interface_playpause_image].alpha,0);"


    Did you visit my site with an iPhone user agent? It uses KRPano when iPhone is detected.

    I'm confused. You say that video on iPhone doesn't work, but it's working just fine for me. I just need my iPhone videos to loop!

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!