Be careful where you put commas ,
and check if everything is closed {
with }
brackets correctly.
Basically you shouldn't put any ,
before closing brackets }
or ]
like you did at the end:
},
});
or after '#CVCs',
cVCs: '#CVCs',
},
Also are you sure you want to put },
after this.getPanelArea().add(myNewPanel);
?
this.getPanelArea().add(myNewPanel);
},
This will close your controller definition but you have two more function piccsClicked
and cvcsClicked
that should go before the closing },
.
Moreover closing the controller should be });
and not },
(might have been left there accidentaly).
Try this:
var current = 1;
var myPanel = new Array("panelOne", "panelOneP", "panelTwoP", "panelThreeP", "panelFourP", "panelFiveP", "panelOneC", "panelTwoC", "panelThreeC", "panelFourCVC", "panelFiveC", "panelSixCGraph", "panelSixPGraph");
Ext.define("myApp.controller.MainController", {
extend: "Ext.app.Controller",
config: {
refs: {
main: '#main',
backButton: '#backButton',
nextButton: '#nextButton',
panelArea: '#panelArea', //this panel is in main view along with some other panels, among the other panels there is a panel which contains the back and next buttons
panelOne: '#panelOne', // these are the views extending Ext.Panel
panelOneP: '#panelOneP',
panelTwoP '#panelTwoP',
panelThreeP: '#panelThreeP',
panelFourP: '#panelFourP',
panelFiveP: '#panelFiveP',
panelSixPGraph: '#panelSixPGraph',
panelOneC: '#panelOneC',
panelTwoC: '#panelTwoC',
panelThreeC: '#panelThreeC',
panelFourC: '#panelFourC',
panelFiveC: '#panelFiveC',
panelSixCGraph: '#panelSixCGraph',
piccs: '#piccs', // these two are images in the panelOne
cVCs: '#CVCs'
},
control: {
cVCs: {
tap: 'cvcsClicked'
},
piccs: {
tap: 'piccsClicked'
},
backButton: {
tap: 'navigateBack'
},
nextButton: {
tap: 'navigateNext'
}
}
},
navigateBack: function () {
current = current - 1;
this.addPanel(myPanel[current]);
},
navigateNext: function () {
current = current + 1;
this.addPanel(myPanel[current]);
},
addPanel: function (newPanel) {
this.getPanelArea().removeAt(0);
},
var myNewPanel = Ext.create('Ext.Panel', {
items: [{
xtype: "" + newPanel + "" // every view is given ID exactly as in the array
}]
});
this.getPanelArea().add(myNewPanel);
piccsClicked: function () {
var current = this.getPiccs().getSrc();
if (current == 'resources/images/checkBoxUnchecked.jpg') {
this.getPiccs().setSrc('resources/images/checkBoxChecked.jpg');
} else {
this.getPiccs().setSrc('resources/images/checkBoxUnchecked.jpg');
}
},
cvcsClicked: function () {
var current = this.getCVCs().getSrc();
if (current == 'resources/images/checkBoxUnchecked.jpg') {
this.getCVCs().setSrc('resources/images/checkBoxChecked.jpg');
} else {
this.getCVCs().setSrc('resources/images/checkBoxUnchecked.jpg');
}
}
});