tilderadio
/
AzuraCast
mirror of https://github.com/AzuraCast/AzuraCast.git
4
0
Fork 0
Code Issues Releases Wiki Activity

Use common types for AzuraCast globals.

This commit is contained in:
Buster Neece 2022-12-20 03:47:37 -06:00
parent 4c61d6288a
commit a122e90cd8
No known key found for this signature in database
GPG Key ID: F1D2E64A0005E80E
19 changed files with 116 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/vue/components/Admin/AuditLog.vue
View File

@ -87,6 +87,7 @@ import Icon from "~/components/Common/Icon";
import DataTable from "~/components/Common/DataTable";
import DateRangeDropdown from "~/components/Common/DateRangeDropdown";
import {DateTime} from 'luxon';
import useAzuraCast from "~/vendor/azuracast";
export default {
name: 'AdminAuditLog',
@ -135,8 +136,10 @@ export default {
this.$refs.datatable.relist();
},
formatTimestamp(unix_timestamp) {
const {timeConfig} = useAzuraCast();
return DateTime.fromSeconds(unix_timestamp).toLocaleString(
{...DateTime.DATETIME_SHORT, ...App.time_config}
{...DateTime.DATETIME_SHORT, timeConfig}
);
}
}

5
frontend/vue/components/Admin/Backups.vue
View File

