MediaWiki:Centralnotice-template-Leichte Sprache Banner Apple: Unterschied zwischen den Versionen

Aus Hurraki - Wörterbuch für Leichte Sprache
Zur Navigation springen Zur Suche springen
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
Zeile 3: Zeile 3:
<br>
<br>
<br>
<br>
<html>
<style type="text/css">{{MediaWiki:WMDE_FR2014/Resources/DesktopBanner.css}}</style>
  <head>
<script type="text/javascript">{{MediaWiki:WMDE_FR2014/Resources/DesktopBanner.js
    <style>
| donations-date-base      = 2014-11-26
  #centralNotice.collapsed #{{{banner}}}{
| donations-collected-base  = 2850000
    display: none;
| donators-base            = 120000
  }
| appr-donations-per-minute = 104
  div#{{{banner}}} {
| appr-donators-per-minute  = 5.5
    background: transparent;
}}
    display: none;
</script>
    font-family: Arial, Helvetica, Verdana, sans-serif;
 
    left: 0;
 
    position: fixed;
<div id="WMDE_FR2014_Banner"><div style="box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);">
    top: 0;
     <table id="WMDE_FR2014_Banner-facts" style="height: 100%;"><!-- table height must be defined for height 100% to work on elements within it -->
    width: 100%;
        <tr>
    z-index: 9999;
            <td><table style="height: 100%"><tr><td valign="top" style="height: 1%">
  }
                <p>{{{banner-text}}}</p>
  #{{{banner}}}-form-wrapper {
            </td></tr>
    background: #eef0fc;
                <tr><td>
    box-shadow: 3px 0 5px rgba(0, 0, 0, 0.5);
                    <div style="width: inherit; margin: 0 10px 0 35px;">
     padding: 4px 8px;
                        <div id="donationMeterWrapper">
  }
                            <div id="donationMeter"></div>
  #{{{banner}}}-form {
                            <div id="donationFill">
    height: 100%;
                                <div id="donationText"><span id="donationValue">0,0</span> Mio. &euro;</div>
  }
                                <div id="daysLeft" style="display: none">Nur noch <span id="numDaysLeft">40 Tage</span></div>
  #{{{banner}}}-form table {
                                <div id="pbarTip">
    border: none;
                                    <img src="//upload.wikimedia.org/wikipedia/commons/8/89/Pbar-tip-small.png">
    border-collapse: collapse;
                                </div>
    width: 100%;
                            </div>
    height: 100%;
                            <div id="donationRemaining">es fehlen <span id="valRem">6,1</span> Mio. &euro;</div>
  }
                            <div id="donationMessage"></div>
  #{{{banner}}}-form td {
                        </div>
    font-size: 12px;
                    </div>
    font-weight: bold;
                </td></tr>
    min-width: 55px;
                <tr>
    white-space: nowrap;
                    <td style="height: 1%;">
    margin: 0;
                        <div id="WMDE_FR2014_Banner_info">
    vertical-align: middle;
                            <div id="WMDE_FR2014_Banner_text">
    padding: 2px;
                                <span class="binfo-ucase">Spendenkonto</span>
  }
                                <span>Wikimedia Foerdergesellschaft</span>
  #{{{banner}}}-form span label {
                                <span>BIC</span>
    margin-left: 2px;
                                <span class="binfo-bold">BFSWDE33BER</span>
  }
                                <span>IBAN</span>
  #{{{banner}}}-form .amount-options {
                                <span class="binfo-bold" style="margin-right: 0;">DE33 1002 0500 0001 1947 00</span>
    height: 20%;
                            </div>
  }
                        </div>
  #{{{banner}}}-form .paymentmethod-options td {
                    </td>
    text-align: center;
                </tr></table></td>
    padding: 4px 4px 8px 4px;
  }
  #{{{banner}}}-form button {
    cursor: pointer;
    display: inline-block;
    font-weight: bold;
    width: 110px;
    border: 3px double #ddd;
    border-radius: 8px;
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ffffff 0%,rgb(240, 240, 240) 100%);
    box-shadow: 0 1px 1px #ddd;
    margin: 0 1px;
  }
  #{{{banner}}}-form button:hover {
    color: #0645ad;
  }
  div#{{{banner}}} #{{{banner}}}-facts {
    background: #ffcc00 url(//upload.wikimedia.org/wikipedia/donate/c/c0/Information-icon.png) no-repeat 10px 8px;
    min-height: 65px;
    padding: 0;
    position: relative;
    width: 100%;
    border: none;
    border-collapse: collapse;
  }
  div#{{{banner}}} #{{{banner}}}-facts p {
    color: #000;
    font-size: 13px;
    font-weight: bold;
    line-height: 16px;
    margin: 0;
    padding: 10px 10px 10px 40px;
    text-align: justify;
  }


  div#{{{banner}}} p#{{{banner}}}-legal {
            <td id="WMDE_FR2014_Banner-form-wrapper">
    font-family: Arial, Helvetica, Verdana, sans-serif;
                <form id="WMDE_FR2014_Banner-form" method="post" name="donationForm" action="https://spenden.wikimedia.de/spenden/?page={{{landing-page}}}&skin={{{page-skin}}}&piwik_campaign={{{CampaignName}}}&piwik_kwd={{{BannerName}}}">
    position: relative;
                    <table>
    margin: 0;
                        <tr class="frequency-options">
    padding: 10px 40px 10px 40px;
                            <td colspan="2">
    font-size: 13px;
                                <input type="radio" checked="checked" class="amount-radio" id="interval_onetime" onclick="$('.interval-options').addClass('interval-hidden');$('#interval_multiple').attr('checked', false);" />
    line-height: 16px;
                                <label for="interval_onetime" class="interval-label">einmalig</label>
    font-weight: normal;
                            </td>
    z-index: -10;
                            <td colspan="2">
    background: #ffcc00;
                                <input type="radio" class="amount-radio" id="interval_multiple" onclick="$('.interval-options').removeClass('interval-hidden');$('#interval_onetime').attr('checked', false);" />
    top: -100px;
                                <label for="interval_multiple" class="interval-label">regelm&auml;&szlig;ig</label>
    text-align: center;
                            </td>
  }
                        </tr>
                        <tr class="interval-options interval-hidden">
                            <td colspan="2">
                                <input type="radio" name="interval" class="amount-radio" id="interval1" value="1" />
                                <label for="interval1" class="interval-label">monatlich</label>
                            </td>
                            <td colspan="2">
                                <input type="radio" name="interval" class="amount-radio" id="interval3" value="3" />
                                <label for="interval3" class="interval-label">vierteljährlich</label><br />
                            </td>
                        </tr>
                        <tr class="interval-options interval-hidden">
                            <td colspan="2">
                                <input type="radio" name="interval" class="amount-radio" id="interval6" value="6" />
                                <label for="interval6" class="interval-label">halbjährlich</label>
                            </td>
                            <td colspan="2">
                                <input type="radio" name="interval" class="amount-radio" id="interval12" value="12" />
                                <label for="interval12" class="interval-label">jährlich</label>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="4" style="height: 1px;"><hr /></td>
                        </tr>
                        <tr class="amount-options">
                            <td>
                                <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = ''" id="amount5" value="5" />
                                <label class="amount-label" for="amount5">5 €</label>
                            </td>
                            <td>
                                <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = ''" id="amount15" value="15" />
                                <label class="amount-label"  for="amount15">15 €</label>
                            </td>
                            <td>
                                <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = ''" id="amount25" value="25" />
                                <label class="amount-label" for="amount25">25 €</label>
                            </td>
                            <td>
                                <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = ''" id="amount50" value="50" />
                                <label class="amount-label" for="amount50">50 €</label><br />
                            </td>
                        </tr>
                        <tr class="amount-options">
                            <td>
                                <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = ''" id="amount75" value="75" />
                                <label class="amount-label" for="amount75">75 €</label>
                            </td>
                            <td>
                                <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = ''" id="amount100" value="100" />
                                <label class="amount-label" for="amount100">100 €</label>
                            </td>
                            <td>
                                <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = ''" id="amount250" value="250" />
                                <label class="amount-label" for="amount250">250 €</label>
                            </td>
                            <td>
                                <input type="radio" class="amount-radio" name="betrag" id="amount_other" value="" />
                                <input type="tel" id="amount-other-input" onfocus="$('#amount_other').attr('checked', 'checked');" autocomplete="off" size="3" name="amountGiven" /><br />
                        </tr>
                        <tr>
                            <td colspan="2" style="text-align: left">
                                <button class="send" onclick="$$('#zahlweise').val('BEZ');">Lastschrift</button>
                            </td>
                            <td colspan="2" style="text-align: right">
                                <button class="send" onclick="$('#zahlweise').val('UEB');">Überweisung</button><br />
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2" style="text-align: left">
                                <button class="send" onclick="$('#zahlweise').val('MCP');">Kreditkarte</button>
                            </td>
                            <td colspan="2" style="text-align: right">
                                <button id="btn-ppl" class="send" onclick="$('#zahlweise').val('PPL');">PayPal</button>
                            </td>
                        </tr>
                    </table>
                    <input type="hidden" name="periode" id="periode" value="" />
                    <input type="hidden" name="intervalType" id="intervalType" value="0" />
                    <input type="hidden" id="form-page" name="form" value="{{{form-name}}}" />
                    <input type="hidden" id="wikilogin" name="wikilogin" value="no" />
                    <input type="hidden" id="impCount" name="impCount" value="" />
                    <input type="hidden" id="bImpCount" name="bImpCount" value="" />
                    <input type="hidden" id="zahlweise" name="zahlweise" value="" />
                </form>
            </td>


  #{{{banner}}}-close-wrapper {
            <td id="WMDE_FR2014_Banner-close-wrapper">
    width: 20px;
                <span id="WMDE_FR2014_Banner-close">&nbsp;</span>
  }
            </td>


  div#{{{banner}}} span#{{{banner}}}-close {
         </tr>
    background: url(//upload.wikimedia.org/wikipedia/donate/2/27/Small-white-close.png) no-repeat center center;
    </table></div>
    background-color: black;
    cursor: pointer;
    display: block;
    height: 21px;
    position: absolute;
    right: 0px;
    top: 0px;
    width: 21px;
  }
  div#{{{banner}}} #{{{banner}}}-facts p b {
    background: yellow;
    color: black;
    padding: 1px 0.5em;
  }
  .interval-hidden {
    display: none;
  }
  div#{{{banner}}} span.btext-highlight {
    background: yellow;
    color: black;
    padding: 1px 0.5em;
  }
