diff --git a/src/components/ace/ACE.vue b/src/components/ace/ACE.vue
new file mode 100644
index 000000000..4758bcae0
--- /dev/null
+++ b/src/components/ace/ACE.vue
@@ -0,0 +1,1373 @@
+/* This vue file creates a user interface allowing the creation of custom agents. It loads
+existing agents from the back end and makes it possible to duplicate or edit these agents. The
+custom agents are then stored in local storage in the browser, where they will be sent to the back
+when the user hits the 'Launch Simulation' button. */
+<script>
+import axios from 'axios'
+
+export default {
+    props: {
+    },
+    data() {
+        return {
+            currentMode: 'agent',
+            agentDesc: '',
+            currencyDesc: '',
+            currencyList: [],
+            selectedCurrency: 'o2',
+            selectedCurrencyCategory: 'atmosphere',
+            currencyCategorySelected: 'atmosphere',
+            newCurrencyName: '',
+            categorySelected: 'plants',
+            selectedAgentName: 'rice',
+            selectedCapacity: '',
+            customClassName: '',
+            capacityTypes: {},
+            inTypes: {},
+            outTypes: {},
+            thresholdTypes: {},
+            kindTypes: {},
+            newCapacityType: '',
+            newCapacityValue: '',
+            newInType: '',
+            newInValue: '',
+            newOutType: '',
+            newOutValue: '',
+            newThresholdCurrency: 'o2',
+            newThresholdPath: '',
+            newThresholdLimit: '',
+            newThresholdValue: '',
+            newThresholdConnections: '',
+            propertyNames: {},
+            newPropertyName: '',
+            newPropVal: '',
+            newPropUnit: '',
+            newWeightedIn: '',
+            newWeightedOut: '',
+            newConnectionIn: '',
+            newConnectionOut: '',
+            newRequires: '',
+            newCriterionName: '',
+            newCriterionValue: '',
+            newCriterionLimit: '',
+            newGrowthKind: '',
+            newGrowthPattern: '',
+            newDepriveValue: '',
+            newDepriveUnit: '',
+            changedPropVal: '',
+            newAgentName: '',
+            customAgents: {},
+            customCurrencies: {},
+            exportedListVisible: false,
+            localAgentNames: [],
+            localCurrencyNames: [],
+        }
+    },
+    computed: {
+        selectedAgent() {
+            return this.agentDesc[this.selectedAgentName]
+        },
+        agentOutFlow() {
+            return this.selectedAgent.flows.out
+        },
+        currencyTypes() {
+            const listOfTypes = []
+            /* Determine list of type */
+            const keys = Object.keys(this.currencyDesc)
+            for (let index=0; index<keys.length; ++index) {
+                const currencyType = keys[index]
+                if (!listOfTypes.includes(currencyType)) listOfTypes.push(currencyType)
+            }
+            return listOfTypes
+        },
+        agentClasses() {
+            const listOfClasses = []
+            /* Determine list of agent_class */
+            const agentNames = Object.keys(this.agentDesc)
+            for (let index=0; index<agentNames.length; ++index) {
+                const className = this.agentDesc[agentNames[index]].agent_class
+                if (!listOfClasses.includes(className)) listOfClasses.push(className)
+            }
+            return listOfClasses
+        },
+        agentsInClass() {
+            const listOfAgents = []
+            const agents = Object.keys(this.agentDesc)
+            for (let index=0; index<agents.length; ++index) {
+                const agent = agents[index]
+                const agentClass = this.agentDesc[agent].agent_class
+                if (agentClass===this.categorySelected) { listOfAgents.push(agent) }
+            }
+            return listOfAgents
+        },
+    },
+    watch: {
+        selectedAgentName() {
+        },
+        currencyDesc() {
+            this.generateCurrencyList()
+        },
+    },
+    async created() {
+        // Get agents from simoc-abm
+        try {
+            this.agentDesc = await this.getAgentDesc()
+            // Get agents from local Storage
+            this.getLocalStorageAgents()
+        } catch (error) {
+            console.log(error)
+        }
+        // Get currencies from simoc-abm
+        try {
+            this.currencyDesc = await this.getCurrencyDesc()
+            this.generateCurrencyList()
+            // Get currencies from local storage.
+            this.getLocalStorageCurrencies()
+        } catch (error) {
+            console.log(error)
+        }
+    },
+    methods: {
+        getLocalStorageAgents() {
+            let localStorageAgents = localStorage.getItem('customAgents')
+            localStorageAgents = JSON.parse(localStorageAgents)
+            this.localAgentNames = Object.keys(localStorageAgents)
+            if (typeof (localStorageAgents)==='object' && (localStorageAgents!==null)) {
+                console.log('Agents found in local storage:')
+                for (let index=0; index<this.localAgentNames.length; ++index) {
+                    const localAgentName = this.localAgentNames[index]
+                    this.agentDesc[localAgentName] = localStorageAgents[localAgentName]
+                }
+            } else {
+                console.log(' * No agents loaded from local storage *')
+            }
+        },
+        getLocalStorageCurrencies() {
+            let localStorageCurrencies = localStorage.getItem('customCurrencies')
+            localStorageCurrencies = JSON.parse(localStorageCurrencies)
+            if (typeof (localStorageCurrencies)==='object' && (localStorageCurrencies!==null)) {
+                /* Uncomment to print to the console the list of local storage currencies: */
+                // for(let category in localStorageCurrencies)
+                // console.log("Currencies found in local storage:")
+                // for (let currency in category) {
+                //    console.log(currency)
+                //    this.currencyDesc[category][currency] = localStorageCurrencies[currency]
+                // }
+                if (
+                    typeof (this.currencyDesc.custom)==='object'
+                    && (localStorageCurrencies!=null)
+                ) {
+                    // Object exists
+                } else {
+                    this.currencyDesc.custom = {}
+                }
+                this.localCurrencyNames = Object.keys(localStorageCurrencies)
+                console.log(' * Currencies loaded from local storage:')
+                for (let nameIndex=0; nameIndex<this.localCurrencyNames.length; nameIndex+=1) {
+                    const currencyName = this.localCurrencyNames[nameIndex]
+                    console.log(currencyName)
+                    this.currencyDesc.custom[currencyName] = localStorageCurrencies[currencyName]
+                }
+            } else {
+                console.log(' * No currencies loaded from local storage *')
+            }
+        },
+        async getCurrencyDesc() {
+            try {
+                // Retrieve agent desc  from the backend
+                console.log(`* Loading Currency Desc from backend *`)
+                const response = await axios.get('/get_currency_desc')
+                const currencyDesc = response.data.currency_desc // get the actual data out of the response object
+                console.log(currencyDesc)
+                return currencyDesc
+            } catch (error) {
+                console.log('* Loading agent desc failed! *')
+                console.error(error)
+                return null
+            }
+        },
+        generateCurrencyList() {
+            const currancies = []
+            this.currencyList = []
+            const currencyCats = Object.keys(this.currencyDesc)
+            for (let currencyCatIndex = 0;
+                currencyCatIndex<currencyCats.length; currencyCatIndex+=1) {
+                const currentCurrencyCatName = currencyCats[currencyCatIndex]
+                const curranciesNamesOfType = Object.keys(this.currencyDesc[currentCurrencyCatName])
+                for (let currencyIndex = 0;
+                    currencyIndex<curranciesNamesOfType.length; currencyIndex+=1) {
+                    const currencyName = curranciesNamesOfType[currencyIndex]
+                    // The actual currency is at this.currencyDesc[currentCurrencyCatName][currencyName]
+                    currancies.push(currencyName)
+                }
+            }
+            for (let i=0; i<currancies.length; ++i) {
+                this.currencyList.push(currancies[i])
+            }
+        },
+        async getAgentDesc() {
+            try {
+                // Retrieve agent desc  from the backend
+                console.log(`* Loading Agent Desc from backend *`)
+                const response = await axios.get('/get_agent_desc')
+                const agentDesc = response.data.agent_desc
+                return agentDesc  // get the actual data out of the response object
+            } catch (error) {
+                console.log('* Loading agent desc failed! *')
+                console.error(error)
+                return null
+            }
+        },
+        submitAgent() {
+            this.agentDesc[this.categorySelected][this.selectedAgentName] = {data: 0}
+        },
+        selectItem(item) {
+            this.selectedAgentName = item
+        },
+        selectCurrency(currency) {
+            this.selectedCurrency = currency
+            this.selectedCurrencyCategory = this.currencyCategorySelected
+        },
+        setCustomClass() {
+            this.selectedAgent.agent_class=this.customClassName
+            this.categorySelected = this.customClassName
+        },
+        removeCapacity(key) {
+            delete this.selectedAgent.capacity[key]
+            // Remove the capacities object if there are no capacities in it.
+            if ((Object.keys(this.selectedAgent.capacity).length) === 0) {
+                delete this.selectedAgent.capacity
+            }
+        },
+        removeInFlow(currency) {
+            delete this.selectedAgent.flows.in[currency]
+        },
+        removeOutFlow(currency) {
+            delete this.agentOutFlow[currency]
+        },
+        removeThreshold(currency) {
+            delete this.selectedAgent.thresholds[currency]
+            // Remove thresholds object if there are no currencies listed
+            if (Object.keys(this.selectedAgent.thresholds).length === 0) {
+                delete this.selectedAgent.thresholds
+            }
+        },
+        removeProperty(property) {
+            delete this.selectedAgent.properties[property]
+        },
+        removeGrowth(currency, kind) {
+            // Delete the specific kind of growth
+            delete this.agentOutFlow[currency].growth[kind]
+            // Remove the growth object if there are no growths in it.
+            const flowGrowth = this.agentOutFlow[currency].growth
+            if (Object.keys(flowGrowth).length === 0) {
+                delete this.agentOutFlow[currency].growth
+            }
+        },
+        removeCriterion(currency, kind) {
+            // Delete the specific kind of criterion
+            delete this.agentOutFlow[currency].criteria[kind]
+            // Remove the criteria object if there are no growths in it.
+            const thisCriteria = this.agentOutFlow[currency].criteria
+            if (Object.keys(thisCriteria).length === 0) {
+                delete this.agentOutFlow[currency].criteria
+            }
+        },
+        removeFlowArrayItem(direction, type, currency, name) {
+            const agent = this.selectedAgent
+            const index = (
+                agent.flows[direction][currency][type].indexOf(name)
+            )
+            // Delete the connection by its array index number
+            if (index !== -1) {
+                const currencyArray = agent.flows[direction][currency][type]
+                currencyArray.splice(index, 1)
+            }
+            // Remove the flow array array if it is empty
+            const flowarray = agent.flows[direction][currency][type]
+            if ((flowarray).length === 0) {
+                delete agent.flows[direction][currency][type]
+            }
+        },
+        removeDeprive(currency) {
+            delete this.selectedAgent.flows.in[currency].deprive
+        },
+        changePropertyValue(property, newPVal) {
+            let newPropVal = newPVal
+            /* See if it is a number, if it is, store it as one, otherwise as a string */
+            if (!Number.isNaN(Number(newPropVal))) {
+            /* This is to ensure the data sent to the back is not a string in the JSON */
+            /* When it is supposed to be a number e.g. { a: 1 } vs { a: '1' } */
+            /* Works with !isNaN(newPropVal), but doesn't pass lint*/
+            /* Check this again to verify with this workaround for lint */
+                newPropVal = +newPropVal
+            }
+            // Convert true/false string to boolean
+            if (newPropVal==='true') { newPropVal = true }
+            if (newPropVal==='false') { newPropVal = false }
+            this.selectedAgent.properties[property].value=newPropVal
+        },
+        renameAgent(newName) {
+            // Make Sure Agent Doesn't Already Exist
+            const agentNames = Object.keys(this.agentDesc)
+            for (let nameIndex=0; nameIndex<agentNames.length; nameIndex+=1) {
+                const name = agentNames[nameIndex]
+                if (name === newName) {
+                    const alertString = `${newName} already exists, try another name!`
+                    console.log(alertString) // This really needs to be a notification like an alert
+                    // alert(alertString) // Alert does not pass lint
+                    return
+                }
+            }
+            // Rename Object
+            const thisAgent = this.selectedAgent
+            this.agentDesc[newName] = thisAgent
+            delete this.selectedAgent
+            this.selectedAgentName = newName
+            // Make sure that if it is a plant, the corresponding currency is renamed also
+            if (this.categorySelected==='plants') {
+                // This really needs to be a notification like an alert, but alert does not pass lint
+                console.log('PLANT. MAKE SURE PLANT FLOW CURRENCIES ARE UPDATED/CREATED,')
+                console.log('(i.e. rice has rice as outflow, ')
+                console.log('and has rice as a biomass connection)!')
+            }
+            // Export the plant currency
+        },
+        renameCurrency(newName) {
+            // Make Sure Currency Doesn't Already Exist
+            const currencyNames = Object.keys(this.currencyDesc[this.currencyCategorySelected])
+            for (let nameIndex=0; nameIndex<currencyNames.length; nameIndex+=1) {
+                const name = currencyNames[nameIndex]
+                if (name === newName) {
+                    const alertString = `${newName} already exists, try another name!`
+                    // This really needs to be a notification like an alert, but alert does not pass lint
+                    console.log(alertString)
+                    return
+                }
+            }
+            // Rename Object
+            const thisCurrency = (
+                this.currencyDesc[this.currencyCategorySelected][this.selectedCurrency])
+            this.currencyDesc[this.currencyCategorySelected][newName] = thisCurrency
+            delete this.currencyDesc[this.currencyCategorySelected][this.selectedCurrency]
+            this.selectedCurrency = newName
+            this.generateCurrencyList()
+        },
+        changeCapacityType(key, value, newName) {
+            if (!(newName==='' || newName===undefined)) { // Make sure it is not the empty string
+                this.selectedAgent.capacity[newName]=value
+                delete this.selectedAgent.capacity[key]
+            } else {
+                console.log('Cannot change to type without label')
+            }
+        },
+        changeInType(key, value, newName) {
+            if (!(newName==='' || newName===undefined)) { // Make sure it is not the empty string
+                this.selectedAgent.flows.in[newName]=value // Set item at new location
+                delete this.selectedAgent.flows.in[key] // Remove item from old location
+            } else {
+                console.log('Cannot change to type without label')
+            }
+        },
+        changeOutType(key, value, newName) {
+            if (!(newName==='' || newName===undefined)) { // Make sure it is not the empty string
+                this.agentOutFlow[newName]=value
+                delete this.agentOutFlow[key]
+            } else {
+                console.log('Cannot change to type without label')
+            }
+        },
+        changeThresholdType(key, value, newName) {
+            if (!(newName==='' || newName===undefined)) { // Make sure it is not the empty string
+                this.selectedAgent.thresholds[newName]=value
+                delete this.selectedAgent.thresholds[key]
+            } else {
+                console.log('Cannot change to type without label')
+            }
+        },
+        changePropertyName(key, value, newName) {
+            if (!(newName==='' || newName===undefined)) { // Make sure it is not the empty string
+                this.selectedAgent.properties[newName]=value
+                delete this.selectedAgent.properties[key]
+            } else {
+                console.log('Cannot change to type without label')
+            }
+        },
+        changeGrowthType(kind, value, newName, key) {
+            if (!(newName==='' || newName===undefined)) { // Make sure it is not the empty string
+                this.agentOutFlow[key].growth[newName]=value
+                delete this.agentOutFlow[key].growth[kind]
+            } else {
+                console.log('Cannot change to type without label')
+            }
+        },
+        changeCriterionType(kind, value, newName, key) {
+            // const flow = true
+            // const dirrection = 'out'
+            // const parameter = 'criteria'
+            // this.changeType(kind, value, newName, key, parameter, flow, dirrection)
+            if (!(newName==='' || newName===undefined)) { // Make sure it is not the empty string
+                this.agentOutFlow[key].criteria[newName]=value
+                delete this.agentOutFlow[key].criteria[kind]
+            } else {
+                console.log('Cannot change to type without label')
+            }
+        },
+        changeType(kind, value, newName, key, parameter, flow, dirrection) {
+            if (!(newName==='' || newName===undefined)) { // Make sure it is not the empty string
+                if (!flow) {
+                    this.selectedAgent[parameter][newName]=value
+                    delete this.selectedAgent[parameter][key]
+                } else {
+                    this.selectedAgent.flows[dirrection][parameter][newName]=value
+                    delete this.selectedAgent.flows[dirrection][parameter][kind]
+                }
+            } else {
+                console.log('Cannot change to type without label')
+            }
+        },
+        addNewCapacity(key, value) {
+            // Add the capacity object if it doesn't exist
+            if (!(typeof (this.selectedAgent.capacity)==='object')) {
+                this.selectedAgent.capacity = {}
+            }
+            this.selectedAgent.capacity[key]=value
+        },
+        addNewFlow(direction, currency) {
+            this.selectedAgent.flows[direction][currency]={}
+            this.selectedAgent.flows[direction][currency].flow_rate = {}
+        },
+        addNewThreshold(currency, path, limit, value, connections) {
+            // Add the threshold object if it doesn't exist
+            if (!(typeof (this.selectedAgent.thresholds)==='object')) {
+                this.selectedAgent.thresholds = {}
+            }
+            this.selectedAgent.thresholds[currency]={}
+            this.selectedAgent.thresholds[currency].path=path
+            this.selectedAgent.thresholds[currency].limit=limit
+            this.selectedAgent.thresholds[currency].value=value
+            this.selectedAgent.thresholds[currency].connections=connections
+        },
+        addNewProperty(newPropertyName, newPVal, newPropUnit) {
+            let newPropVal = newPVal
+            if (!Number.isNaN(Number(newPropVal))) { /* If it is a number, make sure it is a number and not a string */
+                newPropVal = +newPropVal
+            }
+            if (newPropVal==='true') { newPropVal = true }
+            if (newPropVal==='false') { newPropVal = false }
+            if (newPropUnit !== '') {
+                this.selectedAgent.properties[newPropertyName] = (
+                    {value: newPropVal, unit: newPropUnit}
+                )
+            } else { // Make sure not to add unit if it is not specified
+                this.selectedAgent.properties[newPropertyName] = (
+                    {value: newPropVal}
+                )
+            }
+        },
+        addFlowArrayItem(direction, type, currency, name) {
+            const agent = this.selectedAgent
+            // Add the array if it doesn't exist
+            if (!(typeof (agent.flows[direction][currency][type])==='object')) {
+                agent.flows[direction][currency][type] = []
+            }
+            // Add the item to the array
+            (agent.flows[direction][currency][type]).push(name)
+        },
+        addNewCriterion(currency, name, value, limit) {
+            const agent = this.selectedAgent
+            // Add Criteria if it doesn't exist
+            if (!(typeof (agent.flows.out[currency].criteria)==='object')) {
+                agent.flows.out[currency].criteria = {}
+            }
+            if (!(typeof (agent.flows.out[currency].criteria[name])==='object')) {
+                agent.flows.out[currency].criteria[name] = {}
+            }
+            // Add the criterion
+            agent.flows.out[currency].criteria[name].value=value
+            agent.flows.out[currency].criteria[name].limit=limit
+        },
+        addNutrition() {
+            const currency = this.currencyDesc[this.selectedCurrencyCategory][this.selectedCurrency]
+            currency.nutrition = {}
+            currency.nutrition.kcal = 0
+            currency.nutrition.water = 0
+            currency.nutrition.protein = 0
+            currency.nutrition.carbohydrate = 0
+            currency.nutrition.fat = 0
+        },
+        deleteNutrition() {
+            delete this.currencyDesc[this.selectedCurrencyCategory][this.selectedCurrency].nutrition
+        },
+        addGrowth(currency, kind, pattern) {
+            const agent = this.selectedAgent
+            if (!(typeof (agent.flows.out[currency].growth)==='object')) {
+                agent.flows.out[currency].growth = {}
+            }
+            agent.flows.out[currency].growth[kind] = {}
+            agent.flows.out[currency].growth[kind].type=pattern
+        },
+        addDeprive(currency, value, unit) {
+            this.selectedAgent.flows.in[currency].deprive = {}
+            this.selectedAgent.flows.in[currency].deprive.value=value
+            this.selectedAgent.flows.in[currency].deprive.unit=unit
+        },
+        createNewAgent() {
+            const agentNumber = Object.keys(this.agentDesc).length + 1
+            const newAgentName=`agent_${agentNumber}`
+            this.agentDesc[newAgentName] = {}
+            this.agentDesc[newAgentName].amount = 1
+            this.agentDesc[newAgentName].flows = {}
+            this.agentDesc[newAgentName].flows.in = {}
+            this.agentDesc[newAgentName].flows.out = {}
+            this.agentDesc[newAgentName].properties = {}
+            this.agentDesc[newAgentName].agent_class=this.categorySelected
+            // Switch to the new agent
+            this.selectedAgentName=newAgentName
+        },
+        createNewCurrency() {
+            // Generate a unique currency name
+            // Count currencies
+            this.selectedCurrencyCategory = this.currencyCategorySelected
+            const currencyList = Object.keys(this.currencyDesc[this.selectedCurrencyCategory])
+            const count = currencyList.length + 1
+            const currencyNumber = count + 1
+            const currency_number_string = `_currency_${currencyNumber}`
+            const newCurrencyName=`${this.selectedCurrencyCategory}${currency_number_string}`
+            // Create the empty object
+            this.currencyDesc[this.selectedCurrencyCategory][newCurrencyName] = {}
+            // Set empty parameters
+            this.currencyDesc[this.selectedCurrencyCategory][newCurrencyName].label=''
+            // Switch to newly generated currency
+            this.generateCurrencyList()
+            this.selectedCurrency=newCurrencyName
+        },
+        duplicateAgent() {
+            const agentNumber = Object.keys(this.agentDesc).length + 1
+            const newAgentName=`${this.selectedAgentName}_${agentNumber}`
+            // Deep Copy the original object
+            const copiedObject = JSON.parse(JSON.stringify(this.selectedAgent))
+            this.agentDesc[newAgentName]=copiedObject
+            // Switch to the copied agent
+            this.selectedAgentName=newAgentName
+            // Make sure to duplicate correspoding plant currency
+            if (this.categorySelected==='plants') {
+                // This really needs to be a notification like an alert, but alert does not pass lint
+                console.log('PLANT. MAKE SURE PLANT FLOW CURRENCIES ARE UPDATED')
+                console.log('AND NEW PLANT CURRENCIES ARE MADE TO MATCH (i.e. rice has rice)')
+                console.log('as outflow, and has rice as a biomass connection)!')
+            }
+        },
+        duplicateCurrency() {
+            // ERROR: Duplicating currency more than once does not update #, currencDesc.length not chging
+            const currencyNumber = Object.keys(this.currencyDesc).length + 1
+            const newCurrencyName=`${this.selectedCurrency}_${currencyNumber}`
+            // Deep Copy the original object
+            const currencyCatSelected = this.currencyDesc[this.currencyCategorySelected]
+            const originalObject = currencyCatSelected[this.selectedCurrency]
+            const copiedObject = JSON.parse(JSON.stringify(originalObject))
+            this.currencyDesc[this.currencyCategorySelected][newCurrencyName]=copiedObject
+            // Switch to the copied agent
+            this.selectedCurrency=newCurrencyName
+            this.generateCurrencyList()
+        },
+        exportJSON() {
+            // Package this agent singly
+            const agentName = this.selectedAgentName
+            this.customAgents[agentName] = this.selectedAgent
+            let currentCustomAgents=localStorage.getItem('customAgents')
+            currentCustomAgents=JSON.parse(currentCustomAgents)
+            // If there isn't a custom agent object, create it.
+            if (!(typeof (currentCustomAgents)==='object' && (currentCustomAgents!==null))) {
+                currentCustomAgents = {}
+            }
+            // Add this agent to the custom agents object.
+            currentCustomAgents[agentName] = this.customAgents[agentName]
+            // Save to the local browser storage
+            localStorage.setItem('customAgents', JSON.stringify(currentCustomAgents))
+            // If plant, export currency for it, too
+            if (this.categorySelected==='plants') {
+                // This really needs to be a notification like an alert, but alert does not pass lint
+                console.log('PLANT EXPORTED. MAKE SURE FLOW CURRENCIES ARE UPDATED, AND NEW PLANT')
+                console.log('CURRENCIES EXPORTED TOO!')
+            }
+        },
+        exportJSONCurrency() {
+            const currencyName = this.selectedCurrency
+            let currentCustomCurrencies = localStorage.getItem('customCurrencies')
+            currentCustomCurrencies = JSON.parse(currentCustomCurrencies)
+            // Check if the custom currency object exists
+            if (typeof (currentCustomCurrencies)==='object' && (currentCustomCurrencies!==null)) {
+                console.log('* Custom currencies object already exist! Appending *')
+            } else { // Create the currency object
+                console.log('* No custom currencies object found, creating from scratch *')
+                currentCustomCurrencies = {}
+            }
+            // Create the currency category
+            /*
+            // In simoc abm, it expects custom currencies to have a "category" property instead of
+            // being filed by category within the currency object. So instead of putting it in the
+            // category, we can just file them under "custom" category and use the parameter
+            // This commented code would be useful to create a custom category hierarchy within
+            // the object if we wanted to change back:
+            if(typeof (currentCustomCurrencies[this.currencyCategorySelected])=='object' &&
+                (currentCustomCurrencies!=null)) {
+            } else {
+                currentCustomCurrencies[this.currencyCategorySelected] = {}
+            }
+            */
+            let exportCategory = this.currencyCategorySelected
+            this.customCurrencies[currencyName] = this.currencyDesc[exportCategory][currencyName]
+            // Assign category for export
+            if (exportCategory==='custom') {
+                exportCategory = this.currencyDesc.custom[currencyName].category
+            } else {
+                this.customCurrencies[currencyName].category = exportCategory
+            }
+            currentCustomCurrencies[currencyName]=this.customCurrencies[currencyName]
+            localStorage.setItem('customCurrencies', JSON.stringify(currentCustomCurrencies))
+        },
+        deleteExportAgent(agent) {
+            let currentCustomAgents=localStorage.getItem('customAgents')
+            currentCustomAgents=JSON.parse(currentCustomAgents)
+            // If there isn't a custom agent object, create it.
+            if (!(typeof (currentCustomAgents)==='object' && (currentCustomAgents!==null))) {
+                currentCustomAgents = {}
+            }
+            // Remove this agent from custom agents object.
+            delete currentCustomAgents[agent]
+            // Save to the local browser storage
+            localStorage.setItem('customAgents', JSON.stringify(currentCustomAgents))
+            // Remove from custom agent names
+            this.localAgentNames = this.localAgentNames.filter(item => item !== agent)
+        },
+        deleteExportCurrency(currency) {
+            let currentCustomCurrencies=localStorage.getItem('customCurrencies')
+            currentCustomCurrencies=JSON.parse(currentCustomCurrencies)
+            // If there isn't a custom agent object, create it.
+            if (!(typeof (currentCustomCurrencies)==='object'&&(currentCustomCurrencies!==null))) {
+                currentCustomCurrencies = {}
+            }
+            // Remove this agent from custom agents object.
+            delete currentCustomCurrencies[currency]
+            // Save to the local browser storage
+            localStorage.setItem('customCurrencies', JSON.stringify(currentCustomCurrencies))
+            // Remove from custom agent names
+            this.localCurrencyNames = this.localCurrencyNames.filter(item => item !== currency)
+        },
+        returnToMenu() { // Function to return to main menu
+            this.$router.push('menu')
+        },
+        switchMode(mode) { // Function to swap between agent mode, currency mode, export data mode
+            this.currentMode=mode
+        },
+        getCriteriaValueModel(currency, kind) { // Function to limit line length in Vue
+            return this.agentOutFlow[currency].criteria[kind].value
+        },
+    },
+}
+</script>
+<template>
+    <div class="navMenu">
+        <button @click="returnToMenu()">Return to Menu</button>
+        <button v-if="currentMode!='exports'" @click="switchMode('exports')">Manage Exports</button>
+        <button v-if="currentMode!='agent'" @click="switchMode('agent')">Agent Editor</button>
+        <button v-if="currentMode!='currency'" @click="switchMode('currency')">Currency Editor</button>
+    </div>
+    <h2 v-if="currentMode==='exports'">Export manager for custom agents and currencies</h2>
+    <div v-if="currentMode==='exports'" class="gridBoxEven">
+        <div class="scrollie agentBox">
+            <h3>Custom Exported Agents</h3>
+            <p>Click to delete</p>
+            <ul>
+                <li v-for="agent in localAgentNames"
+                    :key="agent">
+                    <button @click="deleteExportAgent(agent)">{{agent}}</button>
+                </li>
+            </ul>
+        </div>
+        <div class="scrollie agentBox">
+            <h3>Custom Exported Currencies</h3>
+            <p>Click to delete</p>
+            <ul>
+                <li v-for="currency in localCurrencyNames"
+                    :key="currency">
+                    <button @click="deleteExportCurrency(currency)">{{currency}}</button>
+                </li>
+            </ul>
+        </div>
+    </div>
+    <div v-if="typeof(currencyDesc[currencyCategorySelected])==='object' && currentMode==='currency'">
+        <h2>Currency Editor</h2>
+        <label> Currency Category
+            <select id="currencyCategorySelector" v-model="currencyCategorySelected">
+                <option v-for="category in currencyTypes" :key="category" :value="category"> {{category}} </option>
+            </select>
+        </label>
+        <button @click="createNewCurrency()">Create New Blank Currency</button>
+        <br>
+        <br>
+        <div class="gridBox">
+            <div class="scrollie agentBox">
+                <div id="buttonList">
+                    <ul>
+                        <li v-for="currency in Object.keys(currencyDesc[currencyCategorySelected])"
+                            :key="currency">
+                            <button @click="selectCurrency(currency)">{{currency}}</button>
+                        </li>
+                    </ul>
+                </div> <!-- Button List -->
+            </div> <!-- scrollie -->
+            <div class="agentData">
+                Currency: {{selectedCurrency}}
+                <input v-model="newCurrencyName" type="text" name="newCurrencyName">
+                <button @click="renameCurrency(newCurrencyName)">Rename Currency</button>
+                <button @click="duplicateCurrency()">Duplicate Currency</button>
+                <button @click="exportJSONCurrency()">Export Currency</button>
+                <br>
+                Label :
+                <input v-model="currencyDesc[selectedCurrencyCategory][selectedCurrency].label" name="currencyLabel"
+                       type="text">
+                <br>
+                Description:
+                <input v-model="currencyDesc[selectedCurrencyCategory][selectedCurrency].description"
+                       name="currencyDescription" type="text">
+                <br>
+                Source:
+                <input v-model="currencyDesc[selectedCurrencyCategory][selectedCurrency].source"
+                       name="currencySource" type="text">
+                <br>
+                Unit:
+                <input v-model="currencyDesc[selectedCurrencyCategory][selectedCurrency].unit"
+                       name="currencyUnit" type="text">
+                <br>
+                Short:
+                <input v-model="currencyDesc[selectedCurrencyCategory][selectedCurrency].short"
+                       name="currencyShort" type="text">
+                <br>
+                <span v-if="typeof(currencyDesc[selectedCurrencyCategory][selectedCurrency].nutrition)==='object'">
+                    Nutrition-
+                    <button @click="deleteNutrition()">Delete Nutrition</button>
+                    {{currencyDesc[selectedCurrencyCategory][selectedCurrency].nutrition}}
+                    <br> &nbsp; &nbsp; &nbsp; &nbsp; kcal:
+                    <input v-model="currencyDesc[selectedCurrencyCategory][selectedCurrency].nutrition.kcal"
+                           name="nutkcal" type="number">
+                    <br> &nbsp; &nbsp; &nbsp; &nbsp; water:
+                    <input v-model="currencyDesc[selectedCurrencyCategory][selectedCurrency].nutrition.water"
+                           name="nutwater" type="number">
+                    <br> &nbsp; &nbsp; &nbsp; &nbsp; protein:
+                    <input v-model="currencyDesc[selectedCurrencyCategory][selectedCurrency].nutrition.protein"
+                           name="nutprotein" type="number">
+                    <br> &nbsp; &nbsp; &nbsp; &nbsp; carbohydrates:
+                    <input v-model="currencyDesc[selectedCurrencyCategory][selectedCurrency].nutrition.carbohydrate"
+                           name="nutcarb" type="number">
+                    <br> &nbsp; &nbsp; &nbsp; &nbsp; fat:
+                    <input v-model="currencyDesc[selectedCurrencyCategory][selectedCurrency].nutrition.fat"
+                           name="nutfat" type="number">
+                </span>
+                <button v-else @click="addNutrition()">Add Nutrition </button>
+                <br>
+                <hr>
+                {{currencyDesc[selectedCurrencyCategory][selectedCurrency]}}
+            </div> <!-- CurrencyBox -->
+        </div> <!-- gridBox -->
+    </div> <!-- vif currency object exists -->
+    <div v-if="currentMode==='agent'">
+        <h2> Agent Editor </h2>
+        <p>
+            Supports custom plant agents. Make sure to add the corresponding 'out' flow currencies
+            and biomass connection.
+        </p>
+        <p>
+            For other agent types, the agent editor is experimental or not fully implemented.
+        </p>
+        <label for="categorySelector">Choose Agent Class:  </label>
+        <select id="categorySelector" v-model="categorySelected">
+            <option v-for="category in agentClasses" :key="category" :value="category">
+                {{category}}
+            </option>
+        </select>
+        <button @click="createNewAgent()">Create New Blank Agent</button>
+        <br><br>
+        <div id="gridbox" class="gridBox">
+            <div id="agentSelector" class="scrollie agentBox">
+                <h2> Agents ({{categorySelected}}): </h2>
+                <ul>
+                    <li v-for="item in agentsInClass" :key="item">
+                        <button @click="selectItem(item)">{{item}}</button>
+                    </li>
+                </ul>
+            </div> <!-- Agent Selector -->
+            <div v-if="typeof(agentDesc)==='object'" id="agentPresenter" class="agentData scrollie">
+                <h2> {{selectedAgentName}}  <input v-model="newAgentName" name="newAgentName" type="text">
+                    <button @click="renameAgent(newAgentName)">Rename Agent</button>
+                    <button @click="duplicateAgent()">Duplicate Agent</button>
+                    <button @click="exportJSON()">Export Agent</button>
+                </h2>
+                <ul>
+                    <li>Agent Class:
+                        <select id="categoryChanger" v-model="selectedAgent.agent_class">
+                            <option v-for="category in agentClasses" :key="category" :value="category">
+                                {{category}}
+                            </option>
+                        </select>
+                        <label>
+                            Change to custom class:
+                            <input v-model="customClassName" name="customClass" type="text">
+                        </label>
+                        <button @click="setCustomClass">Set Custom Class</button>
+                    </li>
+                    <li>Description: <br>
+                        <textarea v-model="selectedAgent.description"
+                                  name="descriptionField" rows="4" cols="100" />
+                    </li>
+                </ul>
+                <details>
+                    <summary>Capacity</summary>
+                    <ul>
+                        <li v-for="(value, key) in selectedAgent.capacity" :key="key">
+                            {{key}}
+                            (Change to:
+                            <input v-model="capacityTypes[key]" name="capType" type="text">
+                            <button @click="changeCapacityType(key, value, capacityTypes[key])">Change</button>)
+                            :::::
+                            Quantity:
+                            <input v-model="selectedAgent.capacity[key]" name="capVal" type="number">
+                            <button @click="removeCapacity(key)">Remove Capacity</button>
+                        </li>
+                        <li class="newItem">
+                            New Capacity:
+                            <input v-model="newCapacityType" name="newCapType" type="text">
+                            :::::
+                            Quantity:
+                            <input v-model="newCapacityValue" name="newCapVal" type="number">
+                            <button @click="addNewCapacity(newCapacityType, newCapacityValue)">Add Capacity</button>
+                        </li>
+                    </ul>
+                </details> <!-- END OF CAPACITY -->
+                <details>
+                    <summary>Flows</summary>
+                    <details>
+                        <summary>In Currencies</summary>
+                        <ul> <!-- In currency ul -->
+                            <li v-for="(value, currency) in selectedAgent.flows.in" :key="currency">
+                                <details>
+                                    <summary>{{currency}}
+                                        <button @click="removeInFlow(currency)">Remove In Flow Currency</button>
+                                    </summary>
+                                    <label>Change currency to:
+                                        <select v-model="inTypes[currency]" name="changeInFlowCurrency">
+                                            <option v-for="item in currencyList" :key="item" :value="item">
+                                                {{item}}
+                                            </option>
+                                        </select>
+                                    </label>
+                                    <button @click="changeInType(currency, value, inTypes[currency])">Change</button>
+                                    <ul>
+                                        <li> Value:
+                                            <input v-model="selectedAgent.flows.in[currency].value"
+                                                   name="flowValueFieldIn" type="number">
+                                        </li>
+                                        <li> flow_rate:
+                                            <ul>
+                                                <li>Unit:
+                                                    <input v-model="selectedAgent.flows.in[currency].flow_rate.unit"
+                                                           name="flowInUnit" type="text">
+                                                </li>
+                                                <li>Time:
+                                                    <input v-model="selectedAgent.flows.in[currency].flow_rate.time"
+                                                           name="flowInTime" type="text">
+                                                </li>
+                                            </ul>
+                                        </li>
+                                        <li> connections :
+                                            <span
+                                                v-if="typeof(selectedAgent.flows.in[currency].connections)
+                                                    ==='object'">
+                                                (Click to remove)
+                                                <button
+                                                    v-for="(connection) in
+                                                        selectedAgent.flows.in[currency].connections"
+                                                    :key="connection"
+                                                    @click="removeFlowArrayItem(
+                                                        'in', 'connections',
+                                                        currency, connection)">
+                                                    {{connection}}
+                                                </button>
+                                                <br>
+                                            </span>
+                                            <input v-model="newConnectionIn" name="connectionNewName" type="text">
+                                            <button @click="addFlowArrayItem(
+                                                'in', 'connections', currency, newConnectionIn)">
+                                                Add new Connection
+                                            </button>
+                                        </li>
+                                        <li> weighted:
+                                            <span v-if="typeof(selectedAgent.flows.in[currency].weighted)
+                                                ==='object'">
+                                                (Click to remove)
+                                                <button
+                                                    v-for="(weighted)
+                                                        in selectedAgent.flows.in[currency].weighted"
+                                                    :key="weighted"
+                                                    @click="removeFlowArrayItem('in', 'weighted', currency, weighted)">
+                                                    {{weighted}}
+                                                </button>
+                                                <br>
+                                            </span>
+                                            <input v-model="newWeightedIn" name="newWeighted" type="text">
+                                            <button @click="addFlowArrayItem(
+                                                'in', 'weighted', currency, newWeightedIn)">
+                                                Add new Weighted
+                                            </button>
+                                        </li>
+                                        <li> deprive:
+                                            <ul v-if="typeof(selectedAgent.flows.in[currency].deprive)==='object'">
+                                                <button @click="removeDeprive(currency)">
+                                                    Disable Deprive [Currently Enabled]
+                                                </button>
+                                                <li>Value:
+                                                    <input v-model="selectedAgent.flows.in[currency].deprive.value"
+                                                           name="depriveValue" type="number">
+                                                </li>
+                                                <li>Unit:
+                                                    <input v-model="selectedAgent.flows.in[currency].deprive.unit"
+                                                           name="depriveUnit" type="text">
+                                                </li>
+                                            </ul>
+                                            <ul v-else class="newItem">
+                                                <button @click="addDeprive(currency, newDepriveValue, newDepriveUnit)">
+                                                    Enable Deprive [Currently Disabled]
+                                                </button>
+                                                <li>Value:
+                                                    <input v-model="newDepriveValue"
+                                                           name="newDepriveName" type="number">
+                                                </li>
+                                                <li>Unit:
+                                                    <input v-model="newDepriveUnit" name="newDepriveUnit" type="text">
+                                                </li>
+                                            </ul>
+                                        </li>
+                                    </ul>
+                                </details>
+                            </li>
+                            <li class="newItem"> <!-- NEW FLOW -->
+                                <label>New In Flow:
+                                    <select v-model="newInType" name="newInFlowCurrencySelector">
+                                        <option v-for="item in currencyList"
+                                                :key="item" :value="item">
+                                            {{item}}
+                                        </option>
+                                    </select>
+                                </label>
+                                <button @click="addNewFlow('in', newInType)">Add In Flow Currency</button>
+                            </li>
+                        </ul> <!-- In currency ul -->
+                    </details> <!-- END in currency -->
+                    <details>
+                        <summary>Out Currencies</summary>
+                        <ul> <!-- Out Currency ul -->
+                            <li v-for="(value, currency) in agentOutFlow" :key="currency">
+                                <details>
+                                    <summary>
+                                        {{currency}}
+                                        <button @click="removeOutFlow(currency)">
+                                            Remove Out Flow Currency
+                                        </button>
+                                    </summary>
+                                    Change currency to:
+                                    <label>
+                                        <select v-model="outTypes[currency]" name="changeOutCurrencySelector">
+                                            <option v-for="item in currencyList" :key="item" :value="item">
+                                                {{item}}
+                                            </option>
+                                        </select>
+                                    </label>
+                                    <button @click="changeOutType(currency, value, outTypes[currency])">Change</button>
+                                    <ul> <!-- Out currency -->
+                                        <li> Value:
+                                            <input v-model="agentOutFlow[currency].value"
+                                                   name="flowValueOut" type="number">
+                                        </li>
+                                        <li> flow_rate:
+                                            <ul>
+                                                <li>Unit:
+                                                    <input v-model="agentOutFlow[currency].flow_rate.unit"
+                                                           name="flowUnitOut" type="text">
+                                                </li>
+                                                <li>Time:
+                                                    <input v-model="agentOutFlow[currency].flow_rate.time"
+                                                           name="flowTimeOut" type="text">
+                                                </li>
+                                            </ul>
+                                        </li>
+                                        <li> connections:
+                                            <span v-if="typeof(agentOutFlow[currency].connections)
+                                                ==='object'">
+                                                (Click to remove)
+                                                <button
+                                                    v-for="(connection)
+                                                        in agentOutFlow[currency].connections"
+                                                    :key="connection"
+                                                    @click="removeFlowArrayItem(
+                                                        'out', 'connections', currency, connection)">
+                                                    {{connection}}
+                                                </button>
+                                                <br>
+                                            </span>
+                                            <input v-model="newConnectionOut" name="addNewConnectName" type="text">
+                                            <button @click="addFlowArrayItem(
+                                                'out', 'connections', currency, newConnectionOut)">
+                                                Add new Connection
+                                            </button>
+                                        </li>
+                                        <li> weighted:
+                                            <span v-if="typeof(agentOutFlow[currency].weighted)
+                                                ==='object'">
+                                                (Click to remove)
+                                                <button v-for="(weighted) in
+                                                            agentOutFlow[currency].weighted"
+                                                        :key="weighted"
+                                                        @click="removeFlowArrayItem(
+                                                            'out', 'weighted', currency, weighted)">
+                                                    {{weighted}}
+                                                </button>
+                                                <br>
+                                            </span>
+                                            <input v-model="newWeightedOut" name="addNewWeightedNameOut" type="text">
+                                            <button @click="addFlowArrayItem(
+                                                'out', 'weighted', currency, newWeightedOut)">
+                                                Add new Weighted
+                                            </button>
+                                        </li>
+                                        <li> requires :
+                                            <span v-if="typeof(agentOutFlow[currency].requires)
+                                                ==='object'">
+                                                (Click to remove)
+                                                <button v-for="(requires)
+                                                            in agentOutFlow[currency].requires"
+                                                        :key="requires"
+                                                        @click="removeFlowArrayItem('out',
+                                                                                    'requires',
+                                                                                    currency, requires)">
+                                                    {{requires}}
+                                                </button>
+                                                <br>
+                                            </span>
+                                            <label> (Currency)
+                                                <select v-model="newRequires" name="requiresCurrencySelector">
+                                                    <option v-for="item in currencyList" :key="item"
+                                                            :value="item"> {{item}}
+                                                    </option>
+                                                </select>
+                                            </label>
+                                            <button @click="addFlowArrayItem('out', 'requires', currency, newRequires)">
+                                                Add new Requires
+                                            </button>
+                                        </li>
+                                        <li> growth:
+                                            <ul v-if="typeof(agentOutFlow[currency].growth)==='object'">
+                                                <li v-for="(pattern, kind)
+                                                        in agentOutFlow[currency].growth"
+                                                    :key="kind">
+                                                    {{kind}}
+                                                    (Change to:
+                                                    <input v-model="kindTypes[kind]" name="kindTypeName" type="text">
+                                                    <button @click="changeGrowthType(
+                                                        kind, pattern, kindTypes[kind], currency)">
+                                                        Change
+                                                    </button>)
+                                                    <button @click="removeGrowth(currency, kind)">Remove Growth</button>
+                                                    :::::
+                                                    <ul>
+                                                        <li> Type:
+                                                            <input
+                                                                v-model="agentOutFlow[currency].growth[kind].type"
+                                                                name="growthTypeField" type="text">
+                                                        </li>
+                                                    </ul>
+                                                </li>
+                                            </ul>
+                                            <label>
+                                                New Growth Kind:
+                                                <input v-model="newGrowthKind" name="newGrowthKind" type="text">
+                                            </label>
+                                            <ul>
+                                                <li> Type:
+                                                    <input v-model="newGrowthPattern" name="newGrowthPatternTypeField"
+                                                           type="text">
+                                                </li>
+                                            </ul>
+                                            <button @click="addGrowth(currency, newGrowthKind, newGrowthPattern)">
+                                                Add Growth
+                                            </button>
+                                        </li>
+                                        <li> criteria:
+                                            <ul v-if="typeof(agentOutFlow[currency].criteria)==='object'">
+                                                <li v-for="(pattern, kind)
+                                                    in agentOutFlow[currency].criteria" :key="kind">
+                                                    {{kind}}
+                                                    (
+                                                    <label>Change to:
+                                                        <input v-model="kindTypes[kind]" name="kindTypeCriteria"
+                                                               type="text">
+                                                    </label>
+                                                    <button @click="changeCriterionType(
+                                                        kind, pattern, kindTypes[kind], currency)">
+                                                        Change
+                                                    </button>)
+                                                    <button @click="removeCriterion(currency, kind)">
+                                                        Remove Criterion
+                                                    </button>
+                                                    :::::
+                                                    <ul>
+                                                        <li> Limit:
+                                                            <select
+                                                                v-model="agentOutFlow[currency].criteria[kind].limit"
+                                                                name="criteriaLimitField">
+                                                                <option value="&lt;"> &lt; </option>
+                                                                <option value="&equals;"> = </option>
+                                                                <option value="&gt;"> &gt; </option>
+                                                            </select>
+                                                        </li>
+                                                        <li> Value:
+                                                            <select
+                                                                v-model="agentOutFlow[currency].criteria[kind].value"
+                                                                name="criteriaValueField">
+                                                                <option :value="true">True</option>
+                                                                <option :value="false">False</option>
+                                                            </select>
+                                                        </li>
+                                                    </ul>
+                                                </li>
+                                            </ul>
+                                            <ul>
+                                                <li>
+                                                    <input v-model="newCriterionName" name="newCriterionNameField"
+                                                           type="text">
+                                                    <button @click="addNewCriterion(currency, newCriterionName,
+                                                                                    newCriterionValue,
+                                                                                    newCriterionLimit)">
+                                                        Add new Criterion
+                                                    </button>
+                                                    <ul>
+                                                        <li> Limit:
+                                                            <select v-model="newCriterionLimit"
+                                                                    name="criterionLimitFieldNew">
+                                                                <option value="&lt;"> &lt; </option>
+                                                                <option value="&equals;"> = </option>
+                                                                <option value="&gt;"> &gt; </option>
+                                                            </select>
+                                                        </li>
+                                                        <li> Value:
+                                                            <select v-model="newCriterionValue"
+                                                                    name="criterionValueFieldNew">
+                                                                <option :value="true">True</option>
+                                                                <option :value="false">False</option>
+                                                            </select>
+                                                        </li>
+                                                    </ul>
+                                                </li> <!-- Criterion Item -->
+                                            </ul>
+                                        </li> <!-- Criteria -->
+                                    </ul> <!-- Out currency -->
+                                </details>
+                            </li>
+                            <li class="newItem"> <!-- NEW FLOW -->
+                                <label>
+                                    New Out Flow:
+                                    <select v-model="newOutType" name="outFlowCurrencySelector">
+                                        <option v-for="item in currencyList" :key="item" :value="item">
+                                            {{item}}
+                                        </option>
+                                    </select>
+                                </label>
+                                <button @click="addNewFlow('out',newOutType)">Add Out Flow Currency</button>
+                            </li>
+                        </ul> <!-- Out Currency ul -->
+                    </details><!-- End Out Currency -->
+                </details><details><summary>Thresholds</summary>
+                    <h4> Currencies </h4>
+                    <ul>
+                        <li v-for="(value, currency) in selectedAgent.thresholds" :key="currency">
+                            {{currency}}
+                            (
+                            <label>Change to:
+                                <select v-model="thresholdTypes[currency]" name="changeThresholdCurrency">
+                                    <option v-for="item in currencyList" :key="item" :value="item">
+                                        {{item}}
+                                    </option>
+                                </select>
+                            </label>
+                            <button @click="changeThresholdType(currency, value, thresholdTypes[currency])">Change</button>)
+                            <button @click="removeThreshold(currency)">Remove Currency</button>
+                            <ul>
+                                <li> Path:
+                                    <input v-model="selectedAgent.thresholds[currency].path"
+                                           name="thesholdPathField" type="text">
+                                </li>
+                                <li> Limit:
+                                    <select v-model="selectedAgent.thresholds[currency].limit"
+                                            name="thresholdLimitField">
+                                        <option value="&lt;"> &lt; </option>
+                                        <option value="&equals;"> = </option>
+                                        <option value="&gt;"> &gt; </option>
+                                    </select>
+                                </li>
+                                <li> Value:
+                                    <input v-model="selectedAgent.thresholds[currency].value"
+                                           name="thesholdValueField" type="number">
+                                </li>
+                                <li> Connnections:
+                                    <input v-model="selectedAgent.thresholds[currency].connections"
+                                           name="connectionsThresholdsField" type="text">
+                                </li>
+                            </ul>
+                        </li>
+                        <li class="newItem"> <!-- NEW FLOW -->
+                            <label>New Currency:
+                                <select v-model="newThresholdCurrency" name="newThresholdCurrency" selected="o2">
+                                    <option v-for="item in currencyList" :key="item" :value="item">
+                                        {{item}}
+                                    </option>
+                                </select>
+                            </label>
+                            <ul>
+                                <li> Path:  <input v-model="newThresholdPath" name="newThresholdPathField" type="text">
+                                </li>
+                                <li> Limit:
+                                    <select v-model="newThresholdLimit" name="thresholdLimitFieldNew">
+                                        <option value="&lt;"> &lt; </option>
+                                        <option value="&equals;"> = </option>
+                                        <option value="&gt;"> &gt; </option>
+                                    </select>
+                                </li>
+                                <li> Value: <input v-model="newThresholdValue" type="number" name="newThresholdsValueField">
+                                </li>
+                                <li> Connnections:
+                                    <input v-model="newThresholdConnections" type="text"
+                                           name="newThresholdConnectionsField">
+                                </li>
+                            </ul>
+                            <button @click="addNewThreshold(newThresholdCurrency, newThresholdPath,
+                                                            newThresholdLimit, newThresholdValue,
+                                                            newThresholdConnections)">
+                                Add Threshold Currency
+                            </button>
+                        </li> <!-- NEW FLOW -->
+                    </ul>
+                </details><!-- END OF THRESHOLDS -->
+                <details><summary>Properties</summary>
+                    <ul>
+                        <li v-for="(attributes, property) in selectedAgent.properties" :key="property">
+                            {{property}} (Change to:
+                            <input v-model="propertyNames[property]" name="propertyName" type="text">
+                            <button @click="changePropertyName(property, attributes, propertyNames[property])">
+                                Change
+                            </button>)
+                            <button @click="removeProperty(property)">Remove</button>
+                            <ul> <!-- Property Attributes -->
+                                <li>
+                                    value: {{attributes.value}}
+                                    <input v-model="changedPropVal" name="propVal" type="text">
+                                    <button @click="changePropertyValue(property, changedPropVal)">Change Value</button>
+                                </li>
+                                <li>unit:
+                                    <input v-model="selectedAgent.properties[property].unit"
+                                           name="propUnit" type="text" col="15">
+                                </li>
+                            </ul>
+                        </li>
+                        <li class="newItem">
+                            New Property:
+                            <input v-model="newPropertyName" name="newPropertyName" type="text">
+                            <ul> <!-- Property Attributes -->
+                                <li>value: <input v-model="newPropVal" name="propValField" type="text"> </li>
+                                <li>unit: <input v-model="newPropUnit" name="propUnitField" type="text"> </li>
+                                <button @click="addNewProperty(newPropertyName, newPropVal, newPropUnit)">
+                                    Add New Property
+                                </button>
+                            </ul>
+                        </li>
+                    </ul>
+                </details>
+                <h2> Agent JSON Content View </h2>
+                <hr>
+                <ul>
+                    <li v-for="(value, key) in selectedAgent" :key="key">
+                        <b>{{key}}</b> :
+                        <i v-if="typeof(value)!='object'">{{value}}</i>
+                        <ul v-else>
+                            <li v-for="(subvalue, subkey) in selectedAgent[key]" :key="subkey">
+                                <b>{{subkey}}</b> :
+                                <i v-if="typeof(subvalue)!='object'">{{subvalue}}</i>
+                                <ul v-else>
+                                    <li v-for="(subsubvalue, subsubkey) in selectedAgent[key][subkey]" :key="subsubkey">
+                                        <b>{{subsubkey}}</b> :
+                                        <i v-if="typeof(subsubvalue)!='object'">{{subsubvalue}}</i>
+                                        <ul v-else>
+                                            <li v-for="(subsubsubvalue, subsubsubkey)
+                                                in selectedAgent[key][subkey][subsubkey]" :key="subsubsubkey">
+                                                <b>{{subsubsubkey}}</b> :  {{subsubsubvalue}}
+                                            </li>
+                                        </ul>
+                                    </li>
+                                </ul>
+                            </li>
+                        </ul>
+                    </li>
+                </ul>
+            </div>
+        </div> <!-- gridBox -->
+    </div> <!-- agentMode div -->
+</template>
+<style scoped>
+
+summary {
+    font-weight: bold;
+}
+details {
+    background-color: rgba(150,150,150,0.2);
+    border: 2px dotted grey;
+    padding: 10px;
+}
+details ul {
+    list-style-type: none;
+}
+.navMenu {
+    display: flex;
+    justify-content: center;
+}
+.gridBox {
+            display: grid;
+            grid-template-columns: 1fr 5fr;
+            grid-gap: 10px;
+}
+.gridBoxEven {
+            display: grid;
+            grid-template-columns: 1fr 1fr;
+            grid-gap: 10px;
+}
+.scrollie {
+    overflow-y: scroll !important;
+    /* FireFox */
+    scrollbar-width: auto;
+    scrollbar-color: grey black;
+    height: 400px;
+    width: 100%;
+}
+.agentBox {
+    padding: 3px;
+    border: solid grey 2px;
+}
+.agentData {
+    padding: 5px;
+    border: solid grey 5px;
+    color: white;
+    background-color: rgba(250,100,100,0.1);
+}
+.newItem {
+    background-color: rgba(250,100,100,0.3);
+    border: 2px dotted white;
+}
+</style>
diff --git a/src/components/ace/index.js b/src/components/ace/index.js
new file mode 100644
index 000000000..4998abbcb
--- /dev/null
+++ b/src/components/ace/index.js
@@ -0,0 +1 @@
+export {default as ACE} from './ACE.vue'
diff --git a/src/components/configuration/ConfigurationMenu.vue b/src/components/configuration/ConfigurationMenu.vue
index 871ef18c5..12e4b84d0 100644
--- a/src/components/configuration/ConfigurationMenu.vue
+++ b/src/components/configuration/ConfigurationMenu.vue
@@ -1,3 +1,10 @@
+<!--
+ConfigurationMenu.vue relates to the pop up menu modal accessible by pressing the hamburger
+(3 horizontal line) button that appears in the upper right corner of the screen on the top bar
+when in Simulation Configuration, which is reached after choosing 'Mars' or
+'Biosphere 2' from the "Main Menu" modal menu. See base\BaseConfiguration.vue for the layout of the
+Simulation Configuration itself.
+-->
 <template>
     <BaseMenu>
         <template #menu-title>