@ -116,6 +116,7 @@ import formatFileSize from "~/functions/formatFileSize";
import AdminBackupsConfigureModal from "~/components/Admin/Backups/ConfigureModal";
import AdminBackupsRunBackupModal from "~/components/Admin/Backups/RunBackupModal";
import EnabledBadge from "~/components/Common/Badges/EnabledBadge.vue";
import useAzuraCast from "~/vendor/azuracast";
export default {
name: 'AdminBackups',
@ -186,8 +187,10 @@ export default {
return DateTime.fromSeconds(timestamp).toRelative();
},
toLocaleTime(timestamp) {
const {timeConfig} = useAzuraCast();
return DateTime.fromSeconds(timestamp).toLocaleString(
{...DateTime.DATETIME_SHORT, ...App.time_config}
{...DateTime.DATETIME_SHORT, timeConfig}
);
},
formatFileSize(size) {

6
frontend/vue/components/Common/CodemirrorTextarea.vue
View File

@ -8,6 +8,7 @@ import {useVModel} from "@vueuse/core";
import {computed} from "vue";
import {css} from "@codemirror/lang-css";
import {javascript} from "@codemirror/lang-javascript";
import useAzuraCast from "~/vendor/azuracast";
const props = defineProps({
modelValue: String,
@ -27,9 +28,10 @@ const lang = computed(() => {
return null;
});
const {theme} = useAzuraCast();
const dark = computed(() => {
console.log(App.theme);
return App.theme === 'dark';
return theme === 'dark';
})
</script>

5
frontend/vue/components/Common/FlowUpload.vue
View File

@ -73,6 +73,7 @@ import Icon from './Icon';
import _ from 'lodash';
import {computed, onMounted, onUnmounted, reactive, ref} from "vue";
import Flow from "@flowjs/flow.js";
import useAzuraCast from "~/vendor/azuracast";
const props = defineProps({
targetUrl: String,
@ -131,6 +132,8 @@ const files = reactive({
const file_browse_target = ref(); // Template Ref
const file_drop_target = ref(); // Template Ref
const {apiCsrf} = useAzuraCast();
onMounted(() => {
let defaultConfig = {
target: () => {
@ -139,7 +142,7 @@ onMounted(() => {
singleFile: !props.allowMultiple,
headers: {
'Accept': 'application/json',
'X-API-CSRF': App.api_csrf
'X-API-CSRF': apiCsrf
},
withCredentials: true,
allowDuplicateUploads: true,

7
frontend/vue/components/Common/ScheduleView.vue
View File

@ -9,6 +9,7 @@ import allLocales from '@fullcalendar/core/locales-all';
import luxon2Plugin from '@fullcalendar/luxon2';
import timeGridPlugin from '@fullcalendar/timegrid';
import {shallowRef} from "vue";
import useAzuraCast from "~/vendor/azuracast";
const props = defineProps({
scheduleUrl: String,
@ -34,8 +35,10 @@ const onEventClick = (arg) => {
emit('click', arg.event);
};
const {localeShort, timeConfig} = useAzuraCast();
const calendarOptions = shallowRef({
locale: App.locale_short,
locale: localeShort,
locales: allLocales,
plugins: [luxon2Plugin, timeGridPlugin],
initialView: 'timeGridWeek',
@ -52,7 +55,7 @@ const calendarOptions = shallowRef({
views: {
timeGridWeek: {
slotLabelFormat: {
...App.time_config,
...timeConfig,
hour: 'numeric',
minute: '2-digit',
omitZeroMinute: true,

42
frontend/vue/components/InlinePlayer.vue
View File

@ -22,7 +22,7 @@
</a>
<div class="inline-volume-controls d-inline-flex align-items-center ml-1">
<div class="flex-shrink-0">
<a class="btn btn-sm btn-outline-light px-2" href="#" @click.prevent="volume = 0"
<a class="btn btn-sm btn-outline-light px-2" href="#" @click.prevent="mute"
:aria-label="$gettext('Mute')">
<icon icon="volume_mute"></icon>
</a>
@ -33,7 +33,7 @@
step="1" v-model="volume">
</div>
<div class="flex-shrink-0">
<a class="btn btn-sm btn-outline-light px-2" href="#" @click.prevent="volume = 100"
<a class="btn btn-sm btn-outline-light px-2" href="#" @click.prevent="fullVolume"
:aria-label="$gettext('Full Volume')">
<icon icon="volume_up"></icon>
</a>
@ -65,11 +65,11 @@
</style>
<script setup>
import AudioPlayer from '~/components/Common/AudioPlayer';
import AudioPlayer from '~/components/Common/AudioPlayer.vue';
import formatTime from '~/functions/formatTime.js';
import Icon from '~/components/Common/Icon';
import Icon from '~/components/Common/Icon.vue';
import {usePlayerStore} from "~/store.js";
import {get, set, useMounted, useStorage} from "@vueuse/core";
import {useMounted, useStorage} from "@vueuse/core";
import {computed, ref, toRef} from "vue";
const store = usePlayerStore();
@ -79,42 +79,30 @@ const current = toRef(store, 'current');
const volume = useStorage('player_volume', 55);
const isMuted = useStorage('player_is_muted', false);
const isMounted = useMounted();
const player = ref(); // Template ref
const player = ref(); // AudioPlayer
const duration = computed(() => {
if (!get(isMounted)) {
return;
}
return get(player).getDuration();
return player.value?.getDuration();
});
const durationText = computed(() => {
return formatTime(get(duration));
return formatTime(duration.value);
});
const currentTime = computed(() => {
if (!get(isMounted)) {
return;
}
return get(player).getCurrentTime();
return player.value?.getCurrentTime();
});
const currentTimeText = computed(() => {
return formatTime(get(currentTime));
return formatTime(currentTime.value);
});
const progress = computed({
get: () => {
if (!get(isMounted)) {
return;
}
return get(player).getProgress();
return player.value?.getProgress();
},
set: (prog) => {
get(player).setProgress(prog);
player.value?.setProgress(prog);
}
});
@ -127,6 +115,10 @@ const stop = () => {
};
const mute = () => {
set(isMuted, !get(isMuted));
isMuted.value = !isMuted.value;
};
const fullVolume = () => {
volume.value = 100;
};
</script>

6
frontend/vue/components/Stations/Media.vue
View File

@ -164,6 +164,7 @@ import PlayButton from "~/components/Common/PlayButton";</script>
import formatFileSize from '~/functions/formatFileSize.js';
import _ from 'lodash';
import {DateTime} from 'luxon';
import useAzuraCast from "~/vendor/azuracast";
export default {
props: {
@ -252,8 +253,11 @@ export default {
if (!value) {
return '';
}
const {timeConfig} = useAzuraCast();
return DateTime.fromSeconds(value).setZone(this.stationTimeZone).toLocaleString(
{...DateTime.DATETIME_MED, ...App.time_config}
{...DateTime.DATETIME_MED, ...timeConfig}
);
},
selectable: true,

9
frontend/vue/components/Stations/Playlists.vue
View File

@ -142,6 +142,7 @@ import Icon from '~/components/Common/Icon';
import CloneModal from './Playlists/CloneModal';
import {DateTime} from 'luxon';
import humanizeDuration from 'humanize-duration';
import useAzuraCast from "~/vendor/azuracast";
export default {
name: 'StationPlaylists',
@ -198,14 +199,18 @@ export default {
: this.$gettext('Enable');
},
formatTime (time) {
const {timeConfig} = useAzuraCast();
return DateTime.fromSeconds(time).setZone(this.stationTimeZone).toLocaleString(
{...DateTime.DATETIME_MED, ...App.time_config}
{...DateTime.DATETIME_MED, ...timeConfig}
);
},
formatLength (length) {
const {localeShort} = useAzuraCast();
return humanizeDuration(length * 1000, {
round: true,
language: App.locale_short,
language: localeShort,
fallbacks: ['en']
});
},

11
frontend/vue/components/Stations/Profile/SchedulePanel.vue
View File

@ -49,12 +49,15 @@ export default {
import {DateTime} from "luxon";
import _ from "lodash";
import {computed} from "vue";
import useAzuraCast from "~/vendor/azuracast";
const props = defineProps({
scheduleItems: Array,
stationTimeZone: String
});
const {timeConfig} = useAzuraCast();
const processedScheduleItems = computed(() => {
const now = DateTime.now().setZone(props.stationTimeZone);
@ -66,21 +69,21 @@ const processedScheduleItems = computed(() => {
if (start_moment.hasSame(now, 'day')) {
row.start_formatted = start_moment.toLocaleString(
{...DateTime.TIME_SIMPLE, ...App.time_config}
{...DateTime.TIME_SIMPLE, ...timeConfig}
);
} else {
row.start_formatted = start_moment.toLocaleString(
{...DateTime.DATETIME_MED, ...App.time_config}
{...DateTime.DATETIME_MED, ...timeConfig}
);
}
if (end_moment.hasSame(start_moment, 'day')) {
row.end_formatted = end_moment.toLocaleString(
{...DateTime.TIME_SIMPLE, ...App.time_config}
{...DateTime.TIME_SIMPLE, ...timeConfig}
);
} else {
row.end_formatted = end_moment.toLocaleString(
{...DateTime.DATETIME_MED, ...App.time_config}
{...DateTime.DATETIME_MED, ...timeConfig}
);
}

5
frontend/vue/components/Stations/Queue.vue
View File

@ -57,6 +57,7 @@ import DataTable from '../Common/DataTable';
import QueueLogsModal from './Queue/LogsModal';
import Icon from "~/components/Common/Icon";
import {DateTime} from 'luxon';
import useAzuraCast from "~/vendor/azuracast";
export default {
name: 'StationQueue',
@ -78,8 +79,10 @@ export default {
},
methods: {
formatTime(time) {
const {timeConfig} = useAzuraCast();
return this.getDateTime(time).toLocaleString(
{...DateTime.TIME_WITH_SECONDS, ...App.time_config}
{...DateTime.TIME_WITH_SECONDS, ...timeConfig}
);
},
formatRelativeTime(time) {

5
frontend/vue/components/Stations/Reports/Listeners/InnerMap.vue
View File

@ -16,6 +16,7 @@
<script setup>
import {onMounted, provide, ref, shallowRef} from "vue";
import L from "leaflet";
import useAzuraCast from "~/vendor/azuracast";
const props = defineProps({
attribution: String
@ -26,6 +27,8 @@ const $map = shallowRef();
provide('map', $map);
const {theme} = useAzuraCast();
onMounted(() => {
// Fix issue with Leaflet icons being built in Webpack
// https://github.com/Leaflet/Leaflet/issues/4968
@ -47,7 +50,7 @@ onMounted(() => {
const tileAttribution = 'Map tiles by Carto, under CC BY 3.0. Data by OpenStreetMap, under ODbL.';
L.tileLayer(tileUrl, {
theme: App.theme,
theme: theme,
attribution: tileAttribution,
}).addTo(map);

5
frontend/vue/components/Stations/Reports/Requests.vue
View File

@ -55,6 +55,7 @@
import DataTable from '~/components/Common/DataTable';
import Icon from "~/components/Common/Icon";
import {DateTime} from 'luxon';
import useAzuraCast from "~/vendor/azuracast";
export default {
name: 'StationRequests',
@ -102,8 +103,10 @@ export default {
this.$refs.datatable.refresh();
},
formatTime(time) {
const {timeConfig} = useAzuraCast();
return DateTime.fromSeconds(time).setZone(this.stationTimeZone).toLocaleString(
{...DateTime.DATETIME_MED, ...App.time_config}
{...DateTime.DATETIME_MED, ...timeConfig}
);
},
doDelete(url) {

9
frontend/vue/components/Stations/Reports/Timeline.vue
View File

@ -82,6 +82,7 @@ import Icon from "~/components/Common/Icon";
import DataTable from "~/components/Common/DataTable";
import DateRangeDropdown from "~/components/Common/DateRangeDropdown";
import {DateTime} from 'luxon';
import useAzuraCast from "~/vendor/azuracast";
export default {
name: 'StationsReportsTimeline',
@ -167,13 +168,17 @@ export default {
return Math.abs(val);
},
formatTimestamp(unix_timestamp) {
const {timeConfig} = useAzuraCast();
return DateTime.fromSeconds(unix_timestamp).toLocaleString(
{...DateTime.DATETIME_SHORT, ...App.time_config}
{...DateTime.DATETIME_SHORT, ...timeConfig}
);
},
formatTimestampStation(unix_timestamp) {
const {timeConfig} = useAzuraCast();
return DateTime.fromSeconds(unix_timestamp).setZone(this.stationTimeZone).toLocaleString(
{...DateTime.DATETIME_SHORT, ...App.time_config}
{...DateTime.DATETIME_SHORT, ...timeConfig}
);
}
}

10
frontend/vue/components/Stations/Streamers/BroadcastsModal.vue
View File

@ -43,6 +43,7 @@ import Icon from '~/components/Common/Icon';
import PlayButton from "~/components/Common/PlayButton";
import {DateTime} from 'luxon';
import '~/vendor/sweetalert.js';
import useAzuraCast from "~/vendor/azuracast";
export default {
name: 'StreamerBroadcastsModal',
@ -62,8 +63,10 @@ export default {
label: this.$gettext('Start Time'),
sortable: false,
formatter: (value) => {
const {timeConfig} = useAzuraCast();
return DateTime.fromSeconds(value).toLocaleString(
{...DateTime.DATETIME_MED, ...App.time_config}
{...DateTime.DATETIME_MED, ...timeConfig}
);
},
class: 'pl-3'
@ -76,8 +79,11 @@ export default {
if (value === 0) {
return this.$gettext('Live');
}
const {timeConfig} = useAzuraCast();
return DateTime.fromSeconds(value).toLocaleString(
{...DateTime.DATETIME_MED, ...App.time_config}
{...DateTime.DATETIME_MED, ...timeConfig}
);
}
},

7
frontend/vue/pages/InlinePlayer.js
View File

@ -2,13 +2,16 @@ import {createApp} from 'vue';
import InlinePlayer from '~/components/InlinePlayer.vue';
import installPinia from '../vendor/pinia';
import gettext from "../vendor/gettext";
import useAzuraCast from "~/vendor/azuracast";
document.addEventListener('DOMContentLoaded', function () {
const inlineApp = createApp(InlinePlayer);
/* Gettext */
if (typeof App.locale !== 'undefined') {
inlineApp.config.language = App.locale;
const {locale} = useAzuraCast();
if (typeof locale !== 'undefined') {
inlineApp.config.language = locale;
}
inlineApp.use(gettext);

7
frontend/vue/vendor/axios.js vendored
View File

@ -2,6 +2,7 @@ import axios from "axios";
import VueAxios from "vue-axios";
import gettext from "~/vendor/gettext";
import {inject} from "vue";
import useAzuraCast from "~/vendor/azuracast";
/* Composition API Axios utilities */
export function useAxios() {
@ -12,8 +13,10 @@ export function useAxios() {
export default function installAxios(vueApp) {
// Configure auto-CSRF on requests
if (typeof App.api_csrf !== 'undefined') {
axios.defaults.headers.common['X-API-CSRF'] = App.api_csrf;
const {apiCsrf} = useAzuraCast();
if (typeof apiCsrf !== 'undefined') {
axios.defaults.headers.common['X-API-CSRF'] = apiCsrf;
}
vueApp.use(VueAxios, axios);

14
frontend/vue/vendor/azuracast.js vendored Normal file
View File

@ -0,0 +1,14 @@
export default function useAzuraCast() {
return {
lang: {
confirm: App.lang.confirm ?? 'Are you sure?',
advanced: App.lang.advanced ?? 'Advanced'
},
locale: App.locale ?? 'en_US',
localeShort: App.locale_short ?? 'en',
localeWithDashes: App.locale_with_dashes ?? 'en-US',
timeConfig: App.time_config ?? {},
apiCsrf: App.api_csrf ?? null,
theme: App.theme ?? 'light'
}
}

5
frontend/vue/vendor/gettext.js vendored
View File

@ -1,8 +1,11 @@
import translations from "../../../translations/translations.json";
import {createGettext} from "vue3-gettext";
import useAzuraCast from "~/vendor/azuracast";
const {locale} = useAzuraCast();
export default createGettext({
defaultLanguage: App.locale,
defaultLanguage: locale,
translations: translations,
silent: true
});

7
frontend/vue/vendor/luxon.js vendored
View File

@ -1,8 +1,9 @@
import {Settings} from 'luxon';
import useAzuraCast from "~/vendor/azuracast";
const {localeWithDashes} = useAzuraCast();
document.addEventListener('DOMContentLoaded', function () {
Settings.defaultLocale = App.locale_with_dashes;
Settings.defaultZoneName = 'UTC';
Settings.defaultLocale = localeWithDashes;
Settings.defaultZoneName = 'UTC';
});