diff --git a/card.svg b/card.svg index 8a45a5c..fe94dc8 100644 --- a/card.svg +++ b/card.svg @@ -1,2 +1,2 @@ -Rallier les TroupesAction, Charme455Mobilisez un Champion. \ No newline at end of file +Rallier les TroupesAction, Charme455Mobilisez un Champion. \ No newline at end of file diff --git a/src/actual_card_data.json b/src/actual_card_data.json new file mode 100644 index 0000000..b46b27c --- /dev/null +++ b/src/actual_card_data.json @@ -0,0 +1,24 @@ +{ + "id": 10, + "role": "market", + "card_type": "action", + "faction": "yellow", + "name": "Rally the Troops", + "cost": 4, + "init_amount": 1, + "effects": [ + { + "effect": "heal", + "amount": 5 + }, + { + "effect": "damage", + "amount": 5 + }, + { + "effect": "prepare", + "amount": 1, + "effect_type": "faction_combo" + } + ] +} \ No newline at end of file diff --git a/src/generate_cards_mvp.py b/src/generate_cards_mvp.py index 4ae1d9e..99004fc 100644 --- a/src/generate_cards_mvp.py +++ b/src/generate_cards_mvp.py @@ -72,10 +72,18 @@ with open('src/card_data.json') as f: # Params x_width = 298 y_height = 417 -stats_radius = 25 +border_width_x = 12 +border_width_y = 17 +border_upper_offset = 5 +title_y_offset = 24 +title_font_size = 19 +subtitle_font_size = 13 +cost_right_offset = 38 +stats_radius = 22 +effect_text_size = 14 row_1_base_y = 280 -row_2_base_y = 390 -row_1_to_2_separator_y = 360 +row_2_base_y = 375 +row_1_to_2_separator_y = 345 row_1_to_2_separator_shorten_by = 20 background_colors = { @@ -86,40 +94,112 @@ background_colors = { 'base': 'lightgrey' } +gradient_colors = { + 'red': 'red', + 'blue': 'blue', + 'yellow': 'yellow', + 'green': 'green' +} + +icon_colors = { + 'yellow': ['#ff9935', '#ffe744'] +} + # Create a new SVG drawing dwg = svgwrite.Drawing('card.svg', profile='tiny', size=(str(x_width) + 'px', str(y_height) + 'px')) +# Define linear colored gradient +gradient = dwg.linearGradient(start=(0, 0), end=(1, 0), id="grad1") +gradient.add_stop_color(0, gradient_colors[card_data['faction']], opacity=1) +gradient.add_stop_color(1, gradient_colors[card_data['faction']], opacity=0) +dwg.defs.add(gradient) + +# Define linear colored gradient for faction icon +gradient_faction_icon = dwg.linearGradient(start=(0, 1), end=(0, 0), id="grad2") +gradient_faction_icon.add_stop_color(0, icon_colors[card_data['faction']][0], opacity=1) +gradient_faction_icon.add_stop_color(1, icon_colors[card_data['faction']][1], opacity=1) +dwg.defs.add(gradient_faction_icon) + +# # Define a drop shadow filter +# filter_shadow = dwg.defs.add(dwg.filter(id='dropShadow')) +# filter_shadow.feGaussianBlur(in_='SourceAlpha', stdDeviation=3) +# filter_shadow.feOffset(dx=3, dy=3, result='offsetblur') +# filter_shadow.feFlood(flood_color='black', flood_opacity=0.5) +# filter_shadow.feComposite(in2='offsetblur', operator='in') +# filter_shadow.feMerge().feMergeNode(in_='SourceGraphic') + # Draw card background -dwg.add(dwg.rect(insert=(0, 0), size=(str(x_width) + 'px', str(y_height) + 'px'), rx=10, ry=10, fill=background_colors[card_data['faction']])) +dwg.add(dwg.rect(insert=(0, 0), size=(str(x_width) + 'px', str(y_height) + 'px'), rx=15, ry=18, fill='black')) +dwg.add(dwg.rect(insert=(border_width_x, border_width_y - border_upper_offset), size=(str(x_width - border_width_x*2) + 'px', str(y_height - border_width_y*2 + border_upper_offset) + 'px'), rx=0, ry=0, fill=background_colors[card_data['faction']])) # Draw title area -dwg.add(dwg.rect(insert=(0, 0), size=(str(x_width) + 'px', '50px'), fill='white')) -dwg.add(dwg.text(card_data['title'], insert=(130, 30), text_anchor='middle', fill='black', font_size='24px', font_weight="bold")) +# dwg.add(dwg.rect(insert=(0, 0), size=(str(x_width) + 'px', '50px'), fill='white')) +dwg.add(dwg.text(card_data['title'], insert=(x_width/2, title_y_offset + border_width_y - border_upper_offset), text_anchor='middle', fill='black', font_size=str(title_font_size) + 'px', font_weight="bold", font_family='Helvetica')) # Draw type area -dwg.add(dwg.text(card_data['type'], insert=(10, 70), fill='black', font_size='16px')) +dwg.add(dwg.text(card_data['type'], insert=(x_width/2, title_y_offset + title_font_size + 10), text_anchor='middle', fill='black', font_size=str(subtitle_font_size) + 'px', font_family='Helvetica')) + +# Draw faction icon +dwg.add(dwg.circle(center=(border_width_x + 23 + 1, border_width_y - border_upper_offset + 20 + 4 + 1), r=20, fill='black')) +dwg.add(dwg.circle(center=(border_width_x + 23, border_width_y - border_upper_offset + 20 + 4), r=20, fill='url(#grad2)')) +# dwg.add(dwg.image(card_data['faction_icon'], insert=(x_width - 30 - 15, 30 - 15), size=(30, 30))) # Draw cost circle -dwg.add(dwg.circle(center=(x_width - 30, 25), r=20, fill='yellow')) -dwg.add(dwg.text(str(card_data['cost']), insert=(x_width - 35, 32), fill='black', font_size='24px', font_weight="bold")) +dwg.add(dwg.circle(center=(x_width - cost_right_offset + 2, 19 + border_width_y + 2), r=21, fill='rgb(202, 129, 25)')) +dwg.add(dwg.circle(center=(x_width - cost_right_offset, 19 + border_width_y), r=20, fill='yellow')) +dwg.add(dwg.text(str(card_data['cost']), insert=(x_width - cost_right_offset, 26 + border_width_y), text_anchor='middle', fill='black', font_size='24px', font_weight="bold", font_family='Helvetica')) # Draw image area -dwg.add(dwg.image(card_data['image_path'], insert=(0, 80), size=(x_width, 180))) +dwg.add(dwg.rect(insert=(0, 65), size=(str(x_width) + 'px', '200px'), fill='black')) +dwg.add(dwg.image(card_data['image_path'], insert=(0, 65), size=(x_width, 200))) + +dwg.add(dwg.rect(insert=(border_width_x, 265), size=(str(30) + 'px', str(y_height - 265 - border_width_y) + 'px'), fill='url(#grad1)')) # TODO: figure out nb of effects and adjust row_1_x_offset accordingly -# Draw row 1 stats -dwg.add(dwg.circle(center=(100, row_1_base_y + stats_radius), r=25, fill='red')) -dwg.add(dwg.text(str(card_data['row_1']['damage']), insert=(100, row_1_base_y + stats_radius + 9), text_anchor='middle', fill='white', font_size='24px', font_weight="bold")) +card_effects = card_data['row_1'] +row_1_nb_effects = len(card_data['row_1'].keys()) -dwg.add(dwg.circle(center=(210, row_1_base_y + stats_radius), r=25, fill='green')) -dwg.add(dwg.text(str(card_data['row_1']['heal']), insert=(210, row_1_base_y + stats_radius + 9), text_anchor='middle', fill='white', font_size='24px', font_weight="bold")) +row_1_x_offset = -20 +row_1_x_step = 60 +if row_1_nb_effects == 1: + row_1_x_offset = 0 +elif row_1_nb_effects == 2: + row_1_x_offset = -20 +elif row_1_nb_effects == 3: + row_1_x_offset = -40 +row_1_nb_effects_applied = 0 + +# Draw row 1 stats +if card_effects.get('damage'): + x_effect_pos = x_width/2 + row_1_x_offset + row_1_x_step*row_1_nb_effects_applied + dwg.add(dwg.circle(center=(x_effect_pos, row_1_base_y + stats_radius), r=stats_radius, fill='red')) + dwg.add(dwg.text(str(card_data['row_1']['damage']), insert=(x_effect_pos, row_1_base_y + stats_radius + 9), text_anchor='middle', fill='white', font_size='24px', font_weight="bold", font_family='Helvetica')) + row_1_nb_effects_applied += 1 + +if card_effects.get('gold'): + x_effect_pos = x_width/2 + row_1_x_offset + row_1_x_step*row_1_nb_effects_applied + dwg.add(dwg.circle(center=(x_effect_pos, row_1_base_y + stats_radius), r=stats_radius, fill='yellow')) + dwg.add(dwg.text(str(card_data['row_1']['gold']), insert=(x_effect_pos, row_1_base_y + stats_radius + 9), text_anchor='middle', fill='black', font_size='24px', font_weight="bold", font_family='Helvetica')) + row_1_nb_effects_applied += 1 + +if card_effects.get('heal'): + x_effect_pos = x_width/2 + row_1_x_offset + row_1_x_step*row_1_nb_effects_applied + dwg.add(dwg.circle(center=(x_effect_pos, row_1_base_y + stats_radius), r=stats_radius, fill='green')) + dwg.add(dwg.text(str(card_data['row_1']['heal']), insert=(x_effect_pos, row_1_base_y + stats_radius + 9), text_anchor='middle', fill='white', font_size='24px', font_weight="bold", font_family='Helvetica')) + row_1_nb_effects_applied += 1 if card_data['row_2']: # Draw row 1 to row 2 separator dwg.add(dwg.line(start=(0 + row_1_to_2_separator_shorten_by, row_1_to_2_separator_y), end=(x_width - row_1_to_2_separator_shorten_by, row_1_to_2_separator_y), stroke='black', stroke_width=1)) # Draw row 2 effect text - dwg.add(dwg.text(card_data['row_2']['effect'], insert=(x_width/2, row_2_base_y), text_anchor='middle', fill='black', font_size='16px')) + # If ally effect, draw ally icon (TODO condition) + row_2_icon_x = border_width_x + 35 + row_2_icon_y = row_2_base_y - 5 + dwg.add(dwg.circle(center=(row_2_icon_x + 1, row_2_icon_y + 1), r=15, fill='black')) + dwg.add(dwg.circle(center=(row_2_icon_x, row_2_icon_y), r=15, fill='url(#grad2)')) + # dwg.add(dwg.image(card_data['faction_icon'], insert=(x_width - 30 - 15, 30 - 15), size=(30, 30))) + dwg.add(dwg.text(card_data['row_2']['effect'], insert=(x_width/2, row_2_base_y), text_anchor='middle', fill='black', font_size=str(effect_text_size) + 'px', font_family='Helvetica')) # Save the SVG file dwg.save()