commit c03acd9e310aef6295195de0fd5688b9a53e20e9
Author: root <root@hub.scroll.pub>
Date: 2024-12-28 08:12:56 +0000
Subject: Initial commit
diff --git a/body.html b/body.html
new file mode 100644
index 0000000..320ae51
--- /dev/null
+++ b/body.html
@@ -0,0 +1,37 @@
+<header>
+ <h1>Simulateur de Crédit Immobilier</h1>
+ <p>Comparez plusieurs taux et découvrez leurs coûts et mensualités.</p>
+</header>
+
+<main>
+ <section id="calculator">
+ <div class="input-group">
+ <label for="amount">Montant du prêt (€):</label>
+ <input type="number" id="amount" min="10000" step="1000" required>
+ </div>
+ <div class="input-group">
+ <label for="duration">Durée (années):</label>
+ <input type="number" id="duration" min="1" max="30" required>
+ </div>
+
+ <div id="rates-container">
+ <div class="rate-input">
+ <label>Taux d'intérêt (%):</label>
+ <input type="number" class="rate" min="0" step="0.01" required>
+ <button class="remove-rate">×</button>
+ </div>
+ </div>
+
+ <button id="add-rate">Ajouter un taux</button>
+ <button id="calculate">Calculer</button>
+ </section>
+
+ <section id="results" class="hidden">
+ <h2>Comparaison des Taux</h2>
+ <div id="results-grid"></div>
+ </section>
+</main>
+
+<footer>
+ <p>Simulateur conçu pour vous aider à prendre des décisions éclairées.</p>
+</footer>
\ No newline at end of file
diff --git a/index.scroll b/index.scroll
new file mode 100644
index 0000000..4d34cdf
--- /dev/null
+++ b/index.scroll
@@ -0,0 +1,8 @@
+buildHtml
+baseUrl https://creditcompare.scroll.pub
+metaTags
+editButton /edit.html
+title Simulateur de Crédit Immobilier en France - Comparez les Taux
+style.css
+body.html
+script.js
\ No newline at end of file
diff --git a/prompt.json b/prompt.json
new file mode 100644
index 0000000..a5f4814
--- /dev/null
+++ b/prompt.json
@@ -0,0 +1,25 @@
+{
+ "id": "3656018d-cc34-4c71-834b-cb5dbc7c7c09",
+ "object": "chat.completion",
+ "created": 1735373549,
+ "model": "deepseek-chat",
+ "choices": [
+ {
+ "index": 0,
+ "message": {
+ "role": "assistant",
+ "content": "---domain---\ncreditcompare.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://creditcompare.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Simulateur de Crédit Immobilier en France - Comparez les Taux\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <h1>Simulateur de Crédit Immobilier</h1>\n <p>Comparez plusieurs taux et découvrez leurs coûts et mensualités.</p>\n</header>\n\n<main>\n <section id=\"calculator\">\n <div class=\"input-group\">\n <label for=\"amount\">Montant du prêt (€):</label>\n <input type=\"number\" id=\"amount\" min=\"10000\" step=\"1000\" required>\n </div>\n <div class=\"input-group\">\n <label for=\"duration\">Durée (années):</label>\n <input type=\"number\" id=\"duration\" min=\"1\" max=\"30\" required>\n </div>\n\n <div id=\"rates-container\">\n <div class=\"rate-input\">\n <label>Taux d'intérêt (%):</label>\n <input type=\"number\" class=\"rate\" min=\"0\" step=\"0.01\" required>\n <button class=\"remove-rate\">×</button>\n </div>\n </div>\n\n <button id=\"add-rate\">Ajouter un taux</button>\n <button id=\"calculate\">Calculer</button>\n </section>\n\n <section id=\"results\" class=\"hidden\">\n <h2>Comparaison des Taux</h2>\n <div id=\"results-grid\"></div>\n </section>\n</main>\n\n<footer>\n <p>Simulateur conçu pour vous aider à prendre des décisions éclairées.</p>\n</footer>\n---style.css---\n:root {\n --primary-color: #2c3e50;\n --secondary-color: #3498db;\n --background-color: #f5f6fa;\n --text-color: #2c3e50;\n --border-color: #dfe6e9;\n --shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n}\n\nbody {\n font-family: 'Segoe UI', sans-serif;\n line-height: 1.6;\n color: var(--text-color);\n background-color: var(--background-color);\n margin: 0;\n padding: 20px;\n max-width: 800px;\n margin: 0 auto;\n}\n\nheader {\n text-align: center;\n margin-bottom: 40px;\n}\n\nh1 {\n color: var(--primary-color);\n font-size: 2.5rem;\n margin-bottom: 10px;\n}\n\n#calculator {\n background: white;\n padding: 30px;\n border-radius: 10px;\n box-shadow: var(--shadow);\n}\n\n.input-group {\n margin-bottom: 20px;\n}\n\nlabel {\n display: block;\n margin-bottom: 5px;\n font-weight: 600;\n}\n\ninput {\n width: 100%;\n padding: 10px;\n border: 1px solid var(--border-color);\n border-radius: 5px;\n font-size: 1rem;\n}\n\n#rates-container {\n margin: 20px 0;\n}\n\n.rate-input {\n display: flex;\n align-items: center;\n gap: 10px;\n margin-bottom: 10px;\n}\n\n.rate-input input {\n flex: 1;\n}\n\n.remove-rate {\n background: #e74c3c;\n color: white;\n border: none;\n border-radius: 50%;\n width: 30px;\n height: 30px;\n cursor: pointer;\n font-size: 1.2rem;\n line-height: 1;\n}\n\nbutton {\n background: var(--secondary-color);\n color: white;\n border: none;\n padding: 10px 20px;\n border-radius: 5px;\n cursor: pointer;\n font-size: 1rem;\n transition: background 0.3s ease;\n}\n\nbutton:hover {\n background: #2980b9;\n}\n\n#add-rate {\n background: #27ae60;\n margin-right: 10px;\n}\n\n#add-rate:hover {\n background: #219653;\n}\n\n#results {\n margin-top: 40px;\n}\n\n#results-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n}\n\n.result-card {\n background: white;\n padding: 20px;\n border-radius: 10px;\n box-shadow: var(--shadow);\n}\n\n.result-card h3 {\n margin-top: 0;\n color: var(--primary-color);\n}\n\n.hidden {\n display: none;\n}\n\n@media (max-width: 600px) {\n h1 {\n font-size: 2rem;\n }\n \n #calculator {\n padding: 20px;\n }\n}\n---script.js---\ndocument.addEventListener('DOMContentLoaded', function() {\n const ratesContainer = document.getElementById('rates-container');\n const addRateButton = document.getElementById('add-rate');\n const calculateButton = document.getElementById('calculate');\n const resultsSection = document.getElementById('results');\n const resultsGrid = document.getElementById('results-grid');\n\n // Add initial rate input\n addRateInput();\n\n addRateButton.addEventListener('click', addRateInput);\n\n calculateButton.addEventListener('click', function() {\n const amount = parseFloat(document.getElementById('amount').value);\n const duration = parseInt(document.getElementById('duration').value);\n const rates = Array.from(document.querySelectorAll('.rate')).map(input => parseFloat(input.value));\n\n if (!validateInputs(amount, duration, rates)) return;\n\n resultsGrid.innerHTML = '';\n rates.forEach(rate => {\n const result = calculateLoan(amount, duration, rate);\n resultsGrid.appendChild(createResultCard(rate, result));\n });\n\n resultsSection.classList.remove('hidden');\n });\n\n function addRateInput() {\n const rateInput = document.createElement('div');\n rateInput.className = 'rate-input';\n rateInput.innerHTML = `\n <label>Taux d'intérêt (%):</label>\n <input type=\"number\" class=\"rate\" min=\"0\" step=\"0.01\" required>\n <button class=\"remove-rate\">×</button>\n `;\n ratesContainer.appendChild(rateInput);\n\n rateInput.querySelector('.remove-rate').addEventListener('click', function() {\n if (ratesContainer.children.length > 1) {\n ratesContainer.removeChild(rateInput);\n }\n });\n }\n\n function validateInputs(amount, duration, rates) {\n if (isNaN(amount) || amount <= 0) {\n alert('Veuillez entrer un montant de prêt valide.');\n return false;\n }\n if (isNaN(duration) || duration <= 0) {\n alert('Veuillez entrer une durée valide.');\n return false;\n }\n if (rates.some(rate => isNaN(rate) || rate < 0)) {\n alert('Veuillez entrer des taux d\\'intérêt valides.');\n return false;\n }\n return true;\n }\n\n function calculateLoan(amount, duration, rate) {\n const monthlyRate = rate / 100 / 12;\n const numberOfPayments = duration * 12;\n const monthlyPayment = amount * monthlyRate / (1 - Math.pow(1 + monthlyRate, -numberOfPayments));\n const totalCost = monthlyPayment * numberOfPayments;\n const totalInterest = totalCost - amount;\n\n return {\n monthlyPayment: monthlyPayment.toFixed(2),\n totalCost: totalCost.toFixed(2),\n totalInterest: totalInterest.toFixed(2)\n };\n }\n\n function createResultCard(rate, result) {\n const card = document.createElement('div');\n card.className = 'result-card';\n card.innerHTML = `\n <h3>Taux: ${rate.toFixed(2)}%</h3>\n <p>Mensualité: ${result.monthlyPayment} €</p>\n <p>Coût total: ${result.totalCost} €</p>\n <p>Intérêts totaux: ${result.totalInterest} €</p>\n `;\n return card;\n }\n});\n---end---"
+ },
+ "logprobs": null,
+ "finish_reason": "stop"
+ }
+ ],
+ "usage": {
+ "prompt_tokens": 281,
+ "completion_tokens": 1842,
+ "total_tokens": 2123,
+ "prompt_cache_hit_tokens": 0,
+ "prompt_cache_miss_tokens": 281
+ },
+ "system_fingerprint": "fp_f1afce2943"
+}
\ No newline at end of file
diff --git a/readme.scroll b/readme.scroll
new file mode 100644
index 0000000..fd7cf51
--- /dev/null
+++ b/readme.scroll
@@ -0,0 +1,2 @@
+# creditcompare.scroll.pub
+Website generated by DeepSeek from prompt: creer un site pour simuler un credit immobilier en france. En permetant la possibilité d'ajouter plusieurs taux et comparer leurs coûts et mensualité.sois creatif avec un beau rendu
\ No newline at end of file
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..9e32003
--- /dev/null
+++ b/script.js
@@ -0,0 +1,87 @@
+document.addEventListener('DOMContentLoaded', function() {
+ const ratesContainer = document.getElementById('rates-container');
+ const addRateButton = document.getElementById('add-rate');
+ const calculateButton = document.getElementById('calculate');
+ const resultsSection = document.getElementById('results');
+ const resultsGrid = document.getElementById('results-grid');
+
+ // Add initial rate input
+ addRateInput();
+
+ addRateButton.addEventListener('click', addRateInput);
+
+ calculateButton.addEventListener('click', function() {
+ const amount = parseFloat(document.getElementById('amount').value);
+ const duration = parseInt(document.getElementById('duration').value);
+ const rates = Array.from(document.querySelectorAll('.rate')).map(input => parseFloat(input.value));
+
+ if (!validateInputs(amount, duration, rates)) return;
+
+ resultsGrid.innerHTML = '';
+ rates.forEach(rate => {
+ const result = calculateLoan(amount, duration, rate);
+ resultsGrid.appendChild(createResultCard(rate, result));
+ });
+
+ resultsSection.classList.remove('hidden');
+ });
+
+ function addRateInput() {
+ const rateInput = document.createElement('div');
+ rateInput.className = 'rate-input';
+ rateInput.innerHTML = `
+ <label>Taux d'intérêt (%):</label>
+ <input type="number" class="rate" min="0" step="0.01" required>
+ <button class="remove-rate">×</button>
+ `;
+ ratesContainer.appendChild(rateInput);
+
+ rateInput.querySelector('.remove-rate').addEventListener('click', function() {
+ if (ratesContainer.children.length > 1) {
+ ratesContainer.removeChild(rateInput);
+ }
+ });
+ }
+
+ function validateInputs(amount, duration, rates) {
+ if (isNaN(amount) || amount <= 0) {
+ alert('Veuillez entrer un montant de prêt valide.');
+ return false;
+ }
+ if (isNaN(duration) || duration <= 0) {
+ alert('Veuillez entrer une durée valide.');
+ return false;
+ }
+ if (rates.some(rate => isNaN(rate) || rate < 0)) {
+ alert('Veuillez entrer des taux d\'intérêt valides.');
+ return false;
+ }
+ return true;
+ }
+
+ function calculateLoan(amount, duration, rate) {
+ const monthlyRate = rate / 100 / 12;
+ const numberOfPayments = duration * 12;
+ const monthlyPayment = amount * monthlyRate / (1 - Math.pow(1 + monthlyRate, -numberOfPayments));
+ const totalCost = monthlyPayment * numberOfPayments;
+ const totalInterest = totalCost - amount;
+
+ return {
+ monthlyPayment: monthlyPayment.toFixed(2),
+ totalCost: totalCost.toFixed(2),
+ totalInterest: totalInterest.toFixed(2)
+ };
+ }
+
+ function createResultCard(rate, result) {
+ const card = document.createElement('div');
+ card.className = 'result-card';
+ card.innerHTML = `
+ <h3>Taux: ${rate.toFixed(2)}%</h3>
+ <p>Mensualité: ${result.monthlyPayment} €</p>
+ <p>Coût total: ${result.totalCost} €</p>
+ <p>Intérêts totaux: ${result.totalInterest} €</p>
+ `;
+ return card;
+ }
+});
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..7a56e17
--- /dev/null
+++ b/style.css
@@ -0,0 +1,142 @@
+:root {
+ --primary-color: #2c3e50;
+ --secondary-color: #3498db;
+ --background-color: #f5f6fa;
+ --text-color: #2c3e50;
+ --border-color: #dfe6e9;
+ --shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+}
+
+body {
+ font-family: 'Segoe UI', sans-serif;
+ line-height: 1.6;
+ color: var(--text-color);
+ background-color: var(--background-color);
+ margin: 0;
+ padding: 20px;
+ max-width: 800px;
+ margin: 0 auto;
+}
+
+header {
+ text-align: center;
+ margin-bottom: 40px;
+}
+
+h1 {
+ color: var(--primary-color);
+ font-size: 2.5rem;
+ margin-bottom: 10px;
+}
+
+#calculator {
+ background: white;
+ padding: 30px;
+ border-radius: 10px;
+ box-shadow: var(--shadow);
+}
+
+.input-group {
+ margin-bottom: 20px;
+}
+
+label {
+ display: block;
+ margin-bottom: 5px;
+ font-weight: 600;
+}
+
+input {
+ width: 100%;
+ padding: 10px;
+ border: 1px solid var(--border-color);
+ border-radius: 5px;
+ font-size: 1rem;
+}
+
+#rates-container {
+ margin: 20px 0;
+}
+
+.rate-input {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ margin-bottom: 10px;
+}
+
+.rate-input input {
+ flex: 1;
+}
+
+.remove-rate {
+ background: #e74c3c;
+ color: white;
+ border: none;
+ border-radius: 50%;
+ width: 30px;
+ height: 30px;
+ cursor: pointer;
+ font-size: 1.2rem;
+ line-height: 1;
+}
+
+button {
+ background: var(--secondary-color);
+ color: white;
+ border: none;
+ padding: 10px 20px;
+ border-radius: 5px;
+ cursor: pointer;
+ font-size: 1rem;
+ transition: background 0.3s ease;
+}
+
+button:hover {
+ background: #2980b9;
+}
+
+#add-rate {
+ background: #27ae60;
+ margin-right: 10px;
+}
+
+#add-rate:hover {
+ background: #219653;
+}
+
+#results {
+ margin-top: 40px;
+}
+
+#results-grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+ gap: 20px;
+}
+
+.result-card {
+ background: white;
+ padding: 20px;
+ border-radius: 10px;
+ box-shadow: var(--shadow);
+}
+
+.result-card h3 {
+ margin-top: 0;
+ color: var(--primary-color);
+}
+
+.hidden {
+ display: none;
+}
+
+@media (max-width: 600px) {
+ h1 {
+ font-size: 2rem;
+ }
+
+ #calculator {
+ padding: 20px;
+ }
+}
\ No newline at end of file