How do I embed a Silverlight control into a Facelets page? - silverlight

I am trying to embed a Silverlight control into a JSF 2.0 page, which is using Facelets, however, I am receiving a very ambiguous error message when the page renders.
Can anyone suggest how I can do this? I have my clientaccesspolicy.xml, and silverlight.js in place.
When I remove the <object> tag, the JSF page displays correctly
If I place the <object> tag into a vanilla HTML page, the silverlight control renders correctly in my Tomcat 7.0.25.
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:cayman="http://www.fnet.com/cayman/jsf"
template="/WEB-INF/jsf/template.xhtml">
<ui:define name="title">Home Page</ui:define>
<ui:define name="content">
<h:form>
<ui:include src="header.xhtml">
<ui:param name="loginBean" value="#{UserLoginComponent}" />
</ui:include>
<div>
<p:growl />
</div>
<center>
<p:panel header="Home Page">
<f:verbatim escape="#{true}">
<object data="data:application/x-silverlight-2,"
type="application/x-silverlight-2" width="100%" height="100%">
<param name="source" value="Dashboard.xap" />
<a
href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50826.0"
style="text-decoration: none"> <img
src="http://go.microsoft.com/fwlink/?LinkId=161376"
alt="Get Microsoft Silverlight" style="border-style: none" />
</a>
</object>
</f:verbatim>
<iframe id="_sl_historyFrame"
style="visibility: hidden; height: 0px; width: 0px; border: 0px"></iframe>
<h:inputHidden id="userid" value="ADMINISTRATOR" />
<h:inputHidden id="password" value="admin" />
<h:inputHidden id="adminserviceuurl"
value="http://129.196.218.35:8080/cayman/services" />
</p:panel>
</center>
</h:form>
</ui:define>

Remove <f:verbatim>. It's a leftover from the old ages of JSF 1.x on JSP and deprecated in JSF 2.x.
As to the ambiguous error message which you forgot to include in your question, make sure that you're properly escaping XML special characters like &. Facelets is a XML based view technology and will be parsed by a XML parser before generating the HTML. The XML parser will choke when it encounters & which is supposed to represent the start of an entity, but there is no ; to denote the end of an entity or when the entity by itself does not represent anything at all.
So, replace
href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50826.0"
by
href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50826.0"

Related

Unable to load Silverlight in angular2 when embedded in a component

Current behavior
When embedding and loading Silverlight.xap directly inside an HTML page, it works fine. But when we move same code inside a component, it won't load the Silverlight. DOM in both cases, i.e. embedding and loading through HTML and through component, doesn't show any difference.
Code of Silverlight-app.Component.HTML Page
When we load this page directly, i.e. localhost/OurApp/Silverlight-app.Component.HTML, silverlight content gets loaded and it works fine. But when we open index.html in browser (which is main component of our angular2 and Silverlight-app.Component.HTML page is child component of index.html), it don't load silverlight content.
<section>
<div>
<object id="silverlightControlHost" data="data:application/x-silverlight-2," type="application/x-silverlight-2"
width="100%" height="100%" style="min-height: 100%; height: 1000px">
<param name="source" value="clientbin/SilverlightApp.xap"/>
<param name="onError" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="5.0.61118.0" />
<param name="autoUpgrade" value="true" />
<param name="Windowless" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=5.0.61118.0" style="text-decoration: none">
<img src="images/slmedallion.png" alt="Get Microsoft Silverlight" style="border-style: none" />
</a>
</object>
<iframe id="_sl_historyFrame" style="visibility: hidden; height: 0px; width: 0px;
border: 0px"></iframe>
<iframe id="desktop" style="visibility: hidden; height: 0px; width: 0px; border: 0px"></iframe>
</div>
</section>
Expected/desired behavior
Embedding and loading Silverlight component should have same behavior irrespective of loading through HTML or through component.
What is the motivation / use case for changing the behavior?
We are migrating our Silverlight application to Angular2. As complete migration will take months, we are keeping some of the silverlight modules as well.
Images for better understanding of the issue
this example does exactly what you need :)
https://github.com/lohiarahul/Angular2-Silverlight-Starter

Richface popup not working in GAE

