Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: replace lightbox loading text with spinner (#7393)

This commit is contained in:
Joe 2019-04-17 10:24:03 -07:00 committed by GitHub
parent 7cd621778d
commit ee808dc682
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/assets/javascripts/discourse/lib/lightbox.js.es6
View File

@ -2,6 +2,7 @@ import loadScript from "discourse/lib/load-script";
import { escapeExpression } from "discourse/lib/utilities"; import { escapeExpression } from "discourse/lib/utilities";
import { renderIcon } from "discourse-common/lib/icon-library"; import { renderIcon } from "discourse-common/lib/icon-library";
import { isAppWebview, postRNWebviewMessage } from "discourse/lib/utilities"; import { isAppWebview, postRNWebviewMessage } from "discourse/lib/utilities";
import { spinnerHTML } from "discourse/helpers/loading-spinner";
export default function($elem) { export default function($elem) {
if (!$elem) { if (!$elem) {
@ -10,6 +11,7 @@ export default function($elem) {
loadScript("/javascripts/jquery.magnific-popup.min.js").then(function() { loadScript("/javascripts/jquery.magnific-popup.min.js").then(function() {
const spoilers = $elem.find(".spoiler a.lightbox, .spoiled a.lightbox"); const spoilers = $elem.find(".spoiler a.lightbox, .spoiled a.lightbox");
$elem $elem
.find("a.lightbox") .find("a.lightbox")
.not(spoilers) .not(spoilers)
@ -18,6 +20,8 @@ export default function($elem) {
closeOnContentClick: false, closeOnContentClick: false,
removalDelay: 300, removalDelay: 300,
mainClass: "mfp-zoom-in", mainClass: "mfp-zoom-in",
tClose: I18n.t("lightbox.close"),
tLoading: spinnerHTML,
gallery: { gallery: {
enabled: true, enabled: true,
@ -26,8 +30,6 @@ export default function($elem) {
tCounter: I18n.t("lightbox.counter") tCounter: I18n.t("lightbox.counter")
}, },
tClose: I18n.t("lightbox.close"),
tLoading: I18n.t("lightbox.loading"),
ajax: { ajax: {
tError: I18n.t("lightbox.content_load_error") tError: I18n.t("lightbox.content_load_error")
}, },

4
app/assets/stylesheets/common/base/lightbox.scss
View File

@ -100,3 +100,7 @@ $meta-element-margin: 6px;
} }
} }
} }
.mfp-preloader .spinner {
margin: auto;
}

1
config/locales/client.en.yml
View File

@ -2806,7 +2806,6 @@ en:
next: "Next (Right arrow key)" next: "Next (Right arrow key)"
counter: "%curr% of %total%" counter: "%curr% of %total%"
close: "Close (Esc)" close: "Close (Esc)"
loading: "Loading…"
content_load_error: '<a href="%url%">The content</a> could not be loaded.' content_load_error: '<a href="%url%">The content</a> could not be loaded.'
image_load_error: '<a href="%url%">The image</a> could not be loaded.' image_load_error: '<a href="%url%">The image</a> could not be loaded.'