Date: prev next · Thread: first prev next last
2011 Archives by date, by thread · List index 

Ok. This script is ready for review. Note it needs some variables to
be linked with actual data, and all <a> links are unset.
Also, the CSS may not be to your liking, only some size and
positioning settings are important. The fill image is a transparent
glass effect, so the colour can be changed from CSS.
Get the "meter-scale.png"
http://www.filefactory.com/file/b562ac1/n/meter-scale.png
and get "meter-fill.png" from
http://www.filefactory.com/file/b562abh/n/meter-fill.png

Do you want a donate button or link? If button, chrome (browser
widget) button or image button?


--------------------------------------------- The script (embedded
HTML with PHP and CSS) ---------------------------------------------
<?php
$donation_goal = 2000;
$donation_current = 1568; // Where to link this?
$currency = '&#36;'; // What currency to use?
$countdown = 20; // Where to link this?

$donation_percent = ($donation_current / $donation_goal) * 100;
if ($donation_percent > 100) {
        $donation_percent = 100;
} elseif ($donation_percent > 99 && $donation_percent < 100) {
        $donation_percent = 99;
} elseif ($donation_percent < 1 && $donation_percent > 0) {
        $donation_percent = 1;
} else {
        $donation_percent = round($donation_percent);
}

$donation_pixels = $donation_percent * 2;
?><html><head><title>Donate - version3</title>
<style>
div#donate {
        width:400px;
        border-radius:6px;
        background:#efffef;
        border:1px solid #106802;
        overflow:hidden;
} #donate table {
        width:100%;
} #donate p,h2 {
        margin:0px 5px 3px;
} #donate h2 {
        color:#111;
        padding:0;
} #goal {
        color:#222;
        padding:0 0 2px;
} #marker0 {
        cursor:default;
        color:#106802;
        position:relative;
        top:-3px;
        width:200px;
        text-align:center;
} #marker1 {
        cursor:default;
        background:#ccf4c6;
        margin:-5px 5px 5px;
        width:200px;
} #marker2 {
        position:relative;
        width:<?php echo($donation_pixels);?>px;
        height:15px;
        background:#18a303 url('meter-fill.png') repeat-x;
        bottom:0;
        left:0;
        display:block;
        border-right:1px solid #18a303;
} #marker3 {
        position:relative;
        left:-1;
        display:block;
        width:202px;
}
</style></head><body>
<!--donation meter begin-->
<div id="donate"><?php
  if ($countdown > 0) {?>
        <table border="0" cellpadding="1"
cellspacing="0"><tbody>
        <tr>
                <td>
                        <h2>Donate Today!</h2>
                </td>
                <td rowspan="3" valign="middle" style="width:200px;">
                        <p id="marker0">
                                <?php 
echo($currency.$donation_current.",&nbsp;".$donation_percent);?>%
                        </p>
                        <div id="marker1">
                                <div id="marker2">
                                        <img id="marker3" src="meter-scale.png"/>
                                </div>
                        </div>
                </td>
        </tr>
        <tr>
                <td>
                        <p id="goal">
                                Our target is: <?php echo($currency.$donation_goal);?>
                        </p>
                </td>
        </tr>
        <tr>
                <td>
                        <p id="countdown"><?php if($countdown < 5) echo("Only
");echo($countdown);?> days left!</p>
                </td>
        </tr>
        <tr>
                <td colspan="2" valign="middle">
                        <p style="text-align:center;"><a href="">Donate now!</a></p>
                </td>
        </tr>
        </tbody></table>
<?php } else {?>
        <h2>Time's up.</h2>
        <p>You can <a href="">donate</a> anyway, though, if you want!</p><?php }?>
</div>
<!--donation meter end-->
</body></html>
--------------------------------------------- End of script
---------------------------------------------

-- 
Unsubscribe instructions: E-mail to website+help@libreoffice.org
List archive: http://listarchives.libreoffice.org/www/website/
*** All posts to this list are publicly archived for eternity ***

Context

Privacy Policy | Impressum (Legal Info) | Copyright information: Unless otherwise specified, all text and images on this website are licensed under the Creative Commons Attribution-Share Alike 3.0 License. This does not include the source code of LibreOffice, which is licensed under the Mozilla Public License (MPLv2). "LibreOffice" and "The Document Foundation" are registered trademarks of their corresponding registered owners or are in actual use as trademarks in one or more countries. Their respective logos and icons are also subject to international copyright laws. Use thereof is explained in our trademark policy.