You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
99 lines
2.2 KiB
99 lines
2.2 KiB
|
|
function createWord( word )
|
|
{
|
|
var s = '';
|
|
for( var i = 0; i < word.length; i++ )
|
|
{
|
|
ch = word.charAt( i );
|
|
s +=
|
|
'<span class="upper">' +
|
|
'<span>' + ch + '</span>' +
|
|
(( i < word.length - 1 ) ?
|
|
'<span class="dash">–</span>' : '' ) +
|
|
'</span>';
|
|
}
|
|
return s;
|
|
}
|
|
|
|
$(document).ready(function()
|
|
{
|
|
var w = new wcontainer( "#ub-widget" );
|
|
|
|
w.setEditContent( '<div class="inputwrap"><input class="percent" value="so*phis*ti*ca*ted"></div>' );
|
|
w.setViewContent( '<span class="upper"><span class="dash fixed">—</span></span>' );
|
|
w.setData( "dashWidth", w.elements.container.find( "span.dash" ).outerWidth() );
|
|
w.setViewContent( "" );
|
|
|
|
// onViewMode
|
|
w.onViewMode = function()
|
|
{
|
|
var word = w.elements.container.find( "input" ).val().trim( ['*'] );
|
|
|
|
w.setData( "word", word );
|
|
word = word.replace( /\*/g, '' );
|
|
w.setViewContent( createWord( word ) );
|
|
w.elements.container.find( "span.upper" ).click( function(){
|
|
$( this ).find( "span.dash" ).toggleClass( "fixed" );
|
|
w.adjustSize();
|
|
w.checkAnswer();
|
|
});
|
|
w.checkAnswer();
|
|
};
|
|
|
|
// viewSize
|
|
w.viewSize = function()
|
|
{
|
|
var w = 0;
|
|
var h = 0;
|
|
|
|
winstance.elements.containerView.find( "span.upper span:visible" ).each( function()
|
|
{
|
|
w += $( this ).outerWidth();
|
|
h = Math.max( h, $( this ).outerHeight() );
|
|
});
|
|
var dw = winstance.getData( "dashWidth" );
|
|
|
|
return { w: w+dw, h: h };
|
|
};
|
|
|
|
// editSize
|
|
w.editSize = function()
|
|
{
|
|
return {
|
|
w: winstance.elements.containerEdit.find( "input" ).outerWidth( true ),
|
|
h: winstance.elements.containerEdit.find( "input" ).outerHeight( true ),
|
|
};
|
|
};
|
|
|
|
|
|
w.checkAnswer = function()
|
|
{
|
|
var word = "";
|
|
this.elements.container.find( "span.upper span:visible" ).each( function()
|
|
{
|
|
if( this.className.indexOf( "fixed" ) != -1 ){
|
|
word += '*';
|
|
}
|
|
else if( this.className.indexOf( "dash" ) != -1 ){
|
|
return;
|
|
}
|
|
else{
|
|
word += $( this ).text();
|
|
}
|
|
});
|
|
|
|
if( word == this.getData( "word" ) ){
|
|
this.elements.container.addClass( "answerRight" );
|
|
}
|
|
else{
|
|
this.elements.container.removeClass( "answerRight" );
|
|
}
|
|
};
|
|
|
|
|
|
window.w = w;
|
|
window.winstance = w;
|
|
|
|
w.modeView();
|
|
|
|
}); |