{"id":2036,"date":"2012-12-08T09:22:00","date_gmt":"2012-12-08T18:22:00","guid":{"rendered":"https:\/\/www.kellyrob99.com\/blog\/?p=2036"},"modified":"2012-12-08T09:22:00","modified_gmt":"2012-12-08T18:22:00","slug":"kuler-iterm2-themes-with-groovy-scripting","status":"publish","type":"post","link":"https:\/\/www.kellyrob99.com\/blog\/2012\/12\/08\/kuler-iterm2-themes-with-groovy-scripting\/","title":{"rendered":"Kuler iTerm2 Themes with Groovy Scripting"},"content":{"rendered":"

Having recently purchased a new MBP laptop, I was going through the usual new computer activities and installing one of my favorite apps, the iTerm2<\/a> terminal program. This program really shines for managing multiple terminal windows, and recently they added the ability to easily import and export color themes for sharing<\/a>. I, of course, got immediately distracted with a shiny new feature and ended up spending an afternoon writing some code to try it out. Along the way I grabbed some color themes from the Adobe Kuler site<\/a>, built a quick and dirty SwingBuilder script to visualize the themes and wrote a script for emitting Apple plist files<\/a> suitable for import into iTerm2. <\/p>\n

Adobe Kuler<\/h2>\n

This is a nice resource for finding and building color themes primarily intended for web consumption. Each theme boils down to five colors represented as hexadecimal which can be applied to a layout design in a fairly predictable pattern. In addition to using the website directly, RSS feeds<\/a> are made available for accessing shared themes. This makes grabbing a handful of themes for experimentation very easy to accomplish with the Groovy XmlSlurper.<\/p>\n

Here’s an excerpt of the RSS feed we’re parsing, representing a five color theme named ‘Feeling Etsy’.<\/p>\n

\r\n<item>\r\n      <title>Theme Title: Feeling Etsy<\/title>\r\n      <link>http:\/\/kuler.adobe.com\/index.cfm#themeID\/1892986<\/link>\r\n      <guid>http:\/\/kuler.adobe.com\/index.cfm#themeID\/1892986<\/guid>\r\n      <enclosure xmlns="http:\/\/www.solitude.dk\/syndication\/enclosures\/">\r\n        <title>Feeling Etsy<\/title>\r\n        <link length="1" type="image\/png">\r\n          <url>http:\/\/kuler-api.adobe.com\/kuler\/themeImages\/theme_1892986.png<\/url>\r\n        <\/link>\r\n      <\/enclosure>\r\n      <description>\r\n\t\t\t\t &lt;img src="http:\/\/kuler-api.adobe.com\/kuler\/themeImages\/theme_1892986.png" \/&gt;&lt;br \/&gt;\r\n\t\t\t\t \r\n\t\t\t\t Artist: kenzia.studio&lt;br \/&gt;\r\n\t\t\t\t ThemeID: 1892986&lt;br \/&gt;\r\n\t\t\t\t Posted: 05\/02\/2012&lt;br \/&gt;\r\n\t\t\t\t \r\n\t\t\t\t\t Tags: \r\n\t\t\t\t\t community...., join, lifestyle, share, vintage\r\n\t\t\t\t &lt;br \/&gt;\t\r\n\t\t\t\t \r\n\t\t\t\t\tHex:\r\n\t\t\t\t\tDCEBDD, A0D5D6, 789AA1, 304345, AD9A27<\/description>\r\n\r\n...\r\n<\/pre>\n
And here’s parsing code<\/a> that queries for 100 of the ‘top rated’ and 100 of the ‘popular’ themes, serializing them out to a Groovy script file. There’s going to be some overlap in these two sets, so the end result is somewhat less than 200 themes.<\/p>\n
\r\n\/**\r\n * Reads RSS feeds from kuler and extracts the hexadecimal representation of each five element theme, writing those\r\n * values to a file.\r\n *\/\r\ndef feeds = [\r\n        new URL("http:\/\/kuler-api.adobe.com\/feeds\/rss\/get.cfm?itemsPerPage=100&listType=rating"),\r\n        new URL("http:\/\/kuler-api.adobe.com\/feeds\/rss\/get.cfm?itemsPerPage=100&listType=popular")\r\n]\r\ndef mappedThemes = [:]\r\ndef slurp = {rssXML, themes ->\r\n    def xml = new XmlSlurper().parseText(rssXML)\r\n    xml.channel.item.each { theme ->\r\n        println theme.title\r\n        def desc = theme.description.toString().split('\\n')\r\n        def hex = desc[-1]\r\n        hex = hex.replaceAll('\\t', '')\r\n        hex = hex.replaceAll(' ', '')\r\n        themes.put(theme.title.toString().replaceAll('Theme Title:', '').trim().replaceAll(' ', '_')\r\n                .replaceAll('\\'', '_').toLowerCase(), hex.split(','))\r\n    }\r\n}\r\n\r\nfeeds.each { URL url ->\r\n    slurp(url.text, mappedThemes)\r\n}\r\n\r\nprintln mappedThemes.keySet().size()\r\n\r\ndef themeMapFile = new File("kulerThemeMap-${new Date().format('yyMMddHHmmss')}.groovy")\r\nthemeMapFile << "themeMap = ${mappedThemes.inspect()}"\r\nthemeMapFile.absolutePath\r\n<\/pre>\n
The end result is a Groovy script file containing a single Map type variable named ‘themeMap’ in the global scope. This file can be interpreted by a GroovyShell to extract the Map of themes easily – not the best way to serialize the data but I actually wrote this parsing code a couple of years back and just wanted to quickly incorporate it into today’s efforts so I left it as is. <\/p>\n
Output in the file is just a Map of the theme name to the five corresponding hexadecimal color codes.<\/p>\n
\r\nthemeMap = ['pie_party__for_all_kulerist!!!':['690011', 'BF0426', 'CC2738', 'F2D99C', 'E5B96F'],\r\n 'pear_lemon_fizz':['04BFBF', 'CAFCD8', 'F7E967', 'A9CF54', '588F27'],\r\n 'feeling_etsy':['DCEBDD', 'A0D5D6', '789AA1', '304345', 'AD9A27'],\r\n 'phaedra':['FF6138', 'FFFF9D', 'BEEB9F', '79BD8F', '00A388'], \r\n...\r\n<\/pre>\n
Visualizing the Themes<\/h2>\n
In order to see which of these themes might look OK in iTerm I wrote a SwingBuilder script that reads in the script file output from the last step, like so:<\/p>\n
\r\nassert args.size() == 1, '''The name or path to a file containing a themeMap \r\nscript variable must be supplied on the command line'''\r\n\r\ndef themeMapFileName = args[0]\r\nBinding binding = new Binding()\r\nnew GroovyShell(binding).evaluate(new File(themeMapFileName))\r\nassert binding.hasVariable('themeMap'), "${args[0]} file must contain a Map variable named themeMap"\r\ndef themeMap = binding.themeMap as TreeMap\r\n<\/pre>\n
The Swing app just has a simple 2 column layout to display the name of the theme on the left and colored labels for each of the theme colors. Looks like this:<\/p>\nngg_shortcode_0_placeholder\n
Having worked on Swing apps in plain-Jane Java professionally before, I’m still always astounded at how much less code you can write with Groovy and SwingBuilder. Here’s the 30 lines it takes to do the GUI and here’s the full file on github<\/a>.<\/p>\n
\r\ndef swing = new groovy.swing.SwingBuilder()\r\ndef mainPanel = swing.panel() {\r\n    boxLayout(axis: javax.swing.BoxLayout.Y_AXIS)\r\n    label(text: "Showing ${themeMap.size()} themes")\r\n    scrollPane() {\r\n        panel() {\r\n            boxLayout(axis: javax.swing.BoxLayout.Y_AXIS)\r\n            themeMap.each { key, value ->\r\n                panel(border:  emptyBorder(3)) {\r\n                    gridLayout(columns: 2, rows: 1)\r\n                    label(text: key)\r\n                    value.each {\r\n                        def color = Color.decode("#" + it)\r\n                        int colorSize = 50\r\n                        label(opaque: true, toolTipText: it, background: color, foreground: color,\r\n                                preferredSize: [colorSize, colorSize] as Dimension,\r\n                                border: lineBorder(color:Color.WHITE, thickness:1))\r\n                    }\r\n                }\r\n            }\r\n        }\r\n    }\r\n}\r\ndef frame = swing.frame(title: 'Frame') {\r\n    scrollPane(constraints: SwingConstants.CENTER) {\r\n        widget(mainPanel)\r\n    }\r\n}\r\nframe.pack()\r\nframe.show()\r\n<\/pre>\n
Creating the iTerm plist Files<\/h2>\n
The iTerm color presets define some ‘Basic Colors’ and some ‘ANSI Colors’. The basic ones cover: Foreground, Background, Bold, Selection, Selected Text, Cursor and Cursor Text. Seeing as we’ve got seven of these to map to five colors, I’ve(arbitrarily) chosen to make the Cursor and Cursor Text values depend upon the Foreground and Background colors, plus a fixed increment value. Here’s a picture to help explain.<\/p>\nngg_shortcode_1_placeholder\n
And here is the configuration screen for this new profile in iTerm.<\/p>\nngg_shortcode_2_placeholder\n
Each of the ANSI colors maps a standard color onto our color scheme and provides ‘Normal’ and ‘Bright’ variations for each color. I’ve (again arbitrarily) decided to map each of these by randomly selecting a color from the theme and determining a ‘Bright’ version of it. This leads to some themes where colors won’t show up very well if there is a conflict with the ‘Basic’ colors but it’s sufficient for my use case. In the end we want to write out an xml file for each theme which looks something like this:<\/p>\n
\r\n<plist version="1.0">\r\n  <dict>\r\n    <key>Ansi 0 Color<\/key>\r\n    <dict>\r\n      <key>Blue Component<\/key>\r\n      <real>0.2705882353<\/real>\r\n      <key>Green Component<\/key>\r\n      <real>0.2627450980<\/real>\r\n      <key>Red Component<\/key>\r\n      <real>0.1882352941<\/real>\r\n    <\/dict>\r\n    <key>Ansi 8 Color<\/key>\r\n    <dict>\r\n...\r\n<\/pre>\n
This repeating structure is easy to create using Groovy’s built in xml functionality. Because we want to include the DOCTYPE and xml header, I’m using StreamingMarkupBuilder and it’s handy yieldUnescaped<\/em> function. Full source code is available on github<\/a>, but here’s the bit which generates the two ANSI color definitions shown in the xml above.<\/p>\n
\r\nfinal Closure buildColors = { builder, Color color ->\r\n    builder.dict {\r\n        key('Blue Component')\r\n        real(normalize(color.blue))\r\n        key('Green Component')\r\n        real(normalize(color.green))\r\n        key('Red Component')\r\n        real(normalize(color.red))\r\n    }\r\n}\r\n\r\nfinal Closure buildComponentColors = { builder, colors, i ->\r\n    final hex = colors[random.nextInt(colors.size())]\r\n\r\n    \/\/Normal\r\n    final Color color = extractColor(hex)\r\n    builder.key("Ansi $i Color")\r\n    buildColors(builder, color)\r\n\r\n    \/\/Bright\r\n    final Color brighterColor = color.brighter()\r\n    builder.key("Ansi ${i + 8} Color")\r\n    buildColors(builder, brighterColor)\r\n}\r\n<\/pre>\n
Each theme results in a PLIST xml file ready to import into iTerm. <\/p>\n
Conclusion<\/h1>\n
I continue to be impressed with how easy Groovy makes it to solve common programming problems. Within a very small space of time I was able to:<\/p>\n
    \n
  • parse multiple RSS feeds<\/li>\n
  • create a Swing application to visualize results<\/li>\n
  • transform the previously parsed results into an xml document usable in iTerm<\/li>\n
  • do it all in a couple of hundred lines of code<\/li>\n
  • publish the individual scripts on github<\/li>\n<\/ul>\n
    Hopefully this gives you some ideas on how to do some Groovy hacking of your own. I know it was a fun afternoon for me \ud83d\ude42 <\/p>\n","protected":false},"excerpt":{"rendered":"
    Having recently purchased a new MBP laptop, I was going through the usual new computer activities and installing one of my favorite apps, the iTerm2 terminal program. This program really shines for managing multiple terminal windows, and recently they added the ability to easily import and export color themes for sharing. I, of course, got […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"ngg_post_thumbnail":0,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"jetpack_post_was_ever_published":false},"categories":[6],"tags":[257,251,258,112,249,28,148,109,50,113,250],"class_list":["post-2036","post","type-post","status-publish","format-standard","hentry","category-dev","tag-groovy","tag-iterm","tag-java","tag-kellyrob99","tag-kuler","tag-open-source","tag-source-code","tag-streamingmarkupbuilder","tag-swingbuilder","tag-thekaptain","tag-xmlslurper"],"aioseo_notices":[],"aioseo_head":"\n\t\t\n\t\n\t\n\t\n\t\n\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t