From d7b8eeef1aa0fb120d662daf8cf41daca71f4b26 Mon Sep 17 00:00:00 2001 From: Jason Lee Date: Fri, 6 Oct 2023 16:20:32 +0800 Subject: [PATCH] Fix JavaScript import for Vite --- app/javascript/entrypoints/admin.css | 2 +- app/javascript/front/app.js | 5 - app/javascript/front/index.js | 11 +- app/javascript/front/index.scss | 1 - app/javascript/front/notifier.js | 2 +- app/javascript/front/topics.js | 33 +-- .../homeland/{i18n.js.erb => i18n.js} | 32 +-- app/javascript/homeland/index.js | 42 ++-- app/javascript/homeland/index.scss | 1 + app/javascript/homeland/timeago.settings.js | 71 ++++++ app/javascript/vendor/bootstrap.js | 13 - .../javascript/vendor}/jquery.atwho.min.js | 0 .../vendor}/jquery.autogrow-textarea.js | 0 .../javascript/vendor}/jquery.fluidbox.min.js | 0 .../javascript/vendor}/jquery.hotkeys.js | 0 .../vendor}/jquery.infinitescroll.min.js | 0 .../vendor}/jquery.mobile-events.js | 0 .../javascript/vendor}/jquery.qrcode.min.js | 0 .../javascript/vendor}/pagination.js | 0 .../vendor/social-share-button/index.js | 4 +- .../vendor/social-share-button/wechat.js | 25 +- .../vendor}/tooltipster.bundle.min.js | 0 app/views/admin/dashboards/index.html.erb | 2 +- app/views/layouts/application.html.erb | 22 +- app/views/layouts/simple.html.erb | 2 +- .../notifications/index.html.erb | 4 +- app/views/topics/_form.html.erb | 6 +- app/views/topics/index.html.erb | 6 +- app/views/topics/show.html.erb | 13 +- bun.lockb | Bin 108779 -> 109839 bytes .../initializers/content_security_policy.rb | 11 + lib/assets/javascripts/backbone.js | 1 - lib/assets/javascripts/google_analytics.js | 4 - lib/assets/javascripts/jquery.timeago.js | 231 ------------------ .../javascripts/jquery.timeago.settings.js | 70 ------ lib/assets/javascripts/underscore.js | 5 - package.json | 2 + 37 files changed, 176 insertions(+), 445 deletions(-) rename app/javascript/homeland/{i18n.js.erb => i18n.js} (56%) create mode 100644 app/javascript/homeland/timeago.settings.js rename {lib/assets/javascripts => app/javascript/vendor}/jquery.atwho.min.js (100%) rename {lib/assets/javascripts => app/javascript/vendor}/jquery.autogrow-textarea.js (100%) rename {lib/assets/javascripts => app/javascript/vendor}/jquery.fluidbox.min.js (100%) rename {lib/assets/javascripts => app/javascript/vendor}/jquery.hotkeys.js (100%) rename {lib/assets/javascripts => app/javascript/vendor}/jquery.infinitescroll.min.js (100%) rename {lib/assets/javascripts => app/javascript/vendor}/jquery.mobile-events.js (100%) rename {lib/assets/javascripts => app/javascript/vendor}/jquery.qrcode.min.js (100%) rename {lib/assets/javascripts => app/javascript/vendor}/pagination.js (100%) rename {lib/assets/javascripts => app/javascript/vendor}/tooltipster.bundle.min.js (100%) delete mode 100644 lib/assets/javascripts/backbone.js delete mode 100644 lib/assets/javascripts/google_analytics.js delete mode 100644 lib/assets/javascripts/jquery.timeago.js delete mode 100644 lib/assets/javascripts/jquery.timeago.settings.js delete mode 100644 lib/assets/javascripts/underscore.js diff --git a/app/javascript/entrypoints/admin.css b/app/javascript/entrypoints/admin.css index 648b165c89..0dcc02c7e1 100644 --- a/app/javascript/entrypoints/admin.css +++ b/app/javascript/entrypoints/admin.css @@ -1 +1 @@ -@import "~/admin/index"; +@import "~/admin/index.scss"; diff --git a/app/javascript/front/app.js b/app/javascript/front/app.js index 4466a19ad2..65e4b9413d 100644 --- a/app/javascript/front/app.js +++ b/app/javascript/front/app.js @@ -1,8 +1,5 @@ import i18n from "~/homeland/i18n"; -require("./emoji-modal"); -require("./notifier"); - const AppView = Backbone.View.extend({ el: "body", repliesPerPage: 50, @@ -37,8 +34,6 @@ const AppView = Backbone.View.extend({ }, initComponents() { - $("abbr.timeago").timeago(); - // Bind Ctrl+Enter for submit $(".cell_comments_new textarea").unbind("keydown"); $(".cell_comments_new textarea").bind( diff --git a/app/javascript/front/index.js b/app/javascript/front/index.js index 3372276bc2..b0893d02bb 100644 --- a/app/javascript/front/index.js +++ b/app/javascript/front/index.js @@ -1,5 +1,6 @@ -require("./app"); -require("./topics"); -require("./toc"); -require("./notifier"); -require("./editor"); +import("./emoji-modal"); +import("./notifier"); +import("./app"); +import("./topics"); +import("./toc"); +import("./editor"); diff --git a/app/javascript/front/index.scss b/app/javascript/front/index.scss index da8bf519dd..0e0fc606fe 100644 --- a/app/javascript/front/index.scss +++ b/app/javascript/front/index.scss @@ -1,7 +1,6 @@ @import "~/homeland/index.scss"; @import "~/vendor/atwho"; -@import "~/vendor/jquery.fluidbox"; @import "~/vendor/tooltipster.bundle"; @import "~/vendor/social-share-button/index"; diff --git a/app/javascript/front/notifier.js b/app/javascript/front/notifier.js index 8ad92e1a34..1f80e8b510 100644 --- a/app/javascript/front/notifier.js +++ b/app/javascript/front/notifier.js @@ -41,7 +41,7 @@ class Notifier { } } } else { - return console.log( + return console.warn( "Desktop notifications are not supported for this Browser/OS version yet." ); } diff --git a/app/javascript/front/topics.js b/app/javascript/front/topics.js index 98bd86c0b1..f93e5dcfef 100644 --- a/app/javascript/front/topics.js +++ b/app/javascript/front/topics.js @@ -1,7 +1,7 @@ import i18n from "~/homeland/i18n"; // TopicsController -window.Topics = { +window.Topics = window.Topics || { topic_id: null, user_liked_reply_ids: [], }; @@ -28,7 +28,6 @@ window.TopicView = Backbone.View.extend({ this.initComponents(); this.initCableUpdate(); - this.initContentImageZoom(); this.checkRepliesLikeStatus(); return this.itemsUpdated(); }, @@ -126,35 +125,6 @@ window.TopicView = Backbone.View.extend({ return this.unsetReplyTo(); }, - initContentImageZoom() { - const exceptClasses = ["emoji", "twemoji", "media-object avatar-16"]; - const imgEls = $(".markdown img"); - for (let el of Array.from(imgEls)) { - if (exceptClasses.indexOf($(el).attr("class")) === -1) { - $(el).wrap( - `` - ); - } - } - - // Bind click event - if (App.turbolinks || App.mobile) { - $("a.zoom-image").attr("target", "_blank"); - } else { - $("a.zoom-image").fluidbox({ - closeTrigger: [ - { - selector: "window", - event: "scroll", - }, - ], - }); - } - return true; - }, - preview(body) { $("#preview").text("Loading..."); @@ -174,6 +144,7 @@ window.TopicView = Backbone.View.extend({ preview_box.hide(); return $(".preview", switcher).click((e) => { + debugger; e.preventDefault(); const target = e.currentTarget; diff --git a/app/javascript/homeland/i18n.js.erb b/app/javascript/homeland/i18n.js similarity index 56% rename from app/javascript/homeland/i18n.js.erb rename to app/javascript/homeland/i18n.js index 5d78ddcdf5..8a4145d8c6 100644 --- a/app/javascript/homeland/i18n.js.erb +++ b/app/javascript/homeland/i18n.js @@ -1,8 +1,8 @@ /* eslint-disable */ import i18n from "i18next"; -const deepAssign = require('deep-assign'); -const metaLocale = document.querySelector('meta[name=locale]'); -const lang = (metaLocale && metaLocale.content || 'en').replace('-', '_'); +const deepAssign = import("deep-assign"); +const metaLocale = document.querySelector("meta[name=locale]"); +const lang = ((metaLocale && metaLocale.content) || "en").replace("-", "_"); i18n.init({ // we init with resources @@ -13,15 +13,17 @@ i18n.init({ "common.unlike": "Unlike", "common.follow_user": "Follow", "common.unfollow_user": "Followed", - "common.block_user_title": "Block this user, you will not see him topics.", + "common.block_user_title": + "Block this user, you will not see him topics.", "common.block_user": "Block", "common.unblock_user": "Unblock", - "common.block_node_title": "Block this node, you will not see topics in this node.", + "common.block_node_title": + "Block this node, you will not see topics in this node.", "common.block_node": "Block node", "common.unblock_node": "Unblock node", "common.favorite": "Favorite", - "common.unfavorite": "Unfavorite" - } + "common.unfavorite": "Unfavorite", + }, }, zh_CN: { translation: { @@ -29,18 +31,20 @@ i18n.init({ "common.unlike": "取消赞", "common.follow_user": "关注", "common.unfollow_user": "已关注", - "common.block_user_title": "屏蔽后，社区列表将不会出现此用户发布的内容。", + "common.block_user_title": + "屏蔽后，社区列表将不会出现此用户发布的内容。", "common.block_user": "屏蔽", "common.unblock_user": "取消屏蔽", - "common.block_node_title": "屏蔽后，社区列表将不会显示此节点有关的内容。", + "common.block_node_title": + "屏蔽后，社区列表将不会显示此节点有关的内容。", "common.block_node": "屏蔽节点", "common.unblock_node": "取消节点屏蔽", "common.favorite": "收藏", - "common.unfavorite": "取消收藏" - } - } - }, + "common.unfavorite": "取消收藏", + }, + }, + }, debug: false, - lng: lang + lng: lang, }); export default i18n; diff --git a/app/javascript/homeland/index.js b/app/javascript/homeland/index.js index aae812ca2f..2245e0ce08 100644 --- a/app/javascript/homeland/index.js +++ b/app/javascript/homeland/index.js @@ -1,11 +1,17 @@ +import { createConsumer } from "@rails/actioncable"; +import * as Rails from "@rails/ujs"; +import Backbone from "backbone"; import jQuery from "jquery"; -window.jQuery = jQuery; -window.$ = jQuery; -window.Backbone = require("backbone"); -window._ = require("underscore"); - import Turbolinks from "turbolinks"; import TubrolinksPrefetch from "turbolinks-prefetch"; +import * as Underscore from "underscore"; +import("dropzone"); +import("jquery.caret"); + +window.jQuery = jQuery; +window.$ = jQuery; +window.Backbone = Backbone; +window._ = Underscore; window.Turbolinks = Turbolinks; Turbolinks.start(); @@ -14,25 +20,19 @@ Turbolinks.setProgressBarDelay(200); Turbolinks.controller.cache.size = 30; TubrolinksPrefetch.start(); -window.Rails = require("@rails/ujs"); +window.Rails = Rails; Rails.start(); -require("~/pagination"); -require("~/jquery.timeago"); -require("~/jquery.timeago.settings"); -require("~/jquery.hotkeys"); -require("~/jquery.autogrow-textarea"); -require("~/tooltipster.bundle.min"); -require("~/dropzone"); -require("~/jquery.fluidbox.min"); -require("~/jquery.caret"); -require("~/jquery.atwho.min"); -require("~/google_analytics"); -require("~/jquery.infinitescroll.min"); -require("~/jquery.mobile-events"); -require("~/vendor/social-share-button"); +import("~/vendor/pagination"); +import("~/vendor/jquery.hotkeys"); +import("~/vendor/jquery.autogrow-textarea"); +import("~/vendor/tooltipster.bundle.min"); +import("~/vendor/jquery.atwho.min"); +import("~/vendor/jquery.infinitescroll.min"); +import("~/vendor/jquery.mobile-events"); +import("~/vendor/social-share-button"); -import { createConsumer } from "@rails/actioncable"; +import("./timeago.settings"); window.App = { turbolinks: false, diff --git a/app/javascript/homeland/index.scss b/app/javascript/homeland/index.scss index f8ba14e2be..af41ac2b10 100644 --- a/app/javascript/homeland/index.scss +++ b/app/javascript/homeland/index.scss @@ -423,6 +423,7 @@ body { font-size: 14px; } +.form-select, .form-control { background-color: var(--form-control-background-color); border-color: var(--form-control-border-color); diff --git a/app/javascript/homeland/timeago.settings.js b/app/javascript/homeland/timeago.settings.js new file mode 100644 index 0000000000..9f62e1c0cc --- /dev/null +++ b/app/javascript/homeland/timeago.settings.js @@ -0,0 +1,71 @@ +import("timeago"); + +const strings = { + "zh-CN": { + prefixAgo: null, + prefixFromNow: null, + suffixAgo: "前", + suffixFromNow: "刚刚", + seconds: "1 分钟", + minute: "约 1 分钟", + minutes: "%d 分钟", + hour: "1 小时", + hours: "%d 小时", + day: "1 天", + days: "%d 天", + month: "1 月", + months: "%d 月", + year: "1 年", + years: "%d 年", + numbers: [], + wordSeparator: "", + }, + en: { + prefixAgo: null, + prefixFromNow: null, + suffixAgo: "ago", + suffixFromNow: "one second", + seconds: "few seconds", + minute: "one minute", + minutes: "%d minutes", + hour: "one hour", + hours: "%d hours", + day: "one day", + days: "%d days", + month: "one month", + months: "%d months", + year: "one year", + years: "%d years", + numbers: [], + }, + "zh-TW": { + prefixAgo: null, + prefixFromNow: null, + suffixAgo: "前", + suffixFromNow: "剛剛", + seconds: "1 分鐘", + minute: "約 1 分鐘", + minutes: "%d 分鐘", + hour: "1 小時", + hours: "%d 小時", + day: "1 天", + days: "%d 天", + month: "1 月", + months: "%d 月", + year: "1 年", + years: "%d 年", + numbers: [], + wordSeparator: "", + }, +}; + +document.addEventListener("DOMContentLoaded", () => { + const localized = strings[App.locale]; + if (jQuery.timeago && localized) { + jQuery.timeago.settings.strings = localized; + // Display original dates older than 3 months. + jQuery.timeago.settings.cutoff = 1000 * 60 * 60 * 24 * 30 * 3; + + $("abbr.timeago").timeago(); + } +}); diff --git a/app/javascript/vendor/bootstrap.js b/app/javascript/vendor/bootstrap.js index 1ce9f7a4b0..f55f4c8664 100644 --- a/app/javascript/vendor/bootstrap.js +++ b/app/javascript/vendor/bootstrap.js @@ -1,15 +1,2 @@ import * as bootstrap from "bootstrap/dist/js/bootstrap.esm"; window.bootstrap = bootstrap; -require("bootstrap-select"); - -document.addEventListener("turbolinks:load", () => { - $("select.bootstrap-select").selectpicker({ - size: 10, - style: "btn-secondary", - }); -}); -document.addEventListener("turbolinks:before-cache", () => { - $("select.bootstrap-select") - .selectpicker("destroy") - .addClass("bootstrap-select"); -}); diff --git a/lib/assets/javascripts/jquery.atwho.min.js b/app/javascript/vendor/jquery.atwho.min.js similarity index 100% rename from lib/assets/javascripts/jquery.atwho.min.js rename to app/javascript/vendor/jquery.atwho.min.js diff --git a/lib/assets/javascripts/jquery.autogrow-textarea.js b/app/javascript/vendor/jquery.autogrow-textarea.js similarity index 100% rename from lib/assets/javascripts/jquery.autogrow-textarea.js rename to app/javascript/vendor/jquery.autogrow-textarea.js diff --git a/lib/assets/javascripts/jquery.fluidbox.min.js b/app/javascript/vendor/jquery.fluidbox.min.js similarity index 100% rename from lib/assets/javascripts/jquery.fluidbox.min.js rename to app/javascript/vendor/jquery.fluidbox.min.js diff --git a/lib/assets/javascripts/jquery.hotkeys.js b/app/javascript/vendor/jquery.hotkeys.js similarity index 100% rename from lib/assets/javascripts/jquery.hotkeys.js rename to app/javascript/vendor/jquery.hotkeys.js diff --git a/lib/assets/javascripts/jquery.infinitescroll.min.js b/app/javascript/vendor/jquery.infinitescroll.min.js similarity index 100% rename from lib/assets/javascripts/jquery.infinitescroll.min.js rename to app/javascript/vendor/jquery.infinitescroll.min.js diff --git a/lib/assets/javascripts/jquery.mobile-events.js b/app/javascript/vendor/jquery.mobile-events.js similarity index 100% rename from lib/assets/javascripts/jquery.mobile-events.js rename to app/javascript/vendor/jquery.mobile-events.js diff --git a/lib/assets/javascripts/jquery.qrcode.min.js b/app/javascript/vendor/jquery.qrcode.min.js similarity index 100% rename from lib/assets/javascripts/jquery.qrcode.min.js rename to app/javascript/vendor/jquery.qrcode.min.js diff --git a/lib/assets/javascripts/pagination.js b/app/javascript/vendor/pagination.js similarity index 100% rename from lib/assets/javascripts/pagination.js rename to app/javascript/vendor/pagination.js diff --git a/app/javascript/vendor/social-share-button/index.js b/app/javascript/vendor/social-share-button/index.js index 92e7123ae3..005d4b7d59 100644 --- a/app/javascript/vendor/social-share-button/index.js +++ b/app/javascript/vendor/social-share-button/index.js @@ -1,5 +1,5 @@ -require("~/jquery.qrcode.min"); -require("./wechat"); +import("~/vendor/jquery.qrcode.min"); +import("./wechat"); window.SocialShareButton = { openUrl(url, width, height) { diff --git a/app/javascript/vendor/social-share-button/wechat.js b/app/javascript/vendor/social-share-button/wechat.js index 6532853e58..cd837611f3 100644 --- a/app/javascript/vendor/social-share-button/wechat.js +++ b/app/javascript/vendor/social-share-button/wechat.js @@ -4,11 +4,12 @@ * DS207: Consider shorter variations of null checks * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md */ -//= require jquery.qrcode.min window.SocialShareWeChatButton = { init(opts) { - if (opts == null) { opts = {}; } + if (opts == null) { + opts = {}; + } const $wDialog = `
\
\ ${opts.header} \ @@ -25,34 +26,40 @@ ${opts.footer} \ bindEvents() { const $wContainer = $("#ss-wechat-dialog"); - return $wContainer.find(".wechat-popup-close").on("click", e => $wContainer.hide()); + return $wContainer + .find(".wechat-popup-close") + .on("click", (e) => $wContainer.hide()); }, qrcode(opts) { - if (opts == null) { opts = {}; } + if (opts == null) { + opts = {}; + } if (!$("#ss-wechat-dialog").length) { this.init(opts); this.bindEvents(); } - const $wBody = $('#ss-wechat-dialog-qr'); + const $wBody = $("#ss-wechat-dialog-qr"); $wBody.empty(); $wBody.qrcode({ width: 200, height: 200, - text: opts.url + text: opts.url, }); const $wContainer = $("#ss-wechat-dialog"); let top = ($(window).height() - $wContainer.height()) / 2; - if (top < 100) { top = 100; } + if (top < 100) { + top = 100; + } const left = ($(window).width() - $wContainer.width()) / 2; $wContainer.css({ top, - left + left, }); return $wContainer.show(); - } + }, }; diff --git a/lib/assets/javascripts/tooltipster.bundle.min.js b/app/javascript/vendor/tooltipster.bundle.min.js similarity index 100% rename from lib/assets/javascripts/tooltipster.bundle.min.js rename to app/javascript/vendor/tooltipster.bundle.min.js diff --git a/app/views/admin/dashboards/index.html.erb b/app/views/admin/dashboards/index.html.erb index 61ba107879..d1e0ef1b46 100644 --- a/app/views/admin/dashboards/index.html.erb +++ b/app/views/admin/dashboards/index.html.erb @@ -92,7 +92,7 @@
- <% end %> - <%= yield :scripts %> <%= paginate @notifications %> diff --git a/app/views/topics/_form.html.erb b/app/views/topics/_form.html.erb index 8a2ff1ee8f..00f31d74c2 100644 --- a/app/views/topics/_form.html.erb +++ b/app/views/topics/_form.html.erb @@ -2,10 +2,8 @@ <%= render "shared/error_messages", target: @topic %> <%= f.hidden_field :node_id %>
-
-
- <%= f.select :node_id, Node.sorted.name_options, {}, class: "bootstrap-select", data: { "live-search": true } %> -
+
+ <%= f.select :node_id, Node.sorted.name_options, {}, class: "form-select md:w-[200px]", data: { "live-search": true } %> <%= f.text_field :title, class: "form-control", placeholder: t("topics.form.title_placeholder") %>
diff --git a/app/views/topics/index.html.erb b/app/views/topics/index.html.erb index 829138fe81..d3686a3149 100644 --- a/app/views/topics/index.html.erb +++ b/app/views/topics/index.html.erb @@ -24,10 +24,10 @@ <% end %>
<% if current_user %> -