I'm trying to port THIS pasge and its HTML5 animation to a winform.
What I did is copied and added the index.html and all the css and js file to my project. This is how my project directory looks like
And then I'm trying to load the html file into my webbrowser object using this code snippet
private void Form1_Load(object sender, EventArgs e)
{
string curDir = Directory.GetCurrentDirectory();
this.webBrowser2.Url = new Uri(String.Format("file:///{0}/index.html", curDir));
}
And I have set properties of all the file to Copy Always
Now when I run the project I get a script error message and upon pressing Yes
it loads the page but only background is displayed and the animation is lost!
please help!
PS: I've changed
<link href="css/main.css" rel="stylesheet" type="text/css" />
<script src="js/ThreeWebGL.js"></script>
<script src="js/ThreeExtras.js"></script>
To
<link href="main.css" rel="stylesheet" type="text/css" />
<script src="ThreeWebGL.js"></script>
<script src="ThreeExtras.js"></script>
in index.html file
Screenshots of two script error that I'm getting--
It works in IE10
The *.js files need to be in a js folder. Either create the folder and move them or edit the html file.
EDIT1:
Does it work if you point it to "http://www.script-tutorials.com/demos/177/index.html"?
EDIT2:
Add:
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
in the html head section.
EDIT3:
I tried on my machine and it's the same behavior. But the page does run fine in Internet Explorer 11. Maybe the WinForms control uses IE engine in some compatibility mode.
I would use http://www.awesomium.com/
The webbrowser control is just an instance of IE - that page doesn't work for me in Internet Explorer so it's unlikely to work in the embedded browser. Search for webkit net - might give you better results. I'm tempted to ask why you want to do this but I'm sure you've got a good reason.
Got it working! Basically the set up works fine. Just had to open main.css file and comment out all the footer properties to get rid of the footer and found another script ref which was pointed to js/script.js had to change it to script.js
Now how can i increase the framerate so that it doesnt stutter? Theres a lag at the moment
Related
I'm using HttpClient to get html string and use WebView's navigateToString method to show this page. I know I can use WebView load this page directly, but I would need to do some processing on that page before it's shown in WebView.
So, I faced a question. The web page quotes some css/js files in header, but I saw that 'href' value is relative path. Then the page will not show correctly in WebView.
[Updated]
For example, I'm using HttpClient to request a URI (http://example.com), then I will get the whole html page string. I will do some operations on this html string. After that, I will use WebView.NavigateToString(htmlpage) method to show this page. But if you check its head tag, there will be some <link> tag, its href value is relative path(/style-a/1.css), not absolute path. Then you will find that the html page doesn't show correctly in WebView.
Could someone give me a solution/code sample?
#Pedro Lamas, rene, Barett, moi_meme, Shachaf.Gortler Please do not put my question on hold. I didn't break any SO rules. My question was very clear. I think you do this, it's because you do not know how to answer my question. That's ok. If you don't know, you could choose not to answer it, but please do not put it on hold.
You can set address of your Link or Scripts tag with ms-appx-web:// and put address after that with additional [ / ] .
for example in this case you can use :
<script src="ms-appx-web:///Assets/FolderName/test.js" type="text/javascript"></script>
and also for link can use :
<link rel="stylesheet" type="text/css" href="ms-appx-web:///style-a/1.css">
I'll do my best to convey my situation as the date I can give you is limited.
There is this button inside a webpage when clicked creates a new tab whose HTML source is somewhat like below.
<HTML><HEAD><META content="IE=5.0000" http-equiv="X-UA-Compatible">
<TITLE>Report Viewer Webpage</TITLE>
<META content="text/html; charset=windows-1252" http-equiv=Content-Type>
<SCRIPT src="javascript1.js"></SCRIPT>
<SCRIPT src="javascript2.js"></SCRIPT>
<SCRIPT src="anotherJavascript.js"></SCRIPT>
</HEAD>
<BODY onload="CallInit('ABC_DEFG_HIJKL_1_',''); window_onload();" onhelp=common_ShowHelp() leftMargin=0 topMargin=0 bgColor=#c6c6c6 currJsHelpVar="help_reports_viewer_dlg">
<OBJECT id=CRViewer codeBase="/viewer/activeXViewer/activexviewer.cab#Version=9,2,0,442" classid=CLSID:1123452WDUIHED:1325726GDUJBEA:12R432VD width="100%" height="99%" VIEWASTEXT>
<PARAM NAME="lastProp" VALUE="500">
<!--Bunch of other params go here-->
<PARAM NAME="_cx" VALUE="26987">
<SCRIPT language=VBScript>
<!--Some Business Logic-->
</SCRIPT>
<OBJECT id=ReportSource codeBase="/viewer/activeXViewer/activexviewer.cab#Version=9,2,0,442" classid=CLSID:1123452WDUIHED:1325726GDUJBEA:12R432VD width="1%" height="1%"></OBJECT>
<OBJECT id=ViewHelp codeBase="/viewer/activeXViewer/activexviewer.cab#Version=9,2,0,442" classid=CLSID:1123452WDUIHED:1325726GDUJBEA:12R432VD width="1%" height="1%"></OBJECT>
</BODY>
</HTML>
And the page content look something like this:
And of course this is a Crystal Report.
All I want to do is click on the neat little Export button sitting right beside Print button above the text preview.
And I am using Selenium to automate all this. But the problem is, selenium only works with HTML elements and I believe the buttons in the page are ActiveX controls or something else. And they are only loaded after the call to <Body> tag's onLoad call.
One of the biggest constraint is that this application only works in IE and the power of IE developer tools is not enabling me to inspect the button element. IE developer tools just doesn't see those buttons as HTML elements. They don't exist to IE developer tools. I am using IE 9 by the way.
What would help me in automating the clicking of that Export button ? Any javascript would help ??
When I inspected this webpage, the first <Object> right after the <Body> is taking all the space of the view. And I think that randomly generated elements are going inside it dynamically.
You can try FluentAutomation. It is written on top of Selenium and has Click on (x, y) coordinate function. I've managed to get it working for Crystal report. Please let me know if you have any problem.
Cheers,
Given the HTML code you're showing, it seems that the content of the page is an ActiveX.
As a result, there is no way for you to do any kind of automation with Selenium as you said it yourself, Selenium only works with HTML.
I have a C#-WPF application which I placed a web browser in it. in the solution I have also index.html file and also a js file. the HTML has some calls to the javascript file.
and has the following tag:
<script type="text/javascript charset="utf-8" src="myfile.js"></script>
in my xaml.cs I have the following code:
webBrowser.Source = new Uri("hard-coded path to the HTML file");
when I run this code I get an error "An error has occured in the script on this page, object doesn't support property or method 'addEventListener'"
but when I clicked only on the same HTML file and run it in a broweser, there is no error.
what can cause this behavior? what is wrong in my C# code? Any idea??
thanks
I get an error "An error has occured in the script on this page,
object doesn't support property or method 'addEventListener'"
This error happens because you embded webbrowser could not find address of myfile.js.so for this problem you can put java scrip file in source
so do this:
<script type="text/javascript charset="utf-8" src="AddressLocation\myfile.js"></script>
Change with:
<script type="text/javascript>
//add content of your java file here
</script>
Simple enough question: I've created a small app that is basically just a favourites that sits in my system tray so that I can open often-used sites/folders/files from the same place. Getting the default icons from my system for known file types isn't terribly complicated, but I don't know how to get the favicon from a website. (SO has the grey->orange stack icon in the address bar for instance)
Does anyone know how I might go about that?
You'll want to tackle this a few ways:
Look for the favicon.ico at the root of the domain
www.domain.com/favicon.ico
Look for a <link> tag with the rel="shortcut icon" attribute
<link rel="shortcut icon" href="/favicon.ico" />
Look for a <link> tag with the rel="icon" attribute
<link rel="icon" href="/favicon.png" />
The latter two will usually yield a higher quality image.
Just to cover all of the bases, there are device specific icon files that might yield higher quality images since these devices usually have larger icons on the device than a browser would need:
<link rel="apple-touch-icon" href="images/touch.png" />
<link rel="apple-touch-icon-precomposed" href="images/touch.png" />
And to download the icon without caring what the icon is you can use a utility like http://www.google.com/s2/favicons which will do all of the heavy lifting:
var client = new System.Net.WebClient();
client.DownloadFile(
#"http://www.google.com/s2/favicons?domain=stackoverflow.com",
"stackoverflow.com.ico");
Updated 2020
Here are three services you can use in 2020 onwards
<img height="16" width="16" src='https://icons.duckduckgo.com/ip3/www.google.com.ico' />
<img height="16" width="16" src='http://www.google.com/s2/favicons?domain=www.google.com' />
<img height="16" width="16" src='https://api.statvoo.com/favicon/?url=google.com' />
You can use Google S2 Converter.
http://www.google.com/s2/favicons?domain=google.com
Source: http://www.labnol.org/internet/get-favicon-image-of-websites-with-google/4404/
This question is the first google search result I got when I keep searching for website favicon API. So I think it'll be still helpful in the future.
https://icon.horse/icon/[url.hostname] will give you a better site icon.
https://icon.horse/icon/stackoverflow.com
You can do it without programming in 3 steps:
1. Just open the web site, right-click and select "view source" to open the HTML code of that site. Then in the text editor search for "favicon" - it will direct you to something looking like
<link rel="icon" href='/SOMERELATIVEPATH/favicon.ico' type="image/x-icon" />
Take the string in href and append it to the web site's base URL (let's assume it is "http://WEBSITE/"), so it looks like
http://WEBSITE/SOMERELATIVEPATH/favicon.ico
which is the absolute path to the favicon. If you didn't find it this way, it can be as well in the root in which case the URL is http://WEBSITE/favicon.ico.
2. Take the URL you determined and insert it into the href-Parameter of the following code:
<html>
<head>
<title>Capture Favicon</title>
</head>
<body>
<a href='http://WEBSITE/SOMERELATIVEPATH/favicon.ico' alt="Favicon"/>Favicon</a>
</body>
</html>
3. Save this HTML code locally (e.g. on your desktop) as GetFavicon.html and then double-click on it to open it. It will display only a link named Favicon. Right-click on this link and select "Save target as..." to save the Favicon on your local PC - and you're done!
It's a good practice to minimize the number of requests each page needs.
So if you need several icons, yandex can do a sprite of favicons in one query.
Here is an example
http://favicon.yandex.net/favicon/google.com/stackoverflow.com/yandex.net/
The first thing to look for is /favicon.ico in the site root; something like WebClient.DownloadFile() should do fine. However, you can also set the icon in metadata - for SO this is:
<link rel="shortcut icon"
href="http://sstatic.net/stackoverflow/img/favicon.ico">
and note that alternative icons might be available; the "touch" one tends to be bigger and higher res, for example:
<link rel="apple-touch-icon"
href="http://sstatic.net/stackoverflow/img/apple-touch-icon.png">
so you would parse that in either the HTML Agility Pack or XmlDocument (if xhtml) and use WebClient.DownloadFile()
Here's some code I've used to obtain this via the agility pack:
var favicon = "/favicon.ico";
var el=root.SelectSingleNode("/html/head/link[#rel='shortcut icon' and #href]");
if (el != null) favicon = el.Attributes["href"].Value;
Note the icon is theirs, not yours.
In 2020, using duckduckgo.com's service from the CLI
curl -v https://icons.duckduckgo.com/ip2/<website>.ico > favicon.ico
Example
curl -v https://icons.duckduckgo.com/ip2/www.cdc.gov.ico > favicon.ico
You can get the favicon URL from the website's HTML.
Here is the favicon element:
<link rel="icon" type="image/png" href="/someimage.png" />
You should use a regular expression here. If no tag found, look for favicon.ico in the site root directory. If nothing found, the site does not have a favicon.
HttpWebRequest w = (HttpWebRequest)HttpWebRequest.Create("http://stackoverflow.com/favicon.ico");
w.AllowAutoRedirect = true;
HttpWebResponse r = (HttpWebResponse)w.GetResponse();
System.Drawing.Image ico;
using (Stream s = r.GetResponseStream())
{
ico = System.Drawing.Image.FromStream(s);
}
ico.Save("favicon.ico");
Sometimes we can't get the favicon image with the purposed solution as some websites use .png or other image extensions. Here is the working solution.
Open your website with a firefox browser.
Right-click on the website and click the "View page info" option from the list.
It will open up a dialog and click on the "Media" tab.
In that tab you will see all the images including favicon.
Select the favicon.ico image or click through the images to see which image is used as favicon. Some websites use .png images as well.
Then click on the "Save As" button and you should be good to go.
thanks!
This is a late answer, but for completeness: it is difficult to get even close to fetching 90% all favicons.
A while ago I wrote a WordPress plugin which attempts to get closer to 100%.
This is how it works:
It starts by searching existing favicon repositories such as Google favicons and GetFavicons for the favicon.
If none of them returns an icon, the plugin attempts to get the icon itself. This involves traversing several pages on the domain.
The plugin then inspects the physical image file, because on some servers files get returned with the incorrect mime types.
The code is still not perfect because in the details you will find many weird situations: people have wrongly coded paths, e.g. img/favicon.ico where img is not in the root, duplicate headers in HTML output, different server responses from the head and body etc.
The core of the fetching part is here so you can reverse-engineer it, but be aware that validating the response should be done (checking image filetype, mime etc.).
The SHGetFileInfo (Check pinvoke.net for the signature) lets you retrieve a small or large icon, just as if you were dealing with a file/folder/Shell item.
http://realfavicongenerator.net/favicon_checker?site=http://stackoverflow.com gives you favicon analysis stating which favicons are present in what size. You can process the page information to see which is the best quality favicon, and append it's filename to the URL to get it.
You can use Getfv.co :
To retrieve a favicon you can hotlink it at... http://g.etfv.co/[URL]
Example for this page : http://g.etfv.co/https://stackoverflow.com/questions/5119041/how-can-i-get-a-web-sites-favicon
Download content and let's go !
Edit :
Getfv.co and fvicon.com look dead. If you want I found a non free alternative : grabicon.com.
Using jquery
var favicon = $("link[rel='shortcut icon']").attr("href") ||
$("link[rel='icon']").attr("href") || "";
Style sheet in master page is not working for one web page of asp.net application but it works for another web page.
If you are referencing a css file from a master page you should ensure it has an absolute path, that way it will work everywhere. For example:
<head runat="server">
<link type="text/css" rel="stylesheet" href="~/_styles/mystylesheet.css" />
</head>
The important thing to note here is that the head tag has the runar="server" attribute and that i am specifying the full virtual path using a tilde ("~").
Are none of its style elements being included? Is it being over ridden( they are Cascading Style Sheets)? Does it have the correct CSS include statement?
Are your pages in different levels of folders ?
For example,
..\main.css
..\folder1\MasterPage.master
..\folder1\css_working.aspx
..\folder1\folder2\css_not_working.aspx
in this scenario you should define your css in masterpage as :
<link rel="stylesheet" type="text/css" href="../main.css" />
And take your pages to same level, like that :
..\main.css
..\folder1\MasterPage.master
..\folder1\css_working.aspx
..\folder2\css_not_working.aspx
If you are using update panels there are some cases where the styling may be lost for AJAX toolkit controls. To fix this you need to put hte full name of hte class items into the stylesheet instead of letting hte toolkit handle this.
Also be sure to use a relative url where possible so that if a file moves it won't loose it's mapping.
Use Firebug or Debug Bar, these tools will show you all the styles being employed on each element, so you can see what stylesheets it is using and which ones it is not.
Also, when you build check for any warnings about stylesheets that it can't reference etc.
it could be a permission issue on the folder... if you have deny users="?" in your web config.. make sure you have an allow users on the folder where you have your style sheets