</style> </head>
  <body>
    <div id="{{{banner}}}">
      <div style="box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);">
         <table id="{{{banner}}}-facts" style="height: 100%;">
          <!-- table height must be defined for height 100% to work on elements within it -->
          <tbody>
            <tr>
              <td>
                <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed
                  diam nonumy eirmod tempor invidunt ut labore et dolore magna
                  aliquyam erat, sed diam voluptua. At vero eos et accusam et
                  justo duo dolores et ea rebum. Stet clita kasd gubergren, no
                  sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem
                  ipsum dolor sit amet, consetetur sadipscing elitr, sed diam
                  nonumy eirmod tempor invidunt ut labore et dolore magna
                  aliquyam erat, sed diam voluptua. At vero eos et accusam et
                  justo duo dolores et ea rebum. Stet clita kasd gubergren, no
                  sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
              </td>
              <td id="{{{banner}}}-form-wrapper">
             
                  <table style="width: 350px; height: 219px;">
                    <tbody>
                      <tr>
                        <td colspan="4" style="text-align: center"> <input name="cmd"
                            value="_s-xclick" type="hidden"> <input name="hosted_button_id"
                            value="PJZZZMESJX5Z2" type="hidden"> <input src="https://www.paypalobjects.com/de_DE/DE/i/btn/btn_donate_LG.gif"
                            name="submit" alt="Jetzt einfach, schnell und sicher online bezahlen – mit PayPal."
                            type="image" border="0"> <img alt="" src="https://www.paypalobjects.com/de_DE/i/scr/pixel.gif"
                            width="1" height="1" border="0"> </td>
                      </tr>
                    </tbody>
                  </table>
             
              </td>
              <td id="{{{banner}}}-close-wrapper"> <span id="{{{banner}}}-close">&nbsp;</span>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <p id="{{{banner}}}-legal"> <strong style="color: #0078FF;">Spendenkonto:</strong>
        Wikimedia Fördergesellschaft - Kontonummer <strong style="color: #0078FF">1194700</strong>
        - Bankleitzahl <strong style="color: #0078FF">10020500</strong> - BIC
        BFSWDE33BER - IBAN DE33 1002 0500 0001 1947 00 </p>
    </div>
    <script type="text/javascript">
