Compass and the StressLess study

The Compass mobile application is a part of the StressLess study, a study purposed for finding out how effective the Muse and Spire devices are in improving stress management during the intervention period for cancer patients. "We hope to gather information on how people choose to use new technology to manage stress," states Partner's Healthcare.

When I jumped into Compass, the application just needed a few weeks worth of a features to complete and deliver into production. My role in the finalization and delivery of Compass was more like that of a full-stack web developer, meaning that I produced features for both the front and back end of the application.

Ongoing Refactoring of the FreeText Widget

The team developed widgets for components of the application's interface that require certain common behavior like with text inputs, different types of buttons, and multiple choice questions. I worked on the FreeText widget for a specific feature story with the goal of changing the 'return' key on an IOS keyboard to say 'next' and focus to the next text field (nope this isn't a native function you can just implement with one line of code!).

Compass involves quite a few pages worth of survey questions involving text inputs, so it's helpful for the users to really streamline the onboarding process as much as possible by reducing the amount of user input required to navigate through the application. I'll include a snippit of what was needed to make this happen:

var args = arguments[0] || {};
 
 //Initial load values
 $.title.text = args.title;
 $.title2.text = args.title2;
 if (args.default)
 	$.textarea.setValue(args.default);
 if(args.statement){
 	$.statement.setText(args.statement);
 }
 else{
 	$.statement.setVisible(false);
 	$.statement.setHeight(0);
 	$.statement.setWidth(0);
 }
 if(args.statement2){
 	$.statement2.setText(args.statement2);
 }
 else{
 	$.statement2.setVisible(false);
 	$.statement2.setHeight(0);
 	$.statement2.setWidth(0);
 }
 
 $.textarea.addEventListener('return', function(){
 	$.textarea.blur();
 	$.textarea2.focus();
 
 });
 
 /*if (args.params.subType == 'text') {
 	$.textarea.setKeyboardType(Ti.UI.RETURNKEY_NEXT);
 }*/
 
 if (args.params && args.params.subType) {
 	switch (args.params.subType) {
 		case 'number':
 			$.textarea.setKeyboardType(Ti.UI.KEYBOARD_NUMBERS_PUNCTUATION);
 		break;
 		case 'text':
 			//$.textarea.setKeyboardType(returnKeyType:Ti.UI.RETUR);
 		break;
 		
 	}
 	
 }
 
 //Global function to set title
 exports.setTitle = function(title){
 	$.title.text = title;
 };
 
 //Global function to get answer value
 exports.getValue = function() {
 	return $.textarea.value;
 };
 
 exports.setValue = function(val) {
 	$.textarea.setValue(val);
 };

We originally thought a function like this would be very simple, but the way that the FreeText was implemented (as a 'textarea' where all 'textfield's are given the same ID with which to call them) meant that behavioral changes would spread across all of them. Since we didn't want every textfield to have this 'next' behavior, we added another widget called 'FreeTextGroup' and built on that instead.