move campaign to subTab of Corruption

Author: Fillyosopher

Synergism.css

@@ -140,8 +140,9 @@ body.loading {
     background-color: crimson;
 }
 
-#corrStatsBtn.active-subtab,
-#corrLoadoutsBtn.active-subtab {
+#switchCorruptionSubTab1.active-subtab,
+#switchCorruptionSubTab2.active-subtab,
+#switchCorruptionSubTab3.active-subtab {
     background-color: dodgerblue;
 }
 
@@ -722,12 +723,7 @@ button.isEvent:hover {
     color: red;
 }
 
-#campaigntab {
-    border-color: red;
-    color: orange;
-}
-
-#traitstab {
+#corruptiontab {
     border-color: orange;
     color: red;
 }
@@ -3148,8 +3144,9 @@ p#ascendHotKeys {
 
 #campaigns {
     justify-content: center;
-    align-items: start;
+    align-items: center;
     margin-top: 10px;
+    width: 90%;
 }
 
 #campaignsMain {
@@ -3317,7 +3314,13 @@ p#ascendHotKeys {
     margin-bottom: 1px;
 }
 
-#traits {
+#corruption {
+    position: relative;
+    padding: 0;
+    text-align: center;
+}
+
+#corruptionContainer {
     justify-content: center;
     align-items: start;
 
@@ -3408,8 +3411,13 @@ p#ascendHotKeys {
     text-align: center;
 }
 
-#corrStatsBtn,
-#corrLoadoutsBtn {
+#corruptionsubtab {
+    align-items: center;
+}
+
+#switchCorruptionSubTab1,
+#switchCorruptionSubTab2,
+#switchCorruptionSubTab3 {
     min-width: 120px;
     max-width: 100%;
     border: 2px solid;

index.html

