Flickr.photos.search() Error (GAE+JSF) - ajax

my problem is the folling one, I am trying to display a couple of images from flickr by using a tag. When I deploy the app I get a blank page. But by checking the browser's console I have found this:
(index):13
Uncaught SyntaxError: Invalid or unexpected token?method=flickr.photos.search&api_key=88f1c84…&tags=football&per_page=5&page…:1
And
Uncaught ReferenceError: jsonFlickrApi is not defined at ?method=flickr.photos.search&api_key=88f1c84…&tags=football&per_page=5&page…:1
I don't really know what this means at all...
<!DOCTYPE html >
<html>
<head>
<TITLE>Flickr</TITLE>
</head>
<body>
<script>
function jsonFlickrApi(rsp){
window.rsp = rsp;
var s = "";
s = "total number is: "+rsp.photos.photo.length+"<br/>";
for(var i=0;i<rsp.photos.photo.length;i++){
photo = rsp.photos.photo[i];
t_url = "http://farm"+photo.farm+".static.flickr.com/"+photo.server+"/"+photo.id+"_"+photo.secret+"_"+"t.jpg";
p_url = "http://www.flickr.com/photos/"+photo.owner+"/"+photo.id;
s += '' + 'img alt="'+photo.title+ '"src="'+t_url+'"/>'+'';
}
document.writeln(s);
}
</script>
<script src="https://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=88f1c841c5e9acb6cccd8f1f81cf6950&tags=football&per_page=5&page=1&format=json&api_sig=70c1245d615fa1dc6b254724dcbabfad"></script>
</body>
</html>

