Java Script to create dynamic URL in img
I've searched and tried many similar question/answer combinations on here. The only difference I can see is I'm trying to present an IP camera video feed and not an img.
I have an existing and working page that takes various IP camera feeds and presents them in a grid that you can load in any webpage (chrome in this case). I want to add a hyper link to each one so that when you click it it opens a web page with a fullscreen version of the feed. Here is an example of one of the hyperlink and img..note these work. :) -
myurl = 10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=100&mode=jpeg&maxfps=30&monitor=1&buffer=500
<a href="http://myurl" target="_blank">
<img src="myurl"></a>
The goal is to open this page on a raspberry pi with 7" touch screen and since the raspberry pi doesn't support gesture well, when you full screen the web page (F11) there's no way to go back or close the tab that is open. To solve this I want to open the href in a new page, dynamically pass the value after "monitor=" and have a button in that page the close the tab when you're done viewing.
I got the button to work but can't get the feed to load. To confirm the url works I just don't know how to dynamically create it properly and then show it. Any help would be greatly appreciated.
This is the current piece of code on the montage making the call
<a href="./cameraclick3.html?var1=1" target="_blank">
<img src="http://10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=30&mode=jpeg&maxfps=30&monitor=1&buffer=500"></a>
The code for cameraclick3.html is:
<head>
<link rel="shortcut icon" href="/cctv.ico" />
<title>CCTV</title>
<script>
function load()
{
document.getElementById('image').src = urlname();
}
function urlname()
{
var mon = request.getParameter("var1");
var urlname1 = "http://10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=30&mode=jpeg&maxfps=30&monitor=" + mon + "&buffer=500";
return urlname1;
}
</script>
</head>
<body bgcolor="black" onload="load()">
<button type="button" onclick="javascript:window.close()">Discard</button>
<img src="" id="image"/>
</body>
javascript html url
asked Nov 21 '18 at 22:35
MattMatt
1
add a comment |
I've searched and tried many similar question/answer combinations on here. The only difference I can see is I'm trying to present an IP camera video feed and not an img.
I have an existing and working page that takes various IP camera feeds and presents them in a grid that you can load in any webpage (chrome in this case). I want to add a hyper link to each one so that when you click it it opens a web page with a fullscreen version of the feed. Here is an example of one of the hyperlink and img..note these work. :) -
myurl = 10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=100&mode=jpeg&maxfps=30&monitor=1&buffer=500
<a href="http://myurl" target="_blank">
<img src="myurl"></a>
The goal is to open this page on a raspberry pi with 7" touch screen and since the raspberry pi doesn't support gesture well, when you full screen the web page (F11) there's no way to go back or close the tab that is open. To solve this I want to open the href in a new page, dynamically pass the value after "monitor=" and have a button in that page the close the tab when you're done viewing.
I got the button to work but can't get the feed to load. To confirm the url works I just don't know how to dynamically create it properly and then show it. Any help would be greatly appreciated.
This is the current piece of code on the montage making the call
<a href="./cameraclick3.html?var1=1" target="_blank">
<img src="http://10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=30&mode=jpeg&maxfps=30&monitor=1&buffer=500"></a>
The code for cameraclick3.html is:
<head>
<link rel="shortcut icon" href="/cctv.ico" />
<title>CCTV</title>
<script>
function load()
{
document.getElementById('image').src = urlname();
}
function urlname()
{
var mon = request.getParameter("var1");
var urlname1 = "http://10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=30&mode=jpeg&maxfps=30&monitor=" + mon + "&buffer=500";
return urlname1;
}
</script>
</head>
<body bgcolor="black" onload="load()">
<button type="button" onclick="javascript:window.close()">Discard</button>
<img src="" id="image"/>
</body>
javascript html url
asked Nov 21 '18 at 22:35
MattMatt
1
your code is looking good .But check the url may not provide a static image
– LDS
Nov 22 '18 at 5:57
Thanks...If I paste the url in a browser its an active video. Currently I have 2 streams copied 3 times each as a test in a table and they play and display with out problem. I've used a few different strict html methods to open in new tab or just open straight and it works. Once I try to parse and recombine with the js something breaks.
– Matt
Nov 22 '18 at 14:30
It looks like somethings wrong with my request.getparameter call. In chrome there are developer tools there's three different urls showing when its stepping through the code. After the var1=1 there's ":11", ":16", ":18" and the request.getparameter errors with "uncaught referenceerror:request not defined" hmmm...and it changes on refreshes. One if for urlname, load and onload. and okay I just realized those are line numbers. rip.
– Matt
Nov 22 '18 at 14:38
add a comment |
I've searched and tried many similar question/answer combinations on here. The only difference I can see is I'm trying to present an IP camera video feed and not an img.
I have an existing and working page that takes various IP camera feeds and presents them in a grid that you can load in any webpage (chrome in this case). I want to add a hyper link to each one so that when you click it it opens a web page with a fullscreen version of the feed. Here is an example of one of the hyperlink and img..note these work. :) -
myurl = 10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=100&mode=jpeg&maxfps=30&monitor=1&buffer=500
<a href="http://myurl" target="_blank">
<img src="myurl"></a>
The goal is to open this page on a raspberry pi with 7" touch screen and since the raspberry pi doesn't support gesture well, when you full screen the web page (F11) there's no way to go back or close the tab that is open. To solve this I want to open the href in a new page, dynamically pass the value after "monitor=" and have a button in that page the close the tab when you're done viewing.
I got the button to work but can't get the feed to load. To confirm the url works I just don't know how to dynamically create it properly and then show it. Any help would be greatly appreciated.
This is the current piece of code on the montage making the call
<a href="./cameraclick3.html?var1=1" target="_blank">
<img src="http://10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=30&mode=jpeg&maxfps=30&monitor=1&buffer=500"></a>
The code for cameraclick3.html is:
<head>
<link rel="shortcut icon" href="/cctv.ico" />
<title>CCTV</title>
<script>
function load()
{
document.getElementById('image').src = urlname();
}
function urlname()
{
var mon = request.getParameter("var1");
var urlname1 = "http://10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=30&mode=jpeg&maxfps=30&monitor=" + mon + "&buffer=500";
return urlname1;
}
</script>
</head>
<body bgcolor="black" onload="load()">
<button type="button" onclick="javascript:window.close()">Discard</button>
<img src="" id="image"/>
</body>
javascript html url
asked Nov 21 '18 at 22:35
MattMatt
1
I've searched and tried many similar question/answer combinations on here. The only difference I can see is I'm trying to present an IP camera video feed and not an img.
I have an existing and working page that takes various IP camera feeds and presents them in a grid that you can load in any webpage (chrome in this case). I want to add a hyper link to each one so that when you click it it opens a web page with a fullscreen version of the feed. Here is an example of one of the hyperlink and img..note these work. :) -
myurl = 10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=100&mode=jpeg&maxfps=30&monitor=1&buffer=500
<a href="http://myurl" target="_blank">
<img src="myurl"></a>
The goal is to open this page on a raspberry pi with 7" touch screen and since the raspberry pi doesn't support gesture well, when you full screen the web page (F11) there's no way to go back or close the tab that is open. To solve this I want to open the href in a new page, dynamically pass the value after "monitor=" and have a button in that page the close the tab when you're done viewing.
I got the button to work but can't get the feed to load. To confirm the url works I just don't know how to dynamically create it properly and then show it. Any help would be greatly appreciated.
This is the current piece of code on the montage making the call
<a href="./cameraclick3.html?var1=1" target="_blank">
<img src="http://10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=30&mode=jpeg&maxfps=30&monitor=1&buffer=500"></a>
The code for cameraclick3.html is:
<head>
<link rel="shortcut icon" href="/cctv.ico" />
<title>CCTV</title>
<script>
function load()
{
document.getElementById('image').src = urlname();
}
function urlname()
{
var mon = request.getParameter("var1");
var urlname1 = "http://10.0.0.200:9080/zm/cgi-bin/nph-zms?scale=30&mode=jpeg&maxfps=30&monitor=" + mon + "&buffer=500";
return urlname1;
}
</script>
</head>
<body bgcolor="black" onload="load()">
<button type="button" onclick="javascript:window.close()">Discard</button>
<img src="" id="image"/>
</body>
javascript html url
javascript html url
asked Nov 21 '18 at 22:35
MattMatt
1
asked Nov 21 '18 at 22:35
MattMatt
1
asked Nov 21 '18 at 22:35
MattMatt
1
asked Nov 21 '18 at 22:35
MattMatt
1
asked Nov 21 '18 at 22:35
MattMatt
1
1
your code is looking good .But check the url may not provide a static image
– LDS
Nov 22 '18 at 5:57
Thanks...If I paste the url in a browser its an active video. Currently I have 2 streams copied 3 times each as a test in a table and they play and display with out problem. I've used a few different strict html methods to open in new tab or just open straight and it works. Once I try to parse and recombine with the js something breaks.
– Matt
Nov 22 '18 at 14:30
It looks like somethings wrong with my request.getparameter call. In chrome there are developer tools there's three different urls showing when its stepping through the code. After the var1=1 there's ":11", ":16", ":18" and the request.getparameter errors with "uncaught referenceerror:request not defined" hmmm...and it changes on refreshes. One if for urlname, load and onload. and okay I just realized those are line numbers. rip.
– Matt
Nov 22 '18 at 14:38
add a comment |
your code is looking good .But check the url may not provide a static image
– LDS
Nov 22 '18 at 5:57
Thanks...If I paste the url in a browser its an active video. Currently I have 2 streams copied 3 times each as a test in a table and they play and display with out problem. I've used a few different strict html methods to open in new tab or just open straight and it works. Once I try to parse and recombine with the js something breaks.
– Matt
Nov 22 '18 at 14:30
It looks like somethings wrong with my request.getparameter call. In chrome there are developer tools there's three different urls showing when its stepping through the code. After the var1=1 there's ":11", ":16", ":18" and the request.getparameter errors with "uncaught referenceerror:request not defined" hmmm...and it changes on refreshes. One if for urlname, load and onload. and okay I just realized those are line numbers. rip.
– Matt
Nov 22 '18 at 14:38
your code is looking good .But check the url may not provide a static image
– LDS
Nov 22 '18 at 5:57
your code is looking good .But check the url may not provide a static image
– LDS
Nov 22 '18 at 5:57
Thanks...If I paste the url in a browser its an active video. Currently I have 2 streams copied 3 times each as a test in a table and they play and display with out problem. I've used a few different strict html methods to open in new tab or just open straight and it works. Once I try to parse and recombine with the js something breaks.
– Matt
Nov 22 '18 at 14:30
Thanks...If I paste the url in a browser its an active video. Currently I have 2 streams copied 3 times each as a test in a table and they play and display with out problem. I've used a few different strict html methods to open in new tab or just open straight and it works. Once I try to parse and recombine with the js something breaks.
– Matt
Nov 22 '18 at 14:30
It looks like somethings wrong with my request.getparameter call. In chrome there are developer tools there's three different urls showing when its stepping through the code. After the var1=1 there's ":11", ":16", ":18" and the request.getparameter errors with "uncaught referenceerror:request not defined" hmmm...and it changes on refreshes. One if for urlname, load and onload. and okay I just realized those are line numbers. rip.
– Matt
Nov 22 '18 at 14:38
It looks like somethings wrong with my request.getparameter call. In chrome there are developer tools there's three different urls showing when its stepping through the code. After the var1=1 there's ":11", ":16", ":18" and the request.getparameter errors with "uncaught referenceerror:request not defined" hmmm...and it changes on refreshes. One if for urlname, load and onload. and okay I just realized those are line numbers. rip.
– Matt
Nov 22 '18 at 14:38
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53421380%2fjava-script-to-create-dynamic-url-in-img%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53421380%2fjava-script-to-create-dynamic-url-in-img%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
your code is looking good .But check the url may not provide a static image
– LDS
Nov 22 '18 at 5:57
Thanks...If I paste the url in a browser its an active video. Currently I have 2 streams copied 3 times each as a test in a table and they play and display with out problem. I've used a few different strict html methods to open in new tab or just open straight and it works. Once I try to parse and recombine with the js something breaks.
– Matt
Nov 22 '18 at 14:30
It looks like somethings wrong with my request.getparameter call. In chrome there are developer tools there's three different urls showing when its stepping through the code. After the var1=1 there's ":11", ":16", ":18" and the request.getparameter errors with "uncaught referenceerror:request not defined" hmmm...and it changes on refreshes. One if for urlname, load and onload. and okay I just realized those are line numbers. rip.
– Matt
Nov 22 '18 at 14:38