Video (p:media) does not start - jsf-2

I can't get p:media to work, tested with Chrome and IE, different Quicktime- and Windows-types over StreamedContent (see example below) and by referencing it from the resources-folder (value=/resources/clear.avi) of my webapp. No video starts to play although loading & rendering seems to be "working" per se. The player shows up and the loaded video seems not to be broken while the files aren't for sure (playing works on desktop usage). When using StreamedContent, I start to render after loading the video.
My config:
PrimeFaces 3.5
Apache MyFaces 2.1.12
Jetty 9.0.4
What can be wrong here?
<h:panelGroup id="video">
<p:media value="#{contentEditorBean.media}" width="250" height="190" player="windows" rendered="#{contentEditorBean.media != null}">
<f:param name="autoPlay" value="false" />
</p:media>
</h:panelGroup>

Related

Responding to resource requests with specific extensions with MVC

I wrote a basic range request class I was wanting to flesh out so html5 video and audio players could interact with my MVC app.
I have it functioning (but not fully featured for things like If-Modified) if I don't add the extension to the 'src' tags. Thing is on the routing I can't get any string with a "{filename}.{extension}" style of route to work. My guess is anything like that is assumed to be a static file and thus I never get the opportunity to fulfill the request. If I add a source without the extension it works.
So this works
<video id="my-video-player" class="video-js" controls preload="auto" width="640" height="264" src="#Url.Action("Index","Video",new { id = "SampleVideo_1280x720_20mb" })" type="video/mp4">
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
supports HTML5 video
</p>
</video>
but this doesn't
<video id="my-video-player" class="video-js" controls preload="auto" width="640" height="264" src="#Url.Action("Index","Video",new { id = "SampleVideo_1280x720_20mb.mp4" })" type="video/mp4">
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
supports HTML5 video
</p>
</video>
Does anyone know how I could make certain extensions potentially reroute to a handler of my choosing?
Edit:
Linked below is a method to make it work on 1 path, ideally I'd like to inject it so I could do it for any path, so I'd like to keep it open to see if anyone has more insight. As this method still would require you to have an IgnorePath also to make sure any direct path to your media files aren't handled by the static file handler instead of your MVC path.
<system.webServer>
<handlers>
<add name="Media-Handler" path="/Video/*" verb="GET" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0"/>
</handlers>
</system.webServer>

Display dialog from backing bean in primefaces mobile

I am doing mobile conversion of our website using PF mobile. In that I am trying to open views in a dialog using Primefaces mobile. It works just fine in desktop browser but not in mobile version. The page keeps waiting to load but nothing happens. Is it not implemented in PF mobile or is something wrong with my code?
Following is the view - webapp/m/dlg/sampledlg.xhtml
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"xmlns:h="http://java.sun.com/jsf/html"xmlns:f="http://java.sun.com/jsf/core"xmlns:p="http://primefaces.org/ui"xmlns:pm="http://primefaces.org/mobile"><f:view renderKitId="PRIMEFACES_MOBILE" /><h:head></h:head><h:body><pm:page id="main"><pm:header title="Main Page">/pm:header><pm:content><p:link outcome="pm:second" value="Go" /></pm:content></pm:page><pm:page id="second" lazy="true"><pm:header title="Second Page"></pm:header><pm:content>Sample content</pm:content></pm:page></h:body></html>
Following is the code from the backing bean.
RequestContext.getCurrentInstance().openDialog("dlg/sampledlg");
return;
Also basic dialog like the following that displays only a message doesnt work either in mobile pages. It works in desktop though.
RequestContext.getCurrentInstance().showMessageInDialog("This is sample text");
face-config.xml has the following:
<navigation-handler>
org.primefaces.application.DialogNavigationHandler
</navigation-handler>
<view-handler>org.primefaces.application.DialogViewHandler</view-handler>
<navigation-handler>org.primefaces.mobile.application.MobileNavigationHandler</navigation-handler>
I can absolutely add more information if needed. Any help here is much appreciated. Thank you in advance.
Here is my platform information:
- Tomee 7.0.0 M3
- Primefaces 6.0
- Jsf 2.2.12
- Jdk 1.7
- Jee 7
Working solution:
bean:
...
RequestContext.getCurrentInstance().execute("PF('dlgDelete').show();");
xhtml:
...
<p:dialog header="confirmation" widgetVar="dlgDelete" >
<p:outputLabel value="Are you...?"/>
<p:commandButton value="yes" action="#{appBean.deleteMethod()}" update="tblParts" oncomplete="PF('dlgDelete').hide();" icon="ui-icon-check" iconPos="right" styleClass="ui-btn-inline"/>
<p:commandButton value="no" onclick="PF('dlgDelete').hide();" icon="ui-icon-forbidden" iconPos="right" styleClass="ui-btn-inline"/>
</p:dialog>

