fix(settings/clock/achievements): remove animation when coming from achievemnts screen
This commit is contained in:
@@ -27,16 +27,17 @@ const achievementAssets =
|
|||||||
assets.images.settings.bottomScreen.clock.achievements;
|
assets.images.settings.bottomScreen.clock.achievements;
|
||||||
const { onRender, onClick } = useScreen();
|
const { onRender, onClick } = useScreen();
|
||||||
|
|
||||||
const app = useAppStore();
|
|
||||||
const store = useSettingsStore();
|
const store = useSettingsStore();
|
||||||
|
const app = useAppStore();
|
||||||
const achievements = useAchievementsStore();
|
const achievements = useAchievementsStore();
|
||||||
const achievementsScreen = useAchievementsScreen();
|
const achievementsScreen = useAchievementsScreen();
|
||||||
const confirmationModal = useConfirmationModal();
|
const confirmationModal = useConfirmationModal();
|
||||||
|
|
||||||
const isAnimating = ref(true);
|
const isAnimating = ref(true);
|
||||||
|
|
||||||
const bLabel = ref($t("common.goBack"));
|
const comingFromAchievements = app.previousScreen === "achievements";
|
||||||
const aLabel = ref($t("common.select"));
|
const bLabel = ref(comingFromAchievements ? $t("common.cancel") : $t("common.goBack"));
|
||||||
|
const aLabel = ref(comingFromAchievements ? $t("common.reset") : $t("common.select"));
|
||||||
|
|
||||||
const SLIDE_OFFSET = 96;
|
const SLIDE_OFFSET = 96;
|
||||||
const SLIDE_DURATION = 0.25;
|
const SLIDE_DURATION = 0.25;
|
||||||
@@ -106,6 +107,15 @@ const animateOutro = async () => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
if (comingFromAchievements) {
|
||||||
|
obtainedRef.value?.showInstant();
|
||||||
|
totalRef.value?.showInstant();
|
||||||
|
animation.offsetY = 0;
|
||||||
|
animation.opacity = 1;
|
||||||
|
animation.viewAllOffsetY = 0;
|
||||||
|
isAnimating.value = false;
|
||||||
|
return;
|
||||||
|
}
|
||||||
animateIntro();
|
animateIntro();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -90,7 +90,7 @@ const isAnimating = ref(true);
|
|||||||
const animation = reactive({
|
const animation = reactive({
|
||||||
offsetY: SLIDE_OFFSET,
|
offsetY: SLIDE_OFFSET,
|
||||||
opacity: 0,
|
opacity: 0,
|
||||||
upArrowOffsetY: ARROW_IMAGE_HEIGHT,
|
upArrowOffsetY: +ARROW_IMAGE_HEIGHT,
|
||||||
downArrowOffsetY: -ARROW_IMAGE_HEIGHT,
|
downArrowOffsetY: -ARROW_IMAGE_HEIGHT,
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -125,7 +125,15 @@ const animateOutro = async () => {
|
|||||||
.to(animation, { opacity: 0, duration: SLIDE_DURATION, ease: "none" }, 0);
|
.to(animation, { opacity: 0, duration: SLIDE_DURATION, ease: "none" }, 0);
|
||||||
};
|
};
|
||||||
|
|
||||||
defineExpose({ animateIntro, animateOutro });
|
const showInstant = () => {
|
||||||
|
animation.offsetY = 0;
|
||||||
|
animation.opacity = 1;
|
||||||
|
animation.upArrowOffsetY = 0;
|
||||||
|
animation.downArrowOffsetY = 0;
|
||||||
|
isAnimating.value = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
defineExpose({ animateIntro, animateOutro, showInstant });
|
||||||
|
|
||||||
const increase = () => {
|
const increase = () => {
|
||||||
const newValue = value.value + 1;
|
const newValue = value.value + 1;
|
||||||
|
|||||||
@@ -6,8 +6,13 @@ import StatusBar from "./StatusBar.vue";
|
|||||||
import Notifications from "./Notifications.vue";
|
import Notifications from "./Notifications.vue";
|
||||||
|
|
||||||
const store = useSettingsStore();
|
const store = useSettingsStore();
|
||||||
|
const app = useAppStore();
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
if (app.previousScreen === "achievements") {
|
||||||
|
store.isIntro = false;
|
||||||
|
return;
|
||||||
|
}
|
||||||
store.animateIntro();
|
store.animateIntro();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user