diff --git a/assets/stylesheets/global/_icons.scss.erb b/assets/stylesheets/global/_icons.scss.erb index 555b526a..bfc852f4 100644 --- a/assets/stylesheets/global/_icons.scss.erb +++ b/assets/stylesheets/global/_icons.scss.erb @@ -32,11 +32,11 @@ <%= items = [] - manifest['icons'].each do |icon| + manifest['items'].each do |item| rules = [] - rules << "background-position: -#{icon['col']}rem -#{icon['row']}rem;" - rules << "@extend %darkIconFix !optional;" if icon['dark_icon_fix'] - items << "._icon-#{icon['type']}:before { #{rules.join(' ')} }" + rules << "background-position: -#{item['col']}rem -#{item['row']}rem;" + rules << "@extend %darkIconFix !optional;" if item['dark_icon_fix'] + items << "._icon-#{item['type']}:before { #{rules.join(' ')} }" end items.join('') diff --git a/lib/tasks/sprites.thor b/lib/tasks/sprites.thor index 01cbcf22..251a9327 100644 --- a/lib/tasks/sprites.thor +++ b/lib/tasks/sprites.thor @@ -21,26 +21,26 @@ class SpritesCLI < Thor bg_color = get_sidebar_background items_with_icons.each_with_index do |item, index| - if item[:has_icons] - item[:row] = (index / icons_per_row).floor - item[:col] = index - item[:row] * icons_per_row + item[:row] = (index / icons_per_row).floor + item[:col] = index - item[:row] * icons_per_row - item[:icon_16] = get_icon(item[:path_16], 16) - item[:icon_32] = get_icon(item[:path_32], 32) + item[:icon_16] = get_icon(item[:path_16], 16) + item[:icon_32] = get_icon(item[:path_32], 32) - item[:dark_icon_fix] = needs_dark_icon_fix(item[:icon_32], bg_color) - end + item[:dark_icon_fix] = needs_dark_icon_fix(item[:icon_32], bg_color) end + log_details(items_with_icons, icons_per_row) + generate_spritesheet(16, items_with_icons, 'assets/images/sprites/docs.png') {|item| item[:icon_16]} generate_spritesheet(32, items_with_icons, 'assets/images/sprites/docs@2x.png') {|item| item[:icon_32]} # Add Mongoose's icon details to docs without custom icons - template_item = items_with_icons.find {|item| item[:type] == 'mongoose'} + default_item = items_with_icons.find {|item| item[:type] == 'mongoose'} items_without_icons.each do |item| - item[:row] = template_item[:row] - item[:col] = template_item[:col] - item[:dark_icon_fix] = template_item[:dark_icon_fix] + item[:row] = default_item[:row] + item[:col] = default_item[:col] + item[:dark_icon_fix] = default_item[:dark_icon_fix] end save_manifest(items, icons_per_row, 'assets/images/sprites/docs.json') @@ -60,9 +60,9 @@ class SpritesCLI < Thor # Checking paths against an array of possible paths is faster than 200+ File.exist? calls files = Dir.glob('public/icons/docs/**/*.png') - items.map do |item| + + items.each do |item| item[:has_icons] = files.include?(item[:path_16]) && files.include?(item[:path_32]) - item end end @@ -111,79 +111,79 @@ class SpritesCLI < Thor end def get_luminance(color) - rgba = [ + rgb = [ ChunkyPNG::Color.r(color).to_f, ChunkyPNG::Color.g(color).to_f, - ChunkyPNG::Color.b(color).to_f, - ChunkyPNG::Color.a(color).to_f + ChunkyPNG::Color.b(color).to_f ] - rgba.map! do |rgb| - rgb /= 255 - rgb < 0.03928 ? rgb / 12.92 : ((rgb + 0.055) / 1.055) ** 2.4 + rgb.map! do |value| + value /= 255 + value < 0.03928 ? value / 12.92 : ((value + 0.055) / 1.055) ** 2.4 end - 0.2126 * rgba[0] + 0.7152 * rgba[1] + 0.0722 * rgba[2] + 0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2] end - def generate_spritesheet(size, icons, output_path, &icon_to_img) + def generate_spritesheet(size, items_with_icons, output_path, &item_to_icon) logger.info("Generating spritesheet #{output_path} with icons of size #{size} x #{size}") - icons_per_row = Math.sqrt(icons.length).ceil + icons_per_row = Math.sqrt(items_with_icons.length).ceil spritesheet = ChunkyPNG::Image.new(size * icons_per_row, size * icons_per_row) - icons.each do |icon| - img = icon_to_img.call(icon) + items_with_icons.each do |item| + icon = item_to_icon.call(item) # Calculate the base coordinates - base_x = icon[:col] * size - base_y = icon[:row] * size + base_x = item[:col] * size + base_y = item[:row] * size # Center the icon if it's not a perfect rectangle - x = base_x + ((size - img.width) / 2).floor - y = base_y + ((size - img.height) / 2).floor + x = base_x + ((size - icon.width) / 2).floor + y = base_y + ((size - icon.height) / 2).floor - spritesheet.compose!(img, x, y) + spritesheet.compose!(icon, x, y) end FileUtils.mkdir_p(File.dirname(output_path)) spritesheet.save(output_path) end - def save_manifest(icons, icons_per_row, path) + def save_manifest(items, icons_per_row, path) logger.info("Saving spritesheet details to #{path}") FileUtils.mkdir_p(File.dirname(path)) # Only save the details that the scss file needs - manifest_icons = icons.map do |icon| + manifest_items = items.map do |item| { - :type => icon[:type], - :row => icon[:row], - :col => icon[:col], - :dark_icon_fix => icon[:dark_icon_fix] + :type => item[:type], + :row => item[:row], + :col => item[:col], + :dark_icon_fix => item[:dark_icon_fix] } end - manifest = {:icons_per_row => icons_per_row, :icons => manifest_icons} + manifest = {:icons_per_row => icons_per_row, :items => manifest_items} File.open(path, 'w') do |f| f.write(JSON.generate(manifest)) end end - def log_details(icons, icons_per_row) - logger.debug("Amount of icons: #{icons.length}") + def log_details(items_with_icons, icons_per_row) + logger.debug("Amount of icons: #{items_with_icons.length}") logger.debug("Icons per row: #{icons_per_row}") - max_type_length = icons.map { |icon| icon[:type].length }.max + max_type_length = items_with_icons.map {|item| item[:type].length}.max border = "+#{'-' * (max_type_length + 2)}+#{'-' * 5}+#{'-' * 8}+#{'-' * 15}+" + logger.debug(border) logger.debug("| #{'Type'.ljust(max_type_length)} | Row | Column | Dark icon fix |") logger.debug(border) - icons.each do |icon| - logger.debug("| #{icon[:type].ljust(max_type_length)} | #{icon[:row].to_s.ljust(3)} | #{icon[:col].to_s.ljust(6)} | #{(icon[:dark_icon_fix] ? 'Yes' : 'No').ljust(13)} |") + items_with_icons.each do |item| + logger.debug("| #{item[:type].ljust(max_type_length)} | #{item[:row].to_s.ljust(3)} | #{item[:col].to_s.ljust(6)} | #{(item[:dark_icon_fix] ? 'Yes' : 'No').ljust(13)} |") end logger.debug(border) @@ -192,7 +192,7 @@ class SpritesCLI < Thor def logger @logger ||= Logger.new($stdout).tap do |logger| logger.level = options[:verbose] ? Logger::DEBUG : Logger::INFO - logger.formatter = proc { |severity, datetime, progname, msg| "#{msg}\n" } + logger.formatter = proc {|severity, datetime, progname, msg| "#{msg}\n"} end end end