@ -14,7 +14,7 @@
* /
var sankoreLang = {
display : "Affich er" ,
display : "Ferm er" ,
edit : "Modifier" ,
add : "Ajouter" ,
enter _data : "Saisir la donnée:" ,
@ -28,24 +28,25 @@ var sankoreLang = {
none : "aucun" ,
help : "Aide" ,
help _content : "<p><h2>Contraste</h2></p>" +
"<p><h3>Jeu de couleurs.</h3></p>" +
"<p><h3>Jeu de couleurs.</h3></p>" +
"<p>Cette activité permet de masquer et d’afficher du texte en jouant sur la couleur de fond (jaune ou noir). Le but est de pouvoir faire apparaître des données en passant d’une couleur à l’autre.</p>" +
"<p>Cette activité permet de masquer et d’afficher du texte en jouant sur la couleur de fond (jaune ou noir). Le but est de pouvoir faire apparaître des données en passant d’une couleur à l’autre.</p>" +
"<p>Le bouton “Recharger” réinitialise les exercices.</p>" +
"<p>Le bouton “Recharger” réinitialise les exercices.</p>" +
"<p>Le bouton “Modifier” vous permet :</p>" +
"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>" +
"<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>" +
"<p>Le bouton “Modifier” vous permet :</p>" +
"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>" +
"<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>" +
"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “+ Ajouter” en haut, puis</p>" +
"<ul><li>saisissez la donnée par exemple “3x15”,</li>" +
"<li>saisissez le résultat, par exemple “15” et cliquez sur “OK”.</li></ul>" +
"<p>Pour modifier les données ou les résultats, cliquez directement sur l’exercice.</p>" +
"<p>Pour supprimer un exercice, cliquez sur la croix en haut à droite de l’exercice.</p>" +
"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “+ Ajouter” en haut, puis</p>" +
"<ul><li>saisissez la donnée par exemple “3x15”,</li>" +
"<li>saisissez le résultat, par exemple “15” et cliquez sur “OK”.</li></ul>" +
"<p>Pour modifier les données ou les résultats, cliquez directement sur l’exercice.</p>" +
"<p>Pour supprimer un exercice, cliquez sur la croix en haut à droite de l’exercice.</p>" +
"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>" ,
theme : "Thème"
} ;
function init ( ) {
@ -61,6 +62,8 @@ function init(){
var flagForSelect = false ;
var dragElement = null ; //the element that must be dragging
var lang = "" ; //locale language
var resizeFlag = true ;
var coords = {
left : 0 ,
top : 0
@ -82,9 +85,11 @@ function init(){
$ ( "#wgt_reload" ) . text ( sankoreLang . reload ) ;
$ ( "#wgt_help" ) . text ( sankoreLang . help ) ;
$ ( "#help" ) . html ( sankoreLang . help _content ) ;
$ ( ".style_select option[value='1']" ) . text ( sankoreLang . slate ) ;
$ ( ".style_select option[value='2']" ) . text ( sankoreLang . pad ) ;
$ ( ".style_select option[value='3']" ) . text ( sankoreLang . none ) ;
$ ( "#style_select option[value='1']" ) . text ( sankoreLang . slate ) ;
$ ( "#style_select option[value='2']" ) . text ( sankoreLang . pad ) ;
$ ( "#style_select option[value='3']" ) . text ( sankoreLang . none ) ;
var tmpl = $ ( "div.inline label" ) . html ( ) ;
$ ( "div.inline label" ) . html ( sankoreLang . theme + tmpl )
if ( window . sankore ) {
if ( sankore . preference ( "blackYellowData" , "" ) ) {
@ -109,7 +114,7 @@ function init(){
if ( window . sankore ) {
if ( sankore . preference ( "by_style" , "" ) ) {
changeStyle ( sankore . preference ( "by_style" , "" ) ) ;
$ ( ". style_select" ) . val ( sankore . preference ( "by_style" , "" ) ) ;
$ ( "# style_select" ) . val ( sankore . preference ( "by_style" , "" ) ) ;
} else
changeStyle ( "3" )
} else
@ -120,9 +125,15 @@ function init(){
if ( ! $ ( this ) . hasClass ( "selected" ) ) {
$ ( this ) . addClass ( "selected" ) ;
$ ( "#wgt_edit" ) . removeClass ( "selected" ) ;
$ ( ".style_select" ) . css ( "display" , "none" ) ;
$ ( "#parameters" ) . css ( "display" , "none" ) ;
var tmpwh = $ ( window ) . height ( ) ;
var tmpww = $ ( window ) . width ( ) ;
resizeFlag = true ;
window . resizeTo ( tmpww , tmpwh - 44 )
$ ( "#data" ) . css ( "padding-bottom" , "" ) ;
$ ( "#leftDiv" ) . css ( "border-top-left-radius" , "7px" ) ;
$ ( "#rightDiv" ) . css ( "border-top-right-radius" , "7px" ) ;
$ ( this ) . css ( "display" , "none" ) ;
$ ( "#wgt_add" ) . css ( "display" , "none" ) ;
$ ( "#wgt_edit" ) . css ( "display" , "block" ) ;
mode = false ;
$ ( ".leftDiv, .rightDiv" ) . animate ( {
@ -135,7 +146,7 @@ function init(){
tmpReadyTask . width ( $ ( domElem ) . width ( ) )
. height ( $ ( domElem ) . height ( ) )
. css ( "position" , "absolute" )
. css ( "top" , $ ( domElem ) . position ( ) . top )
. css ( "top" , $ ( domElem ) . position ( ) . top - 40 )
. css ( "left" , $ ( domElem ) . position ( ) . left )
. find ( ".taskContainer" ) . removeAttr ( "contenteditable" ) ;
@ -146,15 +157,22 @@ function init(){
opacityChanged = false ;
}
} ) ;
$ ( document ) . disableTextSelect ( ) ;
}
} else {
if ( ! $ ( this ) . hasClass ( "selected" ) ) {
$ ( this ) . addClass ( "selected" ) ;
$ ( "#wgt_display" ) . removeClass ( "selected" ) ;
$ ( ".style_select" ) . css ( "display" , "block" ) ;
$ ( "#parameters" ) . css ( "display" , "block" ) ;
tmpwh = $ ( window ) . height ( ) ;
tmpww = $ ( window ) . width ( ) ;
resizeFlag = true ;
window . resizeTo ( tmpww , tmpwh + 44 )
$ ( "#data" ) . css ( "padding-bottom" , "42px" ) ;
$ ( "#leftDiv" ) . css ( "border-top-left-radius" , "0px" ) ;
$ ( "#rightDiv" ) . css ( "border-top-right-radius" , "0px" ) ;
$ ( this ) . css ( "display" , "none" ) ;
$ ( "#wgt_add" ) . css ( "display" , "block" ) ;
$ ( "#wgt_display" ) . css ( "display" , "block" ) ;
mode = true ;
$ ( document ) . enableTextSelect ( ) ;
@ -189,12 +207,15 @@ function init(){
$ ( "#wgt_help" ) . click ( function ( ) {
var tmp = $ ( this ) ;
if ( $ ( this ) . hasClass ( "open" ) ) {
$ ( this ) . removeClass ( "help_pad" ) . removeClass ( "help_wood" )
$ ( "#help" ) . slideUp ( "100" , function ( ) {
tmp . removeClass ( "open" ) ;
$ ( "#data" ) . show ( ) ;
( $ ( "#wgt_edit" ) . hasClass ( "selected" ) ) ? $ ( "#parameters" ) . show ( ) : '' ;
} ) ;
} else {
$ ( "#data" ) . hide ( ) ;
( $ ( "#style_select" ) . val ( ) == 1 ) ? $ ( this ) . removeClass ( "help_pad" ) . addClass ( "help_wood" ) : $ ( this ) . removeClass ( "help_wood" ) . addClass ( "help_pad" ) ;
$ ( "#data, #parameters" ) . hide ( ) ;
$ ( "#help" ) . slideDown ( "100" , function ( ) {
tmp . addClass ( "open" ) ;
} ) ;
@ -218,10 +239,10 @@ function init(){
$ ( document ) . disableTextSelect ( ) ;
} ) ;
$ ( ". style_select option[value='1']" ) . text ( sankoreLang . slate ) ;
$ ( ". style_select option[value='2']" ) . text ( sankoreLang . pad ) ;
$ ( "# style_select option[value='1']" ) . text ( sankoreLang . slate ) ;
$ ( "# style_select option[value='2']" ) . text ( sankoreLang . pad ) ;
$ ( ". style_select" ) . change ( function ( event ) {
$ ( "# style_select" ) . change ( function ( event ) {
changeStyle ( $ ( this ) . find ( "option:selected" ) . val ( ) ) ;
} )
@ -372,12 +393,12 @@ function init(){
if ( ( prevBottom + 15 + curHeight ) < ( $ ( window ) . height ( ) - 54 ) )
curr . css ( "top" , prevBottom + 15 + "px" ) ;
else
curr . css ( "top" , "6 0px" ) . css ( "left" , prevLeft + 255 + "px" ) ;
curr . css ( "top" , "10 0px" ) . css ( "left" , prevLeft + 255 + "px" ) ;
} else {
if ( ( prevBottom + 15 + curHeight ) < ( $ ( window ) . height ( ) - 54 ) )
curr . css ( "top" , prevBottom + 15 + "px" ) . css ( "left" , prevLeft + "px" ) ;
else
curr . css ( "top" , "6 0px" ) . css ( "left" , prevLeft + 255 + "px" ) ;
curr . css ( "top" , "10 0px" ) . css ( "left" , prevLeft + 255 + "px" ) ;
}
prevBottom = curr . position ( ) . top + curr . height ( ) ,
prevLeft = curr . position ( ) . left ;
@ -390,28 +411,31 @@ function init(){
popupBack . css ( "left" , ( $ ( window ) . width ( ) - 360 ) * 50 / $ ( window ) . width ( ) + "%" ) ;
$ ( window ) . resize ( function ( ) {
if ( $ ( "#wgt_edit" ) . hasClass ( "selected" ) ) {
if ( $ ( ".editContainer" ) . size ( ) > 1 ) {
var prev = $ ( ".editContainer:first" ) ,
prevBottom = prev . position ( ) . top + prev . height ( ) ,
prevLeft = prev . position ( ) . left ;
recursionCall ( prevBottom , prevLeft , prev . next ( ) ) ;
if ( ! resizeFlag ) {
if ( $ ( "#wgt_edit" ) . hasClass ( "selected" ) ) {
if ( $ ( ".editContainer" ) . size ( ) > 1 ) {
var prev = $ ( ".editContainer:first" ) ,
prevBottom = prev . position ( ) . top + prev . height ( ) ,
prevLeft = prev . position ( ) . left ;
recursionCall ( prevBottom , prevLeft , prev . next ( ) ) ;
}
} else {
var tmp _array = [ ] ;
$ ( ".readyTask" ) . each ( function ( ) {
tmp _array . push ( $ ( this ) ) ;
} ) ;
orderItems ( tmp _array ) ;
}
} else {
var tmp _array = [ ] ;
$ ( ".readyTask" ) . each ( function ( ) {
tmp _array . push ( $ ( this ) ) ;
} ) ;
orderItems ( tmp _array ) ;
}
popupBack . css ( "top" , ( $ ( window ) . height ( ) - 138 ) * 50 / $ ( window ) . height ( ) + "%" ) ;
popupBack . css ( "left" , ( $ ( window ) . width ( ) - 360 ) * 50 / $ ( window ) . width ( ) + "%" ) ;
popupBack . css ( "top" , ( $ ( window ) . height ( ) - 138 ) * 50 / $ ( window ) . height ( ) + "%" ) ;
popupBack . css ( "left" , ( $ ( window ) . width ( ) - 360 ) * 50 / $ ( window ) . width ( ) + "%" ) ;
} else
resizeFlag = false ;
} ) ;
if ( window . widget ) {
window . widget . onleave = function ( ) {
exportToSankore ( ) ;
sankore . setPreference ( "by_style" , $ ( ". style_select" ) . find ( "option:selected" ) . val ( ) ) ;
sankore . setPreference ( "by_style" , $ ( "# style_select" ) . find ( "option:selected" ) . val ( ) ) ;
}
}
@ -434,7 +458,7 @@ function init(){
objToExport . data2 = $ ( domElem ) . find ( ".readyTask" ) . find ( ":last-child" ) . text ( ) ;
objToExport . width = $ ( domElem ) . width ( ) ;
objToExport . height = $ ( domElem ) . height ( ) ;
objToExport . top = $ ( domElem ) . position ( ) . top ;
objToExport . top = $ ( domElem ) . position ( ) . top - 40 ;
objToExport . left = $ ( domElem ) . position ( ) . left ;
arrayToExport . push ( objToExport ) ;
} ) ;
@ -493,14 +517,14 @@ function reloadItems(){
//order items
function orderItems ( items ) {
var bottom = 45 ,
var bottom = ( $ ( "#wgt_edit" ) . hasClass ( "selected" ) ) ? 85 : 45 ,
lastItemLeft = 54 ;
for ( var i in items ) {
if ( ( bottom + items [ i ] . height ( ) ) < ( $ ( window ) . height ( ) - 54 ) ) {
items [ i ] . css ( "top" , bottom + 15 + "px" ) . css ( "left" , lastItemLeft + "px" ) . appendTo ( "#data" ) ;
bottom += items [ i ] . height ( ) + 15 ;
} else {
bottom = 6 0;
bottom = 10 0;
lastItemLeft += 255 ;
items [ i ] . css ( "top" , bottom + "px" ) . css ( "left" , lastItemLeft + "px" ) . appendTo ( "#data" ) ;
bottom += items [ i ] . height ( ) ;
@ -525,7 +549,7 @@ function shuffle( arr )
//adding a new task to the page
function addTask ( expression , result ) {
var lastItem = $ ( ".editContainer:last" ) ,
lastItemPos = lastItem . length ? lastItem . position ( ) . top : 4 5,
lastItemPos = lastItem . length ? lastItem . position ( ) . top : 8 5,
lastItemHeight = lastItem . length ? lastItem . height ( ) : 0 ,
lastItemLeft = lastItem . length ? lastItem . position ( ) . left : 54 ;
var bottom = lastItemPos + lastItemHeight + 85 ;
@ -537,7 +561,7 @@ function addTask(expression, result){
if ( bottom < ( $ ( window ) . height ( ) - 54 ) ) {
editContent . css ( "top" , lastItemPos + lastItemHeight + 15 + "px" ) . css ( "left" , lastItemLeft + "px" ) . appendTo ( "#data" ) ;
} else {
lastItemPos = 4 5;
lastItemPos = 8 5;
editContent . css ( "top" , lastItemPos + 15 + "px" ) . css ( "left" , lastItemLeft + 255 + "px" ) . appendTo ( "#data" ) ;
}
main . appendTo ( editContent ) ;
@ -556,13 +580,12 @@ function changeStyle(val){
$ ( ".b_bottom_left" ) . removeClass ( "bbl_pad" ) . removeClass ( "without_back" ) ;
$ ( ".b_bottom_center" ) . removeClass ( "bbc_pad" ) . removeClass ( "without_back" ) ;
$ ( "#wgt_reload" ) . removeClass ( "pad_color" ) . removeClass ( "pad_reload" ) ;
$ ( "#wgt_edit" ) . removeClass ( "pad_color" ) . removeClass ( "pad_edit" ) ;
$ ( "#wgt_help" ) . removeClass ( "pad_color" ) . removeClass ( "pad_help" ) ;
$ ( "#wgt_display" ) . removeClass ( "pad_color" ) . removeClass ( "pad_edit" ) ;
$ ( "#wgt_add" ) . removeClass ( "pad_color" ) . removeClass ( "pad_add" ) ;
$ ( "#wgt_edit" ) . removeClass ( "pad_color" ) . removeClass ( "pad_edit" ) ;
$ ( "#wgt_name" ) . removeClass ( "pad_color" ) ;
$ ( ".style_select" ) . removeClass ( "pad_select" ) . removeClass ( "none_select" ) . val ( val ) ;
$ ( "body, html" ) . removeClass ( "without_radius" ) ;
$ ( "#wgt_display" ) . addClass ( "display_wood" ) ;
$ ( "#style_select" ) . val ( val ) ;
$ ( "body, html" ) . removeClass ( "without_radius" ) . addClass ( "radius_ft" ) ;
break ;
case "2" :
$ ( ".b_top_left" ) . addClass ( "btl_pad" ) . removeClass ( "without_back" ) ;
@ -574,13 +597,12 @@ function changeStyle(val){
$ ( ".b_bottom_left" ) . addClass ( "bbl_pad" ) . removeClass ( "without_back" ) ;
$ ( ".b_bottom_center" ) . addClass ( "bbc_pad" ) . removeClass ( "without_back" ) ;
$ ( "#wgt_reload" ) . addClass ( "pad_color" ) . addClass ( "pad_reload" ) ;
$ ( "#wgt_edit" ) . addClass ( "pad_color" ) . addClass ( "pad_edit" ) ;
$ ( "#wgt_help" ) . addClass ( "pad_color" ) . addClass ( "pad_help" ) ;
$ ( "#wgt_display" ) . addClass ( "pad_color" ) . addClass ( "pad_edit" ) ;
$ ( "#wgt_add" ) . addClass ( "pad_color" ) . addClass ( "pad_add" ) ;
$ ( "#wgt_edit" ) . addClass ( "pad_color" ) . addClass ( "pad_edit" ) ;
$ ( "#wgt_name" ) . addClass ( "pad_color" ) ;
$ ( ".style_select" ) . addClass ( "pad_select" ) . removeClass ( "none_select" ) . val ( val ) ;
$ ( "body, html" ) . removeClass ( "without_radius" ) ;
$ ( "#wgt_display" ) . removeClass ( "display_wood" ) ;
$ ( "#style_select" ) . val ( val ) ;
$ ( "body, html" ) . removeClass ( "without_radius" ) . removeClass ( "radius_ft" ) ;
break ;
case "3" :
$ ( ".b_top_left" ) . addClass ( "without_back" ) . removeClass ( "btl_pad" ) ;
@ -591,14 +613,13 @@ function changeStyle(val){
$ ( ".b_bottom_right" ) . addClass ( "without_back" ) . removeClass ( "bbr_pad" ) ;
$ ( ".b_bottom_left" ) . addClass ( "without_back" ) . removeClass ( "bbl_pad" ) ;
$ ( ".b_bottom_center" ) . addClass ( "without_back" ) . removeClass ( "bbc_pad" ) ;
$ ( "#wgt_help" ) . addClass ( "pad_color" ) . addClass ( "pad_help" ) ;
$ ( "#wgt_reload" ) . addClass ( "pad_color" ) . addClass ( "pad_reload" ) ;
$ ( "#wgt_edit" ) . addClass ( "pad_color" ) . addClass ( "pad_edit" ) ;
$ ( "#wgt_help" ) . addClass ( "pad_color" ) . addClass ( "pad_help" ) ;
$ ( "#wgt_display" ) . addClass ( "pad_color" ) . addClass ( "pad_edit" ) ;
$ ( "#wgt_add" ) . addClass ( "pad_color" ) . addClass ( "pad_add" ) ;
$ ( "#wgt_name" ) . addClass ( "pad_color" ) ;
$ ( ".style_select" ) . addClass ( "none_select" ) . val ( val ) ;
$ ( "body, html" ) . addClass ( "without_radius" ) ;
$ ( "#wgt_display" ) . removeClass ( "display_wood" ) ;
$ ( "#style_select" ) . val ( val ) ;
$ ( "body, html" ) . addClass ( "without_radius" ) . removeClass ( "radius_ft" ) ;
break ;
}
if ( $ ( "#wgt_edit" ) . hasClass ( "selected" ) )
Claudio Valerio
12 years ago
