{"action":"created","issue":{"url":"https://api.github.com/repos/sass-eyeglass/eyeglass-spriting/issues/1","labels_url":"https://api.github.com/repos/sass-eyeglass/eyeglass-spriting/issues/1/labels{/name}","comments_url":"https://api.github.com/repos/sass-eyeglass/eyeglass-spriting/issues/1/comments","events_url":"https://api.github.com/repos/sass-eyeglass/eyeglass-spriting/issues/1/events","html_url":"https://github.com/sass-eyeglass/eyeglass-spriting/issues/1","id":89153882,"number":1,"title":"API Design","user":{"login":"chriseppstein","id":1839,"avatar_url":"https://avatars.githubusercontent.com/u/1839?v=3","gravatar_id":"","url":"https://api.github.com/users/chriseppstein","html_url":"https://github.com/chriseppstein","followers_url":"https://api.github.com/users/chriseppstein/followers","following_url":"https://api.github.com/users/chriseppstein/following{/other_user}","gists_url":"https://api.github.com/users/chriseppstein/gists{/gist_id}","starred_url":"https://api.github.com/users/chriseppstein/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/chriseppstein/subscriptions","organizations_url":"https://api.github.com/users/chriseppstein/orgs","repos_url":"https://api.github.com/users/chriseppstein/repos","events_url":"https://api.github.com/users/chriseppstein/events{/privacy}","received_events_url":"https://api.github.com/users/chriseppstein/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":{"login":"joannajw","id":5845959,"avatar_url":"https://avatars.githubusercontent.com/u/5845959?v=3","gravatar_id":"","url":"https://api.github.com/users/joannajw","html_url":"https://github.com/joannajw","followers_url":"https://api.github.com/users/joannajw/followers","following_url":"https://api.github.com/users/joannajw/following{/other_user}","gists_url":"https://api.github.com/users/joannajw/gists{/gist_id}","starred_url":"https://api.github.com/users/joannajw/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/joannajw/subscriptions","organizations_url":"https://api.github.com/users/joannajw/orgs","repos_url":"https://api.github.com/users/joannajw/repos","events_url":"https://api.github.com/users/joannajw/events{/privacy}","received_events_url":"https://api.github.com/users/joannajw/received_events","type":"User","site_admin":false},"milestone":null,"comments":4,"created_at":"2015-06-17T23:38:32Z","updated_at":"2015-06-18T18:07:01Z","closed_at":null,"body":"```scss\r\n@import \"spriting\";\r\n// Built on top of the asset api\r\n@import \"module-a/assets\";\r\n// app assets\r\n@import \"assets\";\r\n\r\n// No magic sprite import.\r\n\r\n// support for jpg, gif, and png source files.\r\n// Support for images from different directories\r\n// control the ouput filename (no need for the hash at the end of the filename)\r\n// sprite names are their filenames.\r\n$icon-sprite-map: sprite-map(\"module-a/sprite-dir/1.jpg\",\r\n                             \"module-a/sprite-dir/two.png\",\r\n                             \"my-sprite-dir/**/*\",\r\n                             $name: \"icons\",\r\n                             $layout: sprite-layout(horizontal, (spacing: 5px, alignment: bottom)),\r\n                             $exceptions: (\r\n                               \"module-a/sprite-dir/1.jpg\": (\r\n                                 spacing: 40px,\r\n                                 identifier: \"one\"\r\n                               )\r\n                             ));\r\n\r\n@debug $icon-sprite-map;\r\n// ( sprite-map: true,\r\n//   name: \"icons\",\r\n//   sources: (\r\n//     \"module-a/sprite-dir/1.jpg\",\r\n//     \"module-a/sprite-dir/two.png\",\r\n//     \"my-sprite-dir/**/*\"),\r\n//   assets: (\r\n//     \"module-a/sprite-dir/1.jpg\":\r\n//       (path: \"/Users/chris/Projects/mytestproj/node_modules/module-a/images/sprite-dir/1.jpg\",\r\n//        identifier: one,\r\n//        position: 0px -10px,\r\n//        width: 40px,\r\n//        height: 40px),\r\n//     \"module-a/sprite-dir/two.png\":\r\n//       (path: \"/Users/chris/Projects/mytestproj/node_modules/module-a/images/sprite-dir/two.png\",\r\n//        identifier: two,\r\n//        position: 80px -10px,\r\n//        width: 40px,\r\n//        height: 40px),\r\n//     \"my-sprite-dir/foo.png\":\r\n//       (path: \"/Users/chris/Projects/mytestproj/my-sprite-dir/foo.png\",\r\n//        identifier: foo,\r\n//        position: 125px 0px,\r\n//        width: 40px,\r\n//        height: 50px),\r\n//     \"my-sprite-dir/bar.gif\":\r\n//       (path: \"/Users/chris/Projects/mytestproj/my-sprite-dir/bar.gif\",\r\n//        identifier: bar,\r\n//        position: 170px -10px,\r\n//        width: 40px,\r\n//        height: 40px),\r\n//     \"my-sprite-dir/baz.jpg\":\r\n//       (path: \"/Users/chris/Projects/mytestproj/my-sprite-dir/baz.jpg\",\r\n//        identifier: baz,\r\n//        position: 215px -10px,\r\n//        width: 40px,\r\n//        height: 40px)\r\n//   ),\r\n//   width: 260px,\r\n//   height: 50px,\r\n//   layout: (\r\n//     strategy: horizontal,\r\n//     spacing: 5px,\r\n//     alignment: bottom,\r\n//     exceptions: (\r\n//       \"module-a/sprite-dir/1.jpg\": (\r\n//         spacing: 40px\r\n//       )\r\n//     )\r\n//   )\r\n\r\n\r\n@debug sprite-list($icon-sprite-map);\r\n// => \"module-a/sprite-dir/1.jpg\", \"module-a/sprite-dir/two.png\",\r\n//    \"my-sprite-dir/foo.png\", \"my-sprite-dir/bar.gif\", \"my-sprite-dir/baz.jpg\"\r\n\r\n// Calling the sprite-url function causes the sprite image to be constructed and written to disk.\r\n$url: sprite-url($icon-sprite-map) // => url(\"/assets/icons.png\")\r\n$pos: sprite-position($icon-sprite-map, \"module-a/sprite-dir/1.jpg\") // => 10px -87px\r\n$posx: sprite-position-x($icon-sprite-map, \"module-a/sprite-dir/1.jpg\") // => 10px\r\n$posy: sprite-position-y($icon-sprite-map, \"module-a/sprite-dir/1.jpg\") // => -87px\r\n$width: sprite-width($icon-sprite-map, \"module-a/sprite-dir/1.jpg\") // => 35px\r\n$height: sprite-height($icon-sprite-map, \"module-a/sprite-dir/1.jpg\") // => 28px\r\n$total-width: sprite-map-width($icon-sprite-map) // => 260px\r\n$total-height: sprite-map-height($icon-sprite-map) // => 50px\r\n// raises an error if called for an image that has no specified identifer and\r\n// the base filename is not a legal css ident.\r\n$id: sprite-identifier($icon-sprite-map, \"module-a/sprite-dir/1.jpg\") // => one\r\n\r\n\r\n%icon-bg {\r\n  @include sprite-background($icon-sprite-map); // optional $repeat argument defaults to no-repeat.\r\n  // background: url(\"/assets/icons.png\") no-repeat;\r\n}\r\n\r\n\r\n.icon-one {\r\n  @extend %icon-bg;\r\n  @include sprite-position($icon-sprite-map, \"module-a/sprite-dir/1.jpg\");\r\n  // background-position: 10px -87px;\r\n}\r\n\r\n@each $icon in sprite-list($icon-sprite-map) {\r\n  .icon-#{sprite-identifier($icon)} {\r\n    @extend %icon-bg;\r\n    @include sprite-position($icon-sprite-map, $icon);\r\n  }\r\n}\r\n```"},"comment":{"url":"https://api.github.com/repos/sass-eyeglass/eyeglass-spriting/issues/comments/113242213","html_url":"https://github.com/sass-eyeglass/eyeglass-spriting/issues/1#issuecomment-113242213","issue_url":"https://api.github.com/repos/sass-eyeglass/eyeglass-spriting/issues/1","id":113242213,"user":{"login":"eoneill","id":552715,"avatar_url":"https://avatars.githubusercontent.com/u/552715?v=3","gravatar_id":"","url":"https://api.github.com/users/eoneill","html_url":"https://github.com/eoneill","followers_url":"https://api.github.com/users/eoneill/followers","following_url":"https://api.github.com/users/eoneill/following{/other_user}","gists_url":"https://api.github.com/users/eoneill/gists{/gist_id}","starred_url":"https://api.github.com/users/eoneill/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/eoneill/subscriptions","organizations_url":"https://api.github.com/users/eoneill/orgs","repos_url":"https://api.github.com/users/eoneill/repos","events_url":"https://api.github.com/users/eoneill/events{/privacy}","received_events_url":"https://api.github.com/users/eoneill/received_events","type":"User","site_admin":false},"created_at":"2015-06-18T18:07:01Z","updated_at":"2015-06-18T18:07:01Z","body":"What does `sprite-layout` return? Does it do some magic that's can't be represented by the map itself?\r\n\r\ne.g. instead of...\r\n\r\n```scss\r\n$layout: sprite-layout(horizontal, (spacing: 5px, alignment: bottom)),\r\n```\r\nsimplify to...\r\n```scss\r\n$layout: (horizontal, (spacing: 5px, alignment: bottom)),\r\n```\r\n\r\nAlso, for the `spacing`, can this support multiple dimensions?\r\n\r\n```scss\r\nspacing: 5px 10px, // 5px top/bottom, 10px right/left\r\n```\r\nYou could use the same shorthand rules as margin/padding."}}