WKWebView: scalesPageToFit behaviour without Java Script - ios

How to get scalesPageToFit behaviour for HTML content displayed in a WKWebView without using JavaScript? (disabling JS is a requirement for in our case).
Sorry for not posting any code, but I have no idea how I could achieve this. All solutions I know and all I found are based on JS. Example.
I already add <meta name="viewport" content="width=device-width, initial-scale=1.0"/> to the HTML if it does not exist yet, but at least images are often displayed way too big.
All images are provided to WKWebView by a WKURLSchemeHandler.

Please put
<meta name="viewport" content="initial-scale=1.0" />
inside your <head> tag.

extension String {
mutating func fitContentToScreen() {
self.add(prefix: "<header><meta name='viewport' content='width=device-width, user-scalable=yes'></header>")
}
}
You add this header line to html content to fit screen.

Related

Thymeleaf - Set attribute in meta tag with conditional

I would like to set the content of my "robots" tag depending on an attribute returned with my model. In my back end return statements, I have one place where I return the following snippet, and some places where I do not set that attribute at all.
model.addAttribute("robotsMetaTag", "all");
return "pages/index";
I would like to make it so the attribute looks like this if I am setting robotsMetaTag:
<meta name="robots" content="all"/>
and like this if there robotsMetaTag is not set:
<meta name="robots" content="none"/>
Currently, I am doing the following:
<meta name="robots" th:attr="content=${robotsMetaTag}"/>
This works for the pages where I am returning a value for robotsMetaTag, but I would like a default case where if nothing is set/returned then I want the default to be "none". I've been trying to get th:attrappend to work for me for this, but I'm getting parsing errors with the following:
<meta name="robots" th:attrappend="content=${${robotsMetaTag} == null}?none:${robotsMetaTag}"/>
Any help would be greatly appreciated.
Try out this
<meta name="robots" th:attr="content=${robotsMetaTag==null?'none':robotsMetaTag}"/>
Since th:content is a supported attribute and Thymeleaf supports the the elvis operator, you can simplify your expression to this and achive the same result:
<meta name="robots" th:content="${robotsMetaTag} ?: 'none'" />
I figured it out... I was playing too fast and loose with my curly bois... This is what I was looking for. It adds a default case if "robotsMetaTag" is not set.
<meta name="robots" th:attrappend="content=${robotsMetaTag == null} ? none : ${robotsMetaTag}"/>

Twitter summary card with large image not working

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="#nytimes">
<meta name="twitter:creator" content="#SarahMaslinNir">
<meta name="twitter:title" content="Parade of Fans for Houston’s Funeral">
<meta name="twitter:description" content="NEWARK - Thenter code heree guest list and parade of limousines with celebrities emerging from them seemed more suited ">
<meta name="twitter:image" content="http://graphics8.nytimes.com/images/2012/02/19/us/19whitney-span/19whitney-span-articleLarge.jpg">
I have used all the above meta tags, but still the image appears only as a summary card rather than displaying a summary card with large image.
I've been testing your code on a test page, html only. Everything worked fine for me. Here is also the Tweet generated with only the meta tags inside.
Looks to me more, there are other problems inside the html that might cause wrong interpretation of your meta tags.

Detect if site has an RSS/Atom feed?

I have an URL for the site but not for it's feed(s), which I want to parse.
How to
detect if site has an RSS/Atom feed(s)?
Look for the rel="alternate" type="application/rss+xml" link in the head section of the site's defalut page:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://someurl/feed/" />
<title>Some title</title>
</head>
As mentioned in this question How to check if a site has rss feeds
you need to download the page and check for a rel='alternate'.
You could also have a fallback to regex the page for any mention of a feed.xml or similar, should the first parse fail, if you want to be sure to find any possible link to a RSS/Atom. This would not be as certain to contain the RSS of the actual page, it could be a link to an outside RSS.

Grails interprets and closes HTML meta tag

