{"id":205,"date":"2026-03-17T13:10:02","date_gmt":"2026-03-17T13:10:02","guid":{"rendered":"https:\/\/kemasug.com\/?page_id=205"},"modified":"2026-03-17T15:08:13","modified_gmt":"2026-03-17T15:08:13","slug":"inscription-compte","status":"publish","type":"page","link":"https:\/\/www.kemasug.com\/?page_id=205","title":{"rendered":"Inscription et abonnement KEMASUG"},"content":{"rendered":"\n<!-- ================= FRONTEND ================= -->\n<style>\n  body {\n    margin: 0;\n    font-family: Arial, sans-serif;\n    background: linear-gradient(to bottom, #e50914, #0b0b0b); \/* Rouge \u2192 Noir *\/\n    color: white;\n  }\n\n  form#subscriptionForm {\n    max-width: 450px;\n    margin: 50px auto;\n    padding: 30px;\n    background: rgba(0,0,0,0.85);\n    border-radius: 10px;\n    box-shadow: 0 0 20px #e50914;\n  }\n\n  form#subscriptionForm input, \n  form#subscriptionForm select, \n  form#subscriptionForm button {\n    display: block;\n    width: 100%;\n    margin-bottom: 15px;\n    padding: 10px;\n    border-radius: 6px;\n    border: none;\n    font-size: 16px;\n  }\n\n  form#subscriptionForm input, form#subscriptionForm select {\n    background: #111;\n    color: white;\n  }\n\n  form#subscriptionForm button {\n    background: #e50914;\n    color: white;\n    font-weight: bold;\n    cursor: pointer;\n    transition: 0.3s;\n  }\n\n  form#subscriptionForm button:hover {\n    background: #b00710;\n  }\n\n  #studentCardDiv {\n    margin-bottom: 15px;\n  }\n\n  h2 {\n    text-align: center;\n    margin-top: 40px;\n  }\n<\/style>\n\n<h2>Inscription et abonnement KEMASUG<\/h2>\n\n<form id=\"subscriptionForm\">\n  <input type=\"text\" id=\"name\" placeholder=\"Nom complet\" required>\n  <input type=\"email\" id=\"email\" placeholder=\"Email\" required>\n  <input type=\"password\" id=\"password\" placeholder=\"Mot de passe\" required>\n\n  <label>Choisissez votre abonnement :<\/label>\n  <select id=\"planSelect\" required>\n    <option value=\"student\">\u00c9tudiant 3,99 \u20ac \/ mois<\/option>\n    <option value=\"standard\">Standard 7,99 \u20ac \/ mois<\/option>\n    <option value=\"family\">Famille 14,99 \u20ac \/ mois<\/option>\n    <option value=\"premium\">Premium 19,99 \u20ac \/ mois<\/option>\n  <\/select>\n\n  <div id=\"studentCardDiv\" style=\"display:none\">\n    <label>Carte \u00e9tudiante (obligatoire pour \u00c9tudiant)<\/label>\n    <input type=\"file\" id=\"studentCard\" accept=\"image\/*\">\n  <\/div>\n\n  <button type=\"button\" onclick=\"signupAndSubscribe()\">S&rsquo;inscrire et payer<\/button>\n<\/form>\n\n<script type=\"module\">\n  \/\/ ================= FIREBASE =================\n  import { initializeApp } from \"https:\/\/www.gstatic.com\/firebasejs\/10.7.1\/firebase-app.js\";\n  import { getAuth, createUserWithEmailAndPassword } from \"https:\/\/www.gstatic.com\/firebasejs\/10.7.1\/firebase-auth.js\";\n  import { getFirestore, doc, setDoc } from \"https:\/\/www.gstatic.com\/firebasejs\/10.7.1\/firebase-firestore.js\";\n  import { getAnalytics } from \"https:\/\/www.gstatic.com\/firebasejs\/10.7.1\/firebase-analytics.js\";\n\n  \/\/ Ton bloc Firebase fourni\n  const firebaseConfig = {\n    apiKey: \"AIzaSyB_cid-lAs_YDtfDOSrB-9vqg_OL2YkdlY\",\n    authDomain: \"kemasug.firebaseapp.com\",\n    projectId: \"kemasug\",\n    storageBucket: \"kemasug.firebasestorage.app\",\n    messagingSenderId: \"50841803539\",\n    appId: \"1:50841803539:web:9dd33aa13243e820e258e6\",\n    measurementId: \"G-6MVRLLB3RK\"\n  };\n\n  const app = initializeApp(firebaseConfig);\n  const auth = getAuth(app);\n  const db = getFirestore(app);\n  const analytics = getAnalytics(app);\n\n  \/\/ Affiche le champ carte \u00e9tudiante si plan \u00e9tudiant\n  document.getElementById(\"planSelect\").addEventListener(\"change\", (e) => {\n    document.getElementById(\"studentCardDiv\").style.display = (e.target.value === \"student\") ? \"block\" : \"none\";\n  });\n\n  \/\/ Fonction inscription + Stripe Checkout\n  window.signupAndSubscribe = async function() {\n    const name = document.getElementById(\"name\").value;\n    const email = document.getElementById(\"email\").value;\n    const password = document.getElementById(\"password\").value;\n    const plan = document.getElementById(\"planSelect\").value;\n    const studentCard = document.getElementById(\"studentCard\").files[0];\n\n    if(plan === \"student\" && !studentCard){\n      return alert(\"Carte \u00e9tudiante obligatoire pour l\u2019abonnement \u00c9tudiant\");\n    }\n\n    try{\n      \/\/ Cr\u00e9ation compte Firebase\n      const userCredential = await createUserWithEmailAndPassword(auth, email, password);\n      const user = userCredential.user;\n\n      \/\/ Enregistrement dans Firestore\n      await setDoc(doc(db, \"users\", user.uid), {\n        name: name,\n        email: email,\n        plan: plan,\n        subscriptionActive: false,\n        studentCardName: studentCard ? studentCard.name : null\n      });\n\n      alert(\"Compte cr\u00e9\u00e9 !\");\n\n      \/\/ \ud83d\udd39 Price ID Stripe (\u00e0 remplacer par tes vrais IDs)\n      let priceId = \"\";\n      switch(plan){\n        case \"student\": priceId = \"price_etudiant\"; break;\n        case \"standard\": priceId = \"price_standard\"; break;\n        case \"family\": priceId = \"price_famille\"; break;\n        case \"premium\": priceId = \"price_premium\"; break;\n      }\n\n      \/\/ Redirection vers Stripe Checkout (backend Node.js)\n      fetch(\"https:\/\/ton-backend.com\/create-checkout-session\", {\n        method:\"POST\",\n        headers:{\"Content-Type\":\"application\/json\"},\n        body: JSON.stringify({ priceId: priceId, uid: user.uid })\n      })\n      .then(res => res.json())\n      .then(data => { window.location = data.url; });\n\n    } catch(error){\n      alert(error.message);\n    }\n  };\n<\/script>\n\n<!-- ================= BACKEND Node.js ================= -->\n<script type=\"text\/plain\" id=\"backendNodeJS\">\n\/*\n\u26a0\ufe0f Node.js doit tourner sur un serveur s\u00e9par\u00e9\n*\/\n\nconst express = require('express');\nconst app = express();\nconst stripe = require('stripe')('TA_CLE_SECRETE_STRIPE'); \/\/ remplace par ta cl\u00e9\napp.use(express.json());\n\napp.post('\/create-checkout-session', async (req, res) => {\n  const { priceId, uid } = req.body;\n\n  const session = await stripe.checkout.sessions.create({\n    payment_method_types: ['card'],\n    mode: 'subscription',\n    line_items: [{ price: priceId, quantity: 1 }],\n    success_url: `https:\/\/kemasug.com\/success?uid=${uid}`,\n    cancel_url: 'https:\/\/kemasug.com\/cancel',\n  });\n\n  res.json({ url: session.url });\n});\n\napp.listen(4242, () => console.log('Backend Stripe pr\u00eat'));\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Inscription et abonnement KEMASUG Choisissez votre abonnement : \u00c9tudiant 3,99 \u20ac \/ moisStandard 7,99 \u20ac \/ moisFamille 14,99 \u20ac \/ [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-205","page","type-page","status-publish","hentry"],"brizy_media":[],"_links":{"self":[{"href":"https:\/\/www.kemasug.com\/index.php?rest_route=\/wp\/v2\/pages\/205","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kemasug.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.kemasug.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.kemasug.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kemasug.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=205"}],"version-history":[{"count":4,"href":"https:\/\/www.kemasug.com\/index.php?rest_route=\/wp\/v2\/pages\/205\/revisions"}],"predecessor-version":[{"id":213,"href":"https:\/\/www.kemasug.com\/index.php?rest_route=\/wp\/v2\/pages\/205\/revisions\/213"}],"wp:attachment":[{"href":"https:\/\/www.kemasug.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=205"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}