diff --git a/src/components/configuration/CustomAgents.vue b/src/components/configuration/CustomAgents.vue
new file mode 100644
index 000000000..9ff42e172
--- /dev/null
+++ b/src/components/configuration/CustomAgents.vue
@@ -0,0 +1,175 @@
+<!-- This component establishes the user interface for configuring the quantity of custom agents that
+have been defined in local storage that should be present in the actual simulation -->
+
+<script>
+
+import {useWizardStore} from '../../store/modules/WizardStore'
+
+export default {
+    setup() {
+        const wizard = useWizardStore()
+        const {
+            setActiveRefEntry,
+        } = wizard
+        return {
+            setActiveRefEntry,
+        }
+    },
+    data() {
+        return {
+            customAgents: [], // List of all the possible custom agents
+            addedCustomAgents: [], // Objects holding name and quantity for each agent
+            // selectedName: 'Agent', // For first custom agent field
+            // selectedNames: [], // For addedCustomAgents fields
+            // customAgentAdd: false,
+        }
+    },
+    computed: {
+        /* Related to formatting like plant species
+        newAgentAddMode() {
+            if (this.addedCustomAgents.length<1 || this.customAgentAdd) {
+                this.selectedName='Agent'
+                return true
+            } else {
+                return false
+            }
+        }
+        */
+    },
+    watch: {/*
+        selectedName() { // Related to formatting custom agents the way plant species are
+            if (this.selectedName!='Agent'){
+                this.addedCustomAgents.push({name: this.selectedName, quantity: 1}) // Add drop selected agent
+                this.selectedName='Agent'
+                this.customAgentAdd=false // Make the 'Agent' template disappear when drop selected
+            } else {
+                console.log(this.selectedName)
+            }
+        },
+        addedCustomAgents() {
+            this.selectedNames = []
+            for (let agent in Object.keys(this.addedCustomAgents)) {
+                this.selectedNames.push(this.addedCustomAgents[agent].name)
+            }
+        }, */
+    },
+    async created() {
+        try {
+            // Get currencies from local storage.
+            // this.getLocalStorageCurrencies()
+            this.getLocalStorageAgents()
+        } catch (error) {
+            console.log(error)
+        }
+    },
+    methods: {
+        getLocalStorageAgents() {
+            let localStorageAgents = localStorage.getItem('customAgents')
+            localStorageAgents = JSON.parse(localStorageAgents)
+            const localAgentNames = Object.keys(localStorageAgents)
+            if (typeof (localStorageAgents)==='object' && (localStorageAgents!==null)) {
+                console.log('Custom agents found in local storage:')
+                for (let index=0; index<localAgentNames.length; ++index) {
+                    // It only adds an agent if it is NOT a plant. Custom plants appear in Plant Species already
+                    if (localStorageAgents[localAgentNames[index]].agent_class==='plants') {
+                        console.log('PLANT: ', localAgentNames[index])
+                    } else {
+                        console.log('NOT PLANT: ', localAgentNames[index])
+                        this.customAgents.push(localAgentNames[index])
+                        const agentObject = {name: localAgentNames[index], quantity: 0}
+                        console.log(agentObject)
+                        this.addedCustomAgents.push(agentObject)
+                    }
+                }
+            } else {
+                console.log(' * No agents loaded from local storage *')
+            }
+        }, /*
+        addCustomAgent(name) { // Related to formatting custom agents the way plant species are
+            this.customAgentAdd = true // This makes the blank 'Agent' Field appear when you hit +
+            console.log(name, this.newAgentAddMode)
+        },
+        removeCustomAgent(name) {
+            console.log('REMOVE AGENT:', name)
+        },
+        updateCustomAgent(number) {
+            console.log('UPDATE TRIED', number)
+        },*/
+    },
+}
+</script>
+<template>
+    <div v-if="customAgents.length>0">
+        <label class="input-wrapper">
+            <div class="input-title" @click="setActiveRefEntry('CustomAgents')"> <!-- Description @ Reference.vue -->
+                Custom Agents <fa-icon :icon="['fa-solid','circle-info']" />
+            </div>
+            <div class="input-description">Custom user defined agents other than plants.</div>
+            <!-- This commented code is to make the agent look like the plant config instead
+                 but it has issues that would need to be resolved and may be unnecessary.
+            <div v-for="(item,index) in addedCustomAgents" :key="index" class="input-plant-wrapper">
+                <select  v-model="selectedNames[index]" class="input-field-select">
+                    <option value="" selected hidden>selectedNames[index]</option>
+                    <option v-for="(name,k) in customAgents" :key="k" :value="name">{{customAgents[k]}}</option>
+                </select>
+                <label><input class="input-field-number" type="number" pattern="^\d+$"
+                              placeholder="Quantity" @input="updateCustomAgent(index)"> units</label>
+                <fa-layers class="fa-2x plant-row-icon icon-add" @click="addCustomAgent(selectedNames[index])">
+                    <fa-icon :icon="['fa-solid','circle-plus']" />
+                </fa-layers>
+                <fa-layers class="fa-2x plant-row-icon icon-trash" @click="removeCustomAgent(selectedNames[index])">
+                    <fa-icon :icon="['fa-solid','trash']" mask="circle" transform="shrink-7" />
+                </fa-layers>
+            </div>
+            <div v-if="newAgentAddMode">
+                <div class="input-plant-wrapper">
+                    <select v-model="selectedName" class="input-field-select">
+                        <option value="Agent" selected hidden disabled>Agent</option>
+                        <option v-for="(name,k) in customAgents" :key="k" :value="name">{{customAgents[k]}}</option>
+                    </select>
+                    <label><input class="input-field-number" type="number" pattern="^\d+$"
+                                  placeholder="Quantity" @input="updateCustomAgent(index)"> units</label>
+                    <fa-layers class="fa-2x plant-row-icon icon-add" @click="addCustomAgent(selectedName)">
+                        <fa-icon :icon="['fa-solid','circle-plus']" />
+                    </fa-layers>
+                    <fa-layers class="fa-2x plant-row-icon icon-trash" @click="removeCustomAgent(selectedName)">
+                        <fa-icon :icon="['fa-solid','trash']" mask="circle" transform="shrink-7" />
+                    </fa-layers>
+                </div>
+            </div>
+             -->
+            <div v-for="agent in addedCustomAgents" :key="agent.name">
+                <b>{{agent.name}}</b>, Quantity:
+                <input v-model="agent.quantity" type="number" style="width: 50px;">
+            </div>
+        </label>
+    </div>
+</template>
+<style lang="scss" scoped>
+    @import '../../sass/components/configuration-input';
+
+    .input-plant-wrapper{
+        display:flex;
+        justify-content:flex-start;
+        align-items:center;
+    }
+
+    .input-field-select{
+        margin-right:24px;
+    }
+
+    .plant-row-icon{
+        &:first-of-type{
+            margin-left:auto;
+        }
+
+        margin-right:24px;
+    }
+
+.crop-mgmt-description{
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    height: 2em;
+}
+</style>
diff --git a/src/components/configuration/Greenhouse.vue b/src/components/configuration/Greenhouse.vue
index 3d33017e9..7575328a3 100644
--- a/src/components/configuration/Greenhouse.vue
+++ b/src/components/configuration/Greenhouse.vue
@@ -1,3 +1,6 @@
+/* This component establishes the user interface for configuring the greenhouse, including
+the list of plants, when the user is in the 'Simulation Configuration' area prior to pressing
+'Launch Simulation' button */
 <template>
     <div>
         <label v-if="simLocation === 'mars'" class="input-wrapper">
