MOS
/
OpenBoard
5
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

upgraded interactivities

Browse Source
preferencesAboutTextFull
unknown 13 years ago
parent 50062d9d68
commit 698ec0e2c7
5 changed files with 640 additions and 536 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 237
      resources/library/sankoreInteractivities/ord-phrases.wgt/template/scripts/template2.js
  2. 275
      resources/library/sankoreInteractivities/ord-words.wgt/template/scripts/template2.js
  3. 320
      resources/library/sankoreInteractivities/spl-phrase.wgt/scripts/app.js
  4. 324
      resources/library/sankoreInteractivities/spl-text.wgt/scripts/app2.js
  5. 194
      resources/library/sankoreInteractivities/spl-word.wgt/scripts/spl-word.js

237
resources/library/sankoreInteractivities/ord-phrases.wgt/template/scripts/template2.js
Unescape View File

@ -5,12 +5,12 @@
function startEditing()
{
modeEdit();
modeEdit();
}
function stopEditing()
{
modeView();
modeView();
}
function initialize()
@ -20,7 +20,7 @@ function initialize()
function checkResponse()
{
checkWord();
checkWord();
}
/*
/ END sankore api
@ -28,7 +28,16 @@ function checkResponse()
var sentence = "this is\nan example\nsentence";
var sentence = "";
var curSentence = "";
if(window.sankore){
sentence = (sankore.preference("rightOrdPhrases", ""))?sankore.preference("rightOrdPhrases", ""):"this is\nan example\nsentence";
curSentence = (sankore.preference("currentOrdPhrases", ""))?sankore.preference("currentOrdPhrases", ""):"";
} else {
sentence = "this is\nan example\nsentence";
}
var doCheck = true;
// array of dom elements
@ -47,10 +56,10 @@ var widget_padding = 100;
function str_replace( w, b, s ){
while( s.indexOf( w ) != -1 ){
s = s.replace( w, b );
}
return s;
while( s.indexOf( w ) != -1 ){
s = s.replace( w, b );
}
return s;
}
/*
@ -61,16 +70,16 @@ shuffles an array
*/
function shuffle( arr )
{
var pos, tmp;
for( var i = 0; i < arr.length; i++ )
{
pos = Math.round( Math.random() * ( arr.length - 1 ) );
tmp = arr[pos];
arr[pos] = arr[i];
arr[i] = tmp;
}
return arr;
var pos, tmp;
for( var i = 0; i < arr.length; i++ )
{
pos = Math.round( Math.random() * ( arr.length - 1 ) );
tmp = arr[pos];
arr[pos] = arr[i];
arr[i] = tmp;
}
return arr;
}
/*
@ -81,34 +90,34 @@ returns array of dom elements
*/
function createElements( sentence )
{
var el;
var elements = [];
var phrases = sentence.split( "\n" );
for( i in phrases )
{
el = document.createElement( "div" );
$( el ).addClass( "phrase" ).text( phrases[i] );
elements.push( el );
}
return elements;
var el;
var elements = [];
var phrases = sentence.split( "\n" );
for( i in phrases )
{
el = document.createElement( "div" );
$( el ).addClass( "phrase" ).text( phrases[i] );
elements.push( el );
}
return elements;
}
function checkSentence()
{
if( !doCheck )
return;
var ph = [];
$( "#mp_word .phrase" ).each( function()
{
ph.push( $( this ).text() );
});
if( ph.join( "\n" ) == str_replace( "\r", "", sentence ) ){
$( "#mp_word .phrase" ).addClass( "right" );
}
if( !doCheck )
return;
var ph = [];
$( "#mp_word .phrase" ).each( function()
{
ph.push( $( this ).text() );
});
if( ph.join( "\n" ) == str_replace( "\r", "", sentence ) ){
$( "#mp_word .phrase" ).addClass( "right" );
}
}
/*
@ -119,49 +128,56 @@ turns the widget into the view mode
*/
function modeView()
{
if( editMode ){
sentence = str_replace( "\r", "", $( "#mp_word textarea" ).attr( "value" ) );
var p = sentence.split( "\n" );
var p2 = [];
var t;
for( var i in p )
{
t = jQuery.trim( p[i] );
if( t ) p2.push( t );
}
sentence = p2.join( "\n" );
}
// if no sankore api, insert edit button
if( !isSankore ){
$( "#mp_setup" ).empty().append( '<input type="button" value="Edit">' );
$( "#mp_setup input:button" ).click( function(){
modeEdit();
});
}
// clean the previous word
$( "#mp_word" ).empty();
// create new set of elements
var phrases = shuffle( createElements( sentence ) );
for( i in phrases ){
$("#mp_word").append( phrases[i] );
}
// in sankore api there would be a function to check
// the answer, so no update parameter would be needed
$( "#mp_word" ).sortable();
if( !isSankore ){
$( "#mp_word" ).sortable( { update: checkSentence } );
} else
$( "#mp_word" ).sortable();
// adjustHeight
var aHeight = $( phrases[0] ).outerHeight( true );
// apply new width
adjust( aHeight * phrases.length );
if( editMode ){
sentence = str_replace( "\r", "", $( "#mp_word textarea" ).attr( "value" ) );
var p = sentence.split( "\n" );
var p2 = [];
var t;
for( var i in p )
{
t = jQuery.trim( p[i] );
if( t ) p2.push( t );
}
sentence = p2.join( "\n" );
}
// if no sankore api, insert edit button
if( !isSankore ){
$( "#mp_setup" ).empty().append( '<input type="button" value="Edit">' );
$( "#mp_setup input:button" ).click( function(){
modeEdit();
});
}
// clean the previous word
$( "#mp_word" ).empty();
var phrases;
// create new set of elements
if(window.sankore && curSentence && !editMode)
phrases = createElements( curSentence );
else
phrases = shuffle( createElements( sentence ) );
for( i in phrases ){
$("#mp_word").append( phrases[i] );
}
// in sankore api there would be a function to check
// the answer, so no update parameter would be needed
$( "#mp_word" ).sortable();
if( !isSankore ){
$( "#mp_word" ).sortable( {
update: checkSentence
} );
} else
$( "#mp_word" ).sortable();
// adjustHeight
var aHeight = $( phrases[0] ).outerHeight( true );
// apply new width
adjust( aHeight * phrases.length );
}
@ -172,11 +188,13 @@ adjust width or height
*/
function adjust( height )
{
$( "#mp_word" ).animate( {height: height } );
// if viewed as a widget, resize the window
if( !isBrowser ){
window.resizeTo( widget.width, height + widget_padding );
}
$( "#mp_word" ).animate( {
height: height
} );
// if viewed as a widget, resize the window
if( !isBrowser ){
window.resizeTo( widget.width, height + widget_padding );
}
}
/*
@ -186,26 +204,39 @@ modeEdit
*/
function modeEdit()
{
editMode = true;
// if no sankore api, insert ok button
if( !isSankore )
{
$( "#mp_setup" ).empty().append( '<input type="button" value="OK">' );
$( "#mp_setup input:button" ).click( function(){
modeView();
});
}
$( "#mp_word").css( "margin-left", 0 ).empty()
.append('<textarea cols="50" rows="5">'+sentence+'</textarea>');
adjust( $( "#mp_word textarea" ).outerHeight() );
editMode = true;
// if no sankore api, insert ok button
if( !isSankore )
{
$( "#mp_setup" ).empty().append( '<input type="button" value="OK">' );
$( "#mp_setup input:button" ).click( function(){
modeView();
});
}
$( "#mp_word").css( "margin-left", 0 ).empty()
.append('<textarea cols="50" rows="5">'+sentence+'</textarea>');
adjust( $( "#mp_word textarea" ).outerHeight() );
}
$(window).mouseout(function(){
if(window.sankore){
var ph = [];
$( "#mp_word .phrase" ).each( function()
{
ph.push( $( this ).text() );
});
sankore.setPreference("currentOrdPhrases", ph.join( "\n" ));
sankore.setPreference("rightOrdPhrases", sentence);
}
});
$(document).ready(function()
{
$("#ub-widget").append( '\
$("#ub-widget").append( '\
<div id="mp_setup"></div>\
<div id="mp_word"></div>\
');
modeView();
modeView();
});

275
resources/library/sankoreInteractivities/ord-words.wgt/template/scripts/template2.js
Unescape View File

@ -5,12 +5,12 @@
function startEditing()
{
modeEdit();
modeEdit();
}
function stopEditing()
{
modeView();
modeView();
}
function initialize()
@ -20,7 +20,7 @@ function initialize()
function checkResponse()
{
checkWord();
checkWord();
}
/*
/ END sankore api
@ -28,7 +28,16 @@ function checkResponse()
var word = "a*long*,*long*time*ago*...";
var word = "";
var curWord = "";
if(window.sankore){
word = (sankore.preference("rightOrdWords", ""))?sankore.preference("rightOrdWords", ""):"a*long*,*long*time*ago*...";
curWord = (sankore.preference("currentOrdWords", ""))?sankore.preference("currentOrdWords", ""):"";
} else {
word = "a*long*,*long*time*ago*...";
}
var img = "template/images/horse.png";
var doCheckWord = true;
@ -55,31 +64,31 @@ returns array of dom elements
*/
function createWordLetters( word )
{
var ch, el;
var letters = [];
if( word.indexOf( '*' ) != -1 )
{
var tmp = word.split( '*' );
for( i in tmp )
{
ch = tmp[i];
el = document.createElement( "div" );
$(el).addClass( "letter" ).text( ch );
letters.push( el );
}
}
else
{
for( var i = 0; i < word.length; i++ )
{
ch = word.charAt( i );
el = document.createElement( "div" );
$(el).addClass( "letter" ).text( ch );
letters.push( el );
}
}
return letters;
var ch, el;
var letters = [];
if( word.indexOf( '*' ) != -1 )
{
var tmp = word.split( '*' );
for( i in tmp )
{
ch = tmp[i];
el = document.createElement( "div" );
$(el).addClass( "letter" ).text( ch );
letters.push( el );
}
}
else
{
for( var i = 0; i < word.length; i++ )
{
ch = word.charAt( i );
el = document.createElement( "div" );
$(el).addClass( "letter" ).text( ch );
letters.push( el );
}
}
return letters;
}
@ -92,22 +101,22 @@ if they are in the right order
*/
function checkWord()
{
if( !doCheckWord )
return;
var str = "";
$( "#mp_word .letter" ).each( function(){
str += $(this).text();
});
var w = word;
while( w.indexOf( '*' ) != -1 )
{
w = w.replace( '*', '' );
}
if( str == w ){
$( "#mp_word .letter" ).addClass( "right" );
//message( "Right!" );
}
if( !doCheckWord )
return;
var str = "";
$( "#mp_word .letter" ).each( function(){
str += $(this).text();
});
var w = word;
while( w.indexOf( '*' ) != -1 )
{
w = w.replace( '*', '' );
}
if( str == w ){
$( "#mp_word .letter" ).addClass( "right" );
//message( "Right!" );
}
}
/*
@ -118,16 +127,16 @@ shuffles an array
*/
function shuffle( arr )
{
var pos, tmp;
for( var i = 0; i < arr.length; i++ )
{
pos = Math.round( Math.random() * ( arr.length - 1 ) );
tmp = arr[pos];
arr[pos] = arr[i];
arr[i] = tmp;
}
return arr;
var pos, tmp;
for( var i = 0; i < arr.length; i++ )
{
pos = Math.round( Math.random() * ( arr.length - 1 ) );
tmp = arr[pos];
arr[pos] = arr[i];
arr[i] = tmp;
}
return arr;
}
@ -140,56 +149,63 @@ turns the widget into the view mode
*/
function modeView()
{
if( editMode ){
word = $( "#mp_word input:text" ).attr( "value" );
}
// if no sankore api, insert edit button
if( !isSankore ){
$( "#mp_setup" ).empty().append( '<input type="button" value="Edit">' );
$( "#mp_setup input:button" ).click( function(){
modeEdit();
});
}
// clean the previous word
$( "#mp_word" ).empty();
// create new set of letters
var letters = shuffle( createWordLetters( word ) );
for( i in letters ){
$("#mp_word").append( letters[i] );
}
// in sankore api there would be a function to check
// the answer, so no update parameter would be needed
if( !isSankore ){
$( "#mp_word" ).sortable( { update: checkWord } );
} else $( "#mp_word" ).sortable();
// adjustWidth
var totalLettersWidth = 0;
for( i in letters ){
var currentWidth = $( letters[i] ).outerWidth( true );
totalLettersWidth += currentWidth;
}
totalLettersWidth += 1;
var width = Math.max(
totalLettersWidth,
min_view_width
);
// shift the words to the right to center them
if( width > totalLettersWidth ){
$( "#mp_word" ).css( "margin-left", Math.round( (width - totalLettersWidth)/2 ) );
}
else{
$( "#mp_word" ).css( "margin-left", 0 );
}
// apply new width
adjustWidth( width );
if( editMode ){
word = $( "#mp_word input:text" ).attr( "value" );
}
// if no sankore api, insert edit button
if( !isSankore ){
$( "#mp_setup" ).empty().append( '<input type="button" value="Edit">' );
$( "#mp_setup input:button" ).click( function(){
modeEdit();
});
}
// clean the previous word
$( "#mp_word" ).empty();
// create new set of letters
var letters;
if(window.sankore && curWord && !editMode)
letters = createWordLetters( curWord );
else
letters = shuffle( createWordLetters( word ) );
for( i in letters ){
$("#mp_word").append( letters[i] );
}
// in sankore api there would be a function to check
// the answer, so no update parameter would be needed
if( !isSankore ){
$( "#mp_word" ).sortable( {
update: checkWord
} );
} else $( "#mp_word" ).sortable();
// adjustWidth
var totalLettersWidth = 0;
for( i in letters ){
var currentWidth = $( letters[i] ).outerWidth( true );
totalLettersWidth += currentWidth;
}
totalLettersWidth += 1;
var width = Math.max(
totalLettersWidth,
min_view_width
);
// shift the words to the right to center them
if( width > totalLettersWidth ){
$( "#mp_word" ).css( "margin-left", Math.round( (width - totalLettersWidth)/2 ) );
}
else{
$( "#mp_word" ).css( "margin-left", 0 );
}
// apply new width
adjustWidth( width );
}
@ -200,11 +216,13 @@ adjustWidth
*/
function adjustWidth( width )
{
$( "#ub-widget" ).animate( {width: width } );
// if viewed as a widget, resize the window
if( !isBrowser ){
window.resizeTo( width + widget_padding, widget.height );
}
$( "#ub-widget" ).animate( {
width: width
} );
// if viewed as a widget, resize the window
if( !isBrowser ){
window.resizeTo( width + widget_padding, widget.height );
}
}
/*
@ -214,25 +232,36 @@ modeEdit
*/
function modeEdit()
{
editMode = true;
// if no sankore api, insert ok button
if( !isSankore )
{
$( "#mp_setup" ).empty().append( '<input type="button" value="OK">' );
$( "#mp_setup input:button" ).click( function(){
modeView();
});
}
$( "#mp_word").css( "margin-left", 0 ).empty().append('<input value="'+word+'">');
adjustWidth( input_width );
editMode = true;
// if no sankore api, insert ok button
if( !isSankore )
{
$( "#mp_setup" ).empty().append( '<input type="button" value="OK">' );
$( "#mp_setup input:button" ).click( function(){
modeView();
});
}
$( "#mp_word").css( "margin-left", 0 ).empty().append('<input value="'+word+'">');
adjustWidth( input_width );
}
$(window).mouseout(function(){
if(window.sankore){
var str = "";
$( "#mp_word .letter" ).each( function(){
str += $(this).text();
});
sankore.setPreference("currentOrdWords", str);
sankore.setPreference("rightOrdWords", word);
}
});
$(document).ready(function()
{
$("#ub-widget").append( '\
$("#ub-widget").append( '\
<div id="mp_setup"></div>\
<div id="mp_word"></div>\
');
modeView();
modeView();
});

320
resources/library/sankoreInteractivities/spl-phrase.wgt/scripts/app.js
Unescape View File

@ -3,162 +3,178 @@
function createElements( phrase )
{
var s = '';
for( var i = 0; i < phrase.length; i++ )
{
ch = phrase.charAt( i );
if( ch == " " ){
ch = "&nbsp;";
}
s += '<div class="letter">' + ch + '</div>' +
'<div class="dash">&nbsp;</div>';
}
return s;
var s = '';
for( var i = 0; i < phrase.length; i++ )
{
ch = phrase.charAt( i );
if( ch == " " ){
ch = "&nbsp;";
}
s += '<div class="letter">' + ch + '</div>' +
'<div class="dash">&nbsp;</div>';
}
return s;
}
$(document).ready(function()
{
var w = new wcontainer( "#ub-widget" );
w.maxWidth = 600;
w.setEditContent( '<div class="inputwrap"><textarea class="percent">this is a bunch of words which should be split apart</textarea></div>' );
w.setViewContent( '<div class="upper"><div class="dash fixed">. </div></div>' );
w.setData( "dashWidth", w.elements.container.find( ".dash" ).outerWidth() );
w.setViewContent( '<div class="upper"><div class="dash fixed">M</div></div>' );
w.setData( "lineHeight", w.elements.container.find( ".dash" ).outerHeight() );
w.setViewContent( "" );
// onViewMode
w.onViewMode = function()
{
// clean up the text
var phrase = w.elements.container.find( "textarea" ).val()
.replace( /\r/g, '' ).replace( /\n/g, ' ' ).replace( / /g, ' ' ).trim();
// store the text
w.setData( "phrase", phrase );
// remove all dots (they are to be set during the exercise)
phrase = phrase.replace( / /g, '' );
// create the html
w.setViewContent( createElements( phrase ) );
// the behaviour
w.elements.containerView.find( ".letter" )
.mouseover( function()
{
var el = $( this ).next();
// determine new hover class
var is_fixed = ( el.get( 0 ).className.indexOf( "fixed" ) != -1 );
var hover_class = is_fixed?
"dash_hover_fixed" : "dash_hover";
// assign new hover class
el.addClass( hover_class )
.data( "hc", hover_class );
})
.mouseout( function()
{
var el = $( this ).next();
// remove current hover class
var hc = el.data( "hc" );
el.removeClass( hc );
})
.click( function()
{
var el = $( this ).next();
// remove current hover class
$( this ).trigger( "mouseout" );
// toggle fixed class
el.toggleClass( "fixed" );
// determine new hover class
// assign new hover class
$( this ).trigger( "mouseover" );
w.checkAnswer();
w.adjustSize();
});
w.checkAnswer();
};
// viewSize
w.viewSize = function()
{
var w = 0;
var h = 0;
var dh = winstance.getData( "lineHeight" );
var dw = winstance.getData( "dashWidth" );
winstance.elements.containerView.find( "div:visible" ).each( function()
{
w += $( this ).outerWidth();
h = Math.max( h, $( this ).outerHeight( true ) );
});
var square = w*h;
h = Math.max( h, $( winstance.elements.containerView ).height() );
if( winstance.maxWidth )
{
w = Math.min( w, winstance.maxWidth );
h = parseInt( square / w );
}
return { w: w, h: h+dh };
};
// editSize
w.editSize = function()
{
return {
w: winstance.elements.containerEdit.find( "textarea" ).parent().outerWidth( true ),
h: winstance.elements.containerEdit.find( "textarea" ).parent().outerHeight( true ),
};
};
w.checkAnswer = function()
{
var phrase = "";
var ch = "";
this.elements.containerView.find( "div:visible" ).each( function()
{
if( this.className.indexOf( "fixed" ) != -1 ){
phrase += ' ';
}
else if( this.className.indexOf( "dash" ) != -1 ){
return;
}
else{
ch = $( this ).html();
phrase += ch;
}
});
if( phrase == this.getData( "phrase" ) ){
this.elements.containerView.addClass( "answerRight" );
}
else{
this.elements.containerView.removeClass( "answerRight" );
}
};
window.w = w;
window.winstance = w;
w.modeView();
var w = new wcontainer( "#ub-widget" );
var sentence = "";
if(window.sankore)
sentence = (sankore.preference("ordSplPhrases", ""))?sankore.preference("ordSplPhrases", ""):"this is a bunch of words which should be split apart";
else
sentence = "this is a bunch of words which should be split apart";
w.maxWidth = 600;
w.setEditContent( '<div class="inputwrap"><textarea class="percent">' + sentence + '</textarea></div>' );
w.setViewContent( '<div class="upper"><div class="dash fixed">. </div></div>' );
w.setData( "dashWidth", w.elements.container.find( ".dash" ).outerWidth() );
w.setViewContent( '<div class="upper"><div class="dash fixed">M</div></div>' );
w.setData( "lineHeight", w.elements.container.find( ".dash" ).outerHeight() );
w.setViewContent( "" );
// onViewMode
w.onViewMode = function()
{
// clean up the text
var phrase = w.elements.container.find( "textarea" ).val()
.replace( /\r/g, '' ).replace( /\n/g, ' ' ).replace( / /g, ' ' ).trim();
// store the text
w.setData( "phrase", phrase );
// remove all dots (they are to be set during the exercise)
phrase = phrase.replace( / /g, '' );
// create the html
w.setViewContent( createElements( phrase ) );
// the behaviour
w.elements.containerView.find( ".letter" )
.mouseover( function()
{
var el = $( this ).next();
// determine new hover class
var is_fixed = ( el.get( 0 ).className.indexOf( "fixed" ) != -1 );
var hover_class = is_fixed?
"dash_hover_fixed" : "dash_hover";
// assign new hover class
el.addClass( hover_class )
.data( "hc", hover_class );
})
.mouseout( function()
{
var el = $( this ).next();
// remove current hover class
var hc = el.data( "hc" );
el.removeClass( hc );
})
.click( function()
{
var el = $( this ).next();
// remove current hover class
$( this ).trigger( "mouseout" );
// toggle fixed class
el.toggleClass( "fixed" );
// determine new hover class
// assign new hover class
$( this ).trigger( "mouseover" );
w.checkAnswer();
w.adjustSize();
});
w.checkAnswer();
};
// viewSize
w.viewSize = function()
{
var w = 0;
var h = 0;
var dh = winstance.getData( "lineHeight" );
var dw = winstance.getData( "dashWidth" );
winstance.elements.containerView.find( "div:visible" ).each( function()
{
w += $( this ).outerWidth();
h = Math.max( h, $( this ).outerHeight( true ) );
});
var square = w*h;
h = Math.max( h, $( winstance.elements.containerView ).height() );
if( winstance.maxWidth )
{
w = Math.min( w, winstance.maxWidth );
h = parseInt( square / w );
}
return {
w: w,
h: h+dh
};
};
// editSize
w.editSize = function()
{
return {
w: winstance.elements.containerEdit.find( "textarea" ).parent().outerWidth( true ),
h: winstance.elements.containerEdit.find( "textarea" ).parent().outerHeight( true ),
};
};
w.checkAnswer = function()
{
var phrase = "";
var ch = "";
this.elements.containerView.find( "div:visible" ).each( function()
{
if( this.className.indexOf( "fixed" ) != -1 ){
phrase += ' ';
}
else if( this.className.indexOf( "dash" ) != -1 ){
return;
}
else{
ch = $( this ).html();
phrase += ch;
}
});
if( phrase == this.getData( "phrase" ) ){
this.elements.containerView.addClass( "answerRight" );
}
else{
this.elements.containerView.removeClass( "answerRight" );
}
};
window.w = w;
window.winstance = w;
w.modeView();
$(window).mouseout(function(){
if(window.sankore){
sankore.setPreference("ordSplPhrases", w.getData("phrase"));
}
});
});

324
resources/library/sankoreInteractivities/spl-text.wgt/scripts/app2.js
Unescape View File

@ -3,168 +3,182 @@
function createElements( text )
{
var s = '';
var s = '';
var words = text.split( " " );
var words = text.split( " " );
for( var i = 0; i < words.length; i++ )
{
if( i ){
s += '<div>&nbsp;</div>';
}
s += '<div class="letter">' + words[i] + '</div>' +
'<div class="dash">.</div>';
}
for( var i = 0; i < words.length; i++ )
{
if( i ){
s += '<div>&nbsp;</div>';
}
s += '<div class="letter">' + words[i] + '</div>' +
'<div class="dash">.</div>';
}
return s;
return s;
}
$(document).ready(function()
{
var w = new wcontainer( "#ub-widget" );
w.maxWidth = 600;
w.setEditContent( '<div class="inputwrap"><textarea class="percent">hello, this is the first sentence. hi, this is the second sentence. hello again, this is the third sentence. good morning, this is the fifth sentence. hi, sorry, i\'m late, i\'m the fourth sentence.</textarea></div>' );
w.setViewContent( '<div class="upper"><div class="dash fixed">. </div></div>' );
w.setData( "dashWidth", w.elements.container.find( ".dash" ).outerWidth() );
w.setViewContent( '<div class="upper"><div class="dash fixed">M</div></div>' );
w.setData( "lineHeight", w.elements.container.find( ".dash" ).outerHeight() );
w.setViewContent( "" );
// onViewMode
w.onViewMode = function()
{
// clean up the text
var text = w.elements.container.find( "textarea" ).val()
.replace( /\r/g, '' ).replace( /\n/g, ' ' ).replace( / /g, ' ' );
// store the text
w.setData( "text", text );
// remove all dots (they are to be set during the exercise)
text = text.replace( /\. /g, ' ' ).trim( ["."] );
// create the html
w.setViewContent( createElements( text ) );
// the behaviour
w.elements.containerView.find( ".letter" )
.mouseover( function()
{
var el = $( this ).next();
// determine new hover class
var is_fixed = ( el.get( 0 ).className.indexOf( "fixed" ) != -1 );
var hover_class = is_fixed?
"dash_hover_fixed" : "dash_hover";
// assign new hover class
el.addClass( hover_class )
.data( "hc", hover_class );
})
.mouseout( function()
{
var el = $( this ).next();
// remove current hover class
var hc = el.data( "hc" );
el.removeClass( hc );
})
.click( function()
{
var el = $( this ).next();
// remove current hover class
$( this ).trigger( "mouseout" );
// toggle fixed class
el.toggleClass( "fixed" );
// determine new hover class
// assign new hover class
$( this ).trigger( "mouseover" );
w.checkAnswer();
w.adjustSize();
});
w.checkAnswer();
};
// viewSize
w.viewSize = function()
{
var w = 0;
var h = 0;
var dh = winstance.getData( "lineHeight" );
var dw = winstance.getData( "dashWidth" );
winstance.elements.containerView.find( "div:visible" ).each( function()
{
w += $( this ).outerWidth();
h = Math.max( h, $( this ).outerHeight( true ) );
});
var square = w*h;
h = Math.max( h, $( winstance.elements.containerView ).height() );
if( winstance.maxWidth )
{
w = Math.min( w, winstance.maxWidth );
h = parseInt( square / w );
}
return { w: w, h: h+dh };
};
// editSize
w.editSize = function()
{
return {
w: winstance.elements.containerEdit.find( "textarea" ).parent().outerWidth( true ),
h: winstance.elements.containerEdit.find( "textarea" ).parent().outerHeight( true ),
};
};
w.checkAnswer = function()
{
var text = "";
var ch = "";
this.elements.containerView.find( "div:visible" ).each( function()
{
if( this.className.indexOf( "fixed" ) != -1 ){
text += '.';
}
else if( this.className.indexOf( "dash" ) != -1 ){
return;
}
else{
ch = $( this ).html();
if( ch == "&nbsp;" ){
ch = " ";
}
text += ch;
}
});
console.log( text );
if( text == this.getData( "text" ) ){
this.elements.containerView.addClass( "answerRight" );
}
else{
this.elements.containerView.removeClass( "answerRight" );
}
};
window.w = w;
window.winstance = w;
w.modeView();
var w = new wcontainer( "#ub-widget" );
var sentences = "";
if(window.sankore)
sentences = (sankore.preference("ordSplText", ""))?sankore.preference("ordSplText", ""):"hello, this is the first sentence. hi, this is the second sentence. hello again, this is the third sentence. good morning, this is the fifth sentence. hi, sorry, i\'m late, i\'m the fourth sentence.";
else
sentences = "hello, this is the first sentence. hi, this is the second sentence. hello again, this is the third sentence. good morning, this is the fifth sentence. hi, sorry, i\'m late, i\'m the fourth sentence.";
w.maxWidth = 600;
w.setEditContent( '<div class="inputwrap"><textarea class="percent">' + sentences + '</textarea></div>' );
w.setViewContent( '<div class="upper"><div class="dash fixed">. </div></div>' );
w.setData( "dashWidth", w.elements.container.find( ".dash" ).outerWidth() );
w.setViewContent( '<div class="upper"><div class="dash fixed">M</div></div>' );
w.setData( "lineHeight", w.elements.container.find( ".dash" ).outerHeight() );
w.setViewContent( "" );
// onViewMode
w.onViewMode = function()
{
// clean up the text
var text = w.elements.container.find( "textarea" ).val()
.replace( /\r/g, '' ).replace( /\n/g, ' ' ).replace( / /g, ' ' );
// store the text
w.setData( "text", text );
// remove all dots (they are to be set during the exercise)
text = text.replace( /\. /g, ' ' ).trim( ["."] );
// create the html
w.setViewContent( createElements( text ) );
// the behaviour
w.elements.containerView.find( ".letter" )
.mouseover( function()
{
var el = $( this ).next();
// determine new hover class
var is_fixed = ( el.get( 0 ).className.indexOf( "fixed" ) != -1 );
var hover_class = is_fixed?
"dash_hover_fixed" : "dash_hover";
// assign new hover class
el.addClass( hover_class )
.data( "hc", hover_class );
})
.mouseout( function()
{
var el = $( this ).next();
// remove current hover class
var hc = el.data( "hc" );
el.removeClass( hc );
})
.click( function()
{
var el = $( this ).next();
// remove current hover class
$( this ).trigger( "mouseout" );
// toggle fixed class
el.toggleClass( "fixed" );
// determine new hover class
// assign new hover class
$( this ).trigger( "mouseover" );
w.checkAnswer();
w.adjustSize();
});
w.checkAnswer();
};
// viewSize
w.viewSize = function()
{
var w = 0;
var h = 0;
var dh = winstance.getData( "lineHeight" );
var dw = winstance.getData( "dashWidth" );
winstance.elements.containerView.find( "div:visible" ).each( function()
{
w += $( this ).outerWidth();
h = Math.max( h, $( this ).outerHeight( true ) );
});
var square = w*h;
h = Math.max( h, $( winstance.elements.containerView ).height() );
if( winstance.maxWidth )
{
w = Math.min( w, winstance.maxWidth );
h = parseInt( square / w );
}
return {
w: w,
h: h+dh
};
};
// editSize
w.editSize = function()
{
return {
w: winstance.elements.containerEdit.find( "textarea" ).parent().outerWidth( true ),
h: winstance.elements.containerEdit.find( "textarea" ).parent().outerHeight( true ),
};
};
w.checkAnswer = function()
{
var text = "";
var ch = "";
this.elements.containerView.find( "div:visible" ).each( function()
{
if( this.className.indexOf( "fixed" ) != -1 ){
text += '.';
}
else if( this.className.indexOf( "dash" ) != -1 ){
return;
}
else{
ch = $( this ).html();
if( ch == "&nbsp;" ){
ch = " ";
}
text += ch;
}
});
if( text == this.getData( "text" ) ){
this.elements.containerView.addClass( "answerRight" );
}
else{
this.elements.containerView.removeClass( "answerRight" );
}
};
window.w = w;
window.winstance = w;
w.modeView();
$(window).mouseout(function(){
if(window.sankore){
sankore.setPreference("ordSplText", w.getData( "text" ));
}
});
});

194
resources/library/sankoreInteractivities/spl-word.wgt/scripts/spl-word.js
Unescape View File

@ -1,99 +1,113 @@
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">&ndash;</span>' : '' ) +
'</span>';
}
return s;
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">&ndash;</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">&mdash;</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();
var w = new wcontainer( "#ub-widget" );
var words = "";
if(window.sankore)
words = (sankore.preference("ordSplWords", ""))?sankore.preference("ordSplWords", ""):"so*phis*ti*ca*ted";
else
words = "so*phis*ti*ca*ted";
w.setEditContent( '<div class="inputwrap"><input class="percent" value="' + words + '"></div>' );
w.setViewContent( '<span class="upper"><span class="dash fixed">&mdash;</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();
$(window).mouseout(function(){
if(window.sankore){
sankore.setPreference("ordSplWords", w.getData("word"));
}
});
});
Write Preview
Loading…
Cancel
Save