In my Grails GSP file I'm using the HTML meta tag:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
The problem is that Grails closes this tag and renders it as:
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
This fails W3C's HTML validation (since my doctype is HTML and not XHTML).
Is there a fix for this? How can I get Grails to not interpret the
meta tag?
I'm using grails-1.2-M4.
Follow up:
I create the Grails bug GRAILS-5696 for this issue.
Not sure that this is the most beautiful solution, but at least it will work for your case:
<%= '<meta http-equiv="Content-Type" content="text/html; charset=utf-8">' %>
Well...this does not work since it is preprocessed by Grails before displayed as is.
So the only solution I see is to create a TagLib and output the content like this:
class MetaTagLib {
static namespace = 'my'
def meta = {
out << "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\"/>"
}
}
and use it like:
<my:meta />
It works. Tested.
You could validate as HTML5 instead of HTML 4.01, by using <!DOCTYPE html> (that's it, really!). HTML5 allows trailing slashes even in the HTML syntax, in order to allow for systems like this that produce pseudo-XHTML.
Of course, HTML5 is not yet a finished standard; it may change. I think that this aspect of it is unlikely to be changed, but there is still some fairly contentious debate about a lot of the new HTML5 features, so keep in mind that it's not yet finalized.

ASP.NET MVC: How do I send "text/xml" to all browsers but IE?

I need to be able to send the content type "text/xml" to Firefox and Safari, to allow them to render inline SVG in one of my pages.
This works, as long as the content type is "text/xml".
However, when IE hits the page, if the content type is not "text/html" it tries to render the XML document tree, rather than the XHTML content of the page.
What is the "right way" in ASP.NET MVC to set the HTTP Content-Type of ALL of my views?
Keep in mind that I am going to be rendering the views as ViewResults.
Ok, to clear any confusion up:
User Agent Content-Type Desired
-----------------------------------
IE 5.5 text/html
IE 6 text/html
IE 7 text/html
IE 8 text/html
Firefox text/xml
Safari text/xml
Chrome text/xml
And so on.
All of the browsers listed support SVG inline in some way or another. I have a consistent delivery format, save the content type.
You could look at the properties in Request.Browser and sniff out IE that way, and return the proper view that way, though that is prone to issues. This isn't optimal because IE might support it in the future.
public ActionResult MyAction() {
if (this.Request.Browser.Browser == "IE") {
return View("NonSVG");
} else {
return View("SVG");
}
}
Something worth looking into a little more might be this page on Codeplex. They define a property on Browser called AcceptsImageSVG, but it looks like it's geared towards mobile browsers, don't know if it could be used in your situation.
According to W3, you should be using application/xhtml+xml rather than text/xml to signify XHTML:
http://www.w3.org/TR/2002/NOTE-xhtml-media-types-20020801/#text-xml
The above article also notes that text/html should not be used for XHTML content.
You can determine the browser type by using the Request.Browser object
See this example http://msdn.microsoft.com/en-us/library/system.web.configuration.httpcapabilitiesbase.type%28VS.80%29.aspx
So you could do something like:
if( Request.Browser.Type.ToUpper().Contains("IE") )
{
// Return IE View
}
else
{
// Return the other view
}
Or, if you use this in lots of places you could create a ViewResult factory that returns the proper view result based on the browser type.
Kind of hacky, but... What if the SVG was in a frame, the frame advertised content-type=text/xml, while the containing page advertsized the more proper application/xhtml+xml. This divides the problem into two (possibly) more tractable ones.
I'm not sure whether this will work, but you could try using conditional comments:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<!--[if lte IE 8]>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<![endif]-->
<!--[if gt IE 8]>-->
<meta http-equiv="Content-Type" content="text/xml; charset=UTF-8" />
<!--<![endif]-->
<title>Test page</title>
</head>
<body>
<p>Test page</p>
</body>
</html>
Or, better yet, use HTML5:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Test page</title>
</head>
<body>
<p>Test page</p>
</body>
</html>
You don't even need to specify the content type.

Resources