1
0
Fork 0

Incremental step toward removing answer stylers

The VFormat system fulfills the same purpose.  This is a small step toward
removing that system; it will first attempt formatting, and fall back to any
available answer stylers.

The validator/formatters will be extracted into liza.
master
Mike Gerwitz 2016-06-21 16:36:38 -04:00
commit 30b33e56c9
4 changed files with 181 additions and 98 deletions

View File

@ -20,6 +20,7 @@
"devDependencies": {
"chai": ">=1.9.1",
"mocha": ">=1.18.2",
"sinon": ">=1.17.4",
"es6-promise": "~3"
},

View File

@ -84,44 +84,6 @@ module.exports = Class( 'ElementStyler',
_answerStyles: {
'currency': function( value )
{
var pre = '$';
if ( !value )
{
value = 0;
}
else if ( value < 0 )
{
value *= -1;
pre = '-$';
}
var formatter = this._getAnswerStyler( 'number' );
return pre + formatter.call( this, ( +value ).toFixed( 2 ) );
},
'dollars': function( value )
{
var formatter = this._getAnswerStyler( 'currency' );
return formatter.call( this, ( +value ).toFixed( 0 ) );
},
'float': function( value )
{
if ( !value )
{
value = 0;
}
var formatter = this._getAnswerStyler( 'number' );
return formatter.call( this, ( +value ).toFixed( 2 ) );
},
'limit': function( value, _, default_val )
{
value = ( value + '' ).replace( ',', '' );
@ -254,7 +216,6 @@ module.exports = Class( 'ElementStyler',
return ret;
},
'includeExclude': function( value, _, default_val )
{
// use the default if no value
@ -268,7 +229,6 @@ module.exports = Class( 'ElementStyler',
: 'Included';
},
/*
* display as a limit, rejected or default if available
*/
@ -298,31 +258,6 @@ module.exports = Class( 'ElementStyler',
return ret;
},
/**
* format thousands
*/
'number': function( value )
{
var str = value.toString().split( '.' );
var len = str[0].length,
ret = '';
for ( var i = 0; i < len; i++ )
{
ret += str[0].charAt( i );
if ( ( ( len - i ) % 3 ) === 1 )
{
ret += ',';
}
}
str[0] = ret.replace( /,$/, '' );
return str.join( '.' )
},
'state': function( value )
{
return State.getName( value );
@ -367,27 +302,6 @@ module.exports = Class( 'ElementStyler',
: val;
},
'manualDate': function( value )
{
if( value.replace )
{
return value.replace(
/^([0-9]{4})-([0-9]+)-([0-9]+)$/,
'$2/$3/$1'
);
}
return null;
},
'date': function( value )
{
var data = value.split( '-' );
// m/d/y
return data[1] + '/' + data[2] + '/' + data[0];
},
'dateTime': function( value )
{
var ret_val = new Date( ( +value ) * 1000 );

View File

@ -407,14 +407,7 @@ module.exports = Class( 'StepUi' )
return;
}
// give the UI a chance to update the DOM; otherwise, the
// answer elements we update may no longer be used (this also
// has performance benefits since it allows repainting before
// potentially heavy processing)
setTimeout( function()
{
_self._updateAnswerFieldData( data );
}, 25 );
_self.answerDataUpdate( data );
} );
doUpdate( bucket.getData() );
@ -442,6 +435,43 @@ module.exports = Class( 'StepUi' )
},
/**
* Update and style answer field data
*
* @param {Object} data key-value diff
*
* @return {undefined}
*/
'virtual protected answerDataUpdate': function( data )
{
var _self = this;
var data_fmt = _self._formatter.format( data );
// give the UI a chance to update the DOM; otherwise, the
// answer elements we update may no longer be used (this also
// has performance benefits since it allows repainting before
// potentially heavy processing)
setTimeout( function()
{
_self._updateAnswerFieldData( data_fmt );
}, 25 );
},
/**
* Retrieve answer DOM context
*
* @param {string} name field name
*
* @return {jQuery} DOM context
*/
'virtual protected getAnswerContext': function( name )
{
return this._answerContext[ name ];
},
/**
* Update DOM answer fields with respective datum in diff DATA
*
@ -458,7 +488,7 @@ module.exports = Class( 'StepUi' )
// changed
for ( var name in data )
{
if ( !( this._answerContext[ name ] ) )
if ( !( this.getAnswerContext( name ) ) )
{
continue;
}
@ -473,7 +503,7 @@ module.exports = Class( 'StepUi' )
// update every index on the DOM
i = this.styler.getAnswerElementByName(
name, undefined, undefined,
this._answerContext[ name ]
this.getAnswerContext( name )
).length;
}
@ -515,7 +545,7 @@ module.exports = Class( 'StepUi' )
// if we've already found an element for this ref, then it is
// referenced in multiple places; simply store the context as the
// entire step
if ( _self._answerContext[ ref_id ] )
if ( _self.getAnswerContext( ref_id ) )
{
_self._answerContext[ ref_id ] = _self.$content;
return;
@ -545,7 +575,7 @@ module.exports = Class( 'StepUi' )
'private _updateAnswer': function( name, index, value )
{
var $element = this.styler.getAnswerElementByName(
name, index, null, ( this._answerContext[ name ] || this.$content )
name, index, null, ( this.getAnswerContext( name ) || this.$content )
);
var i = $element.length;

View File

@ -0,0 +1,138 @@
/**
* Test case for GeneralStepUi
*
* Copyright (C) 2016 LoVullo Associates, Inc.
*
* This file is part of the Liza Data Collection Framework
*
* Liza is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
var Sut = require( '../../../' ).ui.step.GeneralStepUi,
expect = require( 'chai' ).expect,
sinon = require( 'sinon' ),
Class = require( 'easejs' ).Class;
describe( 'ui.GeneralStepUi', function()
{
describe( 'on answer data change', function()
{
it( 'will attempt pre-style with formatter', function( done )
{
var orig_data = {
foo: [ "orig" ],
},
fmt_data = {
foo: [ "formatted" ],
};
var formatter = createFormatter(),
mock_fmt = sinon.mock( formatter );
mock_fmt.expects( 'format' )
.once()
.withExactArgs( orig_data )
.returns( fmt_data );
createSut( formatter, function( name, value )
{
// by the time the answer data makes its way to the
// element styler, it should have already been
// formatted
expect( name ).to.equal( 'foo' );
expect( value ).to.equal( fmt_data.foo[ 0 ] );
mock_fmt.verify();
done();
} ).answerDataUpdate( orig_data );
} );
} );
} );
/**
* Create new SUT with formatter FORMATTER and generated element
* styler
*
* @param {Object} formatter validator/formatter mock
* @param {function(string,*)} style_callback styler styleAnswer method dfn
*
* @return {Sut}
*/
function createSut( formatter, style_callback )
{
return Sut.extend(
{
// visibility escalation
'override answerDataUpdate': function( data )
{
return this.__super( data );
},
'override getAnswerContext': function( name )
{
return {};
},
} )(
{},
createElementStyler( style_callback ),
formatter
);
}
/**
* Create mock ElementStyler
*
* styleAnswer method is defined by STYLE_CALLBACK
*
* @return {Object} ElementStyler mock
*/
function createElementStyler( style_callback )
{
return {
getAnswerElementByName: function()
{
// jQuery element
return {
attributes: [],
length: 1,
text: function() {},
}
},
styleAnswer: style_callback,
};
}
/**
* Create mock validator/formatter
*
* The only method provided is `format', which contains no definition;
* it is expected to be mocked by the caller.
*
* @param {Object}
*/
function createFormatter( expected, return_data )
{
return {
format: function()
{
},
}
}