links in a pdf open in a new window/tab - pdf

I have a PDF with HTML like the following embedded into it:
<!DOCTYPE html>
<html lang="en-US">
<body>
<embed src="a.pdf" width="800px" height="1050px">
</body>
</html>
a.pdf cointains links inside like "https://www.google.com.ph/"
I want it so that when the user clicks on the links in the PDF, it will open in a new tab or window?
Do i need Javascript or some other language?

Try using an iframe for this. It requires PDF support in the browser of course, which is not universal, so you may want to also offer a download link of some kind.
<!DOCTYPE html>
<html lang="en-US">
<body>
<iframe src="a.pdf" width="800px" height="1050px"></iframe>
</body>
</html>

Related

Implement HTML like template in PUG

I am trying to implement html like template in pug with
#{name}
but this is not working it double prints it then I use pipeline character
|#{name}
but its output is <h1>This Is Content<h1&gt
my full template is
<html lang="en">
<head>
SomeRandomStuff
</head>
<body>
|#{Content}
</body>
Scripts
</html>
Use !{name} instead.
<html lang="en">
<head>
SomeRandomStuff
</head>
<body>
!{Content}
</body>
Scripts
</html>
See docs here.

SoundCloud: callback.html popup doesn't close

I've registered my SoundCloud app.
I'm trying to implement the SoundCloud JS example code with the "callback.html" API
https://developers.soundcloud.com/docs/api/sdks#authentication http://connect.soundcloud.com/examples/recording.html
When I upload a recording, I get the authorization-login popup.
After I login, the popup says "This popup should auto close..."
But the popup doesn't close.
And the recording isn't uploaded.
I'm positive SC.initialize has my correct "clientID" and is referencing "callback.html" correctly from my directory.
Am I missing something? maybe "client secret"?
SC.initialize({
client_id: "xxxxxxxxxxxxxxxxxxxxxx",
redirect_uri: "http://www.example.com/callback.html"
});
One time (fluke) instead of the normal pop msg "This should close", the message said "502 Bad Gateway". But I havent been able to reproduce this msg.
SoundCloud's sample code is broken.
This is from SoundCloud's callback.html
<body onload="window.opener.setTimeout(window.opener.SC.connectCallback, 1)">
This is how I got it to work:
<body onload="window.setTimeout(window.opener.SC.connectCallback, 1)">
SoundCloud's connectCallback uses this.location to collect the OAuth access token. If you set the timeout on window.opener, inside connectCallback this will refer to your app's window and the location will be your main page. Whereas setting it on window will bind this to the callback popup window, and this.location will contain the access token in the query arguments.
I also faced the same issue, and found the solution, if you change your callback.html to below two options, it will work -
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Connect with SoundCloud</title>
</head>
<body onload="window.opener.setTimeout(window.opener.SC.connectCallback, 1)">
<b style="text-align: center;">This popup should automatically close in a few seconds</b>
<script type="text/javascript">
window.opener.SC.connectCallback.call(this);
</script>
</body>
</html>
Or
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Connect with SoundCloud</title>
</head>
<body onload="setTimeout(window.opener.SC.connectCallback)">
<b style="text-align: center;">This popup should automatically close in a few seconds</b>
</body>
</html>

Embed tag inside video tag is not working. HTML5 Video fallback is not working

HTML5 Video tag fallback is not working for me. Embed tag without Video tag works fine.
Below code doesn't work.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<title>Video Demo</title>
</head>
<body>
<video width="549" height="309" controls autoplay>
<source src="small.3gp" type="video/3gpp">
<div>
No Movie
<embed width="549" height="309" autoplay="true" type="video/quicktime" src="small.3gp">
</div>
</video>
</body>
</html>
Below code works.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<title>Video Demo</title>
</head>
<body>
<embed width="549" height="309" autoplay="true" type="video/quicktime" src="small.3gp">
</body>
</html>
I need to create a video player which can run any kind of video file and fallback to quick time if its not supported by native. Mp4 format works fine as its supported in native browser (Chrome , IE and FF also as decoder is already there).
I am testing fallback for other than Mp4. like 3gp in this case.
I have seen code examples of Video for everybody, videojs, diveintohtml5/video, but not able to execute the the above code.
Any help would be appreciated.

Freebase suggest key

Freebase suggest looks great, so I wanted to test it. I first just copied and pasted their simple example in a new page and tested it locally. I got a list of results as soon as I started to type something in the input box, but the fly out pane stayed empty. Here the code of that page :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link type="text/css" rel="stylesheet" href="https://www.gstatic.com/freebase/suggest/4_0/suggest.min.css" />
<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/freebase/suggest/4_0/suggest.min.js"></script>
<script type="text/javascript">
$(function() {
$("#myinput").suggest({
filter:'(all type:/film/film)'});
});
</script>
</head>
<body>
<input type="text" id="myinput"/>
</body>
</html>
If I search for example for Star Wars there is no image and no text that is loaded into the fly out pane. I thought it was because I had no API key, so I got one on google's API console and added "http://mysite.com:8888/mysite.com/" as a referer (I'm testing this in a MAMP folder). As explained on the wiki page I've added my key to my code.
$("#myinput").suggest({
key:'my key',
filter:'(all type:/film/film)'});
});
Now when type in something in the input box I just get "Searching..." as a result. I suppose I did something wrong on the google API console, I'm not sure what referees I should enter.
Ok I figured it out, my referers on Google's API Console where wrong. The right format for my local address was simply :
mysite.com:8888

IE 10 Beta - window.showModalDialog ignores dialogHeight and dialogWidth when opening window which has framset in it

Note: Issue occurs only with IE 10 Beta release
Scenario:
a.html has showModalDialog to open b.html:
window.showModalDialog(b.html, self, 'dialogHeight=800px;dialogWidth=900px');
b.html has frameset in it :
<%# Page Language="vb" AutoEventWireup="false" Codebehind="somefile.aspx.vb">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN">
<HTML>
<HEAD>
Some Title
</TITLE>
</HEAD>
<frameset rows="40px,*" border="0" frameSpacing="0" frameBorder="0">
<frame src="myfile.aspx" noresize height="100%" width="100%" scrolling="no">
</frameset>
</HTML>
Issue:
When I try to open b.html using window.showModalDialog from a.html, the popup appears in a small window though I gave dialogHeight and dialogWidth. This happens only with IE10. I am using beta version. Please help.
I have been able to work around the issue by specifying a document compatibility mode in the framesest page:
<meta http-equiv="x-ua-compatible" content="IE=7" >