$( document ).ready( function() {
  $('body').prepend($('#centralNotice'));


  var impCount = increaseImpCount();
    <!--p id="WMDE_FR2014_Banner-legal">
  $("#impCount").val(impCount);
      <strong style="color: #0078FF;">Spendenkonto:</strong> Wikimedia Fördergesellschaft - Kontonummer <strong style="color: #0078FF">1194700</strong> - Bankleitzahl <strong style="color: #0078FF">10020500</strong> - BIC BFSWDE33BER - IBAN DE33 1002 0500 0001 1947 00
  var bannerImpCount = increaseBannerImpCount();
    </p-->
  $("#bImpCount").val(bannerImpCount);
    <img id="banner-close-ct" src="" width="0" height="0" border="0" />


  setTimeout( addBannerSpace, 15000 );
</div>
  if(wgUserName !== null) $('#wikilogin').val('yes');
  $(window).resize(function() {
    //addBannerSpace();
  });


  $( ".send" ).click( function( e ) {
<script type="text/javascript">
    return validateForm();
    $( document ).ready( function() {
  });
        $('body').prepend($('#centralNotice'));


  $('#{{{banner}}}-close').click(function() {
        var impCount = increaseImpCount();
    hideBanner();
        $("#impCount").val(impCount);
    removeBannerSpace();
        var bannerImpCount = increaseBannerImpCount( "{{{banner}}}" );
    return false;
        $("#bImpCount").val(bannerImpCount);
  });


  $('#{{{banner}}}').mouseenter(function() {
        if ( wgAction === "view" ) {
    $('p#{{{banner}}}-legal').clearQueue().animate({
            setTimeout( addBannerSpace, 7500 );
      top: '0px'
        }
        if(wgUserName !== null) $('#wikilogin').val('yes');
        $(window).resize(function() {
            animateProgressBar();
        });
 
        $( ".send" ).click( function( e ) {
            return validateForm();
        });
 
        $('#WMDE_FR2014_Banner-close').click(function() {
            if( Math.random() < 0.01 ) {
                $( '#banner-close-ct' ).attr( 'src', 'https://spenden.wikimedia.de/piwik/piwik.php?idsite=1&url=https://spenden.wikimedia.de/banner-closed/{{{BannerName}}}&rec=1' );
            }
            hideBanner();
            removeBannerSpace();
            return false;
        });
 
        $("span#numDaysLeft").text( getDaysRemaining() );
        $("span#weekday").text( getCurrentGermanDay() );
        $("span#donorsValue").html( addPointsToNum( Math.floor (getApprDonatorsRaw() ) ) );
     });
     });
  });
  $('#{{{banner}}}').mouseleave(function() {
    $('p#{{{banner}}}-legal').animate({
      top: '-100px'
    });
  });
});