@@ -5,7 +8,7 @@
                 Greenhouse <fa-icon :icon="['fa-solid','circle-info']" />
             </div> <!-- On click make the value the active entry on the reference. Set the wiki as active.-->
 
-            <div class="input-description">Select the size of your greenouse. See <a class="reference-link" href="#" @click="activeReference = 'Graphs'">graph at right</a>.</div>
+            <div class="input-description">Select the size of your greenhouse. See <a class="reference-link" href="#" @click="activeReference = 'Graphs'">graph at right</a>.</div>
             <select ref="greenhouse_type" v-model="greenhouse.type"
                     class="input-field-select" required @change="setGreenhouseHandler">
                 <option value="none" selected>None</option>
@@ -38,7 +41,7 @@
                     <fa-icon :icon="['fa-solid','circle-plus']" />
                 </fa-layers>
                 <fa-layers class="fa-2x plant-row-icon icon-trash" @click="removePlantSpecies(index)">
-                    <!-- Deletes the object at the specicied key within the wizard store. -->
+                    <!-- Deletes the object at the specified key within the wizard store. -->
                     <fa-icon :icon="['fa-solid','trash']" mask="circle" transform="shrink-7" />
                 </fa-layers>
             </div>
@@ -81,10 +84,10 @@ export default {
     data() {
         return {
             // Initialize the localized variables used for v-model
-            greenhouse: undefined,
-            plantSpecies: undefined,
-            plantValue: [],
-            plantFormatted: [],
+            greenhouse: undefined, // Used in the v-model for selection of greenhouse.type
+            plantSpecies: undefined, // Used in the v-model to specify sent plant data, including amount
+            plantValue: [], // This list corresponds to the values for the list of config plants
+            plantFormatted: [], // The formatted list of plants to display in the user drop down
             plantMax: [],  // the max m2 for each plant species to fit in the greenhouse
             plant_selects: {},  // map index -> <select> for the plant type dropdown
             plant_inputs: {},  // map index -> <input> for the plant amount
@@ -181,7 +184,7 @@ export default {
             //const indexType = plantSpecies[index].type
 
             let selectedValues = plantSpecies.splice(index,1)
-            return false;
+            return false
         },
 
         // This method should have returned a list of all plant values
@@ -231,16 +234,12 @@ export default {
         // of similar route calls. Simply to reduce the callback hell look.
         retrievePlantSpecies() {
             axios.defaults.withCredentials = true
-
             const params = {agent_class: 'plants'}
-
             axios.get('/get_agent_types', {params}).then(response => {
                 if (response.status === 200) {
                     response.data.forEach(item => {
                         const {name} = item
-                        this.plantValue.push(name)
-                        // console.log(this.formatPlantName(name))
-                        this.formatPlantName(name)
+                        this.listPlant(name)
                     })
                 }
             }).catch(error => {
@@ -249,6 +248,20 @@ export default {
                     console.log('Plant retrieval error')
                 }
             })
+            // Get plants from local data
+            let customAgents = localStorage.getItem('customAgents')
+            if (customAgents == null) return
+            customAgents = JSON.parse(customAgents)
+            const agentNames = Object.keys(customAgents)
+            for (let index=0; index<agentNames.length; ++index) {
+                const name = (agentNames[index])
+                if (customAgents[name].agent_class === 'plants') this.listPlant(name)
+            }
+        },
+        listPlant(name) {
+            // Add the plant to the menu list
+            this.plantValue.push(name)
+            this.formatPlantName(name)
         },
         updateAndValidate() {
             // validate and update greenhouse type
diff --git a/src/components/configuration/Reference.vue b/src/components/configuration/Reference.vue
index 3567b9ac2..e7fb88056 100644
--- a/src/components/configuration/Reference.vue
+++ b/src/components/configuration/Reference.vue
@@ -209,6 +209,10 @@ using v-for to populate all links with the title and the approriate value for th
             <p>The battery holds a maximum of 10,000 kilowatt-hours (kWh).</p>
         </ReferenceItem>
 
+        <ReferenceItem v-if="activeRefEntry === 'CustomAgents'" heading="Custom Agents">
+            <p>For custom agents that are not <a class="reference-link" href="#" @click="setActiveRefEntry('PlantSpecies')">plants</a>, you can specify the quantity here. This could be something like custom electronic devices that consume power. These are user defined agents created by the agent editor.</p>
+        </ReferenceItem>
+
         <div v-if="activeRefEntry === 'Table'">
             <div class="reference-item-title">Table of Contents</div>
             <ul v-if="simLocation === 'mars'">
diff --git a/src/components/configuration/index.js b/src/components/configuration/index.js
index ec816b6b4..6c66920e7 100644
--- a/src/components/configuration/index.js
+++ b/src/components/configuration/index.js
@@ -8,3 +8,4 @@ export {default as Reference} from './Reference.vue'
 export {default as Graphs} from './Graphs.vue'
 export {default as Presets} from './Presets.vue'
 export {default as Layout} from './Layout.vue'
+export {default as CustomAgents} from './CustomAgents.vue'
diff --git a/src/components/entry/Menu.vue b/src/components/entry/Menu.vue
index fcfd4f1a6..0d9b3aa2d 100644
--- a/src/components/entry/Menu.vue
+++ b/src/components/entry/Menu.vue
@@ -11,8 +11,9 @@
                 <button form="login-form" class="btn-normal btn-mars" @click="toConfiguration('mars')">MARS</button>
                 <button form="login-form" class="btn-normal btn-biosphere2" @click="toConfiguration('b2')">BIOSPHERE 2</button>
                 <button form="login-form" class="btn-normal" @click="uploadSimData">LOAD SIMULATION DATA</button>
-                <!-- <button :class="{'hidden': !showAgentEditor}" form="login-form" class="btn-normal"
-                        @click="toAce">AGENT EDITOR</button> -->
+                 <button :class="{'hidden': !showAgentEditor}" form="login-form" class="btn-normal"
+                        @click="toAce">AGENT EDITOR</button>
+
                 <button :class="{'hidden': !showLiveMode}" form="login-form" class="btn-normal"
                         @click="toLiveDashboard">LIVE MODE</button>
                 <input id="simDataInputFile" ref="simDataInputFile" type="file"
@@ -59,7 +60,7 @@ export default {
     },
     data() {
         return {
-            // showAgentEditor: false,
+            showAgentEditor: false,
             showLiveMode: false,
         }
     },
@@ -76,9 +77,9 @@ export default {
             this.$router.push('configuration')
         },
         // Send the user to the ACE Configuration Editor
-        // toAce() {
-        //     this.$router.push('ace')
-        // },
+        toAce() {
+            this.$router.push('ace')
+        },
         /** Routes the user to the live Dashboard. The minimum configuration required for any
          *  Dashboard instance to open without error is the min_step_num and a duration object
          *  composed of an 'amount' key-value pairing. Both of these values can be 0, but the
@@ -136,10 +137,10 @@ export default {
         },
         // Adapted from '../views/DashboardView.vue'
         keyListener(e) {
-            // if (e.ctrlKey && e.key === 'a') {
-            //     e.preventDefault()  // prevent event from propagating to browser
-            //     this.showAgentEditor = true
-            // }
+            if (e.ctrlKey && e.key === 'a') {
+                e.preventDefault()  // prevent event from propagating to browser
+                this.showAgentEditor = true
+            }
             if (e.ctrlKey && e.key === 'k') {
                 e.preventDefault()  // prevent event from propagating to browser
                 this.surveyWasPrompted = true  // do not prompt with survey in kiosk mode
diff --git a/src/router.js b/src/router.js
index 20a09d959..431e367ee 100644
--- a/src/router.js
+++ b/src/router.js
@@ -26,13 +26,11 @@ export default createRouter({
                 },
             ],
         },
-        /*
         {
             path: '/ace',
-            name: 'ace',
-            conponent: () => import('@/views/AceView.vue'),
+            name: 'ACE',
+            component: () => import('@/components/ace/ACE.vue'),
         },
-        */
         {
             path: '/configuration',
             name: 'configuration',
diff --git a/src/views/ConfigurationView.vue b/src/views/ConfigurationView.vue
index 20e41ce8a..b4225555d 100644
--- a/src/views/ConfigurationView.vue
+++ b/src/views/ConfigurationView.vue
@@ -15,6 +15,7 @@
                             <ECLSS ref="eclss" />
                             <Greenhouse ref="greenhouse" />
                             <Energy v-if="simLocation === 'mars'" ref="energy" />
+                            <CustomAgents ref="customAgents" />
                             <!--
                             This works, but breaks the $refs (i.e. this.$refs works, but not this.$refs.component.$refs)
                             <component :is="formName" v-for="formName in forms" :ref="formName.toLowerCase()" />
@@ -49,7 +50,8 @@ import {useWizardStore} from '../store/modules/WizardStore'
 import {useModalStore} from '../store/modules/ModalStore'
 import {TheTopBar} from '../components/bars'
 import {ConfigurationMenu, Presets, Initial, Inhabitants, ECLSS,
-        Greenhouse, Energy, Reference, Graphs, Layout} from '../components/configuration'
+        Greenhouse, Energy, Reference, Graphs, Layout,
+        CustomAgents} from '../components/configuration'
 import {idleMixin} from '../javascript/mixins'
 import b2Url from '@/assets/b2-bg.jpg'
 import marsUrl from '@/assets/mars-bg.jpg'
@@ -67,6 +69,7 @@ export default {
         Reference,
         Graphs,
         Layout,
+        CustomAgents,
     },
     mixins: [idleMixin],
     setup() {
@@ -179,7 +182,9 @@ export default {
             // load cached simdata if the user selects a preset
             const presets = this.getPresets(this.simLocation)
             const preset_name = this.$refs.presets.$refs.preset_dropdown.value
+            let preset_in_use = false
             if (preset_name in presets) {
+                preset_in_use = true
                 let data
                 try {
                     if (this.simLocation === 'b2') {
@@ -218,6 +223,31 @@ export default {
                 // the store will also validate it and throw errors if it's invalid
                 configParams = {step_num: this.getTotalMissionHours,
                                 game_config: this.getFormattedConfiguration}
+                // Inject custom agents
+                if (!preset_in_use) {
+                    let customAgents = localStorage.getItem('customAgents')
+                    let customCurrencies = localStorage.getItem('customCurrencies')
+                    if ((customAgents != null) && (Object.keys(customAgents).length>0)) {
+                        customAgents = JSON.parse(customAgents)
+                        // Add custom agents to config
+                        const agentNames = Object.keys(customAgents)
+                        for (let index=0; index<agentNames.length; ++index) {
+                            const name = (agentNames[index])
+                            configParams.game_config[name]=customAgents[name]
+                        }
+                    }
+                    if ((customCurrencies != null) && (Object.keys(customCurrencies).length>0)) {
+                        customCurrencies = JSON.parse(customCurrencies)
+                        configParams.game_config.currencies = {}
+                        // Add custom currencies to config
+                        const currencyNames = Object.keys(customCurrencies)
+                        for (let index=0; index<currencyNames.length; ++index) {
+                            const name = (currencyNames[index])
+                            configParams.game_config.currencies[name]=customCurrencies[name]
+                        }
+                    }
+                    console.log(configParams)
+                }
             } catch (err_msg) {
                 this.alert(err_msg)
                 return  // abort if there are any errors