Your error is in this line:
for(var i=0;i<rsp.photos.photo.length;i++){
< is a string character, when you want it to be the less than sign <. So, change to:
for(var i=0;i<rsp.photos.photo.length;i++){

Related

Dynamic section name in EvoHtmlToPdf header

Is there a way in EvoHtmlToPdf to display the section/subsection of a page in the header/footer (i.e. the text of the "current" h1/h2 tag)?
With wkhtmltopdf and other tools, it is possible to replace special tags via JavaScript and the HTML header template (as described here for example Dynamic section name in wicked_pdf header).
Unfortunately, such a solution does not seem to work with EvoHtmlToPdf.
Here's the HTML code of my header template:
<html id="headerFooterHtml">
<head>
<script>
function substHeaderFooter(){
var vars={};
var searchString = document.location.search;
var debugMessage = document.getElementById("showJavaScriptWasExecuted");
if (debugMessage)
debugMessage.textContent = "Search string: ["+ searchString + "]";
var search_list = searchString.substring(1).split('&');
for(var i in search_list){
var content=search_list[i].split('=',2);
vars[content[0]] = decodeQueryParam(content[1]);
}
var tags=['section','subsection'];
for(var i in tags){
var name = tags[i],
classElements = document.getElementsByClassName(name);
for(var j=0; j<classElements.length; ++j){
classElements[j].textContent = vars[name];
}
}
}
</script>
</head>
<body id="headerFooterBody" onload="substHeaderFooter()">
<div id="showJavaScriptWasExecuted"></div>
<div id="sections">{section} / {subsection}</div>
</body>
Resulting header in PDF
I already added the EvoHtmlToPdf PrepareRenderPdfPageDelegate event handler to my code (if that's the way I have to go) but I don't know how to access the section of the current page there...
Thanks in advance for your help!

How to replace an image with another on button click

Hi I have a problem that I can't quite solve. I'm a total noob with HTML/Javascript, so I'm not sure how to proceed. The instructions are in the code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Q2</title>
<script type="text/javascript" src="342.js"></script>
<script type="text/javascript">
function swap() {
if (Math.random()>.5){
document.getElementById("c").style.display = 'none';
document.getElementById("f").src = "images/f.jpg";
} else {
document.getElementById("d").style.display = 'none';
document.getElementById("f").src = "images/f.jpg";
}
}
</script>
</head>
<body>
<p>Add code so that clicking the button changes either the src "c.jpg" or "d.jpg" to "f.jpg" The choice of which should be replaced
should be determined randomly.</p>
<img src="images/c.jpg" id="c"><br>
<img src="images/d.jpg" id="d">
<br><br>
<button type="button" onclick="swap()">OK</button>
</body>
</html>
The original problem had everything but the scripts. When I try this, I'm able to get the image c or d to disappear, but image f doesn't appear. I don't know how to get the image to show. getELementById won't work because I haven't made an id, but how do I do that without having image f showing? Any help is appreciated.
Seems you're missing html
Try add f html element for work:
<img src="images/f.jpg" id="f">
The p tag in the html is talking about c.jpg, d.jpg and e.jpg.
Its not talking about f.jpg, you may want to check that
with the assumption that it is e.jpg and not "f.jpb". And also assuming that you have e.jpg in your images folder. Below code will work fine (small modification in the script)
function swap() {
if (Math.random()>.5){
// document.getElementById("c").style.display = 'none';
document.getElementById("c").src = "images/e.jpg";
} else {
// document.getElementById("d").style.display = 'none';
document.getElementById("d").src = "images/e.jpg";
}
}

Why does the browser tell me the parse is not defined even if I have imported it in the head of the HTML file?

I'm trying to connect my HTML files with the parser server. I followed the direction of the back4app guides and added the following code to the head of index.html. But the browser kept telling me Parse is not defined.
<script src="https://npmcdn.com/parse/dist/parse.min.js"></script>
<script type="text/javascript">
Parse.serverURL = "https://parseapi.back4app.com";
Parse.initialize(
"MY_APP_ID",
"MY_JS_KEY"
);
</script>
Can you please test the code below?
<script src="https://cdnjs.cloudflare.com/ajax/libs/parse/2.1.0/parse.js"></script>
<script type="text/javascript">
function myFunction() {
Parse.initialize("APP_ID", "JS_KEY");
Parse.serverURL = 'https://parseapi.back4app.com/';
}
/</script>

Ruby Mechanize gem not following meta refresh

I have a Ruby 2.2 automation script that uses Mechanize to log in to Google Payments. When I try to access the url Mechanize stops on the meta refresh. The content of the page is:
<!DOCTYPE html>
<html>
<head>
<title>Redirecting...</title>
<script type="text/javascript" language="javascript">
var url = 'https:\/\/accounts.google.com\/ServiceLogin?
service\x3dbilling\x26passive\x3d1209600\x26continue\x3dhttps:\/\/payments.google.com\/
payments\/home%23__HASH__\x26followup\x3dhttps:\/\/payments.google.com\/payments\/
home'; var fragment = ''; if (self.document.location.hash) {fragment = self.document.
location.hash.replace(/^#/,'');}url = url.replace(new RegExp("__HASH__", 'g'),
encodeURIComponent(fragment));window.location.assign(url);
</script><noscript><meta
http-equiv="refresh" content="0; url='https://accounts.google.com/ServiceLogin?
service=billing&passive=1209600&continue=https://payments.google.com
/payments/home&followup=https://payments.google.com/payments/home'"></meta>
</noscript></head>
<body></body>
</html>
Here is the part of my script to get to the login screen:
#agent = Mechanize.new
#agent.follow_meta_refresh = true
page = #agent.get("http://payments.google.com/payments/home")
puts page.content
The page.content at the end only shows the above html, the meta refresh is not followed. Any suggestions on how I can follow that would be greatly appreciated.
Assuming the script isn't really reformatted like that:
url = page.body[/url = '(.*?)'/, 1]
page = #agent.get url

Reloading an Image with delay using javascript

I am failing for 2 days on trying to reload an Image using Java script.
I hope you can help!
the Image is displayed but doesnt Change after the defined 7 secunds...
it's not a server-side Problem while i can see in wireshark that the data isn't even requested by the browser...
is anyone having an idea where my Problem might be?
please see my code below for reference
<html>
<!DOCTYPE html>
<html lang="de-DE">
<head>
<bodyonload="DispayImage()">
<img src="/img/dynamic_live_1.jpg" width="600" height="450" name=Cam>
<script language="JavaScript>
var imageUrl = document.Cam.src;
var random = new Date().getTime();
var delay = 7000;
var counter = 0;
var buffer = new Image;
function DisplayImage()
{
document.Cam.src = buffer.src;
LoadNextImage();
}
function LoadBuffer ()
{
var trickname = imageUrl;
++counter;
trickname += "?counter=" + (random + counter);
buffer.src = trickname;
buffer.onload = DisplayImage;
}
function LoadNextImage()
{
setTimeout("LoadBuffer()", delay);
}
LoadNextImage();
</script>
</body>
</html>
On first sight, your "setTimeout"-call seems to be wrong:
Try
function LoadNextImage()
{
setTimeout(function() {LoadBuffer()}, delay);
}
Also, your body.onload has a wrong call, it says "DispayImage" and not "DisplayImage", but that might be a copy-paste error on your end.
Edit: Just tested the corrected code myself, and here it works (used some local images). One last error I found was that you don't close the "language"-tag:
<script language="JavaScript>
should be
<script language="Javascript">
Or, even better, the "language"-tag is not needed, all browsers use javascript as default when you use "script":
<script>/*Some code here*/</script>

Resources