function addBannerSpace() {
    function animateProgressBar() {
  var expandableBannerHeight = $('div#{{{banner}}}').height() + 44 + $('div#{{{banner}}}-legal').height();
        var donationFillElement = $( "#donationFill" );
  switch(skin) {
        var preFillValue = 0;
    case 'vector':
 
      $('#{{{banner}}}').css( 'top', 0 - expandableBannerHeight );
        donationFillElement.clearQueue();
      $('#mw-panel').animate({top: expandableBannerHeight + 160}, 1000);
        donationFillElement.stop();
      $('#mw-head').animate({top: expandableBannerHeight}, 1000);
        donationFillElement.width( preFillValue + "px" );
      $('#mw-page-base').animate({paddingTop: expandableBannerHeight}, 1000);
 
      break;
        $( '#daysLeft' ).hide();
    case 'monobook':
 
      $('#globalWrapper').css('position', 'relative');
        var barWidth = $( '#donationMeter' ).width();
      $('#globalWrapper').css('top', expandableBannerHeight);
        var dTarget = parseInt( "{{{donation-target}}}" );
      $('#{{{banner}}}').css('top', '-20px');
        var dCollected = getApprDonationsRaw();
      $('#{{{banner}}}').css('background', 'none');
        var dRemaining = dTarget - dCollected;
      break;
        var widthToFill = dCollected / dTarget * barWidth;
  }
 
  $('#{{{banner}}}').css('display', 'block');
        widthToFill += preFillValue;
  $('#{{{banner}}}').animate({top: 0}, 1000);
        donationFillElement.animate( { width: widthToFill + 'px' }, {
}
            duration: 2500,
function removeBannerSpace() {
            progress: function () {
  switch(skin) {
                var dFill = donationFillElement.width() - preFillValue;
    case 'vector':
                var pFill = dFill / barWidth;
      $('#mw-panel').css('top', 160);
 
      $('#mw-head').css('top', 0);
                var dColl = dTarget * pFill / 1000000;
      $('#mw-page-base').css('padding-top', 0);
                var vRem = ( dTarget - ( dTarget * pFill ) ) / 1000000;
      break;
    case 'monobook':
      $('#globalWrapper').css('position', 'relative');
      $('#globalWrapper').css('top', 0);
      break;
  }
}


function increaseImpCount() {
                dColl = dColl.toFixed( 1 );
  impCount = parseInt($.cookie('centralnotice_banner_impression_count')) | 0;
                dColl = dColl.replace( ".", "," );
  $.cookie('centralnotice_banner_impression_count', impCount + 1, { expires: 7, path: '/' });
  return impCount + 1;
}


function increaseBannerImpCount() {
                vRem = vRem.toFixed( 1 );
  var impCount = 0;
                vRem = vRem.replace( ".", "," );


  if($.cookie('centralnotice_single_banner_impression_count')) {
                $( "#donationValue" ).html( dColl );
    var impCountCookie = $.cookie('centralnotice_single_banner_impression_count');
                $( "#valRem" ).html( vRem );
    var bannerImpCount = impCountCookie.split("|");
            },
    if(bannerImpCount[0] === '{{{banner}}}') {
            complete: function () {
      impCount = parseInt(bannerImpCount[1]);
                $( 'div#daysLeft' ).show();
            }
        } );
     }
     }
  }
  $.cookie('centralnotice_single_banner_impression_count', '{{{banner}}}|' + (impCount + 1), { expires: 7, path: '/' });
  return (impCount + 1);
}


