Skip to content

Commit

Permalink
Improve visuals
Browse files Browse the repository at this point in the history
  • Loading branch information
@DIDIRUS4
DIDIRUS4 committed Jul 16, 2024
1 parent d8301fa commit ffab18c
Show file tree
Hide file tree
Showing 2 changed files with 61 additions and 34 deletions.
66 changes: 46 additions & 20 deletions apps/app-frontend/src/App.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,20 @@ import SplashScreen from '@/components/ui/SplashScreen.vue'
import ModrinthLoadingIndicator from '@/components/modrinth-loading-indicator'
import { handleError, useNotifications } from '@/store/notifications.js'
import { command_listener, offline_listener, warning_listener } from '@/helpers/events.js'
import { ArrowLeftFromLineIcon, ArrowRightFromLineIcon, ChatIcon, MaximizeIcon, MinimizeIcon } from '@/assets/icons'
import {
ArrowLeftFromLineIcon,
ArrowRightFromLineIcon,
ChatIcon,
MaximizeIcon,
MinimizeIcon,
} from '@/assets/icons'
import { getOS, isDev, isOffline, showLauncherLogsFolder } from '@/helpers/utils.js'
import { mixpanel_init, mixpanel_is_loaded, mixpanel_opt_out_tracking, mixpanel_track } from '@/helpers/mixpanel.js'
import {
mixpanel_init,
mixpanel_is_loaded,
mixpanel_opt_out_tracking,
mixpanel_track,
} from '@/helpers/mixpanel.js'
import { useDisableClicks } from '@/composables/click.js'
import { openExternal } from '@/helpers/external.js'
import { await_sync, check_safe_loading_bars_complete } from '@/helpers/state.js'
Expand Down Expand Up @@ -67,6 +78,7 @@ const os = ref('')
const instances = useInstances()
const { instancesByPlayed } = storeToRefs(instances)
watch(() => instances)
defineExpose({
initialize: async () => {
Expand All @@ -78,9 +90,8 @@ defineExpose({
opt_out_analytics,
collapsed_navigation,
advanced_rendering,
fully_onboarded
} =
await get()
fully_onboarded,
} = await get()
// video should play if the user is not on linux, and has not onboarded
os.value = await getOS()
// videoPlaying.value = !fully_onboarded && os.value !== 'Linux'
Expand All @@ -98,7 +109,10 @@ defineExpose({
mixpanel_init('014c7d6a336d0efaefe3aca91063748d', { debug: dev, persistence: 'localStorage' })
if (opt_out_analytics) {
console.info('[AR • Hard Disable Patch] • OPT_OUT_ANALYTICS (DISABLED) status is ', opt_out_analytics)
console.info(
'[AR • Hard Disable Patch] • OPT_OUT_ANALYTICS (DISABLED) status is ',
opt_out_analytics,
)
mixpanel_opt_out_tracking()
}
mixpanel_track('Launched', { version, dev, fully_onboarded })
Expand All @@ -120,8 +134,8 @@ defineExpose({
notificationsWrapper.value.addNotification({
title: 'Warning',
text: e.message,
type: 'warn'
})
type: 'warn',
}),
)
// if (showOnboarding.value) {
Expand All @@ -132,16 +146,16 @@ defineExpose({
isLoading.value = false
failureText.value = e
os.value = await getOS()
}
},
})
const confirmClose = async () => {
const confirmed = await confirm(
'An action is currently in progress. Are you sure you want to exit?',
{
title: 'AstralRinth',
type: 'warning'
}
type: 'warning',
},
)
return confirmed
}
Expand All @@ -156,7 +170,7 @@ const handleClose = async () => {
// (Exception: if the user is changing config directory, which takes control of the state, and it's taking a significant amount of time for some reason)
const isSafe = await Promise.race([
check_safe_loading_bars_complete(),
new Promise((r) => setTimeout(r, 2000))
new Promise((r) => setTimeout(r, 2000)),
])
if (!isSafe) {
const response = await confirmClose()
Expand Down Expand Up @@ -203,7 +217,7 @@ command_listener(async (e) => {
if (e.path.endsWith('.mrpack')) {
await install_from_file(e.path).catch(handleError)
mixpanel_track('InstanceCreate', {
source: 'CreationModalFileDrop'
source: 'CreationModalFileDrop',
})
}
} else {
Expand All @@ -215,6 +229,19 @@ command_listener(async (e) => {
const toggleSidebar = () => {
sidebarOpen.value = !sidebarOpen.value
}
async function openInstance(instance) {
const instancePath = `/instance/${encodeURIComponent(instance.path)}/`
if (route.path.startsWith('/instance')) {
await router.replace({ path: `/library` }).then(() => {
setTimeout(() => {
router.replace({ path: instancePath }).catch(() => { })
}, 128)
})
} else {
router.push({ path: instancePath })
}
}
</script>

<template>
Expand All @@ -241,8 +268,8 @@ const toggleSidebar = () => {
</h3>
</div>
<div class="error-div">
AstralRinth App failed to load correctly. This may be because of a corrupted file, or because
the app is missing crucial files.
AstralRinth App failed to load correctly. This may be because of a corrupted file, or
because the app is missing crucial files.
</div>
<div class="error-div">You may be able to fix it one of the following ways:</div>
<ul class="error-div">
Expand Down Expand Up @@ -310,12 +337,11 @@ const toggleSidebar = () => {
<hr />
</div>
<div class="instances pages-list">
<!-- FIXME: Fix visual issuesin future... maybe :D -->
<RouterLink v-for="instance in instancesByPlayed" :key="instance.id"
:to="`/instance/${encodeURIComponent(instance.path)}`" class="btn icon-only collapsed-button">
<Button v-for="instance in instancesByPlayed" :key="instance.id" @click="openInstance(instance)"
style="display: inline-flex; background-color: transparent" class="collapsed-button">
<Avatar class="collapsed-avatar__icon" :src="iconPathAsUrl(instance.metadata?.icon)" size="xl" />
<span class="collapsed-button__label">{{ instance.metadata.name }}</span>
</RouterLink>
</Button>
</div>
<div class="divider">
<hr />
Expand Down Expand Up @@ -728,4 +754,4 @@ const toggleSidebar = () => {
padding: var(--gap-sm) 0;
}
}
</style>
</style>
29 changes: 15 additions & 14 deletions apps/app-frontend/src/components/ui/ExportModal.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ import { export_profile_mrpack, get_pack_export_candidates } from '@/helpers/pro
import { open } from '@tauri-apps/api/dialog'
import { handleError } from '@/store/notifications.js'
import { useTheming } from '@/store/theme'
import { i18n } from '@/main.js';
const t = i18n.global.t;
import { i18n } from '@/main.js'
const t = i18n.global.t
const props = defineProps({
instance: {
type: Object,
Expand Down Expand Up @@ -110,17 +110,22 @@ const exportPack = async () => {
<Modal ref="exportModal" header="Export modpack" :noblur="!themeStore.advancedRendering">
<div class="modal-body">
<div class="labeled_input">
<p>{{ t('ExportModal.ModpackName')}}</p>
<p>{{ t('ExportModal.ModpackName') }}</p>
<div class="iconified-input">
<PackageIcon />
<input v-model="nameInput" type="text" :placeholder="t('ExportModal.ModpackName')" class="input" />
<input
v-model="nameInput"
type="text"
:placeholder="t('ExportModal.ModpackName')"
class="input"
/>
<Button class="r-btn" @click="nameInput = ''">
<XIcon />
</Button>
</div>
</div>
<div class="labeled_input">
<p>{{ t('ExportModal.Version')}}</p>
<p>{{ t('ExportModal.Version') }}</p>
<div class="iconified-input">
<VersionIcon />
<input v-model="versionInput" type="text" placeholder="1.0.0" class="input" />
Expand All @@ -131,7 +136,7 @@ const exportPack = async () => {
</div>
<div class="adjacent-input">
<div class="labeled_input">
<p>{{ t('ExportModal.Description')}}</p>
<p>{{ t('ExportModal.Description') }}</p>

<div class="textarea-wrapper">
<textarea v-model="exportDescription" :placeholder="t('ExportModal.DescriptionPl')" />
Expand All @@ -142,12 +147,8 @@ const exportPack = async () => {
<div class="table">
<div class="table-head">
<div class="table-cell row-wise">
{{ t('ExportModal.SelectFiles')}}
<Button
class="sleek-primary collapsed-button"
icon-only
@click="() => (showingFiles = !showingFiles)"
>
{{ t('ExportModal.SelectFiles') }}
<Button icon-only @click="() => (showingFiles = !showingFiles)">
<PlusIcon v-if="!showingFiles" />
<XIcon v-else />
</Button>
Expand Down Expand Up @@ -201,11 +202,11 @@ const exportPack = async () => {
<div class="button-row push-right">
<Button @click="exportModal.hide">
<XIcon />
{{ t('ExportModal.Cancel')}}
{{ t('ExportModal.Cancel') }}
</Button>
<Button color="primary" @click="exportPack">
<PackageIcon />
{{ t('ExportModal.Export')}}
{{ t('ExportModal.Export') }}
</Button>
</div>
</div>
Expand Down

0 comments on commit ffab18c

Please sign in to comment.