@@ -920,8 +920,9 @@ export const generateEventHandlers = () => {
 
   // CORRUPTION TAB
   // Part 0: Subtabs
-  DOMCacheGetOrSet('corrStatsBtn').addEventListener('click', () => changeSubTab(Tabs.Corruption, { page: 0 }))
-  DOMCacheGetOrSet('corrLoadoutsBtn').addEventListener('click', () => changeSubTab(Tabs.Corruption, { page: 1 }))
+  DOMCacheGetOrSet('switchCorruptionSubTab1').addEventListener('click', () => changeSubTab(Tabs.Corruption, { page: 0 }))
+  DOMCacheGetOrSet('switchCorruptionSubTab2').addEventListener('click', () => changeSubTab(Tabs.Corruption, { page: 1 }))
+  DOMCacheGetOrSet('switchCorruptionSubTab3').addEventListener('click', () => changeSubTab(Tabs.Corruption, { page: 2 }))
 
   // Part 1: Displays
   DOMCacheGetOrSet('corruptionDisplays').addEventListener('click', () => corruptionDisplay('exit'))

src/EventListeners.ts

@@ -152,7 +152,6 @@ import {
   htmlInserts,
   Notification,
   revealStuff,
-  showCorruptionStatsLoadouts,
   updateChallengeDisplay,
   updateChallengeLevel
 } from './UpdateHTML'
@@ -1581,7 +1580,6 @@ const loadSynergy = () => {
       corruptionLoadoutTableUpdate(false, i)
     }
 
-    showCorruptionStatsLoadouts()
     updateCorruptionLoadoutNames()
 
     // For blueberry upgrades!

src/Synergism.ts

@@ -12,7 +12,7 @@ import {
   toggleAchievementScreen,
   toggleBuildingScreen,
   toggleChallengesScreen,
-  toggleCorruptionLoadoutsStats,
+  toggleCorruptionScreen,
   toggleCubeSubTab,
   toggleRuneScreen,
   toggleSingularityScreen
@@ -30,13 +30,12 @@ export enum Tabs {
   Research = 5,
   AntHill = 6,
   WowCubes = 7,
-  Campaign = 8,
-  Corruption = 9,
-  Singularity = 10,
-  Settings = 11,
-  Shop = 12,
-  Event = 13,
-  Purchase = 14
+  Corruption = 8,
+  Singularity = 9,
+  Settings = 10,
+  Shop = 11,
+  Event = 12,
+  Purchase = 13
 }
 
 /**
@@ -270,24 +269,25 @@ const subtabInfo: Record<Tabs, SubTab> = {
       }
     ]
   },
-  [Tabs.Campaign]: {
-    subTabList: [],
-    subtabIndex: 0
-  },
   [Tabs.Corruption]: {
-    tabSwitcher: () => toggleCorruptionLoadoutsStats,
+    tabSwitcher: () => toggleCorruptionScreen,
     subtabIndex: 0,
     subTabList: [
       {
-        subTabID: 'true',
+        subTabID: '0',
         unlocked: true,
-        buttonID: 'corrStatsBtn'
+        buttonID: 'switchCorruptionSubTab1'
       },
       {
-        subTabID: 'false',
+        subTabID: '1',
         unlocked: true,
-        buttonID: 'corrLoadoutsBtn'
-      }
+        buttonID: 'switchCorruptionSubTab2'
+      },
+      {
+        subTabID: '2',
+        unlocked: true,
+        buttonID: 'switchCorruptionSubTab3'
+      },
     ]
   },
   [Tabs.Singularity]: {
@@ -642,12 +642,7 @@ tabRow.appendButton(
     .setType(Tabs.WowCubes)
     .makeDraggable()
     .makeRemoveable(),
-  new $Tab({ class: 'chal11', id: 'campaigntab', i18n: 'tabs.main.campaign' })
-    .setUnlockedState(() => player.challengecompletions[11] > 0)
-    .setType(Tabs.Campaign)
-    .makeDraggable()
-    .makeRemoveable(),
-  new $Tab({ class: 'chal11', id: 'traitstab', i18n: 'tabs.main.corruption' })
+  new $Tab({ class: 'chal11', id: 'corruptiontab', i18n: 'tabs.main.corruption' })
     .setUnlockedState(() => (player.challengecompletions[11] > 0))
     .setType(Tabs.Corruption)
     .makeDraggable()

src/Tabs.ts

@@ -77,7 +77,7 @@ export const toggleTheme = (initial = false, themeNumber = 1, change = false) =>
     DOMCacheGetOrSet('corruptionDescription').style.color = 'darkviolet'
     DOMCacheGetOrSet('versionnumber').style.color = 'fuchsia'
     DOMCacheGetOrSet('singularitytab').style.color = 'red'
-    DOMCacheGetOrSet('traitstab').style.color = 'red'
+    DOMCacheGetOrSet('corruptiontab').style.color = 'red'
     DOMCacheGetOrSet('cubetab').style.color = 'red'
     DOMCacheGetOrSet('ascTimeAccel').style.color = 'royalblue'
     DOMCacheGetOrSet('buildinghotkeys').style.color = 'lightgray'
@@ -200,7 +200,7 @@ export const toggleTheme = (initial = false, themeNumber = 1, change = false) =>
     DOMCacheGetOrSet('antwelcome').style.color = '#b1b1b1'
     DOMCacheGetOrSet('versionnumber').style.color = '#ff5aff'
     DOMCacheGetOrSet('singularitytab').style.color = '#ff5252'
-    DOMCacheGetOrSet('traitstab').style.color = '#ff5252'
+    DOMCacheGetOrSet('corruptiontab').style.color = '#ff5252'
     DOMCacheGetOrSet('cubetab').style.color = '#ff5252'
     DOMCacheGetOrSet('antspecies').style.color = '#8da9ff'
     DOMCacheGetOrSet('ascTimeAccel').style.color = '#97b0ff'

src/Themes.ts

@@ -12,7 +12,7 @@ import { updateSingularityElevator, updateSingularityElevatorVisibility } from '
 import { format, player, resetCheck } from './Synergism'
 import { getActiveSubTab, subTabsInMainTab, Tabs } from './Tabs'
 import type { BuildingSubtab, BuyAmount, Player } from './types/Synergism'
-import { Alert, Confirm, Prompt, showCorruptionStatsLoadouts, updateChallengeDisplay } from './UpdateHTML'
+import { Alert, Confirm, Prompt, updateChallengeDisplay } from './UpdateHTML'
 import { visualUpdateAmbrosia, visualUpdateCubes, visualUpdateOcteracts } from './UpdateVisuals'
 import { Globals as G } from './Variables'
 
@@ -937,10 +937,36 @@ export const toggleCorruptionLevel = (corr: keyof Corruptions, value: number) =>
   corruptionLoadoutTableUpdate(true, 0)
 }
 
-export const toggleCorruptionLoadoutsStats = (statsStr: string) => {
-  const stats = statsStr === 'true'
-  player.corruptions.showStats = stats
-  showCorruptionStatsLoadouts()
+export const toggleCorruptionScreen = () => {
+  const statsButton = DOMCacheGetOrSet('switchCorruptionSubTab1')
+  const corrLoadoutsButton = DOMCacheGetOrSet('switchCorruptionSubTab2')
+  const campaignBtn = DOMCacheGetOrSet('switchCorruptionSubTab3')
+
+  if (getActiveSubTab() === 0) {
+    DOMCacheGetOrSet('corruptionsubtab').style.display = 'flex'
+    DOMCacheGetOrSet('campaigns').style.display = 'none'
+    DOMCacheGetOrSet('corruptionStats').style.display = 'flex'
+    DOMCacheGetOrSet('corruptionLoadouts').style.display = 'none'
+    statsButton.classList.add('subtab-active')
+    corrLoadoutsButton.classList.remove('subtab-active')
+    campaignBtn.classList.remove('subtab-active')
+  }
+  if (getActiveSubTab() === 1) {
+    DOMCacheGetOrSet('corruptionsubtab').style.display = 'flex'
+    DOMCacheGetOrSet('campaigns').style.display = 'none'
+    DOMCacheGetOrSet('corruptionStats').style.display = 'none'
+    DOMCacheGetOrSet('corruptionLoadouts').style.display = 'flex'
+    statsButton.classList.remove('subtab-active')
+    corrLoadoutsButton.classList.add('subtab-active')
+    campaignBtn.classList.remove('subtab-active')
+  }
+  if (getActiveSubTab() === 2) {
+    DOMCacheGetOrSet('corruptionsubtab').style.display = 'none'
+    DOMCacheGetOrSet('campaigns').style.display = 'block'
+    statsButton.classList.remove('subtab-active')
+    corrLoadoutsButton.classList.remove('subtab-active')
+    campaignBtn.classList.add('subtab-active')
+  }
 }
 
 export const toggleAscStatPerSecond = (id: number) => {

src/Toggles.ts

@@ -38,7 +38,6 @@ import {
   visualUpdateAchievements,
   visualUpdateAnts,
   visualUpdateBuildings,
-  visualUpdateCampaign,
   visualUpdateChallenges,
   visualUpdateCorruptions,
   visualUpdateCubes,
@@ -531,11 +530,9 @@ export const hideStuff = () => {
   DOMCacheGetOrSet('ants').style.display = 'none'
   DOMCacheGetOrSet('anttab').style.backgroundColor = ''
   DOMCacheGetOrSet('cubetab').style.backgroundColor = ''
-  DOMCacheGetOrSet('campaigntab').style.backgroundColor = ''
-  DOMCacheGetOrSet('campaigns').style.display = 'none'
-  DOMCacheGetOrSet('traitstab').style.backgroundColor = ''
+  DOMCacheGetOrSet('corruptiontab').style.backgroundColor = ''
   DOMCacheGetOrSet('cubes').style.display = 'none'
-  DOMCacheGetOrSet('traits').style.display = 'none'
+  DOMCacheGetOrSet('corruption').style.display = 'none'
   DOMCacheGetOrSet('singularity').style.display = 'none'
   DOMCacheGetOrSet('singularitytab').style.backgroundColor = ''
   DOMCacheGetOrSet('event').style.display = 'none'
@@ -609,15 +606,10 @@ export const hideStuff = () => {
     DOMCacheGetOrSet('cubes').style.display = 'flex'
     DOMCacheGetOrSet('cubetab').style.backgroundColor = 'white'
   }
-  if (G.currentTab === Tabs.Campaign) {
-    DOMCacheGetOrSet('campaigns').style.display = 'block'
-    DOMCacheGetOrSet('campaigntab').style.backgroundColor = 'red'
-  }
   if (G.currentTab === Tabs.Corruption) {
-    DOMCacheGetOrSet('traits').style.display = 'flex'
-    DOMCacheGetOrSet('traitstab').style.backgroundColor = 'white'
+    DOMCacheGetOrSet('corruption').style.display = 'block'
+    DOMCacheGetOrSet('corruptiontab').style.backgroundColor = 'white'
   }
-
   if (G.currentTab === Tabs.Singularity) {
     DOMCacheGetOrSet('singularity').style.display = 'block'
     DOMCacheGetOrSet('singularitytab').style.backgroundColor = 'lightgoldenrodyellow'
@@ -650,7 +642,6 @@ const visualTab: Record<Tabs, () => void> = {
   [Tabs.Shop]: visualUpdateShop,
   [Tabs.AntHill]: visualUpdateAnts,
   [Tabs.WowCubes]: visualUpdateCubes,
-  [Tabs.Campaign]: visualUpdateCampaign,
   [Tabs.Corruption]: visualUpdateCorruptions,
   [Tabs.Singularity]: visualUpdateSingularity,
   [Tabs.Event]: visualUpdateEvent,
@@ -1037,23 +1028,6 @@ export const updateChallengeLevel = (k: number) => {
   }
 } */
 
-export const showCorruptionStatsLoadouts = () => {
-  const statsButton = DOMCacheGetOrSet('corrStatsBtn')
-  const corrLoadoutsButton = DOMCacheGetOrSet('corrLoadoutsBtn')
-
-  if (player.corruptions.showStats) {
-    DOMCacheGetOrSet('corruptionStats').style.display = 'flex'
-    DOMCacheGetOrSet('corruptionLoadouts').style.display = 'none'
-    statsButton.classList.add('subtab-active')
-    corrLoadoutsButton.classList.remove('subtab-active')
-  } else {
-    DOMCacheGetOrSet('corruptionStats').style.display = 'none'
-    DOMCacheGetOrSet('corruptionLoadouts').style.display = 'flex'
-    statsButton.classList.remove('subtab-active')
-    corrLoadoutsButton.classList.add('subtab-active')
-  }
-}
-
 const updateAscensionStats = () => {
   let t = player.ascensionCounter
   // Division by 0 is not defined

src/UpdateHTML.ts

@@ -2073,5 +2073,3 @@ export const visualUpdateEvent = () => {
 }
 
 export const visualUpdatePurchase = () => {}
-
-export const visualUpdateCampaign = () => {}