css
11 months ago
images
2 years ago
js
1 year ago
sounds
2 years ago
templates
11 months ago
viewer.html
7 months ago
viewer.html
137 lines
| 1 | <!DOCTYPE html> |
| 2 | <html> |
| 3 | |
| 4 | <head> |
| 5 | <title>Debugging</title> |
| 6 | <meta charset="utf-8" /> |
| 7 | </head> |
| 8 | |
| 9 | <body> |
| 10 | <style type="text/css"> |
| 11 | body { |
| 12 | margin: 0; |
| 13 | padding: 0; |
| 14 | } |
| 15 | |
| 16 | .viewer-container { |
| 17 | height: 100vh; |
| 18 | width: 100%; |
| 19 | overflow: hidden; |
| 20 | } |
| 21 | |
| 22 | .fullscreen { |
| 23 | background-color: #333; |
| 24 | } |
| 25 | </style> |
| 26 | |
| 27 | <div class="viewer-container" id="viewer-container"></div> |
| 28 | |
| 29 | <script src="../../../../../wp-includes/js/jquery/jquery.js"></script> |
| 30 | <script src="js/html2canvas.min.js"></script> |
| 31 | <script src="js/three.min.js"></script> |
| 32 | <script src="js/pdf.min.js"></script> |
| 33 | <script src="js/3dflipbook.min.js"></script> |
| 34 | |
| 35 | <script type="text/javascript"> |
| 36 | var template = { |
| 37 | html: "templates/book-view.html", |
| 38 | links: [], |
| 39 | styles: ["css/ep-black-book-view.css"], |
| 40 | script: "js/default-book-view.js", |
| 41 | sounds: { |
| 42 | startFlip: "sounds/start-flip.mp3", |
| 43 | endFlip: "sounds/end-flip.mp3", |
| 44 | }, |
| 45 | }; |
| 46 | </script> |
| 47 | |
| 48 | <script> |
| 49 | // Ensure the script runs after the page has fully loaded |
| 50 | |
| 51 | // Function to extract the file URL from the query parameters |
| 52 | function extractFileParamData(src, $param) { |
| 53 | // Parse the URL |
| 54 | var url = new URL(src); |
| 55 | // Extract the 'file' parameter from the query string |
| 56 | var fileUrl = url.searchParams.get($param); |
| 57 | return fileUrl; |
| 58 | } |
| 59 | |
| 60 | var parentIframeSrc; |
| 61 | |
| 62 | var params = {}; |
| 63 | |
| 64 | window.onload = function () { |
| 65 | // Access the parent window |
| 66 | var parentWindow = window.parent; |
| 67 | |
| 68 | // Get the iframes within the parent window |
| 69 | var iframes = parentWindow.document.getElementsByTagName("iframe"); |
| 70 | |
| 71 | for (var i = 0; i < iframes.length; i++) { |
| 72 | if (iframes[i].contentWindow === window) { |
| 73 | // Get the src attribute of the iframe |
| 74 | parentIframeSrc = iframes[i].src; |
| 75 | |
| 76 | // The encoded string you want to decode |
| 77 | const encodedString = extractFileParamData(parentIframeSrc, "key"); |
| 78 | |
| 79 | // Step 1: Base64 Decode |
| 80 | const decodedString = atob(encodedString); |
| 81 | |
| 82 | // Step 1: Create URLSearchParams object |
| 83 | const urlParams = new URLSearchParams(decodedString); |
| 84 | |
| 85 | // Step 2: Convert URLSearchParams to Object |
| 86 | const paramsObject = {}; |
| 87 | for (const [key, value] of urlParams.entries()) { |
| 88 | params[key] = |
| 89 | value == "yes" || value == "true" |
| 90 | ? true |
| 91 | : value == "no" |
| 92 | ? false |
| 93 | : value; |
| 94 | } |
| 95 | |
| 96 | // Apply sound setting to template |
| 97 | if (params.sound === false || params.sound === "false") { |
| 98 | template.sounds = {}; |
| 99 | } |
| 100 | |
| 101 | // Book 1 { |
| 102 | jQuery("#viewer-container").FlipBook({ |
| 103 | pdf: extractFileParamData(parentIframeSrc, "file"), |
| 104 | template: template, |
| 105 | }); |
| 106 | |
| 107 | |
| 108 | const newSettings = decodedString; |
| 109 | |
| 110 | let oldData = localStorage.getItem("flipbook_settings"); |
| 111 | let settingsArray; |
| 112 | |
| 113 | try { |
| 114 | settingsArray = oldData ? JSON.parse(oldData) : []; |
| 115 | if (!Array.isArray(settingsArray)) { |
| 116 | settingsArray = []; |
| 117 | } |
| 118 | } catch (e) { |
| 119 | settingsArray = []; |
| 120 | } |
| 121 | |
| 122 | settingsArray.push(newSettings); |
| 123 | |
| 124 | let newData = JSON.stringify(settingsArray); |
| 125 | localStorage.setItem("flipbook_settings", newData); |
| 126 | |
| 127 | let updatedData = localStorage.getItem("flipbook_settings"); |
| 128 | |
| 129 | |
| 130 | break; // Exit the loop once the matching iframe is found and processed |
| 131 | } |
| 132 | } |
| 133 | }; |
| 134 | </script> |
| 135 | </body> |
| 136 | |
| 137 | </html> |