Skip to content

Commit

Permalink
Remove Turbolinks
Browse files Browse the repository at this point in the history
  • Loading branch information
@jerodsanto
jerodsanto committed Feb 28, 2024
1 parent 8e323c4 commit 49c6de4
Show file tree
Hide file tree
Showing 25 changed files with 120 additions and 214 deletions.
108 changes: 29 additions & 79 deletions assets/app/app.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import "phoenix_html";
import Turbolinks from "turbolinks";
import { u, ajax } from "umbrellajs";
import autosize from "autosize";
import Cookies from "cookies-js";
Expand Down Expand Up @@ -28,32 +27,32 @@ window.App = {
ten: new Ten(),

attachComments() {
u(".js-comment").each(el => {
u(".js-comment").each((el) => {
if (el.comment === undefined) new Comment(el);
el.comment.detectPermalink();
});
},

attachFlash() {
u(".js-flash").each(el => {
u(".js-flash").each((el) => {
if (el.flash === undefined) new Flash(el);
});
},

attachMiniPlayers() {
u(".js-mini-player").each(el => {
u(".js-mini-player").each((el) => {
if (el.player === undefined) new MiniPlayer(el);
});
},

attachTooltips() {
u(".has-tooltip").each(el => {
u(".has-tooltip").each((el) => {
if (el.tooltip === undefined) new Tooltip(el);
});
},

detachFlash() {
u(".js-flash").each(el => {
u(".js-flash").each((el) => {
el.flash.remove();
});
},
Expand All @@ -66,7 +65,7 @@ window.App = {
this.player.scrubEnd(linkTime);
} else {
let playable = u("[data-play]");
this.player.load(playable.data("play"), _ => {
this.player.load(playable.data("play"), (_) => {
this.player.scrubEnd(linkTime);
this.player.play();
this.player.log("Play");
Expand All @@ -77,7 +76,7 @@ window.App = {
},

formatTimes() {
u("span.time").each(el => {
u("span.time").each((el) => {
let span = u(el);
let anchor = span.parent("a");
let date = new Date(span.text());
Expand All @@ -90,14 +89,21 @@ window.App = {

isExternalLink(a) {
let href = a.attr("href");
return a.attr("rel") == "external" || (href[0] != "/" && !href.match(location.hostname));
return (
a.attr("rel") == "external" ||
(href[0] != "/" && !href.match(location.hostname))
);
}
};

// Hide tooltips when clicking anywhere else
u(document).on("click", function (event) {
const target = u(event.target);
if (!target.closest(".has-tooltip").length && !target.closest(".tooltip").length && !target.hasClass("has-tooltip")) {
if (
!target.closest(".has-tooltip").length &&
!target.closest(".tooltip").length &&
!target.hasClass("has-tooltip")
) {
u(".tooltip").removeClass("is-visible");
}
});
Expand All @@ -120,7 +126,7 @@ u(document).on("change", ".js-toggle-subscription", function (event) {

u(document).handle("click", ".js-subscribe-all", function (event) {
u(event.target).remove();
u(".js-toggle-subscription:not(:checked)").each(el => {
u(".js-toggle-subscription:not(:checked)").each((el) => {
el.click();
});
});
Expand All @@ -131,7 +137,9 @@ u(document).handle("click", ".js-toggle_element", function (event) {
});

u(document).handle("click", ".podcast-summary-widget_toggle", function (event) {
u(event.target).siblings(".podcast-summary-widget_menu").toggleClass("podcast-summary-widget_menu--is-open");
u(event.target)
.siblings(".podcast-summary-widget_menu")
.toggleClass("podcast-summary-widget_menu--is-open");
});

u(document).on("click", "[data-play]", function (event) {
Expand All @@ -146,7 +154,7 @@ u(document).on("click", "[data-play]", function (event) {
App.player.togglePlayPause();
} else {
App.player.pause();
App.player.load(detailsUrl, _ => {
App.player.load(detailsUrl, (_) => {
App.player.play();
App.player.log("Play");
if (linkTime) App.player.scrubEnd(linkTime);
Expand All @@ -167,15 +175,17 @@ u(document).handle("click", "[data-share]", function (event) {
new Share(App.overlay).load(u(this).data("share"));
});

u(document).handle("click", "[data-copy]", function(event) {
u(document).handle("click", "[data-copy]", function (event) {
const el = event.target;
const type = "text/plain";
const blob = new Blob([el.href], {type});
const data = [new ClipboardItem({[type]: blob})];
const blob = new Blob([el.href], { type });
const data = [new ClipboardItem({ [type]: blob })];

navigator.clipboard.write(data).then(() => {
u(el).text("Copied!");
setTimeout(() => { u(el).text("Share") }, 1500);
setTimeout(() => {
u(el).text("Share");
}, 1500);
});
});

Expand Down Expand Up @@ -231,70 +241,12 @@ u(document).on("click", "a[href^=\\#t]", function (event) {
}
});

// submit forms with Turbolinks
u(document).on("submit", "form:not([data-turbolinks=\"false\"])", function (event) {
event.preventDefault();

let form = u(this);
let submits = form.find("input[type=submit]");
let optionalMethodOverride = form.children('input[name="_method"]');
let action = form.attr("action");
let method = form.attr("method");
let referrer = location.href;

// Override the default form action if form has hidden input generated for form_for/3
if (optionalMethodOverride.length) {
method = optionalMethodOverride.first().getAttribute("value");
}

if (method == "get") {
return Turbolinks.visit(`${action}?${form.serialize()}`);
}

let options = {
method: method,
body: new FormData(form.first()),
headers: { "Turbolinks-Referrer": referrer }
};

if (form.data("ajax")) {
options.headers["Accept"] = "application/javascript";
}

submits.each(el => {
el.setAttribute("disabled", true);
});

let andThen = function (err, resp, req) {
submits.each(el => {
el.removeAttribute("disabled");
});

if (req.getResponseHeader("content-type").match(/javascript/)) {
eval(resp);
u(document).trigger("ajax:load");
} else {
let snapshot = Turbolinks.Snapshot.wrap(resp);
Turbolinks.controller.cache.put(referrer, snapshot);
Turbolinks.visit(referrer, { action: "restore" });
}
};

ajax(action, options, andThen);
});

window.onhashchange = function () {
App.deepLink();
};

u(document).on("turbolinks:before-cache", function () {
u("body").removeClass("nav-open");
App.overlay.hide();
App.detachFlash();
});

// on page load
u(document).on("turbolinks:load", function () {
u(document).on("DOMContentLoaded", function () {
console.log("ready");
Prism.highlightAll();
App.player.attach();
autosize(document.querySelectorAll("textarea"));
Expand All @@ -313,5 +265,3 @@ u(document).on("ajax:load", function () {
App.formatTimes();
autosize(document.querySelectorAll("textarea"));
});

Turbolinks.start();
38 changes: 22 additions & 16 deletions assets/app/modules/comment.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,60 +14,66 @@ export default class Comment {

attachUI() {
// Reply textbox and new text box actions
this.replyForm = this.container.children('form[data-context="reply"], form[data-context="new"]');
this.replyForm = this.container.children(
'form[data-context="reply"], form[data-context="new"]'
);
this.replyTextArea = this.replyForm.find("textarea").first();
this.previewArea = this.replyForm.find(".js-comment-preview-area");
this.collapseButton = this.container.children(".js-comment-collapse");
this.replyButton = this.container.children("footer").find(".js-comment-reply");
this.replyButton = this.container
.children("footer")
.find(".js-comment-reply");
this.previewButton = this.replyForm.find(".js-comment-preview");
this.writeButton = this.replyForm.find(".js-comment-write");
this.replies = this.container.children(".comment-replies");

// Edit textbox actions
this.editForm = this.container.children('form[data-context="edit"]');
this.editButton = this.container.children("footer").find(".js-comment-edit");
this.editButton = this.container
.children("footer")
.find(".js-comment-edit");
this.editTextArea = this.editForm.find("textarea").first();
this.editPreviewArea = this.editForm.find(".js-comment-preview-area");
this.editPreviewButton = this.editForm.find(".js-comment-preview");
this.editWriteButton = this.editForm.find(".js-comment-write");
}

attachEvents() {
this.collapseButton.handle("click", _ => {
this.collapseButton.handle("click", (_) => {
this.container.toggleClass("is-collapsed");
});
this.replyButton.handle("click", _ => {
this.replyButton.handle("click", (_) => {
this.toggleReplyForm();
});
this.editButton.handle("click", _ => {
this.editButton.handle("click", (_) => {
this.toggleEditForm();
});
this.previewButton.handle("click", _ => {
this.previewButton.handle("click", (_) => {
this.showPreview();
});
this.editPreviewButton.handle("click", _ => {
this.editPreviewButton.handle("click", (_) => {
this.showEditPreview();
});
this.previewArea.handle("click", _ => {
this.previewArea.handle("click", (_) => {
this.showWrite();
});
this.writeButton.handle("click", _ => {
this.writeButton.handle("click", (_) => {
this.showWrite();
});
this.editPreviewArea.handle("click", _ => {
this.editPreviewArea.handle("click", (_) => {
this.showEditWrite();
});
this.editWriteButton.handle("click", _ => {
this.editWriteButton.handle("click", (_) => {
this.showEditWrite();
});
}

attachKeyboardShortcuts() {
this.replyForm.on("keydown", event => {
this.replyForm.on("keydown", (event) => {
// ctrl+enter or cmd+enter submits form
if ((event.metaKey || event.ctrlKey) && event.key == "Enter") {
event.preventDefault();
this.replyForm.trigger("submit");
this.replyForm.first().submit();
}
});
}
Expand Down Expand Up @@ -125,7 +131,7 @@ export default class Comment {
// Reply form related functions
toggleReplyForm() {
if (!this.replyForm.length) {
Turbolinks.visit("/in");
window.location.href = "/in";
} else if (this.replyForm.hasClass("is-hidden")) {
this.openReplyForm();
} else {
Expand Down Expand Up @@ -155,7 +161,7 @@ export default class Comment {
// Edit form related functions
toggleEditForm() {
if (!this.editForm.length) {
//Turbolinks.visit('/in')
window.location.href = "/in";
} else if (this.editForm.hasClass("is-hidden")) {
this.openEditForm();
} else {
Expand Down
12 changes: 9 additions & 3 deletions assets/app/modules/playButton.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ export default class PlayButton {
constructor() {
this.isPlaying = false;
this.owner = "";
u(document).on("turbolinks:load", () => {
u(document).on("DOMContentLoaded", () => {
if (this.isPlaying && this.owner) {
this.play();
}
Expand All @@ -18,13 +18,19 @@ export default class PlayButton {

play() {
this.isPlaying = true;
this.playBarButton().removeClass("playbar_play").addClass("playbar_pause").text("Pause");
this.playBarButton()
.removeClass("playbar_play")
.addClass("playbar_pause")
.text("Pause");
this.newsItemButton().addClass("is-active").html("<span>Pause</span>");
}

pause() {
this.isPlaying = false;
this.playBarButton().removeClass("playbar_pause").addClass("playbar_play").text("Play");
this.playBarButton()
.removeClass("playbar_pause")
.addClass("playbar_play")
.text("Play");
this.newsItemButton().removeClass("is-active").html("<span>Play</span>");
}

Expand Down
1 change: 0 additions & 1 deletion assets/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,6 @@
"prismjs": "^1.15.0",
"siema": "^1.5.1",
"sortablejs": "^1.4.2",
"turbolinks": "^5.2.0",
"umbrellajs": "^2.8.0",
"wavefile": "11.0.0"
},
Expand Down
11 changes: 3 additions & 8 deletions assets/yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2862,13 +2862,13 @@ pegjs@^0.10.0:
integrity sha512-qI5+oFNEGi3L5HAxDwN2LA4Gg7irF70Zs25edhjld9QemOgp0CbvMtbFcMvFtEo1OityPrcCzkQFB8JP/hxgow==

"phoenix@file:../deps/phoenix":
version "1.7.3"
version "1.7.11"

"phoenix_html@file:../deps/phoenix_html":
version "3.3.1"
version "3.3.3"

"phoenix_live_view@file:../deps/phoenix_live_view":
version "0.19.3"
version "0.20.9"

picocolors@^1.0.0:
version "1.0.0"
Expand Down Expand Up @@ -3689,11 +3689,6 @@ tslib@^1.9.0:
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==

turbolinks@^5.2.0:
version "5.2.0"
resolved "https://registry.npmjs.org/turbolinks/-/turbolinks-5.2.0.tgz"
integrity sha512-pMiez3tyBo6uRHFNNZoYMmrES/IaGgMhQQM+VFF36keryjb5ms0XkVpmKHkfW/4Vy96qiGW3K9bz0tF5sK9bBw==

type-fest@^0.21.3:
version "0.21.3"
resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.21.3.tgz#d260a24b0198436e133fa26a524a6d65fa3b2e37"
Expand Down
Loading

0 comments on commit 49c6de4

Please sign in to comment.