| 1 |
|
|---|
| 2 |
|
|---|
| 3 | function transformToTurnstyleBlock(baseId)
|
|---|
| 4 | {
|
|---|
| 5 | // wrapper '-turnstyle' div has two child divs
|
|---|
| 6 | var select_wrapper = '#'+baseId+'-turnstyle > div';
|
|---|
| 7 |
|
|---|
| 8 | var $header = $(select_wrapper + ":nth-child(1)");
|
|---|
| 9 | var $body = $(select_wrapper + ":nth-child(2)");
|
|---|
| 10 |
|
|---|
| 11 | $header.addClass("openclose ui-state-default ui-corner-all");
|
|---|
| 12 |
|
|---|
| 13 | var title = $header.html();
|
|---|
| 14 |
|
|---|
| 15 | var turnstyle_title = "";
|
|---|
| 16 |
|
|---|
| 17 | turnstyle_title += '<a href="#" id="'+baseId+'-openclose" class="openclose">\n';
|
|---|
| 18 | turnstyle_title += ' <div style="float: left; padding-top: 10px; width: 32px; height: 42px;">\n';
|
|---|
| 19 | turnstyle_title += ' <img id="'+baseId+'-closed" src="css/turnstyle-closed-32.png"/>\n';
|
|---|
| 20 | turnstyle_title += ' <img id="'+baseId+'-open" src="css/turnstyle-open-32.png" \n';
|
|---|
| 21 | turnstyle_title += ' style="display: none;" />\n';
|
|---|
| 22 | turnstyle_title += ' </div>\n';
|
|---|
| 23 | turnstyle_title += ' '+title + '<span id="'+baseId+'-dots"> ...</span>\n';
|
|---|
| 24 | turnstyle_title += '</a>\n';
|
|---|
| 25 |
|
|---|
| 26 | $header.html(turnstyle_title);
|
|---|
| 27 |
|
|---|
| 28 | $body.attr("id",baseId+"-area");
|
|---|
| 29 |
|
|---|
| 30 | $('#'+baseId+'-openclose').click(function() {
|
|---|
| 31 | //$('#'+baseId+'-area').toggle( "blind", {}, 500);
|
|---|
| 32 |
|
|---|
| 33 | // Technique to avoid "display: none" being done by jquery-ui as
|
|---|
| 34 | // this has the undesired side-effect of unloading elements (such
|
|---|
| 35 | // as the entire Meandre workflow).
|
|---|
| 36 |
|
|---|
| 37 | if ($('#'+baseId+'-open').css("display") == "block") {
|
|---|
| 38 | $('#'+baseId+'-area').slideUp(500,function(){
|
|---|
| 39 | $('#'+baseId+'-area').addClass('hide')
|
|---|
| 40 | .slideDown(0);
|
|---|
| 41 | });
|
|---|
| 42 | } else {
|
|---|
| 43 | $('#'+baseId+'-area').slideUp(0,function(){
|
|---|
| 44 | $('#'+baseId+'-area').removeClass('hide')
|
|---|
| 45 | .slideDown(500);
|
|---|
| 46 | });
|
|---|
| 47 | }
|
|---|
| 48 |
|
|---|
| 49 | if ($('#'+baseId+'-open').css("display") == "none") {
|
|---|
| 50 | $('#'+baseId+'-closed').css("display","none");
|
|---|
| 51 | $('#'+baseId+'-open').css("display","block");
|
|---|
| 52 | $('#'+baseId+'-dots').css("display","none");
|
|---|
| 53 | }
|
|---|
| 54 | else {
|
|---|
| 55 | $('#'+baseId+'-open').css("display","none");
|
|---|
| 56 | $('#'+baseId+'-closed').css("display","block");
|
|---|
| 57 | $('#'+baseId+'-dots').css("display","inline");
|
|---|
| 58 | }
|
|---|
| 59 | return false;
|
|---|
| 60 | });
|
|---|
| 61 | }
|
|---|
| 62 |
|
|---|
| 63 | /*
|
|---|
| 64 | (function(){
|
|---|
| 65 | var $button = $('#myButton'),
|
|---|
| 66 | $text = $('#myText'),
|
|---|
| 67 | visible = true;
|
|---|
| 68 | $button.click(function(){
|
|---|
| 69 | if ( visible ) {
|
|---|
| 70 | $text.slideUp('fast',function(){
|
|---|
| 71 | $text.addClass('accessibly-hidden')
|
|---|
| 72 | .slideDown(0);
|
|---|
| 73 | });
|
|---|
| 74 | } else {
|
|---|
| 75 | $text.slideUp(0,function(){
|
|---|
| 76 | $text.removeClass('accessibly-hidden')
|
|---|
| 77 | .slideDown('fast');
|
|---|
| 78 | });
|
|---|
| 79 | }
|
|---|
| 80 | visible = ! visible;
|
|---|
| 81 | });
|
|---|
| 82 | })();
|
|---|
| 83 | */
|
|---|
