150 lines
2.9 KiB
JavaScript
150 lines
2.9 KiB
JavaScript
import config from 'config';
|
|
import { createApp } from 'vue';
|
|
import dayjs from 'dayjs';
|
|
import mitt from 'mitt';
|
|
import tippy from 'tippy.js';
|
|
|
|
import router from './router';
|
|
import initStore from './store';
|
|
import initUiObservers from './ui/observers';
|
|
import initAuthObservers from './auth/observers';
|
|
|
|
import { formatDate, formatDuration } from './format';
|
|
|
|
import '../css/style.scss';
|
|
import 'tippy.js/dist/tippy.css';
|
|
|
|
import Container from '../components/container/container.vue';
|
|
import Icon from '../components/icon/icon.vue';
|
|
import Footer from '../components/footer/footer.vue';
|
|
import Tooltip from '../components/tooltip/tooltip.vue';
|
|
import Dialog from '../components/dialog/dialog.vue';
|
|
|
|
async function init() {
|
|
let uid = 0;
|
|
|
|
const store = initStore(router);
|
|
const app = createApp(Container);
|
|
const events = mitt();
|
|
|
|
function getBasePath(media, type, options) {
|
|
if (store.state.ui.sfw) {
|
|
return config.media.assetPath;
|
|
}
|
|
|
|
if (media.isS3) {
|
|
return config.media.s3Path;
|
|
}
|
|
|
|
if (options?.local) {
|
|
return config.media.assetPath;
|
|
}
|
|
|
|
return config.media.mediaPath;
|
|
}
|
|
|
|
function getFilename(media, type, options) {
|
|
if (store.state.ui.sfw && type && !options?.original) {
|
|
return media.sfw[type];
|
|
}
|
|
|
|
if (store.state.ui.sfw) {
|
|
return media.sfw.path;
|
|
}
|
|
|
|
if (type && !options?.original) {
|
|
return media[type];
|
|
}
|
|
|
|
return media.path;
|
|
}
|
|
|
|
function getPath(media, type, options) {
|
|
if (!media) {
|
|
return null;
|
|
}
|
|
|
|
const path = getBasePath(media, type, options);
|
|
const filename = getFilename(media, type, options);
|
|
|
|
return `${path}/${filename}`;
|
|
}
|
|
|
|
await initAuthObservers(store, router);
|
|
await initUiObservers(store, router);
|
|
|
|
if (window.env.sfw) {
|
|
store.dispatch('setSfw', true);
|
|
}
|
|
|
|
app.use(store);
|
|
app.use(router);
|
|
|
|
await router.isReady();
|
|
|
|
app.mixin({
|
|
components: {
|
|
Icon,
|
|
Footer,
|
|
Tooltip,
|
|
'v-popover': Tooltip,
|
|
Dialog,
|
|
},
|
|
data() {
|
|
return {
|
|
events,
|
|
config,
|
|
};
|
|
},
|
|
computed: {
|
|
theme() { return this.$store.state.ui.theme; },
|
|
},
|
|
watch: {
|
|
pageTitle(title) {
|
|
if (title) {
|
|
document.title = `traxxx - ${title}`;
|
|
return;
|
|
}
|
|
|
|
document.title = 'traxxx';
|
|
},
|
|
},
|
|
beforeCreate() {
|
|
this.uid = uid;
|
|
uid += 1;
|
|
},
|
|
methods: {
|
|
formatDate,
|
|
formatDuration,
|
|
isAfter: (dateA, dateB) => dayjs(dateA).isAfter(dateB),
|
|
isBefore: (dateA, dateB) => dayjs(dateA).isBefore(dateB),
|
|
getPath,
|
|
getBgPath: (media, type) => `url(${getPath(media, type)})`,
|
|
},
|
|
});
|
|
|
|
app.directive('tooltip', {
|
|
beforeMount(el, binding) {
|
|
if (!binding.value) {
|
|
return;
|
|
}
|
|
|
|
// don't include HTML in native title attribute
|
|
const textEl = document.createElement('div');
|
|
textEl.innerHTML = binding.value;
|
|
|
|
el.title = textEl.textContent; // eslint-disable-line no-param-reassign
|
|
|
|
tippy(el, {
|
|
content: binding.value,
|
|
allowHTML: true,
|
|
duration: [0, 0],
|
|
});
|
|
},
|
|
});
|
|
|
|
app.mount('#container');
|
|
}
|
|
|
|
init();
|