123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144 |
- <!DOCTYPE html>
- <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <title>Design</title>
-
-
- <script type="text/javascript" src="/js_libs/jquery.min.js"></script>
- <script type="text/javascript" src="/js_libs/jquery.browser.js"></script>
- <script type="text/javascript" src="/js_libs/jquery.svg.min.js"></script>
- <script type="text/javascript" src="/js_libs/jquery.svgdom.min.js"></script>
- <script type="text/javascript" src="/js_libs/vkbeautify.js"></script>
- <script type="text/javascript" src="/js_libs/util.js"></script>
- <script type="text/javascript" src="/js_libs/printf.js"></script>
- <script type="text/javascript" src="/js_libs/strftime.min.js"></script>
- <script type="text/javascript" src="/js_libs/parsequery.js"></script>
- <script type="text/javascript" src="/js_libs/underscore.min.js"></script>
- <script type="text/javascript" src="/js_libs/jquery.caret.min.js"></script>
- <script type="text/javascript" src="/js_libs/jquery.cookie.js"></script>
-
-
- <script type="text/javascript" src="/js_libs/relaxngui.js"></script>
-
- <script type="text/javascript" src="/js_libs/ui.js"></script>
- <script type="text/javascript" src="/js_libs/custommenu.js"></script>
-
- <link rel="stylesheet" href="/js_libs/custommenu.css" type="text/css"/>
- <link rel="stylesheet" href="/js_libs/ui.css" type="text/css"/>
-
- <link rel="stylesheet" href="/js_libs/relaxngui.css" type="text/css"/>
-
- <link rel="icon" href="favicon.ico">
- <link rel="icon" type="image/png" sizes="96x96" href="favicon-96x96.png">
-
- <style>
- :root {
- --color: #1e90ff;
- --backgroundcolor: fff;
- --fontcolor: 000;
- }
-
- body {
- color: var(--fontcolor);
- background-color: var(--backgroundcolor);
- }
- </style>
-
- </head>
- <script>
- function newLink() {
-
- var formEl = document.forms.config;
- var formData = new FormData(formEl);
- const formElements = Array.from(formData);
-
- var href = window.location.href;
- var dir = href.substring(0, href.lastIndexOf('/')) + "/";
- var link = dir + "service.html?";
-
-
- formElements.forEach((element, index) => {
- if(index!=0){
- link+= "&";
- }
- if(element[0].includes("color")){
- link+= element[0] + "=" + element[1].substring(1);
- }
- else{
- link+= element[0] + "=" + element[1];
- }
- });
-
- document.getElementById("showurl").innerText =link;
- top.document.getElementById('previewframe').setAttribute("src",link);
- }
- $(document).ready(function() {
- newLink()
- });
- </script>
- <body >
- <form action="" id="config">
- Text Style:
- <select onchange="newLink()" name="type" id="type">
- <option value="left">Left</option>
- <option value="center">Center</option>
- <option value="right">right</option>
- </select><br>
- Text: <input onchange="newLink()" name="text" type="text" value="<h1>Your Header</h1>" ></input><br>
- Font Color: <input onchange="newLink()" name="fontcolor" type="color" value="#000000" /><br><br>
-
-
- Background Color: <input onchange="newLink()" name="backgroundcolor" type="color" value="#0081c6" /><br>
- Background Image Url: <input onchange="newLink()" name="backgroundImage" type="text" value="/global_ui/logo.png" /><br>
- Background Image Position:
- <select onchange="newLink()" name="backgroundPosition" id="backgroundPosition">
- <option value="right">Right</option>
- <option value="left">Left</option>
- <option value="left100size">Left Scaled</option>
- <option value="right100size">Right Scaled</option>
-
- </select><br>
- </form>
- <br>
- URL:<br>
- <span id="showurl"></span>
- <br><br>
- Iframe Preview:<br>
- <iframe width="100%" height="200" id="previewframe" src="https://centurio.evva.com/services/frames_support/spinner/service.html?text=Loading%20Serial%20Number&type=lds-spinner&color=000000&fontcolor=000" title="Spinner"></iframe>
- </div>
- </body>
- </html>
|