function validateForm() {
    function addBannerSpace() {
  var chkdPayment = $( 'input[name=pay]:checked', '#{{{banner}}}-form' ).val();
        var expandableBannerHeight = $( 'div#WMDE_FR2014_Banner' ).height() + 44;
  switch( chkdPayment ) {
        var bannerDivElement = $( '#WMDE_FR2014_Banner' );
    case "BEZ":
 
      $( '#form-page' ).val( 'Formularseite2-Lastschrift' );
        switch ( skin ) {
      break;
            case 'vector':
    case "UEB":
                bannerDivElement.css( 'top', 0 - expandableBannerHeight );
      $( '#form-page' ).val( 'Formularseite2-Überweisung' );
                $( '#mw-panel' ).animate( { top: expandableBannerHeight + 160 }, 1000 );
      break;
                $( '#mw-head' ).animate( { top: expandableBannerHeight }, 1000 );
    case "PPL":
                $( '#mw-page-base' ).animate( { paddingTop: expandableBannerHeight }, 1000 );
      $( '#form-page' ).val( 'Formularseite2-PayPal' );
                break;
      break;
            case 'monobook':
    case "MCP":
                $( '#globalWrapper' ).css( 'position', 'relative' );
      $( '#form-page' ).val( 'Formularseite2-Micropayment' );
                $( '#globalWrapper' ).css( 'top', expandableBannerHeight );
      break;
                bannerDivElement.css( 'top', '-20px' );
  }
                bannerDivElement.css( 'background', 'none' );
  var form = document.donationForm;
                break;
  var error = false;
        }
 
        bannerDivElement.css( 'display', 'block' );
  if($('#interval_multiple').attr('checked') === 'checked') {
        bannerDivElement.animate( { top: 0 }, 1000 );
    if($('input[name=interval]:checked', form).length !== 1) {
        setTimeout( animateProgressBar, 1000 );
      alert("Es wurde kein Zahlungsintervall ausgewählt.");
      return false;
    } else {
      $('#periode').val($('input[name=interval]:checked', form).val());
     }
     }
  } else {
    $('#periode').val("0");
  }


  // Get amount selection
    function removeBannerSpace() {
  var amount = null;
        switch(skin) {
  for ( var i = 0; i < form.betrag.length; i++ ) {
            case 'vector':
    if ( form.betrag[i].checked ) {
                $('#mw-panel').css('top', 160);
      amount = form.betrag[i].value;
                $('#mw-head').css('top', 0);
      break;
                $('#mw-page-base').css('padding-top', 0);
                break;
            case 'monobook':
                $('#globalWrapper').css('position', 'relative');
                $('#globalWrapper').css('top', 0);
                break;
        }
     }
     }
  }
  if ( form.amountGiven.value != "" ) {
    var otherAmount = form.amountGiven.value;
    otherAmount = otherAmount.replace(/[,.](\d)$/, '\:$10');
    otherAmount = otherAmount.replace(/[,.](\d)(\d)$/, '\:$1$2');
    otherAmount = otherAmount.replace(/[\$,.]/g, '');
    otherAmount = otherAmount.replace(/:/, '.');
    form.amountGiven.value = otherAmount;
    amount = otherAmount;
    $('#input_amount_other').val( otherAmount );
  }
  // Check amount is a real number
  error = ( amount == null || isNaN( amount ) || amount.value <= 0 );
  // Check amount is at least the minimum
  if ( amount < 1 || error ) {
    alert( 'Der Mindestbetrag beträgt 1 Euro.');
    return false;
  } else if ( amount > 99999 ) {
    alert( 'Der Spendenbetrag ist zu hoch.' );
    return false;
  }
  return !error;
}
</script>
</script>
  </body>
