feature: integrate Donorbox API for donation management

- Add Donorbox configuration in site/config/config.php with API settings
- Create controller for support page to fetch campaign data from API
- Update support.php template with dynamic donation buttons and gauge
- Transform static buttons into dynamic links with proper URL parameters
- Add JavaScript for tab switching between one-time and monthly donations
- Calculate donation percentage and display real-time campaign stats

The donation buttons now link directly to Donorbox with pre-filled amounts
and intervals. API integration is ready but requires API key configuration.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
isUnknown 2025-11-04 10:06:50 +01:00
parent 81cc9e5919
commit 3bcb51c829
5 changed files with 144 additions and 23 deletions

View file

@ -22,16 +22,16 @@
<div class="gauge__container">
<!-- calculet le pourcentage avec lAPI?-->
<div id="gauge" style="--pourcent: 70%"></div>
<div id="gauge" style="--pourcent: <?= $percentage ?>%"></div>
<div class="gauge--infos" id="gauge--infos__donnateurs">
<p class="property">Donnateur·ices</p>
<p class="value">288</p>
<p class="value"><?= $donor_count ?></p>
</div>
<div class="gauge--infos" id="gauge--infos__objectif">
<p class="property">Objectif</p>
<p class="value">200</p>
<p class="value"><?= number_format($goal_amount, 0, ',', ' ') ?>€</p>
</div>
</div>
@ -47,32 +47,32 @@
<p class="p__baseline-big">Index est une ONG dinvestigation à but non-lucratif. Vos dons garantissent notre indépendance.</p>
<nav class="nav--tabs">
<button class="nav--tabs__btn is-selected">Je donne une fois</button>
<button class="nav--tabs__btn">Je donne tous les mois</button>
<button class="nav--tabs__btn is-selected" data-interval="o">Je donne une fois</button>
<button class="nav--tabs__btn" data-interval="m">Je donne tous les mois</button>
</nav>
<div class="btn--donation__container">
<button class="btn--donation">
<p class="bold">5/mois</p>
<p class="small">Soit X€ <br>après impôts</p>
</button>
<button class="btn--donation btn--donation__grow-1">
<p class="bold">10/mois</p>
<p class="small">Soit X€ <br>après impôts</p>
</button>
<button class="btn--donation btn--donation__grow-1">
<p class="bold">20/mois</p>
<p class="small">Soit X€ <br>après impôts</p>
</button>
<button class="btn--donation btn--donation__grow-1">
<p class="bold">50/mois</p>
<p class="small">Soit X€ <br>après impôts</p>
</button>
<button class="btn--donation btn--donation__grow-2">
<a href="<?= $campaign_url ?>?amount=5&default_interval=o" class="btn--donation" data-amount="5">
<p class="bold"><span class="amount-value">5</span></p>
<p class="small">Soit <?= round(5 * 0.34) ?>€ <br>après impôts</p>
</a>
<a href="<?= $campaign_url ?>?amount=10&default_interval=o" class="btn--donation btn--donation__grow-1" data-amount="10">
<p class="bold"><span class="amount-value">10</span></p>
<p class="small">Soit <?= round(10 * 0.34) ?>€ <br>après impôts</p>
</a>
<a href="<?= $campaign_url ?>?amount=20&default_interval=o" class="btn--donation btn--donation__grow-1" data-amount="20">
<p class="bold"><span class="amount-value">20</span></p>
<p class="small">Soit <?= round(20 * 0.34) ?>€ <br>après impôts</p>
</a>
<a href="<?= $campaign_url ?>?amount=50&default_interval=o" class="btn--donation btn--donation__grow-1" data-amount="50">
<p class="bold"><span class="amount-value">50</span></p>
<p class="small">Soit <?= round(50 * 0.34) ?>€ <br>après impôts</p>
</a>
<a href="<?= $campaign_url ?>?default_interval=o" class="btn--donation btn--donation__grow-2">
<p class="small">Montant libre</p>
<p class="bold">Choisissez votre montant</p>
<p class="small">Avec déduction fiscale</p>
</button>
</a>
</div>
<p class="p__details">Le don donne droit à une&nbsp;réduction fiscale de 66%<br> Vous pouvez stopper votre don à tout moment</p>