04a63cfaaa
This commit also: - removes [+ New Topic] behaviour from share, this feature has been duplicated in composer actions, months ago - introduces our new experimental spacing standard for css: eg: `s(2)` - introduces a new panel UI for modals
97 lines
2.9 KiB
JavaScript
97 lines
2.9 KiB
JavaScript
import { isAppleDevice } from "discourse/lib/utilities";
|
|
|
|
export default function(name, opts) {
|
|
opts = opts || {};
|
|
const container = Discourse.__container__;
|
|
|
|
// iOS 11 -> 11.1 have broken INPUTs on position fixed
|
|
// if for any reason there is a body higher than 100% behind them.
|
|
// What happens is that when INPUTs gets focus they shift the body
|
|
// which ends up moving the cursor to an invisible spot
|
|
// this makes the login experience on iOS painful, user thinks it is broken.
|
|
//
|
|
// Also, very little value in showing main outlet and header on iOS
|
|
// anyway, so just hide it.
|
|
if (isAppleDevice()) {
|
|
let pos = $(window).scrollTop();
|
|
$(window)
|
|
.off("show.bs.modal.ios-hacks")
|
|
.on("show.bs.modal.ios-hacks", () => {
|
|
$("#main-outlet, header").hide();
|
|
});
|
|
|
|
$(window)
|
|
.off("hide.bs.modal.ios-hacks")
|
|
.on("hide.bs.modal.ios-hacks", () => {
|
|
$("#main-outlet, header").show();
|
|
$(window).scrollTop(pos);
|
|
|
|
$(window).off("hide.bs.modal.ios-hacks");
|
|
$(window).off("show.bs.modal.ios-hacks");
|
|
});
|
|
}
|
|
|
|
// We use the container here because modals are like singletons
|
|
// in Discourse. Only one can be shown with a particular state.
|
|
const route = container.lookup("route:application");
|
|
const modalController = route.controllerFor("modal");
|
|
|
|
modalController.set("modalClass", opts.modalClass);
|
|
|
|
const controllerName = opts.admin ? `modals/${name}` : name;
|
|
modalController.set("name", controllerName);
|
|
|
|
let controller = container.lookup("controller:" + controllerName);
|
|
const templateName = opts.templateName || Ember.String.dasherize(name);
|
|
|
|
const renderArgs = { into: "modal", outlet: "modalBody" };
|
|
if (controller) {
|
|
renderArgs.controller = controllerName;
|
|
} else {
|
|
// use a basic controller
|
|
renderArgs.controller = "basic-modal-body";
|
|
controller = container.lookup(`controller:${renderArgs.controller}`);
|
|
}
|
|
|
|
if (opts.addModalBodyView) {
|
|
renderArgs.view = "modal-body";
|
|
}
|
|
|
|
const modalName = `modal/${templateName}`;
|
|
const fullName = opts.admin ? `admin/templates/${modalName}` : modalName;
|
|
route.render(fullName, renderArgs);
|
|
if (opts.title) {
|
|
modalController.set("title", I18n.t(opts.title));
|
|
}
|
|
|
|
if (opts.panels) {
|
|
modalController.setProperties({
|
|
panels: opts.panels,
|
|
selectedPanel: opts.panels[0]
|
|
});
|
|
|
|
if (controller.actions.onSelectPanel) {
|
|
modalController.set("onSelectPanel", controller.actions.onSelectPanel);
|
|
}
|
|
|
|
modalController.set(
|
|
"modalClass",
|
|
`${modalController.get("modalClass")} has-tabs`
|
|
);
|
|
} else {
|
|
modalController.setProperties({ panels: [], selectedPanel: null });
|
|
}
|
|
|
|
controller.set("modal", modalController);
|
|
const model = opts.model;
|
|
if (model) {
|
|
controller.set("model", model);
|
|
}
|
|
if (controller.onShow) {
|
|
controller.onShow();
|
|
}
|
|
controller.set("flashMessage", null);
|
|
|
|
return controller;
|
|
}
|