unable to update p:graphicsImage

My html code is as follows
<p:graphicImage id="graphImg" value="#{imageMB.img1}" width="740" height="480"
cache="false" />
<p:commandButton type="submit" value="Next" process="#all"
action="#{imageMB.nextImg()}"
update=":mainFORM:graphImg"/>
Note:In the above code i have tried most of the options for Process (#this,#form,...)
In by Bean i basically pass the StreamedContent
public void nextImg(){
img1=new streamed content;
}
Note: My images are not stored in the project location/glassfish its stored in /Test folder.
When i click the next button actually the img1 data changes, but the image in p:graphicsImage remains same.
The same works fine if i refresh the whole page (using F5 or javascript).
I really don't know why it doesn't get refreshed from the update command but works when the page is reloaded.
I use Primeface4.0/Glassfish 3.1.2.2
There is a issue with updating p:graphicimage on PrimeFaces 4.0 public version. Take a look at the offical forum: http://forum.primefaces.org/viewtopic.php?f=3&t=34658

Why is DotNetNuke text editor control always showing HTML Code with iPad?

I have a DotNetNuke custom module where I am using an HTML editor to allow uses to enter some text to be saved to a database.
It is working fine for all browsers except IPad's safari where I get the HTML tags showing in the editor.
What can I do to make Ipad show text formatted (or even as plain text) rather than having these tags appear as they are very confusing to users.
The control is using:
<%# Register TagPrefix="dnn" TagName="TextEditor" Src="~/controls/TextEditor.ascx" %>
<div id="divTab2">
<dnn:TextEditor ID="txtNotes" runat="server" Width="900px" />
</div>
The web.config has this:
<htmlEditor defaultProvider="DotNetNuke.RadEditorProvider">
<providers>
<clear />
<!--Upgraded by DotNetNuke.TelerikEditorProvider version 5.6.3 - Date: 8/3/2011 1:00:02 AM-->
<!--<add name="TelerikEditorProvider" type="DotNetNuke.HtmlEditor.TelerikEditorProvider.EditorProvider, DotNetNuke.HtmlEditor.TelerikEditorProvider" providerPath="~/Providers/HtmlEditorProviders/Telerik/" toolsFile="~/Providers/HtmlEditorProviders/Telerik/Config/ToolsDefault.xml" configFile="~/Providers/HtmlEditorProviders/Telerik/Config/ConfigDefault.xml" FilterHostExtensions="True" />-->
<!--Upgraded by DotNetNuke.TelerikEditorProvider version 5.6.3 - Date: 8/3/2011 7:33:08 PM-->
<!--<add name="TelerikEditorProvider" type="DotNetNuke.HtmlEditor.TelerikEditorProvider.EditorProvider, DotNetNuke.HtmlEditor.TelerikEditorProvider" providerPath="~/Providers/HtmlEditorProviders/Telerik/" toolsFile="~/Providers/HtmlEditorProviders/Telerik/Config/ToolsDefault.xml" configFile="~/Providers/HtmlEditorProviders/Telerik/Config/ConfigDefault.xml" FilterHostExtensions="True" />-->
<add name="TelerikEditorProvider" type="DotNetNuke.HtmlEditor.TelerikEditorProvider.EditorProvider, DotNetNuke.HtmlEditor.TelerikEditorProvider" providerPath="~/Providers/HtmlEditorProviders/Telerik/" toolsFile="~/Providers/HtmlEditorProviders/Telerik/Config/ToolsDefault.xml" configFile="~/Providers/HtmlEditorProviders/Telerik/Config/ConfigDefault.xml" FilterHostExtensions="True" />
<add name="DotNetNuke.RadEditorProvider" type="DotNetNuke.Providers.RadEditorProvider.EditorProvider, DotNetNuke.RadEditorProvider" providerPath="~/DesktopModules/Admin/RadEditorProvider" />
</providers>
</htmlEditor>
example:
In iPad, I get
<div style="text-align: center;"><strong>Case History Notes - Martha </strong><br /></div><br /><strong>6/24/11</strong>: Referred by Jackie <br /><strong>6/26/11:</strong> Sch. Initial Interview for 6/30; 7:00AM Breakfast at Cafe.<br />
rather than the expected
Case History Notes - Martha 6/24/11: Referred by Jackie 6/26/11: Sch. Initial Interview for 6/30; 7:00AM Breakfast at Cafe.
Safari on the iThings doesn't support contentEditable, which is the feature used for most rech edit panels on the web.
Since I do not have an iPad, I am unable to troubleshoot this. I can confirm that the desktop version of Safari works fine though. Have you tried this on newer versions of DotNetNuke? The browser and telerik definitions are updated with every release. If you cannot upgrade for some reason, I would try upgrading just your telerik controls. For example, you can try the latest release of the DNN 5 RadEditor Provider by dnnWerk.

Safari WIndows and Transparent Flash

// Edit: The issue now appears to be confined to Safari for Windows.
Around the time Safari for Windows 4 came out I started hearing from users that wmode=transparent was no longer working in Safari.
I have googled this many times but have not come up with any answers. I have tried reducing interference by using tags as opposed to scripts to embed the Flash but with no success.
An example is here: http://hiv411.org/safari.php alternately embedded with script at http://hiv411.org/
All videos use wmode=transparent and are embedded via tags. All work fine in every browser I have except Safari.
Code looks like so on safari.php
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" name="test" width="289" height="263" align="middle" id="test">
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="false" />
<param name="movie" value="swfs/BBattLeft.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="bgcolor" value="#ffffff" />
</object>
Much obliged for any help!
UPDATE: The problem is with the flash player for windows safari but has been solved after Flash Player version 10.0.45.2
Yes, It is only with Safari on Windows!
And it's interesting that there is not much written about this on the internet I've been experiencing the same issue, I guessed at first that it has a default value of #FFFFFF for bgcolor and I tried setting it to transparent (not wmode but bgcolor!). it still works in every other browser but it had a green color in Safari (so don't try that! and no the bug is not with the word transparent not being defined! I tried!).
Seems that we have to wait for apple to fix it in the next versions but if you want to change the background color if you only have a solid color underneath you can use:
if you're using the adobe script or javascript to display the flash (recommended)
<!--html-->
<script src="[adobe flash detector script]">
AC_FL_RunContent( 'wmode', 'transparent','bgcolor', 'xxxxxx');
</script>
>
else if youre using embed and or for the <noscript>:
<param name="wmode" bgcolor="#xxxxxx" value="transparent">
...aslo
<embed wmode="transparent" bgcolor="#xxxxxx">
if you wanna detect safari on windows and not display it - or maybe give the the least zindex:
//Javascript:
var isSafari = (navigator.userAgent.indexOf("Safari") != -1) ? true : false;
var isWindows = (navigator.userAgent.indexOf("Windows") != -1) ? true : false;
if (isSafari && isWindows) document.getElementById('yourflashid').style.display = 'none';
if (isSafari && isWindows) document.getElementById('yourflashid').style.Zindex = '-1000';
>
if you have php it's better to do it with php as changing DOM elements with js makes page load slower and requires javascript
<?php
//PHP
/* i like to make a .php external css style sheet
(you have to have a transitional HTML document!
or most browsers will not read it beacuse of difference in MIME types!)*/
function agent($browser) {
$useragent = $_SERVER['HTTP_USER_AGENT'];
return strstr($useragent,$browser);
}
if(agent("Safari") != FALSE) {
if(agent("Windows") != FALSE) { // on windows
?>
#myflash {display:none;}
#verisignflash {z-index:-100; /* for example I already made #000 bgcolor for this and looks right*/
&lt?php
} //All Safari's
}
... and then the code for Safari in general as the rest seem to be compatible! however you can add and else statement here and seperat them
If someone finds a better option I will be glad to read it here!
I have the same problem with Safari for Windows.
But after I've updated my Flash Player to version 10.0.45.2,
the problem is gone.
So I think it's a Flash player bug.

Resources