From 211e7c13b3e7955690f65f0b43ecb2943dfd0393 Mon Sep 17 00:00:00 2001 From: Andy Meneely Date: Tue, 7 Apr 2015 12:20:40 -0400 Subject: [PATCH] Fix typography replacements with embeds Enable embedded icons tests again --- lib/squib/graphics/text.rb | 3 +- samples/embed_text.rb | 119 +++++++++-------- spec/data/samples/embed_text.rb.txt | 193 ++++++++++++++++++++++++++++ 3 files changed, 258 insertions(+), 57 deletions(-) diff --git a/lib/squib/graphics/text.rb b/lib/squib/graphics/text.rb index d39c612..f84e386 100644 --- a/lib/squib/graphics/text.rb +++ b/lib/squib/graphics/text.rb @@ -155,7 +155,8 @@ module Squib layout.font_description = font_desc layout.text = str if markup - layout.markup = Args::Typographer.new(@deck.config).process(layout.text) + str = Args::Typographer.new(@deck.config).process(layout.text) + layout.markup = str end set_wh!(layout, width, height) diff --git a/samples/embed_text.rb b/samples/embed_text.rb index 88ae18c..4e6cf36 100644 --- a/samples/embed_text.rb +++ b/samples/embed_text.rb @@ -4,69 +4,76 @@ Squib::Deck.new do background color: :white rect x: 0, y: 0, width: 825, height: 1125, stroke_width: 2.0 - # embed_text = 'Take 11 :tool: and gain 2 :health:. Take 2 :tool: and gain 3 :purse: if level 2.' - # text(str: embed_text, font: 'Sans 21', - # x: 0, y: 0, width: 180, hint: :red, - # align: :left, ellipsize: false, justify: false) do |embed| - # # Notice how we use dx and dy to adjust the icon to not rest directly on the baseline - # embed.svg key: ':tool:', width: 28, height: 28, dx: 0, dy: 4, file: 'spanner.svg' - # embed.svg key: ':health:', width: 28, height: 28, dx: -2, dy: 4, file: 'glass-heart.svg' - # embed.png key: ':purse:', width: 28, height: 28, dx: 0, dy: 4, file: 'shiny-purse.png' - # end + embed_text = 'Take 11 :tool: and gain 2 :health:. Take 2 :tool: and gain 3 :purse: if level 2.' + text(str: embed_text, font: 'Sans 21', + x: 0, y: 0, width: 180, hint: :red, + align: :left, ellipsize: false, justify: false) do |embed| + # Notice how we use dx and dy to adjust the icon to not rest directly on the baseline + embed.svg key: ':tool:', width: 28, height: 28, dx: 0, dy: 4, file: 'spanner.svg' + embed.svg key: ':health:', width: 28, height: 28, dx: -2, dy: 4, file: 'glass-heart.svg' + embed.png key: ':purse:', width: 28, height: 28, dx: 0, dy: 4, file: 'shiny-purse.png' + end - # embed_text = 'Middle align: Take 1 :tool: and gain 2 :health:. Take 2 :tool: and gain 3 :purse:' - # text(str: embed_text, font: 'Sans 21', - # x: 200, y: 0, width: 180, height: 300, valign: :middle, - # align: :left, ellipsize: false, justify: false, hint: :cyan) do |embed| - # embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' - # embed.svg key: ':health:', width: 28, height: 28, file: 'glass-heart.svg' - # embed.png key: ':purse:', width: 28, height: 28, file: 'shiny-purse.png' - # end + embed_text = 'Middle align: Take 1 :tool: and gain 2 :health:. Take 2 :tool: and gain 3 :purse:' + text(str: embed_text, font: 'Sans 21', + x: 200, y: 0, width: 180, height: 300, valign: :middle, + align: :left, ellipsize: false, justify: false, hint: :cyan) do |embed| + embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' + embed.svg key: ':health:', width: 28, height: 28, file: 'glass-heart.svg' + embed.png key: ':purse:', width: 28, height: 28, file: 'shiny-purse.png' + end - # embed_text = 'This :tool: aligns on the bottom properly. :purse:' - # text(str: embed_text, font: 'Sans 21', - # x: 400, y: 0, width: 180, height: 300, valign: :bottom, - # align: :left, ellipsize: false, justify: false, hint: :green) do |embed| - # embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' - # embed.svg key: ':health:', width: 28, height: 28, file: 'glass-heart.svg' - # embed.png key: ':purse:', width: 28, height: 28, file: 'shiny-purse.png' - # end + embed_text = 'This :tool: aligns on the bottom properly. :purse:' + text(str: embed_text, font: 'Sans 21', + x: 400, y: 0, width: 180, height: 300, valign: :bottom, + align: :left, ellipsize: false, justify: false, hint: :green) do |embed| + embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' + embed.svg key: ':health:', width: 28, height: 28, file: 'glass-heart.svg' + embed.png key: ':purse:', width: 28, height: 28, file: 'shiny-purse.png' + end - # embed_text = 'Wrapping multiples: These are 1 :tool::tool::tool: and these are multiple :tool::tool: :tool::tool:' - # text(str: embed_text, font: 'Sans 21', - # x: 600, y: 0, width: 180, height: 300, valign: :middle, - # align: :left, ellipsize: false, justify: false, hint: :cyan) do |embed| - # embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' - # end + embed_text = 'Wrapping multiples: These are 1 :tool::tool::tool: and these are multiple :tool::tool: :tool::tool:' + text(str: embed_text, font: 'Sans 21', + x: 600, y: 0, width: 180, height: 300, valign: :middle, + align: :left, ellipsize: false, justify: false, hint: :cyan) do |embed| + embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' + end - # embed_text = ':tool:Justify will :tool: work too, and :purse: with more words just for fun' - # text(str: embed_text, font: 'Sans 21', - # x: 0, y: 320, width: 180, height: 300, valign: :bottom, - # align: :left, ellipsize: false, justify: true, hint: :magenta) do |embed| - # embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' - # embed.svg key: ':health:', width: 28, height: 28, file: 'glass-heart.svg' - # embed.png key: ':purse:', width: 28, height: 28, file: 'shiny-purse.png' - # end + embed_text = ':tool:Justify will :tool: work too, and :purse: with more words just for fun' + text(str: embed_text, font: 'Sans 21', + x: 0, y: 320, width: 180, height: 300, valign: :bottom, + align: :left, ellipsize: false, justify: true, hint: :magenta) do |embed| + embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' + embed.svg key: ':health:', width: 28, height: 28, file: 'glass-heart.svg' + embed.png key: ':purse:', width: 28, height: 28, file: 'shiny-purse.png' + end - # embed_text = 'Right-aligned works :tool: with :health: and :purse:' - # text(str: embed_text, font: 'Sans 21', - # x: 200, y: 320, width: 180, height: 300, valign: :bottom, - # align: :right, ellipsize: false, justify: false, hint: :magenta) do |embed| - # embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' - # embed.svg key: ':health:', width: 28, height: 28, file: 'glass-heart.svg' - # embed.png key: ':purse:', width: 28, height: 28, file: 'shiny-purse.png' - # end + embed_text = 'Right-aligned works :tool: with :health: and :purse:' + text(str: embed_text, font: 'Sans 21', + x: 200, y: 320, width: 180, height: 300, valign: :bottom, + align: :right, ellipsize: false, justify: false, hint: :magenta) do |embed| + embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' + embed.svg key: ':health:', width: 28, height: 28, file: 'glass-heart.svg' + embed.png key: ':purse:', width: 28, height: 28, file: 'shiny-purse.png' + end - # embed_text = ':tool:Center-aligned works :tool: with :health: and :purse:' - # text(str: embed_text, font: 'Sans 21', - # x: 400, y: 320, width: 180, height: 300, - # align: :center, ellipsize: false, justify: false, hint: :magenta) do |embed| - # embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' - # embed.svg key: ':health:', width: 28, height: 28, file: 'glass-heart.svg' - # embed.png key: ':purse:', width: 28, height: 28, file: 'shiny-purse.png' - # end + embed_text = ':tool:Center-aligned works :tool: with :health: and :purse:' + text(str: embed_text, font: 'Sans 21', + x: 400, y: 320, width: 180, height: 300, + align: :center, ellipsize: false, justify: false, hint: :magenta) do |embed| + embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' + embed.svg key: ':health:', width: 28, height: 28, file: 'glass-heart.svg' + embed.png key: ':purse:', width: 28, height: 28, file: 'shiny-purse.png' + end + + embed_text = 'Markup and typography replacements with ":tool:" icons won\'t fail' + text(str: embed_text, font: 'Serif 21', markup: true, + x: 600, y: 320, width: 180, height: 300, + align: :center, hint: :magenta) do |embed| + embed.svg key: ':tool:', width: 28, height: 28, file: 'spanner.svg' + end - # save_png prefix: 'embed_' + save_png prefix: 'embed_' end Squib::Deck.new(cards: 3) do diff --git a/spec/data/samples/embed_text.rb.txt b/spec/data/samples/embed_text.rb.txt index 979b66d..8dea7d1 100644 --- a/spec/data/samples/embed_text.rb.txt +++ b/spec/data/samples/embed_text.rb.txt @@ -12,6 +12,199 @@ cairo: rounded_rectangle([0, 0, 825, 1125, 0, 0]) cairo: set_source_color(["#0000"]) cairo: fill([]) cairo: restore([]) +cairo: save([]) +cairo: set_source_color([:black]) +cairo: translate([0, 0]) +cairo: rotate([0]) +cairo: move_to([0, 0]) +pango: font_description=([MockDouble]) +pango: text=(["Take 11 :tool: and gain 2 :health:. Take 2 :tool: and gain 3 :purse: if level 2."]) +pango: width=([184320]) +pango: wrap=([#]) +pango: ellipsize=([#]) +pango: alignment=([#]) +pango: justify=([false]) +pango: spacing=([0]) +cairo: update_pango_layout([MockDouble]) +pango: markup=(["Take 11 :tool: and gain 2 :health:. Take 2 :tool: and gain 3 :purse: if level 2."]) +cairo: move_to([0, 0]) +cairo: update_pango_layout([MockDouble]) +cairo: show_pango_layout([MockDouble]) +cairo: rounded_rectangle([0, 0, 0, 0, 0, 0]) +cairo: set_source_color([:red]) +cairo: set_line_width([2.0]) +cairo: stroke([]) +cairo: restore([]) +cairo: save([]) +cairo: set_source_color([:black]) +cairo: translate([200, 0]) +cairo: rotate([0]) +cairo: move_to([0, 0]) +pango: font_description=([MockDouble]) +pango: text=(["Middle align: Take 1 :tool: and gain 2 :health:. Take 2 :tool: and gain 3 :purse:"]) +pango: width=([184320]) +pango: height=([307200]) +pango: wrap=([#]) +pango: ellipsize=([#]) +pango: alignment=([#]) +pango: justify=([false]) +pango: spacing=([0]) +cairo: update_pango_layout([MockDouble]) +pango: markup=(["Middle align: Take 1 :tool: and gain 2 :health:. Take 2 :tool: and gain 3 :purse:"]) +cairo: move_to([0, 0.0]) +cairo: update_pango_layout([MockDouble]) +cairo: show_pango_layout([MockDouble]) +cairo: rounded_rectangle([0, 0, 0, 0, 0, 0]) +cairo: set_source_color([:cyan]) +cairo: set_line_width([2.0]) +cairo: stroke([]) +cairo: restore([]) +cairo: save([]) +cairo: set_source_color([:black]) +cairo: translate([400, 0]) +cairo: rotate([0]) +cairo: move_to([0, 0]) +pango: font_description=([MockDouble]) +pango: text=(["This :tool: aligns on the bottom properly. :purse:"]) +pango: width=([184320]) +pango: height=([307200]) +pango: wrap=([#]) +pango: ellipsize=([#]) +pango: alignment=([#]) +pango: justify=([false]) +pango: spacing=([0]) +cairo: update_pango_layout([MockDouble]) +pango: markup=(["This :tool: aligns on the bottom properly. :purse:"]) +cairo: move_to([0, 0.0]) +cairo: update_pango_layout([MockDouble]) +cairo: show_pango_layout([MockDouble]) +cairo: rounded_rectangle([0, 0, 0, 0, 0, 0]) +cairo: set_source_color([:green]) +cairo: set_line_width([2.0]) +cairo: stroke([]) +cairo: restore([]) +cairo: save([]) +cairo: set_source_color([:black]) +cairo: translate([600, 0]) +cairo: rotate([0]) +cairo: move_to([0, 0]) +pango: font_description=([MockDouble]) +pango: text=(["Wrapping multiples: These are 1 :tool::tool::tool: and these are multiple :tool::tool: :tool::tool:"]) +pango: width=([184320]) +pango: height=([307200]) +pango: wrap=([#]) +pango: ellipsize=([#]) +pango: alignment=([#]) +pango: justify=([false]) +pango: spacing=([0]) +cairo: update_pango_layout([MockDouble]) +pango: markup=(["Wrapping multiples: These are 1 :tool::tool::tool: and these are multiple :tool::tool: :tool::tool:"]) +cairo: move_to([0, 0.0]) +cairo: update_pango_layout([MockDouble]) +cairo: show_pango_layout([MockDouble]) +cairo: rounded_rectangle([0, 0, 0, 0, 0, 0]) +cairo: set_source_color([:cyan]) +cairo: set_line_width([2.0]) +cairo: stroke([]) +cairo: restore([]) +cairo: save([]) +cairo: set_source_color([:black]) +cairo: translate([0, 320]) +cairo: rotate([0]) +cairo: move_to([0, 0]) +pango: font_description=([MockDouble]) +pango: text=([":tool:Justify will :tool: work too, and :purse: with more words just for fun"]) +pango: width=([184320]) +pango: height=([307200]) +pango: wrap=([#]) +pango: ellipsize=([#]) +pango: alignment=([#]) +pango: justify=([true]) +pango: spacing=([0]) +cairo: update_pango_layout([MockDouble]) +pango: markup=([":tool:Justify will :tool: work too, and :purse: with more words just for fun"]) +cairo: move_to([0, 0.0]) +cairo: update_pango_layout([MockDouble]) +cairo: show_pango_layout([MockDouble]) +cairo: rounded_rectangle([0, 0, 0, 0, 0, 0]) +cairo: set_source_color([:magenta]) +cairo: set_line_width([2.0]) +cairo: stroke([]) +cairo: restore([]) +cairo: save([]) +cairo: set_source_color([:black]) +cairo: translate([200, 320]) +cairo: rotate([0]) +cairo: move_to([0, 0]) +pango: font_description=([MockDouble]) +pango: text=(["Right-aligned works :tool: with :health: and :purse:"]) +pango: width=([184320]) +pango: height=([307200]) +pango: wrap=([#]) +pango: ellipsize=([#]) +pango: alignment=([#]) +pango: justify=([false]) +pango: spacing=([0]) +cairo: update_pango_layout([MockDouble]) +pango: markup=(["Right-aligned works :tool: with :health: and :purse:"]) +cairo: move_to([0, 0.0]) +cairo: update_pango_layout([MockDouble]) +cairo: show_pango_layout([MockDouble]) +cairo: rounded_rectangle([0, 0, 0, 0, 0, 0]) +cairo: set_source_color([:magenta]) +cairo: set_line_width([2.0]) +cairo: stroke([]) +cairo: restore([]) +cairo: save([]) +cairo: set_source_color([:black]) +cairo: translate([400, 320]) +cairo: rotate([0]) +cairo: move_to([0, 0]) +pango: font_description=([MockDouble]) +pango: text=([":tool:Center-aligned works :tool: with :health: and :purse:"]) +pango: width=([184320]) +pango: height=([307200]) +pango: wrap=([#]) +pango: ellipsize=([#]) +pango: alignment=([#]) +pango: justify=([false]) +pango: spacing=([0]) +cairo: update_pango_layout([MockDouble]) +pango: markup=([":tool:Center-aligned works :tool: with :health: and :purse:"]) +cairo: move_to([0, 0]) +cairo: update_pango_layout([MockDouble]) +cairo: show_pango_layout([MockDouble]) +cairo: rounded_rectangle([0, 0, 0, 0, 0, 0]) +cairo: set_source_color([:magenta]) +cairo: set_line_width([2.0]) +cairo: stroke([]) +cairo: restore([]) +cairo: save([]) +cairo: set_source_color([:black]) +cairo: translate([600, 320]) +cairo: rotate([0]) +cairo: move_to([0, 0]) +pango: font_description=([MockDouble]) +pango: text=(["Markup and typography replacements with \":tool:\" icons won't fail"]) +pango: markup=(["foo"]) +pango: width=([184320]) +pango: height=([307200]) +pango: wrap=([#]) +pango: ellipsize=([#]) +pango: alignment=([#]) +pango: justify=([false]) +pango: spacing=([0]) +cairo: update_pango_layout([MockDouble]) +pango: markup=(["foo"]) +cairo: move_to([0, 0]) +cairo: update_pango_layout([MockDouble]) +cairo: show_pango_layout([MockDouble]) +cairo: rounded_rectangle([0, 0, 0, 0, 0, 0]) +cairo: set_source_color([:magenta]) +cairo: set_line_width([2.0]) +cairo: stroke([]) +cairo: restore([]) +surface: write_to_png(["_output/embed_00.png"]) cairo: antialias=(["subpixel"]) cairo: antialias=(["subpixel"]) cairo: antialias=(["subpixel"])