{"action":"created","issue":{"url":"https://api.github.com/repos/angular/material/issues/933","labels_url":"https://api.github.com/repos/angular/material/issues/933/labels{/name}","comments_url":"https://api.github.com/repos/angular/material/issues/933/comments","events_url":"https://api.github.com/repos/angular/material/issues/933/events","html_url":"https://github.com/angular/material/issues/933","id":51832086,"number":933,"title":"mdGridList:  Implement new md-gridlist component","user":{"login":"ThomasBurleson","id":210413,"avatar_url":"https://avatars.githubusercontent.com/u/210413?v=3","gravatar_id":"","url":"https://api.github.com/users/ThomasBurleson","html_url":"https://github.com/ThomasBurleson","followers_url":"https://api.github.com/users/ThomasBurleson/followers","following_url":"https://api.github.com/users/ThomasBurleson/following{/other_user}","gists_url":"https://api.github.com/users/ThomasBurleson/gists{/gist_id}","starred_url":"https://api.github.com/users/ThomasBurleson/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ThomasBurleson/subscriptions","organizations_url":"https://api.github.com/users/ThomasBurleson/orgs","repos_url":"https://api.github.com/users/ThomasBurleson/repos","events_url":"https://api.github.com/users/ThomasBurleson/events{/privacy}","received_events_url":"https://api.github.com/users/ThomasBurleson/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/angular/material/labels/component","name":"component","color":"e11d21"}],"state":"open","locked":false,"assignee":{"login":"shyndman","id":42326,"avatar_url":"https://avatars.githubusercontent.com/u/42326?v=3","gravatar_id":"","url":"https://api.github.com/users/shyndman","html_url":"https://github.com/shyndman","followers_url":"https://api.github.com/users/shyndman/followers","following_url":"https://api.github.com/users/shyndman/following{/other_user}","gists_url":"https://api.github.com/users/shyndman/gists{/gist_id}","starred_url":"https://api.github.com/users/shyndman/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/shyndman/subscriptions","organizations_url":"https://api.github.com/users/shyndman/orgs","repos_url":"https://api.github.com/users/shyndman/repos","events_url":"https://api.github.com/users/shyndman/events{/privacy}","received_events_url":"https://api.github.com/users/shyndman/received_events","type":"User","site_admin":false},"milestone":{"url":"https://api.github.com/repos/angular/material/milestones/9","labels_url":"https://api.github.com/repos/angular/material/milestones/9/labels","id":863791,"number":9,"title":"0.8.0","description":"## Goals\r\n\r\n### Specification Efforts\r\n\r\nThe following tasks need design notes to present the problem and identify solution(s):\r\n\r\n- research virtual repeat\r\n- design architectures:\r\n  - text field autoComplete and search features\r\n  - toggle and multi-selection logic for buttons, icon buttons, etc\r\n\r\n### Polymer Parity\r\n\r\nThe following components will provide parity between the implmentations of Polymer and Angular reference implementations of Material Design\r\n\r\n- select\r\n- popup\r\n- svg icons\r\n- menu\r\n- icon buttons\r\n- textfields\r\n  *  `<md-text-error>`,\r\n  *  `<md-text-multiline>`,\r\n  *  `<md-text-autocomplete>`\r\n  *  `<md-text-search>`\r\n- grid list\r\n- list controls\r\n- button (radios, checks, choices)\r\n  *  `<md-checkgroup>` - multiple selectoin child toggle buttons and icon buttons\r\n  *  `<md-radiogroup>` - single selection of a child button\r\n- focus states\r\n","creator":{"login":"ThomasBurleson","id":210413,"avatar_url":"https://avatars.githubusercontent.com/u/210413?v=3","gravatar_id":"","url":"https://api.github.com/users/ThomasBurleson","html_url":"https://github.com/ThomasBurleson","followers_url":"https://api.github.com/users/ThomasBurleson/followers","following_url":"https://api.github.com/users/ThomasBurleson/following{/other_user}","gists_url":"https://api.github.com/users/ThomasBurleson/gists{/gist_id}","starred_url":"https://api.github.com/users/ThomasBurleson/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ThomasBurleson/subscriptions","organizations_url":"https://api.github.com/users/ThomasBurleson/orgs","repos_url":"https://api.github.com/users/ThomasBurleson/repos","events_url":"https://api.github.com/users/ThomasBurleson/events{/privacy}","received_events_url":"https://api.github.com/users/ThomasBurleson/received_events","type":"User","site_admin":false},"open_issues":48,"closed_issues":10,"state":"open","created_at":"2014-11-12T18:24:47Z","updated_at":"2014-12-23T21:55:30Z","due_on":"2015-01-20T06:00:00Z","closed_at":null},"comments":9,"created_at":"2014-12-12T17:35:47Z","updated_at":"2015-01-04T18:20:01Z","closed_at":null,"body":"#### Overview \r\n\r\nA grid list is best suited to presenting a homogenous data type, typically images, and is optimized for visual comprehension and differentiating between like data types.\r\n\r\n![](https://material-design.storage.googleapis.com/publish/v_2/material_ext_publish/0Bx4BSt6jniD7YTU2ekJPMU80MVU/components_grids_usage1.png)\r\n\r\nSee the Material Design Specification for Details:  [Gridlist Specs](https://www.google.com/design/spec/components/grids.html#grids-usage)\r\n\r\nThe developer will need to implement an Angular Material version that conforms to the functionality and UX defined in the Design specification [above]. \r\n\r\n> Developers should use existing Angular Material components and coding patterns as guides for their own implementation. Shell component assets are available for quick starts [see Below].\r\n\r\n#### Important Considerations\r\n\r\n*  Consider a `md-gridlist-item` to support needs of tile header and footers, plan to support the **primary** and **secondary** actions specified in the Design docs.\r\n  *  Use css to define the dimensions of each md-gridlist-item.\r\n*  Consider need for `md-image` for image tiles\r\n*  Consider image background loading, promise-based load indicator, image-loaded caching, and transforms for scaling; may be part of functionality associated within an `md-image` component.\r\n\r\n```html\r\n<md-gridlist>\r\n   <md-gridlist-item>\r\n     <!-- \r\n            This is a tile that supports ideas of headers and footers;\r\n            where images have precedence over text.\r\n      -->\r\n     <md-image />\r\n  </md-gridlist-item>\r\n</md-gridlist>\r\n```\r\n\r\n*  Static and dynamic (using ng-repeat) usages should be considered.\r\n*  Questions of ripple inks and activity indicators should be considered.\r\n\r\n> The component implementation may be dependent upon the `md-icon` rewrite and availability.\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/angular/material/issues/comments/68642722","html_url":"https://github.com/angular/material/issues/933#issuecomment-68642722","issue_url":"https://api.github.com/repos/angular/material/issues/933","id":68642722,"user":{"login":"ajoslin","id":1265995,"avatar_url":"https://avatars.githubusercontent.com/u/1265995?v=3","gravatar_id":"","url":"https://api.github.com/users/ajoslin","html_url":"https://github.com/ajoslin","followers_url":"https://api.github.com/users/ajoslin/followers","following_url":"https://api.github.com/users/ajoslin/following{/other_user}","gists_url":"https://api.github.com/users/ajoslin/gists{/gist_id}","starred_url":"https://api.github.com/users/ajoslin/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ajoslin/subscriptions","organizations_url":"https://api.github.com/users/ajoslin/orgs","repos_url":"https://api.github.com/users/ajoslin/repos","events_url":"https://api.github.com/users/ajoslin/events{/privacy}","received_events_url":"https://api.github.com/users/ajoslin/received_events","type":"User","site_admin":false},"created_at":"2015-01-04T18:20:01Z","updated_at":"2015-01-04T18:20:01Z","body":"The bad thing about using js for layout is that it's almost impossible to know when you need to recalculate the layout, in every situation. The container could resize without the window resizing, or get a margin added to it, or anything. "}}