</html>

Version vom 11. September 2018, 10:35 Uhr

 <a href="https://itunes.apple.com/de/app/hurraki-leichte-sprache-app/id903688766?mt=8"><img src="//hurraki.de/w/images/7/74/Leichte_Sprache_App_Apple_banner.jpg" title="Leichte Sprache App für iPhone und iPad" style="border: none; float: middle; width: 800px; height: 221px; margin-right: .8em; vertical-align: middle;" /></a>

<a href="#" title="Schließen" onclick="mw.centralNotice.hideBanner();return false;"><img border="0" src="//upload.wikimedia.org/wikipedia/foundation/2/20/CloseWindow19x19.png" alt="Schließen" /></a>

<style type="text/css">MediaWiki:WMDE FR2014/Resources/DesktopBanner.css</style> <script type="text/javascript">MediaWiki:WMDE FR2014/Resources/DesktopBanner.js </script>


{{{banner-text}}}

0,0 Mio. €
                                   <img src="//upload.wikimedia.org/wikipedia/commons/8/89/Pbar-tip-small.png">
es fehlen 6,1 Mio. €
                               Spendenkonto
                               Wikimedia Foerdergesellschaft
                               BIC
                               BFSWDE33BER
                               IBAN
                               DE33 1002 0500 0001 1947 00
               <form id="WMDE_FR2014_Banner-form" method="post" name="donationForm" action="https://spenden.wikimedia.de/spenden/?page={{{landing-page}}}&skin={{{page-skin}}}&piwik_campaign={{{CampaignName}}}&piwik_kwd={{{BannerName}}}">
                               <input type="radio" checked="checked" class="amount-radio" id="interval_onetime" onclick="$('.interval-options').addClass('interval-hidden');$('#interval_multiple').attr('checked', false);" />
                               <label for="interval_onetime" class="interval-label">einmalig</label>
                               <input type="radio" class="amount-radio" id="interval_multiple" onclick="$('.interval-options').removeClass('interval-hidden');$('#interval_onetime').attr('checked', false);" />
                               <label for="interval_multiple" class="interval-label">regelmäßig</label>
                               <input type="radio" name="interval" class="amount-radio" id="interval1" value="1" />
                               <label for="interval1" class="interval-label">monatlich</label>
                               <input type="radio" name="interval" class="amount-radio" id="interval3" value="3" />
                               <label for="interval3" class="interval-label">vierteljährlich</label>
                               <input type="radio" name="interval" class="amount-radio" id="interval6" value="6" />
                               <label for="interval6" class="interval-label">halbjährlich</label>
                               <input type="radio" name="interval" class="amount-radio" id="interval12" value="12" />
                               <label for="interval12" class="interval-label">jährlich</label>

                               <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = " id="amount5" value="5" />
                               <label class="amount-label" for="amount5">5 €</label>
                               <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = " id="amount15" value="15" />
                               <label class="amount-label"  for="amount15">15 €</label>
                               <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = " id="amount25" value="25" />
                               <label class="amount-label" for="amount25">25 €</label>
                               <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = " id="amount50" value="50" />
                               <label class="amount-label" for="amount50">50 €</label>
                               <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = " id="amount75" value="75" />
                               <label class="amount-label" for="amount75">75 €</label>
                               <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = " id="amount100" value="100" />
                               <label class="amount-label" for="amount100">100 €</label>
                               <input type="radio" class="amount-radio" name="betrag_auswahl" onclick="document.donationForm.amountGiven.value = " id="amount250" value="250" />
                               <label class="amount-label" for="amount250">250 €</label>
                               <input type="radio" class="amount-radio" name="betrag" id="amount_other" value="" />
                               <input type="tel" id="amount-other-input" onfocus="$('#amount_other').attr('checked', 'checked');" autocomplete="off" size="3" name="amountGiven" />
                               <button class="send" onclick="$$('#zahlweise').val('BEZ');">Lastschrift</button>
                               <button class="send" onclick="$('#zahlweise').val('UEB');">Überweisung</button>
                               <button class="send" onclick="$('#zahlweise').val('MCP');">Kreditkarte</button>
                               <button id="btn-ppl" class="send" onclick="$('#zahlweise').val('PPL');">PayPal</button>
                   <input type="hidden" name="periode" id="periode" value="" />
                   <input type="hidden" name="intervalType" id="intervalType" value="0" />
                   <input type="hidden" id="form-page" name="form" value="{{{form-name}}}" />
                   <input type="hidden" id="wikilogin" name="wikilogin" value="no" />
                   <input type="hidden" id="impCount" name="impCount" value="" />
                   <input type="hidden" id="bImpCount" name="bImpCount" value="" />
                   <input type="hidden" id="zahlweise" name="zahlweise" value="" />
               </form>
                
   <img id="banner-close-ct" src="" width="0" height="0" border="0" />

