diff --git a/src/ui/step/StepUi.js b/src/ui/step/StepUi.js index e166d0b..fb4ea44 100644 --- a/src/ui/step/StepUi.js +++ b/src/ui/step/StepUi.js @@ -25,6 +25,9 @@ * - ElementStyler; * - BucketDataValidator. * - Global references (e.g. jQuery) must be removed. + * - jQuery must be eliminated. + * - The public API now accepts and returns vanilla DOM content, so at + * least it's encapsulated now. * - Checkbox-specific logic must be extracted. * - This class is doing too much. * @end needsLove @@ -235,13 +238,14 @@ module.exports = Class( 'StepUi' ) /** * Sets content to be displayed * - * @param {jQuery} $content content to display + * @param {HTMLElement} content content to display * * @return {StepUi} self */ - 'public setContent': function( $content ) + 'public setContent': function( content ) { - this.$content = $content; + // TODO: transition away from jQuery + this.$content = $( content ); this._processAnswerFields(); @@ -263,11 +267,11 @@ module.exports = Class( 'StepUi' ) /** * Returns the generated step content as a jQuery object * - * @return {jQuery} generated step content + * @return {HTMLElement} generated step content */ - getContent: function() + 'virtual getContent': function() { - return this.$content; + return this.$content[ 0 ]; }, diff --git a/src/ui/step/StepUiBuilder.js b/src/ui/step/StepUiBuilder.js index 240c921..4d7770f 100644 --- a/src/ui/step/StepUiBuilder.js +++ b/src/ui/step/StepUiBuilder.js @@ -160,10 +160,11 @@ module.exports = Class( 'StepUiBuilder' ) } // enclose it in a div so that we have a single element we can query, - // making our lives much easier + // making our lives much easier (TODO: this is transitional code + // moving from jQuery to vanilla DOM) ui.setContent( $( '
') - .append( $( data.content.html ) ) + .append( $( data.content.html ) )[ 0 ] ); // free the content from memory, as it's no longer needed (we don't need @@ -203,8 +204,10 @@ module.exports = Class( 'StepUiBuilder' ) step = ui.getStep(); + var $content = $( ui.getContent() ); + // instantiate a group object for each of the groups within this step - var $groups = ( ui.getContent().find( '.stepGroup' ) ).each( function() + var $groups = $content.find( '.stepGroup' ).each( function() { group = _self._groupBuilder( $( this ), _self._elementStyler ); group_id = group.getGroupId();