From 10599ab2e789ffb93a19f6aa3c100f533c460315 Mon Sep 17 00:00:00 2001 From: Star Rauchenberger Date: Sun, 29 Oct 2023 11:32:06 -0400 Subject: generate, show, solve puzzles --- app/assets/javascripts/wittle/application.js | 1 + app/assets/javascripts/wittle/utilities.js.erb | 204 ------------------------- app/assets/javascripts/wittle/wittle.js | 5 + 3 files changed, 6 insertions(+), 204 deletions(-) create mode 100644 app/assets/javascripts/wittle/wittle.js (limited to 'app/assets/javascripts') diff --git a/app/assets/javascripts/wittle/application.js b/app/assets/javascripts/wittle/application.js index e54c646..52d2214 100644 --- a/app/assets/javascripts/wittle/application.js +++ b/app/assets/javascripts/wittle/application.js @@ -10,4 +10,5 @@ // Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details // about supported directives. // +//= require jquery3 //= require_tree . diff --git a/app/assets/javascripts/wittle/utilities.js.erb b/app/assets/javascripts/wittle/utilities.js.erb index 406adda..487af6e 100644 --- a/app/assets/javascripts/wittle/utilities.js.erb +++ b/app/assets/javascripts/wittle/utilities.js.erb @@ -245,210 +245,6 @@ window.deleteElementsByClassName = function(rootElem, className) { } } -window.loadHeader = function(titleText) { - document.body.style.marginLeft = '0px' - - var navbar = document.createElement('div') - document.body.appendChild(navbar) - navbar.className = 'navbar' - navbar.style = 'min-width: 700px; position: absolute; top: 0; width: 100%; z-index: 1' - navbar.style.borderBottom = '2px solid ' + window.BORDER - navbar.style.background = window.PAGE_BACKGROUND - - var navbarPadding = document.createElement('div') - document.body.appendChild(navbarPadding) - navbarPadding.className = 'navbar-padding' - - var titleDiv = document.createElement('div') - navbar.appendChild(titleDiv) - titleDiv.style = 'position: absolute; width: 100%; pointer-events: none' - - var titleLabel = document.createElement('label') - titleDiv.appendChild(titleLabel) - titleLabel.style = 'font-size: 48; pointer-events: auto' - titleLabel.id = 'title' - titleLabel.innerText = titleText - - var link = document.createElement('label') - navbar.appendChild(link) - link.style = 'float: left; margin-left: 32px; cursor: pointer; line-height: 60px' - link.className = 'navbar-content' - - if (window.location.href.endsWith('browse.html')) { - navbar.style.position = 'fixed' // When browsing, pin the navbar to the top so that it's visible during infinite scroll. - - link.innerText = 'Create a puzzle' - link.onpointerdown = function() {window.location = 'editor.html'} - - var link2 = document.createElement('label') - navbar.appendChild(link2) - link2.style = 'float: left; margin-left: 20px; cursor: pointer; line-height: 60px; display: none' - link2.className = 'navbar-content' - link2.innerText = 'Jump to top' - link2.id = 'scrollToTop' - link2.onpointerdown = function() {window.scrollTo(0, 0)} - - } else if (window.location.href.includes('/play/')) { - link.innerText = 'Back to all puzzles' - link.onpointerdown = function() {window.location = '../browse.html'} - } else /* All other pages */ { - link.innerText = 'Browse all puzzles' - link.onpointerdown = function() {window.location = 'browse.html'} - } - - var feedbackButton = document.createElement('label') - navbar.appendChild(feedbackButton) - feedbackButton.id = 'feedbackButton' - feedbackButton.style = 'float: right; margin-right: 8px; cursor: pointer; line-height: 60px' - feedbackButton.innerText = 'Send feedback' - feedbackButton.className = 'navbar-content' - feedbackButton.onpointerdown = function() { - var feedback = prompt('Provide feedback:') - if (feedback) { - sendFeedback(feedback) - } - } - - var separator = document.createElement('label') - navbar.appendChild(separator) - separator.style = 'float: right; line-height: 60px; padding-left: 6px; padding-right: 6px' - separator.className = 'navbar-content' - separator.innerText = '|' - - var sourceLink = document.createElement('label') - navbar.appendChild(sourceLink) - sourceLink.style = 'float: right; line-height: 60px; cursor: pointer' - sourceLink.innerText = 'Source code' - sourceLink.className = 'navbar-content' - sourceLink.onpointerdown = function() {window.open('https://github.com/jbzdarkid/jbzdarkid.github.io', '_blank')} - - var collapsedSettings = drawSymbol({'type': 'plus', 'width':20, 'height':20}) - navbar.appendChild(collapsedSettings) - collapsedSettings.style = 'width: 20px; height: 20px; position: absolute; left: 0; cursor: pointer' - collapsedSettings.style.border = '2px solid ' + window.BORDER - collapsedSettings.id = 'collapsedSettings' - collapsedSettings.onpointerdown = function() { - this.style.display = 'none' - var expandedSettings = document.getElementById('expandedSettings') - expandedSettings.style.display = null - window.settings.expanded = 'true' - } - - var expandedSettings = document.createElement('div') - navbar.appendChild(expandedSettings) - expandedSettings.style = 'width: 300px; position: absolute; left: 0; display: none; padding: 10px' - expandedSettings.style.border = '2px solid ' + window.BORDER - expandedSettings.style.background = window.PAGE_BACKGROUND - expandedSettings.id = 'expandedSettings' - - var minus = drawSymbol({'type':'minus', 'width':20, 'height':20}) - minus.style = 'width: 20px; height: 20px; cursor: pointer; position: absolute; top: 0; left: 0' - expandedSettings.appendChild(minus) - minus.onpointerdown = function() { - this.parentElement.style.display = 'none' - var collapsedSettings = document.getElementById('collapsedSettings') - collapsedSettings.style.display = null - window.settings.expanded = 'false' - } - - if (window.settings.expanded == 'true') { - collapsedSettings.onpointerdown() - } - - // Now, for the contents of the settings - var settingsLabel = document.createElement('label') - expandedSettings.appendChild(settingsLabel) - settingsLabel.innerText = 'settings' - settingsLabel.style = 'line-height: 0px' // Attach to the top - - expandedSettings.appendChild(document.createElement('br')) - expandedSettings.appendChild(document.createElement('br')) - - // Theme - document.body.style.color = window.TEXT_COLOR - document.body.style.background = window.PAGE_BACKGROUND - var themeButton = document.createElement('button') - expandedSettings.appendChild(themeButton) - if (window.settings.theme == 'night') { - themeButton.innerText = 'Night theme' - themeButton.onpointerdown = function() { - window.settings.theme = 'light' - location.reload() - } - } else if (window.settings.theme == 'light') { - themeButton.innerText = 'Light theme' - themeButton.onpointerdown = function() { - window.settings.theme = 'night' - location.reload() - } - } - - expandedSettings.appendChild(document.createElement('br')) - - // Sensitivity - var sensLabel = document.createElement('label') - expandedSettings.appendChild(sensLabel) - sensLabel.htmlFor = 'sens' - sensLabel.innerText = 'Mouse Speed 2D' - - var sens = document.createElement('input') - expandedSettings.appendChild(sens) - sens.type = 'range' - sens.id = 'sens' - sens.min = '0.1' - sens.max = '1.3' - sens.step = '0.1' - sens.value = window.settings.sensitivity - sens.onchange = function() { - window.settings.sensitivity = this.value - } - sens.style.backgroundImage = 'linear-gradient(to right, ' + window.ALT_BACKGROUND + ', ' + window.ACTIVE_COLOR + ')' - - // Volume - var volumeLabel = document.createElement('label') - expandedSettings.appendChild(volumeLabel) - volumeLabel.htmlFor = 'volume' - volumeLabel.innerText = 'Volume' - - var volume = document.createElement('input') - expandedSettings.appendChild(volume) - volume.type = 'range' - volume.id = 'volume' - volume.min = '0' - volume.max = '0.24' - volume.step = '0.02' - volume.value = parseFloat(window.settings.volume) - volume.onchange = function() { - window.settings.volume = this.value - } - volume.style.backgroundImage = 'linear-gradient(to right, ' + window.ALT_BACKGROUND + ', ' + window.ACTIVE_COLOR + ')' - - // Custom mechanics -- disabled for now - window.settings.customMechanics = false - /* - var customMechanics = createCheckbox() - expandedSettings.appendChild(customMechanics) - customMechanics.id = 'customMechanics' - if (window.settings.customMechanics == 'true') { - customMechanics.style.background = window.BORDER - customMechanics.checked = true - } - - customMechanics.onpointerdown = function() { - this.checked = !this.checked - this.style.background = (this.checked ? window.BORDER : window.PAGE_BACKGROUND) - window.settings.customMechanics = this.checked - window.location.reload() - } - - var mechLabel = document.createElement('label') - expandedSettings.appendChild(mechLabel) - mechLabel.style.marginLeft = '6px' - mechLabel.htmlFor = 'customMechanics' - mechLabel.innerText = 'Custom mechanics' - */ -} - // Automatically solve the puzzle window.solvePuzzle = function() { if (window.setSolveMode) window.setSolveMode(false) diff --git a/app/assets/javascripts/wittle/wittle.js b/app/assets/javascripts/wittle/wittle.js new file mode 100644 index 0000000..883a4b8 --- /dev/null +++ b/app/assets/javascripts/wittle/wittle.js @@ -0,0 +1,5 @@ +$.ajaxSetup({ + headers: { + 'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content') + } +}); -- cgit 1.4.1