|
|
| Line 1: |
Line 1: |
| − | <noinclude>
| + | {{Domain Form}} |
| − | This is the "Domain Form" template.
| |
| − | Use this form to create a new Domain page with all the necessary information.
| |
| − | </noinclude><includeonly>
| |
| − | <div style="max-width: 900px; margin: 0 auto; background: #000; border: 4px double #DC7; padding: 30px; border-radius: 8px;">
| |
| − | <h2 style="font-family: Georgia, serif; color: #DC7; text-align: center; margin-bottom: 10px; font-size: 2em;">Domain Information Form</h2>
| |
| − | <p style="text-align: center; color: #AAA; margin-bottom: 30px; font-size: 0.9em;">Fill out the form below to create domain page content</p>
| |
| − |
| |
| − | <div id="domainFormContainer">
| |
| − | <form id="domainForm">
| |
| − | <div style="color: #DC7; font-size: 1.3em; margin-top: 25px; margin-bottom: 15px; padding-bottom: 8px; border-bottom: 2px solid #DC7; font-weight: bold;">Basic Information</div>
| |
| − |
| |
| − | <div style="margin-bottom: 20px;">
| |
| − | <label style="display: block; margin-bottom: 8px; font-weight: bold; color: #DC7;">
| |
| − | Title Picture
| |
| − | <span style="font-size: 0.85em; color: #999; font-weight: normal;">(Optional - filename with extension)</span>
| |
| − | </label>
| |
| − | <input type="text" id="titlepic" name="titlepic" placeholder="Leave blank to use auto-detection" style="width: 100%; padding: 12px; background: #1a1a1a; border: 2px solid #DC7; color: #DC7; font-size: 16px; border-radius: 4px;">
| |
| − | </div>
| |
| − |
| |
| − | <div style="margin-bottom: 20px;">
| |
| − | <label style="display: block; margin-bottom: 8px; font-weight: bold; color: #DC7;">
| |
| − | Region <span style="color: #ff6b6b;">*</span>
| |
| − | </label>
| |
| − | <input type="text" id="region" name="region" placeholder="Enter region name" required style="width: 100%; padding: 12px; background: #1a1a1a; border: 2px solid #DC7; color: #DC7; font-size: 16px; border-radius: 4px;">
| |
| − | </div>
| |
| − | | |
| − | <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px;">
| |
| − | <div>
| |
| − | <label style="display: block; margin-bottom: 8px; font-weight: bold; color: #DC7;">
| |
| − | City <span style="color: #ff6b6b;">*</span>
| |
| − | </label>
| |
| − | <input type="text" id="city" name="city" placeholder="Enter city" required style="width: 100%; padding: 12px; background: #1a1a1a; border: 2px solid #DC7; color: #DC7; font-size: 16px; border-radius: 4px;">
| |
| − | </div>
| |
| − | | |
| − | <div>
| |
| − | <label style="display: block; margin-bottom: 8px; font-weight: bold; color: #DC7;">
| |
| − | State <span style="color: #ff6b6b;">*</span>
| |
| − | </label>
| |
| − | <input type="text" id="state" name="state" placeholder="Enter state" required style="width: 100%; padding: 12px; background: #1a1a1a; border: 2px solid #DC7; color: #DC7; font-size: 16px; border-radius: 4px;">
| |
| − | </div>
| |
| − | </div>
| |
| − | | |
| − | <div style="color: #DC7; font-size: 1.3em; margin-top: 25px; margin-bottom: 15px; padding-bottom: 8px; border-bottom: 2px solid #DC7; font-weight: bold;">Domain Storyteller (DST)</div>
| |
| − | | |
| − | <div style="margin-bottom: 20px;">
| |
| − | <label style="display: block; margin-bottom: 8px; font-weight: bold; color: #DC7;">
| |
| − | DST Name <span style="color: #ff6b6b;">*</span>
| |
| − | </label>
| |
| − | <input type="text" id="dstName" name="dstName" placeholder="Enter Domain Storyteller name" required style="width: 100%; padding: 12px; background: #1a1a1a; border: 2px solid #DC7; color: #DC7; font-size: 16px; border-radius: 4px;">
| |
| − | </div>
| |
| − | | |
| − | <div style="margin-bottom: 20px;">
| |
| − | <label style="display: block; margin-bottom: 8px; font-weight: bold; color: #DC7;">
| |
| − | DST Email <span style="color: #ff6b6b;">*</span>
| |
| − | </label>
| |
| − | <input type="email" id="dstEmail" name="dstEmail" placeholder="dst@example.com" required style="width: 100%; padding: 12px; background: #1a1a1a; border: 2px solid #DC7; color: #DC7; font-size: 16px; border-radius: 4px;">
| |
| − | </div>
| |
| − | | |
| − | <div style="color: #DC7; font-size: 1.3em; margin-top: 25px; margin-bottom: 15px; padding-bottom: 8px; border-bottom: 2px solid #DC7; font-weight: bold;">Domain Coordinator (DC)</div>
| |
| − | | |
| − | <div style="margin-bottom: 20px;">
| |
| − | <label style="display: block; margin-bottom: 8px; font-weight: bold; color: #DC7;">
| |
| − | DC Name <span style="color: #ff6b6b;">*</span>
| |
| − | </label>
| |
| − | <input type="text" id="dcName" name="dcName" placeholder="Enter Domain Coordinator name" required style="width: 100%; padding: 12px; background: #1a1a1a; border: 2px solid #DC7; color: #DC7; font-size: 16px; border-radius: 4px;">
| |
| − | </div>
| |
| − | | |
| − | <div style="margin-bottom: 20px;">
| |
| − | <label style="display: block; margin-bottom: 8px; font-weight: bold; color: #DC7;">
| |
| − | DC Email <span style="color: #ff6b6b;">*</span>
| |
| − | </label>
| |
| − | <input type="email" id="dcEmail" name="dcEmail" placeholder="dc@example.com" required style="width: 100%; padding: 12px; background: #1a1a1a; border: 2px solid #DC7; color: #DC7; font-size: 16px; border-radius: 4px;">
| |
| − | </div>
| |
| − | | |
| − | <div style="color: #DC7; font-size: 1.3em; margin-top: 25px; margin-bottom: 15px; padding-bottom: 8px; border-bottom: 2px solid #DC7; font-weight: bold;">Additional Information</div>
| |
| − | | |
| − | <div style="margin-bottom: 20px;">
| |
| − | <label style="display: block; margin-bottom: 8px; font-weight: bold; color: #DC7;">
| |
| − | Additional Notes
| |
| − | <span style="font-size: 0.85em; color: #999; font-weight: normal;">(Optional)</span>
| |
| − | </label>
| |
| − | <textarea id="notes" name="notes" placeholder="Enter any additional notes..." style="width: 100%; padding: 12px; background: #1a1a1a; border: 2px solid #DC7; color: #DC7; font-size: 16px; border-radius: 4px; min-height: 100px; resize: vertical;"></textarea>
| |
| − | </div>
| |
| − |
| |
| − | <div style="display: flex; gap: 15px; margin-top: 30px;">
| |
| − | <button type="submit" style="flex: 1; padding: 15px; font-size: 16px; font-weight: bold; border: 2px solid #DC7; border-radius: 4px; cursor: pointer; background: #DC7; color: #000;">Generate Template Code</button>
| |
| − | <button type="button" onclick="clearDomainForm()" style="flex: 1; padding: 15px; font-size: 16px; font-weight: bold; border: 2px solid #DC7; border-radius: 4px; cursor: pointer; background: transparent; color: #DC7;">Clear Form</button>
| |
| − | </div>
| |
| − | </form>
| |
| − |
| |
| − | <div id="domainOutput" style="margin-top: 30px; display: none;">
| |
| − | <div style="font-weight: bold; margin-bottom: 10px; color: #DC7; font-size: 1.1em;">Generated Template Code:</div>
| |
| − | <textarea id="domainOutputCode" readonly style="width: 100%; padding: 15px; background: #1a1a1a; border: 2px solid #DC7; color: #DC7; font-family: Courier New, monospace; font-size: 14px; min-height: 200px; border-radius: 4px; resize: vertical;"></textarea>
| |
| − | <button onclick="copyDomainCode()" style="width: 100%; margin-top: 10px; padding: 12px; background: #2a5c2a; color: #DC7; border: 2px solid #3a7c3a; border-radius: 4px; cursor: pointer; font-size: 16px; font-weight: bold;">Copy to Clipboard</button>
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| − | | |
| − | <script>
| |
| − | document.getElementById('domainForm').addEventListener('submit', function(e) {
| |
| − | e.preventDefault();
| |
| − |
| |
| − | const titlepic = document.getElementById('titlepic').value.trim();
| |
| − | const region = document.getElementById('region').value.trim();
| |
| − | const city = document.getElementById('city').value.trim();
| |
| − | const state = document.getElementById('state').value.trim();
| |
| − | const dstName = document.getElementById('dstName').value.trim();
| |
| − | const dstEmail = document.getElementById('dstEmail').value.trim();
| |
| − | const dcName = document.getElementById('dcName').value.trim();
| |
| − | const dcEmail = document.getElementById('dcEmail').value.trim();
| |
| − | const notes = document.getElementById('notes').value.trim();
| |
| − |
| |
| − | if (!region || !city || !state || !dstName || !dstEmail || !dcName || !dcEmail) {
| |
| − | alert('Please fill in all required fields!');
| |
| − | return;
| |
| − | }
| |
| − |
| |
| − | let templateCode = '{{Domain\n';
| |
| − |
| |
| − | if (titlepic) {
| |
| − | templateCode += '|titlepic=' + titlepic + '\n';
| |
| − | }
| |
| − |
| |
| − | templateCode += '|region=' + region + '\n';
| |
| − | templateCode += '}}\n\n';
| |
| − |
| |
| − | templateCode += "'''Location:''' " + city + ", " + state + '\n\n';
| |
| − |
| |
| − | templateCode += '== Domain Staff ==\n\n';
| |
| − | templateCode += "'''Domain Storyteller:''' " + dstName + '\n';
| |
| − | templateCode += "'''Email:''' " + dstEmail + '\n\n';
| |
| − | templateCode += "'''Domain Coordinator:''' " + dcName + '\n';
| |
| − | templateCode += "'''Email:''' " + dcEmail + '\n';
| |
| − |
| |
| − | if (notes) {
| |
| − | templateCode += '\n== Notes ==\n\n' + notes + '\n';
| |
| − | }
| |
| − |
| |
| − | document.getElementById('domainOutputCode').value = templateCode;
| |
| − | document.getElementById('domainOutput').style.display = 'block';
| |
| − |
| |
| − | document.getElementById('domainOutput').scrollIntoView({ behavior: 'smooth', block: 'nearest' });
| |
| − | });
| |
| − | | |
| − | function clearDomainForm() {
| |
| − | document.getElementById('domainForm').reset();
| |
| − | document.getElementById('domainOutput').style.display = 'none';
| |
| − | }
| |
| − | | |
| − | function copyDomainCode() {
| |
| − | const outputCode = document.getElementById('domainOutputCode');
| |
| − | outputCode.select();
| |
| − | document.execCommand('copy');
| |
| − |
| |
| − | const btn = event.target;
| |
| − | const originalText = btn.textContent;
| |
| − | btn.textContent = 'Copied!';
| |
| − | btn.style.background = '#3a7c3a';
| |
| − |
| |
| − | setTimeout(function() {
| |
| − | btn.textContent = originalText;
| |
| − | btn.style.background = '#2a5c2a';
| |
| − | }, 2000);
| |
| − | } | |
| − | </script>
| |
| − | </includeonly>
| |
