Fase 3: migra 4 servicios de personaje más a la isla reutilizable

customize, change_race, change_faction y level_up comparten el patrón exacto de
rename (select 'character' + precio -> Stripe), así que reutilizan la isla
CharacterPurchaseForm / entry character_purchase cambiando solo los data-* (url,
label, clase de botón). Sin JS nuevo. Se eliminan los <script> jQuery y Stripe
inline de cada plantilla.

Verificado: check OK, las 4 páginas redirigen a login sin sesión y las plantillas
renderizan la isla correctamente.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-12 21:35:52 +00:00
parent 2258df4b09
commit 823b8d0014
4 changed files with 40 additions and 70 deletions
+10 -15
View File
@@ -55,21 +55,16 @@
<p>Por favor, asegúrate de haber escogido al personaje correcto ya que esta acción no es reversible una vez realizada.</p>
</div>
</fieldset>
<script src="{{ URL_PRINCIPAL }}/static/nw-themes/nw-ryu/nw-js-handlers/change_faction_response.js"></script>
<script src="https://js.stripe.com/v3/"></script>
<form action="" id="nw-change-faction-form" method="POST" accept-charset="utf-8">
<select name="character">
<option value="" selected disabled>Seleccione un personaje</option>
{% for character in characters %}
<option class="priest big-font" value="{{ character }}">{{ character }}</option>
{% endfor %}
</select>
<br>
<button class="change-faction-button" type="submit" name="change-faction-button" data-id="ChangeFaction">Cambiar Facción por {{ price }} €</button>
</form>
<br>
<hr>
<center><div class="alert-message" id="change-race-response"></div></center>
{% load django_vite %}
<!-- Isla React (Vite): servicio de pago de personaje (genérico). -->
<div id="character-purchase-app"
data-csrf="{{ csrf_token }}"
data-url="{% url 'change-faction-character' %}"
data-price="{{ price }}"
data-label="Cambiar Facción"
data-button-class="change-faction-button"></div>
{{ characters|json_script:"character-purchase-data" }}
{% vite_asset 'src/entries/character_purchase.tsx' %}
<br>
</div>
</div>
+10 -20
View File
@@ -19,26 +19,16 @@
<p>Por favor, asegúrate de haber escogido al personaje correcto ya que esta acción no es reversible una vez realizada.</p>
</div>
</fieldset>
<script src="{{ URL_PRINCIPAL }}/static/nw-themes/nw-ryu/nw-js-handlers/change_race_response.js"></script>
<script src="https://js.stripe.com/v3/"></script>
<form id="nw-change-race-form" div class="centered">
<br>
<br>
<p>Escoge el personaje que quieres desbloquear</p>
<br>
<form action="" id="nw-change-race-form" method="POST" accept-charset="utf-8">
<select name="character">
<option value="" selected disabled>Seleccione un personaje</option>
{% for character in characters %}
<option class="priest big-font" value="{{ character }}">{{ character }}</option>
{% endfor %}
</select>
<br>
<button class="change-race-button" type="submit" name="change-race-button" data-id="ChangeRace">Cambiar Raza por {{ price }} €</button>
</form>
<br>
<hr>
<center><div class="alert-message" id="change-race-response"></div></center>
{% load django_vite %}
<!-- Isla React (Vite): servicio de pago de personaje (genérico). -->
<div id="character-purchase-app"
data-csrf="{{ csrf_token }}"
data-url="{% url 'change-race-character' %}"
data-price="{{ price }}"
data-label="Cambiar Raza"
data-button-class="change-race-button"></div>
{{ characters|json_script:"character-purchase-data" }}
{% vite_asset 'src/entries/character_purchase.tsx' %}
<br>
</div>
</div>
@@ -24,26 +24,16 @@
<p>Por favor, asegúrate de haber escogido al personaje correcto ya que esta acción no es reversible una vez realizada.</p>
</div>
</fieldset>
<script src="{{ URL_PRINCIPAL }}/static/nw-themes/nw-ryu/nw-js-handlers/customize_response.js"></script>
<script src="https://js.stripe.com/v3/"></script>
<form id="nw-customize-form" div class="centered">
<br>
<br>
<p>Escoge el personaje que quieres desbloquear</p>
<br>
<form action="" id="nw-customize-form" method="POST" accept-charset="utf-8">
<select name="character">
<option value="" selected disabled>Seleccione un personaje</option>
{% for character in characters %}
<option class="priest big-font" value="{{ character }}">{{ character }}</option>
{% endfor %}
</select>
<br>
<button class="customize-button" type="submit" name="rename-button" data-id="Renombrar">Renombrar por {{ price }} €</button>
</form>
<br>
<hr>
<center><div class="alert-message" id="customize-response"></div></center>
{% load django_vite %}
<!-- Isla React (Vite): servicio de pago de personaje (genérico). -->
<div id="character-purchase-app"
data-csrf="{{ csrf_token }}"
data-url="{% url 'customize-character' %}"
data-price="{{ price }}"
data-label="Personalizar"
data-button-class="customize-button"></div>
{{ characters|json_script:"character-purchase-data" }}
{% vite_asset 'src/entries/character_purchase.tsx' %}
<br>
</div>
</div>
+10 -15
View File
@@ -20,21 +20,16 @@
</div>
</fieldset>
<p>Selecciona el personaje que deseas subir al nivel 80:</p>
<script src="{{ URL_PRINCIPAL }}/static/nw-themes/nw-ryu/nw-js-handlers/level_up_response.js"></script>
<script src="https://js.stripe.com/v3/"></script>
<form action="" id="nw-levelup-form" method="POST" accept-charset="utf-8">
<select name="character">
<option value="" selected disabled>Seleccione un personaje</option>
{% for character in characters %}
<option class="priest big-font" value="{{ character }}">{{ character }}</option>
{% endfor %}
</select>
<br>
<button class="level-up-button" type="submit" name="level-up-button" data-id="LevelUp">Subir a nivel 80 por {{ price }} €</button>
</form>
<br>
<hr>
<center><div class="alert-message" id="levelup-response"></div></center>
{% load django_vite %}
<!-- Isla React (Vite): servicio de pago de personaje (genérico). -->
<div id="character-purchase-app"
data-csrf="{{ csrf_token }}"
data-url="{% url 'level_up_character' %}"
data-price="{{ price }}"
data-label="Subir a nivel 80"
data-button-class="level-up-button"></div>
{{ characters|json_script:"character-purchase-data" }}
{% vite_asset 'src/entries/character_purchase.tsx' %}
<br>
</div>
</div>