|
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101 |
- <!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>
|