FreshRSS/NetNewsWire
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Make iFrames responsive.

Browse Source
This commit is contained in:
Ben Ubois 2019-09-20 17:21:01 -07:00
parent ea13f911f1
commit cdf643c2a6
3 changed files with 53 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
Mac/MainWindow/Detail/styleSheet.css
View File

@ -133,6 +133,20 @@ figcaption {
line-height: 1.3em; line-height: 1.3em;
} }
.iframeWrap {
position: relative;
display: block;
padding-top: 56.25%;
}
.iframeWrap iframe {
position: absolute;
top: 0;
left: 0;
height: 100% !important;
width: 100% !important;
}
/*Block ads and junk*/ /*Block ads and junk*/
iframe[src*="feedads"], iframe[src*="feedads"],

72
Shared/Article Rendering/ArticleRenderer.swift
View File

@ -312,8 +312,6 @@ private extension ArticleRenderer {
return dateFormatter.string(from: date) return dateFormatter.string(from: date)
} }
#if os(macOS)
func renderHTML(withBody body: String) -> String { func renderHTML(withBody body: String) -> String {
var s = "<!DOCTYPE html><html><head>\n\n" var s = "<!DOCTYPE html><html><head>\n\n"
@ -326,18 +324,32 @@ private extension ArticleRenderer {
s += """ s += """
<script type="text/javascript"> <script type="text/javascript">
var init = {
function startup() { wrapFrames: function () {
var anchors = document.getElementsByTagName("a"); document.querySelectorAll("iframe").forEach(element => {
for (var i = 0; i < anchors.length; i++) { var wrapper = document.createElement("div");
anchors[i].addEventListener("mouseenter", function() { mouseDidEnterLink(this) }); wrapper.classList.add("iframeWrap");
anchors[i].addEventListener("mouseleave", function() { mouseDidExitLink(this) }); element.parentNode.insertBefore(wrapper, element);
wrapper.appendChild(element);
});
},
stripStyles: function() {
document.getElementsByTagName("body")[0].querySelectorAll("style, link[rel=stylesheet]").forEach(element => element.remove());
document.getElementsByTagName("body")[0].querySelectorAll("[style]").forEach(element => element.removeAttribute("style"));
},
linkHover: function() {
var anchors = document.getElementsByTagName("a");
for (var i = 0; i < anchors.length; i++) {
anchors[i].addEventListener("mouseenter", function() { mouseDidEnterLink(this) });
anchors[i].addEventListener("mouseleave", function() { mouseDidExitLink(this) });
}
} }
document.getElementsByTagName("body")[0].querySelectorAll("style, link[rel=stylesheet]").forEach(element => element.remove());
document.getElementsByTagName("body")[0].querySelectorAll("[style]").forEach(element => element.removeAttribute("style"));
} }
document.addEventListener("DOMContentLoaded", function(event) {
Object.values(init).forEach(item => item());
})
function mouseDidEnterLink(anchor) { function mouseDidEnterLink(anchor) {
window.webkit.messageHandlers.mouseDidEnter.postMessage(anchor.href); window.webkit.messageHandlers.mouseDidEnter.postMessage(anchor.href);
} }
@ -350,7 +362,7 @@ private extension ArticleRenderer {
""" """
s += "\n\n</head><body onload='startup()'>\n\n" s += "\n\n</head><body>\n\n"
s += body s += body
s += "\n\n</body></html>" s += "\n\n</body></html>"
@ -359,40 +371,6 @@ private extension ArticleRenderer {
return s return s
} }
#else
func renderHTML(withBody body: String) -> String {
var s = "<!DOCTYPE html><html><head>\n"
if let baseURL = baseURL {
s += ("<base href=\"" + baseURL + "\"\n>")
}
s += "<meta name=\"viewport\" content=\"width=device-width\">\n"
s += title.htmlBySurroundingWithTag("title")
s += styleString().htmlBySurroundingWithTag("style")
s += """
<script type="text/javascript">
function startup() {
document.getElementsByTagName("body")[0].querySelectorAll("style, link[rel=stylesheet]").forEach(element => element.remove());
document.getElementsByTagName("body")[0].querySelectorAll("[style]").forEach(element => element.removeAttribute("style"));
}
</script>
"""
s += "\n\n</head><body onload='startup()'>\n\n"
s += body
s += "\n\n</body></html>"
return s
}
#endif
} }
// MARK: - Article extension // MARK: - Article extension

14
iOS/Resources/styleSheet.css
View File

@ -136,6 +136,20 @@ figcaption {
line-height: 1.3em; line-height: 1.3em;
} }
.iframeWrap {
position: relative;
display: block;
padding-top: 56.25%;
}
.iframeWrap iframe {
position: absolute;
top: 0;
left: 0;
height: 100% !important;
width: 100% !important;
}
/*Block ads and junk*/ /*Block ads and junk*/
iframe[src*="feedads"], iframe[src*="feedads"],