<script type="text/javascript">

   $( document ).ready( function() {
       $('body').prepend($('#centralNotice'));
       var impCount = increaseImpCount();
       $("#impCount").val(impCount);
       var bannerImpCount = increaseBannerImpCount( "{{{banner}}}" );
       $("#bImpCount").val(bannerImpCount);
       if ( wgAction === "view" ) {
           setTimeout( addBannerSpace, 7500 );
       }
       if(wgUserName !== null) $('#wikilogin').val('yes');
       $(window).resize(function() {
           animateProgressBar();
       });
       $( ".send" ).click( function( e ) {
           return validateForm();
       });
       $('#WMDE_FR2014_Banner-close').click(function() {
           if( Math.random() < 0.01 ) {
               $( '#banner-close-ct' ).attr( 'src', 'https://spenden.wikimedia.de/piwik/piwik.php?idsite=1&url=https://spenden.wikimedia.de/banner-closed/{{{BannerName}}}&rec=1' );
           }
           hideBanner();
           removeBannerSpace();
           return false;
       });
       $("span#numDaysLeft").text( getDaysRemaining() );
       $("span#weekday").text( getCurrentGermanDay() );
       $("span#donorsValue").html( addPointsToNum( Math.floor (getApprDonatorsRaw() ) ) );
   });
   function animateProgressBar() {
       var donationFillElement = $( "#donationFill" );
       var preFillValue = 0;
       donationFillElement.clearQueue();
       donationFillElement.stop();
       donationFillElement.width( preFillValue + "px" );
       $( '#daysLeft' ).hide();
       var barWidth = $( '#donationMeter' ).width();
       var dTarget = parseInt( "{{{donation-target}}}" );
       var dCollected = getApprDonationsRaw();
       var dRemaining = dTarget - dCollected;
       var widthToFill = dCollected / dTarget * barWidth;
       widthToFill += preFillValue;
       donationFillElement.animate( { width: widthToFill + 'px' }, {
           duration: 2500,
           progress: function () {
               var dFill = donationFillElement.width() - preFillValue;
               var pFill = dFill / barWidth;
               var dColl = dTarget * pFill / 1000000;
               var vRem = ( dTarget - ( dTarget * pFill ) ) / 1000000;
               dColl = dColl.toFixed( 1 );
               dColl = dColl.replace( ".", "," );
               vRem = vRem.toFixed( 1 );
               vRem = vRem.replace( ".", "," );
               $( "#donationValue" ).html( dColl );
               $( "#valRem" ).html( vRem );
           },
           complete: function () {
               $( 'div#daysLeft' ).show();
           }
       } );
   }
   function addBannerSpace() {
       var expandableBannerHeight = $( 'div#WMDE_FR2014_Banner' ).height() + 44;
       var bannerDivElement = $( '#WMDE_FR2014_Banner' );
       switch ( skin ) {
           case 'vector':
               bannerDivElement.css( 'top', 0 - expandableBannerHeight );
               $( '#mw-panel' ).animate( { top: expandableBannerHeight + 160 }, 1000 );
               $( '#mw-head' ).animate( { top: expandableBannerHeight }, 1000 );
               $( '#mw-page-base' ).animate( { paddingTop: expandableBannerHeight }, 1000 );
               break;
           case 'monobook':
               $( '#globalWrapper' ).css( 'position', 'relative' );
               $( '#globalWrapper' ).css( 'top', expandableBannerHeight );
               bannerDivElement.css( 'top', '-20px' );
               bannerDivElement.css( 'background', 'none' );
               break;
       }
       bannerDivElement.css( 'display', 'block' );
       bannerDivElement.animate( { top: 0 }, 1000 );
       setTimeout( animateProgressBar, 1000 );
   }
   function removeBannerSpace() {
       switch(skin) {
           case 'vector':
               $('#mw-panel').css('top', 160);
               $('#mw-head').css('top', 0);
               $('#mw-page-base').css('padding-top', 0);
               break;
           case 'monobook':
               $('#globalWrapper').css('position', 'relative');
               $('#globalWrapper').css('top', 0);
               break;
       }
   }

</script>