From bbdbe0f68801cef5fb5c72e9ee01f31595c98dd9 Mon Sep 17 00:00:00 2001 From: Travis Lehman Date: Sun, 5 Nov 2023 12:39:49 -0500 Subject: [PATCH] donate link Pedal Playground is getting expensive to maintain. --- app/scripts/scripts.js | 48 +++++++++-- app/stylesheets/_components.scss | 76 +++++++++++++++++ index.html | 91 +++++++++++++++----- list.html | 100 ++++++++++++++++++++++ public/scripts/scripts.js | 141 +++++++++++++++++++++++-------- public/stylesheets/styles.css | 56 ++++++++++++ 6 files changed, 449 insertions(+), 63 deletions(-) create mode 100644 list.html diff --git a/app/scripts/scripts.js b/app/scripts/scripts.js index 43391d808..0adb4b73f 100644 --- a/app/scripts/scripts.js +++ b/app/scripts/scripts.js @@ -1,11 +1,16 @@ var pedalImagePath = "public/images/pedals/"; var pedalboardImagePath = "public/images/pedalboards/"; +const UNITS_IN = 'in.'; +const UNITS_MM = 'mm.'; + $(document).ready(function () { // Populate Pedalboards and Pedals lists GetPedalData(); GetPedalBoardData(); + alert('hey'); + // Make lists searchable $(".pedal-list").select2({ placeholder: "Select a pedal", @@ -30,6 +35,24 @@ $(document).ready(function () { }); $(function () { + $("#input-unit-pb").switchButton({ + checked: true, + on_label: UNITS_IN, + off_label: UNITS_MM, + width: 50, + height: 12, + button_width: 35, + }) + + $("#input-unit-pd").switchButton({ + checked: true, + on_label: UNITS_IN, + off_label: UNITS_MM, + width: 50, + height: 12, + button_width: 35, + }) + // Load canvas from localStorage if it has been saved prior if (localStorage["pedalCanvas"] != null) { var savedPedalCanvas = JSON.parse(localStorage["pedalCanvas"]); @@ -214,8 +237,8 @@ $(document).ready(function () { $("body").on("click", "#add-custom-pedal .btn", function (event) { var serial = GenRandom.Job(); var multiplier = $("#canvas-scale").val(); - var width = $("#add-custom-pedal .custom-width").val(); - var height = $("#add-custom-pedal .custom-height").val(); + var width = convertUnitsIfNeeded('pd', $("#add-custom-pedal .custom-width").val()); + var height = convertUnitsIfNeeded('pd', $("#add-custom-pedal .custom-height").val()); var scaledWidth = width * multiplier; var scaledHeight = height * multiplier; var dims = width + '" x ' + height + '"'; @@ -281,8 +304,8 @@ $(document).ready(function () { $("body").on("click", "#add-custom-pedalboard .btn", function (event) { var serial = GenRandom.Job(); var multiplier = $("#canvas-scale").val(); - var width = $("#add-custom-pedalboard .custom-width").val(); - var height = $("#add-custom-pedalboard .custom-height").val(); + var width = convertUnitsIfNeeded('pb', $("#add-custom-pedalboard .custom-width").val()); + var height = convertUnitsIfNeeded('pb',$("#add-custom-pedalboard .custom-height").val()); var scaledWidth = width * multiplier; var scaledHeight = height * multiplier; @@ -421,6 +444,21 @@ $(document).ready(function () { }); }); // End Document ready +function convertUnitsIfNeeded(type, value) { + switch(type) { + case 'pb': + return ($('#input-unit-pb-wrapper span.on').text() === UNITS_IN) ? value : mmToIn(value); + case 'pd': + return ($('#input-unit-pd-wrapper span.on').text() === UNITS_IN) ? value : mmToIn(value); + default: + break; + } +} + +function mmToIn(value) { + return Math.round((value * 0.0393701) * 100) / 100; +} + function readyCanvas(pedal) { var $draggable = $(".canvas .pedal, .canvas .pedalboard").draggabilly({ containment: ".canvas", @@ -801,4 +839,4 @@ $("body").click(function () { // reset stuff $(".panel").remove(); $(".canvas .selected").removeClass("selected"); -}); +}); \ No newline at end of file diff --git a/app/stylesheets/_components.scss b/app/stylesheets/_components.scss index 2f82b3103..e8634d399 100644 --- a/app/stylesheets/_components.scss +++ b/app/stylesheets/_components.scss @@ -843,4 +843,80 @@ body { border-top-color: #e0e2e6; border-bottom-color: #B9BCBF; } +} + + +//
+//

Settings

+// +//
+ +.settings-popover { + // width: 280px; + + h4 { + padding: 1.4rem 1rem; + margin: 0; + font-size: 15px; + font-weight: 600; + } + .panel__action { + // font-size: 14px; + display: flex; + justify-content: space-between; + label { + font-weight: normal; + margin: 0; + } + .form-control { + width: 40px; + padding: 0; + text-align: right; + height: auto; + border: none; + box-shadow: none; + } + } + input::-webkit-outer-spin-button, + input::-webkit-inner-spin-button { + /* display: none; <- Crashes Chrome on hover */ + -webkit-appearance: none; + margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ + } + + input[type=number] { + -moz-appearance:textfield; /* Firefox */ + } +} + +.halp { + @media (max-width: 1023px) { + display: none; + } + border: none; + position: fixed; + bottom: 1rem; + left: 50%; + z-index: 3; + padding: .5rem 1rem; + background: white; + border-radius: 8px; + box-shadow: 0 2px 6px rgba(black, 0.2); + @media (prefers-color-scheme: dark) { + background: $panel-bg-dark; + border: 0; + box-shadow: none !important; + } } \ No newline at end of file diff --git a/index.html b/index.html index c119671b4..b5167b4a3 100644 --- a/index.html +++ b/index.html @@ -59,12 +59,9 @@

PedalPlayground

@@ -78,9 +75,9 @@

PedalPlayground