I need to load a page within a Flex based AIR desktop app, then populate certain fields on the page. I am trying to use an HTML control to load the page, but I can't figure out how to interact with DOM elements. Is there another way to do this?
Any pointers or help would be most appreciated!
Thanks,
rw
I've had success with passing parameters from the Flex / Air app as url variables then in the HTML page (loaded with stagewebview in as3) retrieve those individual data elements using a server side technology (php, asp, etc.) then use javascript to take those values and set them as values for specific fields on the page.
I've used it both ways so for instance the html page can invoke url calls that are monitored by the flex / air app and in as3 I can watch for specific url variables (i.e. when url change is detected) that can trigger any type of action I want to happen in as3, and in the other direction the flex / air app can send data and commands/triggers to the HTML page as well.
AS3 StageWebViewBridge looks really powerful, but I havent pushed myself to get to all the benefits of it yet, I've just used standard StageWebView to suit my needs. Good luck with your project and let me know if you have any other questions with this.
Thanks for your answers - sorry for the late response, I didn't get notified via email, which I am sure is my bad....
So, I have gotten this working. Specifically, I am opening a page, populating fields in a form, submitting the form, then collecting the results. This needs much fleshing out, but the basic concept works:
<fx:Script>
<![CDATA[
private function init(e:Event):void
{
htmlCont.addEventListener(Event.COMPLETE, htmlComplete);
htmlCont.location="https://www.targetsite.com/pagewithform.html"
}
private function htmlComplete(event:Event):void
{
htmlCont.domWindow.document.getElementById("fieldToFill01").value = textInput.text;
htmlCont.removeEventListener(Event.COMPLETE, htmlComplete);
//After new page is loaded, trigger function to get data
htmlCont.addEventListener(Event.COMPLETE, getResult);
//Use htmlElement.htmlLoader to access DOM click() function.
htmlCont.htmlLoader.window.document.getElementById("ButtonID").click();
}
private function getResult(e:Event):void
{
//Getting all <p> tags for example
var returnedArray = htmlCont.htmlLoader.window.document.getElementsByTagName("p");
//Different grabs of the content of a <p> tag.
trace(returnedArray[0].innerHTML);
trace(returnedArray[0].innerText);
trace(returnedArray[0].textContent);
}
</fx:Script>
<!-- Inside your Application somewhere -->
<mx:HTML id="htmlCont" width="100%" height="100%" y="100"/>
Again, there is a lot more to be done with this, and I think I will have some regex questions soon as the formatting of my html target page leaves a lot to be desired!
Thanks for the input, sorry again for bad form in not responding.
rw
Related
So I'm trying to setup a web-page where when you open it, it will play a random piece of music, and when that one finishes, it will play another directly after so you get a constant stream of music, but not in the same order every time. If this goes outside the bounds of HTML and I'm looking at for instance JavaScipt than that's fine.
I know this is probably a rather easy solution, but I'm new to HTML and trying to understand it better.
Thanks in advance if I don't get back to you soon!
This is best solved using JavaScript, which is used to add behavior to a website. HTML is primarily used to structure your site.
We can get a collection of all audio elements with the querySelectorAll function. Then we find a random element with the next line and call the play method.
var audio = document.querySelectorAll("audio");
function playRandom() {
audio[Math.floor(Math.random() * audio.length)].play()
}();
For the second part of your question, you would want to listen for the ended event. Inside the event listener function, you would then call the playRandom() function.
audio.addEventListener("ended", function() {
playRandom();
});
Good afternoon,
I want to know if it will be possible to add Scala Swing objects (especially JFrame objects) in a Play 2.0 application, I look for something like this but I haven't found nothing.
I need a Text Area that the user can write, and after that when he/she submit, I need to create an instance of a Scala class which after that it will show in a JFrame are (if I can) something related with the textarea input.
I can do the textarea form with HTML but the other part I don't know how to do it if not with JFrames.
Are many other ways to do this?
The example of what I can do is (it's a App related on Lambda Calculi):
x ---> create a Var elemnt and display it in a JFrame
\x.x ----> create a Abs(Var,Var) element and display it in a JFrame
...
Can anyone help me?
Thanks in advance
Piotr's comment is correct; the two technologies (HTML and Swing) are very separate. I'm not sure exactly what you're trying to accomplish; however, it sounds like what you want to do is possible via Javascript. A good tutorial for Javascript can be found here: http://www.codecademy.com/tracks/javascript. Javascript is also very easy to integrate into a Play project; you can place your Javascript files in your project's /public folder and reference them from your HTML files using <script> tags.
I am developing an Windows Forms application using VB.NET that offers the user to lookup addresses on Google Maps through a Web Browser. I can also successfully show the directions between two points to the user, as well as allow the user to drag the route as he/she pleases. My question now is - is it possible for me to get the lattitude/longitude information of the route, i.e. the overview_polyline array of encoded lattitude/longitude points and save it to e.g. a text file on my computer? Or is it possible to get a list of all the addresses located both sides of the route over the entire length of the route, and then save the data to a file on my computer? I'm using HTML files to access and display the Google Maps data in the Web Browser item.
Thank you
This is actually pretty simple if your just looking for the screen coordinates.
// this probably should be in your form initialization
this.MouseClick += new MouseEventHandler(MouseClickEvent);
void MouseClickEvent(object sender, MouseEventArgs e)
{
// do whatever you need with e.Location
}
if your strictly looking for the point in the browser, you need to consider the functions
browser.PointToClient();
browser.PointToScreen();
So, this method is usable if you know exactly where your form is (easy to get its coords) and where you webbrowser control is (easy to get coords of this as well since it's just a control in your form) and then, as long as you know how many pixels from the left or right, and from the top or bottom the image will be displayed, once you get the global mouse click coords (which is easy) you can predict where it was clicked on the image.
Alternatively, there are some scarier or uglier ways to do it here...
You can use the ObjectForScripting property to embed code to do this in the webbrowser. It's ugly to say the least. MSDN has some documentation on the process here: http://msdn.microsoft.com/en-us/library/system.windows.forms.webbrowser.objectforscripting.aspx
Because its really ugly, maybe a better solution is to use AxWebBrowser - it's ugly too but not so scary.
In addition, I found this post of someone wanting to do it on a pdf document, and a MSFT person saying its not possible, but really what he is trying to say is that it isn't built in, even with a pdf document its still possible to predict with high to certain accuracy where it was clicked if you use the first method i described. Here is the post anyway: http://social.msdn.microsoft.com/Forums/en/csharpgeneral/thread/2c41b74a-d140-4533-9009-9fcb382dcb60
However, it is possible, and there are a few ways to do it, so don't get scared from that last link I gave ya.
Also, this post may help if you want to do it in javascript:
http://www.devx.com/tips/Tip/29285
Basically, you can add an attribute on the image through methods available in the webbrowser control, you can add something like onclick="GetCoords();" so when it is clicked, the JavaScript function will get the coords, and then you can use javascript to place the values in a hidden input field (input type="hidden") which you can add through the webbrowser control, or if there is one already on the page, you can use that. So, once you place the coords using javacript into that input field, you can easily grab the value in that using the webbrowser control, eg:
webbrowser1.document.getElementById("myHiddenInputField").value
That will get the value in that field, which you've set through JavaScript. Also, the "GetCoords()" function i mentioned is called SetValues() in the javascript method link i provided above (in the devx.com site) but I named it GetCoords because it makes more sense and didn't want to confuse you with the actual name they used, you can change this to any name you want of course. Here is the javascript they were using, this only gets the coords into a variable, doesn't put it into a hidden input field, we will need to do that in addition (at the end of the javascript SetValues/GetCoords function).
function SetValues()
{
var s = 'X=' + window.event.clientX + ' Y=' + window.event.clientY ;
document.getElementById('divCoord').innerText = s;
}
These guys are just saving it inside a div element, which is visible to users, but you can make the div invisible if you want to use a div field, there is no advantage or disadvantage in doing that, you would just need to set the visible property to false using javascript or css, but still, it is easier to use a hidden input field so you don't need to mess with any of that.
Let me know how you get along.
is there any solution on StageWebView.loadURL(), how I can handle URLs in HTML Pages which have target="_blank"?
It's a mobile Android App. (TabbedViewApplication)
Hope someone can help.
Thx
One option is StageWebViewBridge.
StageWebViewBridge is an extended version of flash.media.StageWebView.
Extends loadString method with AS3 - JS communication.
-Extends Bitmap class, you can modify his x,y,alpha,rotation,visible, etc ( Version 1 Beta )
-Communicates Actionscript with Javascript.
-Communicates Javascript with Actionscript.
-Load local files and resources in a easy way.
-Extends loadString method with AS3 - JS communication.
-Extends loadString method to load local resources.
-Lets you take an SnapShot to use as the bitmapData of the bitmap.
StageWebViewBridge source: https://code.google.com/p/stagewebviewbridge/
I never worked with the StageWebView but I know it's really limited. When using an HTMLLoader, you can set a custom HTMLHost instance that specifies to use current HTMLLoader when opening to _blank. However, I don't think it's possible with StageWebView.
public class MyHTMLHost extends HTMLHost
{
public function MyHTMLHost(defaultBehaviors:Boolean=false)
{
super(defaultBehaviors);
}
override public function createWindow(windowCreateOptions:HTMLWindowCreateOptions):HTMLLoader
{
// all JS calls and HREFs to open a new window should use the existing window
return htmlLoader;
}
}
OK, so the only solution for this problem i could found is to load the page (containing the links) as String with the URLLoader and replace its specified parts. Finally loading it via StageWebView.loadString() method.
Problems occur when the Site is dynamic and contains JavaScript. I had also replace some relative links with absolute pathes.
That's it... but I really hope that adobe makes it possible to load those "_blank" links with the StageWebView.loadURL() method.
If you want to capture when a user clicks on a link inside your StageWebView add an an event listener for location changing event (LocationChangeEvent).
This LocationChangeEvent will include the URL they are going to and target. Then you can prevent the URL from loading, let it continue (by doing nothing) or handle it any other way including loading another URL.
If you want to load another URL first stop the loading with stageWebView.stop(). You should also call event.preventDefault(). You can then attempt to
Note: There is another event called locationChange that may be helpful.
As it was declared as an official bug, adobe QA Owner Sanjay C. added a comment: "Able to reproduce the issue with the attached project. Sending to IRB."
So, hope the next Build will come up with the fix wit it.
Best regards
I have an app that allows a user to use JQuery and Javascript to add images and position them in a div dynamically.
I would like to be able to submit the div with all the HTML to a WebService and receive back an image so we have a bitmap of the result of the end user's work.
I would prefer a solution in .Net as this is what I am most familiar with but am open to pretty much anything?
I would like to be able to submit the div with all the HTML to a WebService and receive back an image
Try http://browsershots.org!
Browsershots makes screenshots of your web design in different operating systems and browsers. It is a free open-source online web application providing developers a convenient way to test their website's browser compatibility in one place.
How about this. You load the html into a webbrowser control and then use the DrawToBitmap method. It doesn't show up on intellisense and this is probably not the best solution, but it works. Observe the DocumentCompleted event and add the following code:
private void webBrowser_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)
{
var bmp = new Bitmap(100, 100);
var rect = new Rectangle(webBrowser.Location.X, webBrowser.Location.Y, webBrowser.Width, webBrowser.Height);
webBrowser.DrawToBitmap(bmp, rect);
bmp.Save("test.jpg", ImageFormat.Jpeg);
}
You'll probably want to change the width and height of that bitmap object (do it in some smart way or something). Hope this helps.
EDIT: I see now that you are using a webservice for this, hence this solution probably won't work. I'll leave it here just for information's sake.
I was not able to figure out how to do this by submitting the html and receiving an image but I was able to create and ASHX handler that returns a png file based on this blog post
which was good enough for my scenario.
He uses CutyCapt to take a screen shot of an existing web page, write the image to a folder on the webserver and return it.