Skip to content

Commit

Permalink
v2.0.9
Browse files Browse the repository at this point in the history
  • Loading branch information
@NaturalDevCR
NaturalDevCR committed Nov 14, 2024
1 parent 425676e commit 2dabbc5
Show file tree
Hide file tree
Showing 18 changed files with 329 additions and 568 deletions.
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "my-ui-pro",
"version": "2.0.8",
"version": "2.0.9",
"description": "Soundcraft Ui Multiframe Wrapper",
"productName": "My Ui Pro",
"author": "Josue Orozco A. <[email protected]>",
Expand Down
6 changes: 3 additions & 3 deletions src/components/IFrame.vue
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<template>
<div v-for="(section, index) in layoutsStore.selectedLayout" :key="index" class="parent" :style="{height: section.height}">
<div v-for="(section, key) in layoutsStore.selectedLayout" :key="key" class="parent" :style="{height: section.height}">
<template v-if="section.subFrames">
<div v-for="(subFrame) in section.subFrames" :key="'subFrame' + subFrame">
<iframe
Expand All @@ -11,9 +11,9 @@
</template>
<iframe
v-else
:key="index"
:key="key"
:allowFullScreen="false"
class="full-width"
class="full-width full-height"
:src="mixerStore.mixerSrc"
/>
</div>
Expand Down
48 changes: 0 additions & 48 deletions src/components/LayoutOption.vue
View file

This file was deleted.

124 changes: 33 additions & 91 deletions src/components/LayoutSelector.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<q-separator />

<q-card-section>
<q-scroll-area dark class="q-pa-sm" :visible="false" style="height: 600px; max-width: 500px;">
<q-scroll-area dark class="q-pa-sm" :visible="false" style="height: 500px; max-width: 500px;">
<div class="row q-col-gutter-sm">
<div class="col-12 text-center">
<q-expansion-item
Expand All @@ -35,111 +35,53 @@
</q-card>
</q-expansion-item>
</div>
<div @click="selectLayout('one')" class="col-6 row q-col-gutter-xs text-center">
<div class="col-12">1 Frame</div>
<div class="col-12">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="100px" />
</div>
</div>
<div @click="selectLayout('two')" class="col-6 row q-col-gutter-xs text-center">
<div class="col-12">2 Frames</div>
<div class="col-12">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
</div>
<div class="col-12">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
</div>
</div>
</div>

<div class="col-12 q-my-lg">
<q-separator spaced />
</div>

<div class="row q-col-gutter-sm">
<div class="col-6 row q-col-gutter-xs text-center" @click="selectLayout('threeV1')">
<div class="col-12">3 Frames (v1)</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
<div v-for="(layout, key) in layoutsStore.layoutOptions" :key="key" class="col-6 row q-col-gutter-xs text-center">
<div class="col-12">{{ titleMap[key.toString()] }}</div>
<div @click="selectLayout(key)" v-for="(section, index) in layout" :key="index" class="col-12 row">
<template v-if="section.subFrames">
<div v-for="subFrameIndex in section.subFrames" :key="subFrameIndex" :class="section.selector.class">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered :height="section.selector.height" />
</div>
</template>
<div v-else :class="section.selector.class">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered :height="section.selector.height" />
</div>
</div>
<div class="col-12">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
<q-separator spaced />
</div>
</div>
<div class="col-6 row q-col-gutter-xs text-center" @click="selectLayout('threeV2')">
<div class="col-12">3 Frames (v2)</div>
<div class="col-12">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
</div>
</div>
</div>

<div class="col-12 q-my-lg">
<q-separator spaced />
</div>

<div class="row q-col-gutter-sm">
<!-- Quad Frame -->
<div @click="selectLayout('four')" class="col-6 row q-col-gutter-xs text-center">
<div class="col-12">4 Frames</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="50px" />
</div>
</div>
<!-- Quintuple Frame V1 -->
<div @click="selectLayout('fiveV1')" class="col-6 row q-col-gutter-xs text-center">
<div class="col-12">5 Frames (v1)</div>
<div class="col-12">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="33px" />
</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="33px" />
</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="33px" />
</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="33px" />
</div>
<div class="col-6">
<q-skeleton animation-speed="0" class="cursor-pointer" bordered height="33px" />
</div>
</div>
</div>
</q-scroll-area>

</q-card-section>
</q-card>
</q-dialog>
</template>

<script setup lang="ts">
import {useCommonStore} from 'stores/common-store';
import {useLayoutsStore} from 'stores/layouts-store';
import { useCommonStore } from 'stores/common-store';
import { useLayoutsStore } from 'stores/layouts-store';
const commonStore = useCommonStore()
const layoutsStore = useLayoutsStore()
const commonStore = useCommonStore();
const layoutsStore = useLayoutsStore();
const selectLayout = (value:any) => {
layoutsStore.selectedLayout = layoutsStore.layoutOptions[value]
}
const selectLayout = (value: any) => {
layoutsStore.selectedLayout = layoutsStore.layoutOptions[value];
};
const titleMap:any = {
one: '1 Frame',
two: '2 Frames',
threeV1: '3 Frames (v1)',
threeV2: '3 Frames (v2)',
four: '4 Frames',
fiveV1: '5 Frames (v1)',
fiveV2: '5 Frames (v2)',
fiveV3: '5 Frames (v3)',
sixV1: '6 Frames (v1)',
sixV2: '6 Frames (v2)',
}
</script>
134 changes: 0 additions & 134 deletions src/components/LayoutsEditModal.vue
View file

This file was deleted.

Loading

0 comments on commit 2dabbc5

Please sign in to comment.