|
|
@@ -1,101 +1,101 @@ |
|
|
|
<!DOCTYPE HTML>
|
|
|
|
<html>
|
|
|
|
<head>
|
|
|
|
<title>Pannellum Embed Configuration</title>
|
|
|
|
<meta charset="utf-8">
|
|
|
|
<link type="text/css" rel="Stylesheet" href="css/pannellum.css" />
|
|
|
|
<script>
|
|
|
|
function processForm (form)
|
|
|
|
{
|
|
|
|
var embed_code = document.getElementById('embed_code');
|
|
|
|
embed_code.innerHTML = '<iframe title="pannellum panorama viewer"' +
|
|
|
|
' width="' + escape(form.embed_width.value) +
|
|
|
|
'" height="' + escape(form.embed_height.value) +
|
|
|
|
'" allowfullscreen' +
|
|
|
|
' style="border-style:none;"' +
|
|
|
|
'" src="' + escape(form.pannellum_url.value) +
|
|
|
|
'?' +
|
|
|
|
'panorama=' + escape(form.pano_url.value);
|
|
|
|
if(form.pano_title.value != '') {
|
|
|
|
embed_code.innerHTML += '&amp;title=' + escape(form.pano_title.value);
|
|
|
|
}
|
|
|
|
if(form.pano_author.value != '') {
|
|
|
|
embed_code.innerHTML += '&amp;author=' + escape(form.pano_author.value);
|
|
|
|
}
|
|
|
|
if(form.autoload.checked) {
|
|
|
|
embed_code.innerHTML += '&amp;autoLoad=true';
|
|
|
|
}
|
|
|
|
if(form.autorotate.value != 'none') {
|
|
|
|
embed_code.innerHTML += '&amp;autoRotate=' + escape(form.autorotate.value);
|
|
|
|
}
|
|
|
|
if(form.fallback_url.value != '') {
|
|
|
|
embed_code.innerHTML += '&amp;fallback=' + escape(form.fallback_url.value);
|
|
|
|
}
|
|
|
|
if(form.hfov.value != 0) {
|
|
|
|
embed_code.innerHTML += '&amp;hfov=' + escape(form.hfov.value);
|
|
|
|
}
|
|
|
|
if(form.pitch.value != 0) {
|
|
|
|
embed_code.innerHTML += '&amp;pitch=' + escape(form.pitch.value);
|
|
|
|
}
|
|
|
|
if(form.yaw.value != 0) {
|
|
|
|
embed_code.innerHTML += '&amp;yaw=' + escape(form.yaw.value);
|
|
|
|
}
|
|
|
|
if(form.preview_url.value != '') {
|
|
|
|
embed_code.innerHTML += '&amp;preview=' + escape(form.preview_url.value);
|
|
|
|
}
|
|
|
|
if(form.haov.value != 0) {
|
|
|
|
embed_code.innerHTML += '&amp;haov=' + escape(form.haov.value);
|
|
|
|
}
|
|
|
|
if(form.vaov.value != 0) {
|
|
|
|
embed_code.innerHTML += '&amp;vaov=' + escape(form.vaov.value);
|
|
|
|
}
|
|
|
|
if(form.voffset.value != 0) {
|
|
|
|
embed_code.innerHTML += '&amp;vOffset=' + escape(form.voffset.value);
|
|
|
|
}
|
|
|
|
embed_code.innerHTML += '"></iframe>';
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
function randomString()
|
|
|
|
{
|
|
|
|
var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
|
|
|
|
var randomstring = '';
|
|
|
|
for (var i=0;i<10;i++) {
|
|
|
|
var rnum = Math.floor(Math.random() * chars.length);
|
|
|
|
randomstring += chars.substring(rnum,rnum+1);
|
|
|
|
}
|
|
|
|
return randomstring;
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
</head>
|
|
|
|
|
|
|
|
<body>
|
|
|
|
<form name="embed_gen_form" onsubmit="return processForm(embed_gen_form); return false;">
|
|
|
|
Pannellum Location:<br>
|
|
|
|
<input name="pannellum_url" placeholder="pannellum.htm Location" required><p>
|
|
|
|
Panorama URL:<br>
|
|
|
|
<input name="pano_url" placeholder="Image File" required><p>
|
|
|
|
Panorama Preview URL (optional):<br>
|
|
|
|
<input name="preview_url" placeholder="Image File"><p>
|
|
|
|
Basic Information:<br>
|
|
|
|
<input name="pano_title" placeholder="Title"> <input name="pano_author" placeholder="Author"><p>
|
|
|
|
Partial Panorama (degrees) (optional):<br>
|
|
|
|
<input name="haov" type="number" min="0" max="360" placeholder="Horizontal Angle of View"> <input name="vaov" type="number" min="0" max="180" placeholder="Vertical Angle of View"> <input name="voffset" type="number" min="-90" max="90" placeholder="Vertical Offset"><p>
|
|
|
|
Embed Size:<br>
|
|
|
|
<input name="embed_width" type="number" min="200" placeholder="Width" required> <input name="embed_height" type="number" min="150" placeholder="Height" required><p>
|
|
|
|
Initial Parameters (degrees) (optional):<br>
|
|
|
|
<input name="hfov" type="number" min="40" max="100" placeholder="Horizontal Field of View"> <input name="pitch" type="number" min="-85" max="85" placeholder="Pitch"> <input name="yaw" type="number" min="-180" max="180" placeholder="Yaw"><p>
|
|
|
|
Auto Load: <input name="autoload" type="checkbox"><p>
|
|
|
|
Auto Rotate:
|
|
|
|
<select name="autorotate">
|
|
|
|
<option value="none">None</option>
|
|
|
|
<option value="cw">CW</option>
|
|
|
|
<option value="ccw">CCW</option>
|
|
|
|
</select><p>
|
|
|
|
URL to fall back to if WebGL is not supported:<br>
|
|
|
|
<input name="fallback_url" placeholder="Fallback URL"><p>
|
|
|
|
<input type="submit" value="Generate" onclick="document.getElementById('embed_code').innerHTML = ''"><p>
|
|
|
|
</form>
|
|
|
|
|
|
|
|
<textarea id="embed_code" style="resize: none; height:200px;" onclick="this.select()" cols="100" readonly></textarea>
|
|
|
|
</body>
|
|
|
|
</html>
|
|
|
|
<!DOCTYPE HTML> |
|
|
|
<html> |
|
|
|
<head> |
|
|
|
<title>Pannellum Embed Configuration</title> |
|
|
|
<meta charset="utf-8"> |
|
|
|
<link type="text/css" rel="Stylesheet" href="css/pannellum.css" /> |
|
|
|
<script> |
|
|
|
function processForm (form) |
|
|
|
{ |
|
|
|
var embed_code = document.getElementById('embed_code'); |
|
|
|
embed_code.innerHTML = '<iframe' + |
|
|
|
' width="' + escape(form.embed_width.value) + |
|
|
|
'" height="' + escape(form.embed_height.value) + |
|
|
|
'" allowfullscreen' + |
|
|
|
' style="border-style:none;"' + |
|
|
|
'" src="' + escape(form.pannellum_url.value) + |
|
|
|
'?' + |
|
|
|
'panorama=' + escape(form.pano_url.value); |
|
|
|
if(form.pano_title.value != '') { |
|
|
|
embed_code.innerHTML += '&amp;title=' + escape(form.pano_title.value); |
|
|
|
} |
|
|
|
if(form.pano_author.value != '') { |
|
|
|
embed_code.innerHTML += '&amp;author=' + escape(form.pano_author.value); |
|
|
|
} |
|
|
|
if(form.autoload.checked) { |
|
|
|
embed_code.innerHTML += '&amp;autoLoad=true'; |
|
|
|
} |
|
|
|
if(form.autorotate.value != 'none') { |
|
|
|
embed_code.innerHTML += '&amp;autoRotate=' + escape(form.autorotate.value); |
|
|
|
} |
|
|
|
if(form.fallback_url.value != '') { |
|
|
|
embed_code.innerHTML += '&amp;fallback=' + escape(form.fallback_url.value); |
|
|
|
} |
|
|
|
if(form.hfov.value != 0) { |
|
|
|
embed_code.innerHTML += '&amp;hfov=' + escape(form.hfov.value); |
|
|
|
} |
|
|
|
if(form.pitch.value != 0) { |
|
|
|
embed_code.innerHTML += '&amp;pitch=' + escape(form.pitch.value); |
|
|
|
} |
|
|
|
if(form.yaw.value != 0) { |
|
|
|
embed_code.innerHTML += '&amp;yaw=' + escape(form.yaw.value); |
|
|
|
} |
|
|
|
if(form.preview_url.value != '') { |
|
|
|
embed_code.innerHTML += '&amp;preview=' + escape(form.preview_url.value); |
|
|
|
} |
|
|
|
if(form.haov.value != 0) { |
|
|
|
embed_code.innerHTML += '&amp;haov=' + escape(form.haov.value); |
|
|
|
} |
|
|
|
if(form.vaov.value != 0) { |
|
|
|
embed_code.innerHTML += '&amp;vaov=' + escape(form.vaov.value); |
|
|
|
} |
|
|
|
if(form.voffset.value != 0) { |
|
|
|
embed_code.innerHTML += '&amp;vOffset=' + escape(form.voffset.value); |
|
|
|
} |
|
|
|
embed_code.innerHTML += '"></iframe>'; |
|
|
|
return false; |
|
|
|
} |
|
|
|
function randomString() |
|
|
|
{ |
|
|
|
var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz"; |
|
|
|
var randomstring = ''; |
|
|
|
for (var i=0;i<10;i++) { |
|
|
|
var rnum = Math.floor(Math.random() * chars.length); |
|
|
|
randomstring += chars.substring(rnum,rnum+1); |
|
|
|
} |
|
|
|
return randomstring; |
|
|
|
} |
|
|
|
</script> |
|
|
|
</head> |
|
|
|
|
|
|
|
<body> |
|
|
|
<form name="embed_gen_form" onsubmit="return processForm(embed_gen_form); return false;"> |
|
|
|
Pannellum Location:<br> |
|
|
|
<input name="pannellum_url" placeholder="pannellum.htm Location" required><p> |
|
|
|
Panorama URL:<br> |
|
|
|
<input name="pano_url" placeholder="Image File" required><p> |
|
|
|
Panorama Preview URL (optional):<br> |
|
|
|
<input name="preview_url" placeholder="Image File"><p> |
|
|
|
Basic Information:<br> |
|
|
|
<input name="pano_title" placeholder="Title"> <input name="pano_author" placeholder="Author"><p> |
|
|
|
Partial Panorama (degrees) (optional):<br> |
|
|
|
<input name="haov" type="number" min="0" max="360" placeholder="Horizontal Angle of View"> <input name="vaov" type="number" min="0" max="180" placeholder="Vertical Angle of View"> <input name="voffset" type="number" min="-90" max="90" placeholder="Vertical Offset"><p> |
|
|
|
Embed Size:<br> |
|
|
|
<input name="embed_width" type="number" min="200" placeholder="Width" required> <input name="embed_height" type="number" min="150" placeholder="Height" required><p> |
|
|
|
Initial Parameters (degrees) (optional):<br> |
|
|
|
<input name="hfov" type="number" min="40" max="100" placeholder="Horizontal Field of View"> <input name="pitch" type="number" min="-85" max="85" placeholder="Pitch"> <input name="yaw" type="number" min="-180" max="180" placeholder="Yaw"><p> |
|
|
|
Auto Load: <input name="autoload" type="checkbox"><p> |
|
|
|
Auto Rotate: |
|
|
|
<select name="autorotate"> |
|
|
|
<option value="none">None</option> |
|
|
|
<option value="cw">CW</option> |
|
|
|
<option value="ccw">CCW</option> |
|
|
|
</select><p> |
|
|
|
URL to fall back to if WebGL is not supported:<br> |
|
|
|
<input name="fallback_url" placeholder="Fallback URL"><p> |
|
|
|
<input type="submit" value="Generate" onclick="document.getElementById('embed_code').innerHTML = ''"><p> |
|
|
|
</form> |
|
|
|
|
|
|
|
<textarea id="embed_code" style="resize: none; height:200px;" onclick="this.select()" cols="100" readonly></textarea> |
|
|
|
</body> |
|
|
|
</html> |