Base on example from richface showcase:
http://showcase.richfaces.org/richfaces/component-sample.jsf?demo=popup&sample=simplePopup&skin=blueSky
When I call the popup using #{rich:component, nothing happen (ie. no popup):
<a4j:commandLink styleClass="no-decor" execute="#this"
oncomplete="#{rich:component('popup')}.show()">
However when I change to using rich:componentControl, popup appear
<a4j:commandLink styleClass="no-decor" execute="#this">
<rich:componentControl target="popup" operation="show" />
Note: Both work find from GAE when I run from my local notebook but problem happen when I deploy to GAE online (http://cloudenterpriseapps.appspot.com/public/test/testPopup.jsf)
Any help?
Just solved by adding
<a4j:status onstart="#{rich:component('statPane')}.show()"
onstop="#{rich:component('statPane')}.hide()" />
...
<rich:popupPanel id="statPane" autosized="true">
<h:graphicImage value="/images/common/ai.gif" alt="ai" />
Please wait...
</rich:popupPanel>
Here the complete code and now work fine.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<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:ui="http://java.sun.com/jsf/facelets"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<ui:composition>
<h:head>
<title>RichFaces Showcase</title>
</h:head>
<h:body>
<a4j:status onstart="#{rich:component('statPane')}.show()"
onstop="#{rich:component('statPane')}.hide()" />
<a4j:commandLink styleClass="no-decor" execute="#this" render="#none"
action="#{dummyBean.methodCall}"
oncomplete="#{rich:component('popup')}.show()">
<h:graphicImage value="/images/icons/common/edit.gif" alt="edit" />
</a4j:commandLink>
<h:form id="myform">
<rich:popupPanel id="popup" modal="false" autosized="true"
resizeable="false">
<f:facet name="header">
<h:outputText value="Simple popup panel" />
</f:facet>
<f:facet name="controls">
<h:outputLink value="#"
onclick="#{rich:component('popup')}.hide(); return false;">
X
</h:outputLink>
</f:facet>
<p>Any content might be inside this panel.</p>
<p>
The popup panel is open and closed from the javascript function of
component client side object. The following code <a href="#"
onclick="#{rich:component('popup')}.hide()">hide this panel</a>:
<f:verbatim>#</f:verbatim>
{rich:component('popup')}.hide()
</p>
<a4j:commandButton value="Close" styleClass="no-decor"
execute="#this" render="#none" action="#{dummyBean.methodCall2}"
oncomplete="#{rich:component('popup')}.hide()"/>
<br />
</rich:popupPanel>
</h:form>
<rich:popupPanel id="statPane" autosized="true">
<h:graphicImage value="/images/common/ai.gif" alt="ai" />
Please wait...
</rich:popupPanel>
</h:body>
</ui:composition>
</html>

How to display vendor image file in cakephp .ctp file

i have created component secureimage captcha and now i want to display "vendor files audio/refresh.png" file which is placed under vendor/secureimage/images/refresh.png and vendor/secureimage/images/audio_icon.png
code -----------
<object type="application/x-shockwave-flash" data="/adminpanel_login/captcha/securimage_play.swf?bgcol=#ffffff&icon_file=/adminpanel_login/captcha/audio_icon.png&audio_file=<?php echo $captcha_hear;?>" height="32" width="32">
<param name="movie" value="/adminpanel_login/captcha/securimage_play.swf?bgcol=#ffffff&icon_file=/adminpanel_login/captcha/audio_icon.png&audio_file=<?php echo $captcha_hear;?>" />
</object>
<a tabindex="-1" style="border-style: none;" href="#" title="Refresh Image" onclick="document.getElementById('captcha').src ='<?php echo $this->webroot;?>admins/securimage/' + Math.random(); this.blur(); return false"><img src="<?php //echo $captcha_image_refresh;?>/adminpanel_login/captcha/refresh.png" alt="Reload Image" height="32" width="32" onclick="this.blur()" align="bottom" border="0" /></a>
You should put images in the webroot, that way they can be served directly by your webserver and not by php.
You can do this by symlinking the image from vendors to webroot/img

Users PC installing wrong version of Silverlight

I have a Silverlight Application (SL4) which I have rolled out to people within my network. The problem I have is that when some of my users go to access the SL application it is asking them to download a Silverlight 3 plug in.
Is there something I need to set in my Project to ensure that the Plug in installs SL4.
Sounds like the host page HTML is incorrectly set. Your object tag HTML ought to look like this:-
<div id="silverlightControlHost">
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
<param name="source" value="ClientBin/SilverlightApplication1.xap"/>
<param name="onError" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="4.0.60310.0" />
<param name="autoUpgrade" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.60310.0" style="text-decoration:none">
<img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/>
</a>
</object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe>
</div>
Note in particular the minRuntimeVersion param and the "&v=4.0.60310.0" query string value of the href in the object fallback content.

How do I access a Silverlight XAP file across a domain?

I'm trying to add my Silverlight application that lives on one subdomain to a web page in another subdomain. For some reason this just plain isn't working ... my Silverlight application is loaded as such in a page on http://subA.domain.com/somepage.html:
<div id="silverlightControlHost">
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2"
width="800px" height="600px">
<param name="source" value="http://subB.domain.com/SilverlightApp.xap" />
<param name="onerror" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="2.0.31005.0" />
<param name="autoUpgrade" value="true" />
<param name="enableHtmlAccess" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight"
style="border-style: none" />
</a>
</object>
<iframe style='visibility: hidden; height: 0; width: 0; border: 0px'></iframe>
</div>
If I move SilverlightApp.xap to subA.domain.com, it loads perfectly. What steps are needed to access a XAP file across domains?? I've been scraping the net trying to figure this out and seem to be getting nowhere.
Thanks!!
To assist others who have this same issue, and don't want to use IFrames, please see this link, as it has solved my problem. Even though the author is referring to Silverlight 2, it has solved my problem in Silverlight 3. In case the link goes down, there are 2 things I needed to do:
-- In the Silverlight app, edit the AppManifest.xml to add the following:
<Deployment xmlns="http://schemas.microsoft.com/client/2007/deployment"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
ExternalCallersFromCrossDomain="ScriptableOnly">
-- If you are using HtmlPage in your Silverlight app (such as when reading the QueryString passed to the hosting page), you must also add:
<param name="enableHtmlAccess" value="true" />
to the silverlight object in the hosting page.
Please note there are security implications to the above, and I can't help but to think this is why Microsoft does not go out of their way to disseminate this information. However in my case I don't have scriptable silverlight elements, and since I wrote the silverlight app, I don't have a problem with the hosting page allowing the silverlight app access to it.
While researching this, I noticed that this issue and corresponding solutions gets confused with a separate problem, the problem of a silverlight xap accessing a wcf service across domain boundaries. That issue does require a clientaccesspolicy.xml file located on the root of the website hosting the wcf service.
So it is possible to have the 1st site accessing a xap file on a 2nd site, which accesses a data service on a 3rd site, for maximum flexibility and re-use.
When Silverlight requests a .XAP file cross-domain, the content type must be: application/x-silverlight-app. Also, you need a cross-domain policy file on the other domain. gl
You could create a simple html file next to the .xap that contains the silverlight object and access this from an iframe. This is how http://silverlight.live.com/ fixed this issue for example.
On you main page on subA.domain.com add an iframe that show a html page on the other domain:
<iframe src="http://subB.domain.com/SilverlightApp.html"
scrolling="no"
frameborder="0"
style="width:800px;height:600px">
</iframe>
and SilverlightApp.html on subBdomain.com could look something like:
<html>
<body>
<div id="silverlightControlHost">
<object data="data:application/x-silverlight-2,"
type="application/x-silverlight-2"
width="800px" height="600px">
<param name="source" value="http://subB.domain.com/SilverlightApp.xap" />
<param name="onerror" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="2.0.31005.0" />
<param name="autoUpgrade" value="true" />
<param name="enableHtmlAccess" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=124807"
style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181"
alt="Get Microsoft Silverlight"
style="border-style: none" />
</a>
</object>
<iframe style='visibility: hidden; height: 0; width: 0; border: 0px'>
</iframe>
</div>
</body>
</html>

Resources