Develop Reference

React Native WebView getting response from different source

I am loading a React Native's WebView component like so:
<WebView
source={{uri: 'http://www.example-one.com'}}
onMessage = {(event) => console.log(event.nativeEvent.data)}
/>
And inside my www.example-one.com I add this javascript code
window.postMessage('It works!!');
This works great and I am able to the message from www.example-one.com in my React Native's console.
However, when I load the same WebView with same source and redirect the user to different source say www.example-two.com from inside wwww.example-one.com and add the javascript code inside www.example-two.com i.e.
window.postMessage('It works from example two!!');
then I don't see that message inside React Native's console.
Is there any work around to make this work?

Automatically jump to a certain part of a WebView

I'm making a Chrome App, and i'm using the web view tag, which is similar to an iframe.
Is there a way to load halfway down the webpage that's inside the web view?
I have tried:
<webview onLoad="window.scroll(0, 150)" class="test" src="http://example.co.uk/test.aspx"></webview>
But it seems that would be far to easy. I'm not convinced its even possible.
Thanks

Assuming for a moment that code would execute (it won't because of the CSP), window would refer to the app's page, not the embedded page.
You need to execute the code in the context of the embedded page.
If you worked with Chrome extensions before, you would know that the part interacting with web content is called a Content Script.
Apps have a similar concept for <webview> elements. You can either declare in advance which pages should get which content script while they load, or you can explicitly load a content script.
So, suppose you have a file content.js with the following contents (excuse the pun):
window.scroll(0, 150);
Also, assume you have a script app.js running inside your app page, and a variable webview is a reference to the <webview> in there.
Then, you can make the webview execute it:
Declaratively, by calling webview.addContentScripts before loading the page (e.g. before setting src from app.js code):
// Assuming <webview id="wv"></webview>
var webview = document.getElementById("wv");
webview.addContentScripts([{
name: "ExampleRule",
matches: ["http://example.co.uk/*"], // can be as narrow as you wish
js: ["content.js"]
}]);
webview.src = "http://example.co.uk/test.aspx";
Explicitly, when the page is already loaded:
// Assuming <webview id="wv" src="http://example.co.uk/test.aspx"></webview>
var webview = document.getElementById("wv");
webview.executeScript({file: "content.js"});
It is, of course, possible to make content.js much more sophisticated (for example, receive commands from the app) and/or more precisely control the timing of your operation - but those are at this point generic content script questions for which you can find solutions elsewhere or ask a new question.

Rails 3 : Turning rails views in to a javascript snipet others can copy/paste

I have a rails site where users make a custom profile. It's a picture of themselves with a link and a title sentence, sorta of like a billboard with words.
I want to take this show view from rails and create custom javascript snippet of code for each user so they could copy and paste it into their own websites and blogs and have it show up according to my rails site.
How is this done? Is there a gem?
Thanks

One option is to use fixe sized iFrame, which acts as a sort of window into another site, instead of javascript. The main benefit of using an iFrame is that its isolated from the parent page's CSS and Javascript. So, none of that pages' styles/scripts will affect the display of your code. You can simply serve up a regular HTML code in the iFrame.
The snippet would look something like:
<iframe src="http://yourdomian.com/profile/1/widget" height="100" width="50" />

a simple js script like this :
<div id="profile"></div>
<script type="javascript">
$.get('/user/101/profile', function(data){$("#profile").html(data)});
</script>
and in your /user/101/profile, use render :partial => 'profile'.

How to convert a web page to PDF or image using Javascript?

I have created a graphics using jquery. and i want to convert this web page to pdf or an image. Which one is simpler? but when I convert this page to pdf that graphic will not shows. can any help me to solve this problem??? please refer some code.

JavaScript is interpreted by the browser, not by the HTML -> PDF application. I'd recommend using wkhtmltopdf, as it uses Webkit to render, so maybe that would fix your problem.
To try to render the page that includes JavaScript, fire up Google Chrome (or another browser with a DOM Inspector of sorts), open your webpage, right click and select Inspect Element, right click , click Edit as HTML, and copy & paste the HTML into a new text document, save it, and use that instead to convert to a graphics.
You have to go through a complicated process like this because that application that your are using renders only HTML + CSS, and doesn't even parse the JS. The DOM inspector shows the HTML pages as it currently looks, not when it was loaded.
I hope I didn't make it too complicated...

Dynamically loading a SWF into ShadowBox

FYI, ShadowBox is a javscript media viewer/lightbox. http://www.shadowbox-js.com/
Running into an issue when trying to dynamically load SWFs into my ShadowBox.
My script outputs the following HTML:
<div id="LightBoxItemList">
<a href="Images/large01.jpg" rel="shadowbox[Mixed];" class="First" />
<a href="Images/Hydro_Sample.swf" rel="shadowbox[Mixed];width: 800;height: 600;" />
<a href="Images/large01.jpg" rel="shadowbox[Mixed];" />
</div>
After this HTML is created and inserted into my page, I run the following script:
Shadowbox.clearCache();
Shadowbox.setup("#LightBoxItemList a");
Everything loads correct except the SWF. The SWF loads with a width and height of 300x300. I'm not sure what I'm doing wrong, but any advice would be awesome. Also, I'm running init() with skipSetup.
I would also note that if I put in the HTML into the sample statically (not through an AJAX call), it works correctly after my Shadowbox.Init() (with skipSetup taken out).
So it looks like setup() isn't doing what it should be doing. Or I'm doing it wrong.
Any suggestions would be greatly appreciated!

You need to use = after width and height. Not :.
shadowbox[Mixed];width=600;height=200;

Are you sure the HTML you get back from your AJAX is the same as the code that you are using when you put it in statically. You may be having some escaping issues. I'd use Firebug's NET panel and check that out first.

It is a quirk in ShadowBox.