Skip to content

Commit

Permalink
Flip DeepSSM tab vs expansion panel order
Browse files Browse the repository at this point in the history
  • Loading branch information
@JakeWags
JakeWags committed Apr 4, 2024
1 parent ad8e2d8 commit 867f015
Showing 1 changed file with 98 additions and 102 deletions.
200 changes: 98 additions & 102 deletions web/shapeworks/src/components/DeepSSM/DeepSSMTab.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,9 @@ export default {
}
)
const openTab = ref<number>(0);
const openExpansionPanel = ref<number>(0);
const controlsTabs = ref();
const dataTabs = ref();
const showAbortConfirmation = ref(false);
const prepData = {
Expand Down Expand Up @@ -96,16 +98,16 @@ export default {
return taskId;
}
const tabs = ref();
onMounted(async () => {
if (!deepSSMResult.value && selectedProject.value) {
await loadDeepSSMDataForProject();
}
})
return {
openTab,
openExpansionPanel,
controlsTabs,
dataTabs,
prepData,
augmentationData,
trainingData,
Expand All @@ -115,7 +117,6 @@ export default {
taskData,
abort,
showAbortConfirmation,
tabs,
deepSSMResult,
}
},
Expand Down Expand Up @@ -176,109 +177,104 @@ export default {
</v-dialog>
</div>
<div class="pa-3" v-else>
<v-tabs v-model="tabs">
<v-tab>Controls</v-tab>
<v-tab v-if="deepSSMResult">Data</v-tab>
</v-tabs>
<v-tabs-items v-model="tabs">
<v-tab-item>
<v-expansion-panels v-model="openTab">
<v-expansion-panel>
<v-expansion-panel-header>
Prep
</v-expansion-panel-header>
<v-expansion-panel-content>
<v-text-field v-model="prepData.testingSplit" type="number" label="Test Split" suffix="%" />
<v-text-field v-model="prepData.validationSplit" type="number" label="Validation Split" suffix="%" />
<v-text-field v-model="prepData.percentVariability" type="number" label="Percent Variablity Preserved" min="0" max="100" suffix="%" />
<div class="image-spacing">
<v-label class="spacing-label">Image Spacing</v-label>
<v-text-field class="spacing-input" v-model="prepData.imageSpacing.value.x" type="number" label="X" />
<v-text-field class="spacing-input" v-model="prepData.imageSpacing.value.y" type="number" label="Y" />
<v-text-field class="spacing-input" v-model="prepData.imageSpacing.value.z" type="number" label="Z" />
<v-expansion-panels v-model="openExpansionPanel">
<v-expansion-panel>
<v-expansion-panel-header>Controls</v-expansion-panel-header>
<v-expansion-panel-content>
<v-tabs v-model="controlsTabs">
<v-tab>Prep</v-tab>
<v-tab>Augmentation</v-tab>
<v-tab>Training</v-tab>
</v-tabs>
<v-tabs-items v-model="controlsTabs">
<v-tab-item>
<div>
<v-text-field v-model="prepData.testingSplit" type="number" label="Test Split" suffix="%" />
<v-text-field v-model="prepData.validationSplit" type="number" label="Validation Split" suffix="%" />
<v-text-field v-model="prepData.percentVariability" type="number" label="Percent Variablity Preserved" min="0" max="100" suffix="%" />
<div class="image-spacing">
<v-label class="spacing-label">Image Spacing</v-label>
<v-text-field class="spacing-input" v-model="prepData.imageSpacing.value.x" type="number" label="X" />
<v-text-field class="spacing-input" v-model="prepData.imageSpacing.value.y" type="number" label="Y" />
<v-text-field class="spacing-input" v-model="prepData.imageSpacing.value.z" type="number" label="Z" />
</div>
</div>
</v-expansion-panel-content>
</v-expansion-panel>
<v-expansion-panel>
<v-expansion-panel-header>
Augmentation
</v-expansion-panel-header>
<v-expansion-panel-content>
<v-text-field v-model="augmentationData.numSamples.value" type="number" label="Number of Samples" min="1" />
</v-tab-item>
<v-tab-item>
<div>
<v-text-field v-model="augmentationData.numSamples.value" type="number" label="Number of Samples" min="1" />

<v-select
:items="Object.values(Sampler)"
v-model="augmentationData.samplerType"
label="Sampler Type"
/>
</v-expansion-panel-content>
</v-expansion-panel>
<v-expansion-panel>
<v-expansion-panel-header>
Training
</v-expansion-panel-header>
<v-expansion-panel-content>
<v-select
:items="Object.values(LossFunction)"
v-model="trainingData.lossFunction"
label="Loss Function"
/>
<v-text-field v-model="trainingData.epochs.value" type="number" label="Epochs" min="0" />
<v-text-field v-model="trainingData.learningRate.value" type="number" label="Learning Rate" min="0" />
<v-text-field v-model="trainingData.batchSize.value" type="number" label="Batch Size" min="1" />
<v-select
:items="Object.values(Sampler)"
v-model="augmentationData.samplerType"
label="Sampler Type"
/>
</div>
</v-tab-item>
<v-tab-item>
<div>
<v-select
:items="Object.values(LossFunction)"
v-model="trainingData.lossFunction"
label="Loss Function"
/>
<v-text-field v-model="trainingData.epochs.value" type="number" label="Epochs" min="0" />
<v-text-field v-model="trainingData.learningRate.value" type="number" label="Learning Rate" min="0" />
<v-text-field v-model="trainingData.batchSize.value" type="number" label="Batch Size" min="1" />

<v-checkbox v-model="trainingData.decayLearningRate" label="Decay Learning Rate"></v-checkbox>
<v-checkbox v-model="trainingData.decayLearningRate" label="Decay Learning Rate"></v-checkbox>

<v-checkbox v-model="trainingData.fineTuning" label="Fine Tuning"></v-checkbox>
<v-checkbox v-model="trainingData.fineTuning" label="Fine Tuning"></v-checkbox>

<v-text-field v-model="trainingData.ftEpochs.value" :disabled="!trainingData.fineTuning" type="number" label="Fine Tuning Epochs" min="1" />
<v-text-field v-model="trainingData.ftLearningRate.value" :disabled="!trainingData.fineTuning" type="number" label="Fine Tuning Learning Rate" min="0" />
</v-expansion-panel-content>
</v-expansion-panel>
</v-expansion-panels>
<v-btn @click="submitDeepSSMJob">Run DeepSSM tasks</v-btn>
</v-tab-item>
<v-tab-item v-if="deepSSMResult">
<v-expansion-panels>
<v-expansion-panel>
<v-expansion-panel-header>
Augmentation
</v-expansion-panel-header>
<v-expansion-panel-content>
<!-- table -->
total
<!-- violin plot -->
<v-img :src="deepSSMResult.result?.aug_visualization" alt="Augmented Data Violin Plot" />
</v-expansion-panel-content>
</v-expansion-panel>
<v-expansion-panel>
<v-expansion-panel-header>
Training
</v-expansion-panel-header>
<v-expansion-panel-content>
<!-- training data -->
<!-- table -->
<!-- epoch plots -->
Training Plot
<v-img :src="deepSSMResult.result?.training_visualization" alt="Training Plot" />
<div v-if="deepSSMResult.result?.training_visualization_ft">
Fine Tuning Plot
<v-img :src="deepSSMResult.result?.training_visualization_ft" alt="Fine Tuning Plot" />
<v-text-field v-model="trainingData.ftEpochs.value" :disabled="!trainingData.fineTuning" type="number" label="Fine Tuning Epochs" min="1" />
<v-text-field v-model="trainingData.ftLearningRate.value" :disabled="!trainingData.fineTuning" type="number" label="Fine Tuning Learning Rate" min="0" />
</div>
</v-tab-item>
</v-tabs-items>
<v-btn @click="submitDeepSSMJob">Run DeepSSM tasks</v-btn>
</v-expansion-panel-content>
</v-expansion-panel>
<v-expansion-panel v-if="deepSSMResult">
<v-expansion-panel-header>Data</v-expansion-panel-header>
<v-expansion-panel-content>
<v-tabs v-model="dataTabs">
<v-tab>Prep</v-tab>
<v-tab>Augmentation</v-tab>
<v-tab>Training</v-tab>
<v-tab>Testing</v-tab>
</v-tabs>
<v-tabs-items v-model="dataTabs">
<v-tab-item>
<div>
<!-- table -->
total
<!-- violin plot -->
<v-img :src="deepSSMResult.result?.aug_visualization" alt="Augmented Data Violin Plot" />
</div>
</v-tab-item>
<v-tab-item>
<div>
<!-- training data -->
<!-- table -->
<!-- epoch plots -->
Training Plot
<v-img :src="deepSSMResult.result?.training_visualization" alt="Training Plot" />
<div v-if="deepSSMResult.result?.training_visualization_ft">
Fine Tuning Plot
<v-img :src="deepSSMResult.result?.training_visualization_ft" alt="Fine Tuning Plot" />
</div>
</div>
</v-tab-item>
<v-tab-item>
<div>
<!-- testing data -->
<!-- distance table -->
</div>
</v-expansion-panel-content>
</v-expansion-panel>
<v-expansion-panel>
<v-expansion-panel-header>
Testing
</v-expansion-panel-header>
<v-expansion-panel-content>
<!-- testing data -->
<!-- distance table -->
</v-expansion-panel-content>
</v-expansion-panel>
</v-expansion-panels>
</v-tab-item>
</v-tabs-items>
</v-tab-item>
</v-tabs-items>
</v-expansion-panel-content>
</v-expansion-panel>
</v-expansion-panels>
</div>
</template>

Expand Down

0 comments on commit 867f015

Please sign in to comment.