Correct Screenshot for Convert Code

<https://lh3.googleusercontent.com/-94xyunmwDto/VSrpHpasbKI/AAAAAAAAVz0/3HFkjMLygiU/s1600/Road-to-Polymer-Convert-Code800.png>


On Sunday, April 12, 2015 at 2:48:21 PM UTC-7, Chuck Horton wrote:
>
> I added a convert code program. You can either paste 0.5 code or choose a 
> file and it will try to convert your custom element. It is still a work in 
> progress. You can access it at 
> http://chuckh.github.io/road-to-polymer/convert-code.html or 
> http://chuckh.github.io/road-to-polymer/ and select Polymer Convert Code. 
> Comments, suggestions, and corrections are welcome.
>
>
> <https://lh3.googleusercontent.com/-nBy-kwjLmsU/VSrmel3V2hI/AAAAAAAAVzA/ZiOj0aLGP6w/s1600/Road-to-Polymer-Compare-Code-800.png>
>
>
> I have use the below conversion steps either by changing the code, or 
> adding comments about changes needed.
> HTML Conversion Process
>
> *polymer-element*
>
>    1. polymer-element to dom-module
>    2. polymer-element name to <dom-module id=
>    3. polymer-element attribute/property camelCase to dash-case
>    4. polymer-element attributes="xxx xxxx" add to javascript properties
>    5. polymer-element layout <polymer-element name="x-foo" layout 
>    horizontal wrap>
>       - add <link rel="import" href="../layout/layout.html"> to top with 
>       other imports
>       - add hostAttributes ''`hostAttributes: {class: "layout horizontal 
>       wrap"}``` to Polymer({
>       - see 
>       
> https://www.polymer-project.org/0.8/docs/migration.html#layout-attributes
>    6. polymer-element move up <link rel="import" type="css" 
>    href="my-awesome-button.css"> from `<template> to <dom-module>
>    7. polymer-element move up <style></style> from <template> to 
>    <dom-module>
>       - see 
>       https://www.polymer-project.org/0.8/docs/devguide/local-dom.html
>    
> *template* see 
> https://www.polymer-project.org/0.8/docs/devguide/experimental.html
>
>    1. template repeat to is="x-repeat" and repeat= to items= - 
>    *(temporary)*
>    2. template is="auto-binding" to is="x-binding" - *(temporary)*
>    3. template if= to is="x-if" - *(temporary)* or use display block or 
>    none
>
> *other*
>
>    1. textContent binding from <div>First: {{first}}</div> TO 
>    <span>{{first}}</span><br>
>    2. elements on-click="{{handleClick}}" to on-click="handleClick"
>
> Javascript Conversion Process
>    
>    1. polymer-element name to Polymer({ is:
>    2. polymer-element attributes="" to javascript properties: { }
>
> CSS Conversion Process
>
> see https://www.polymer-project.org/0.8/docs/migration.html#styling
>
>    1. polymer-element move up <style></style> from <template> to 
>    <dom-module> (as noted above)
>       - see 
>       https://www.polymer-project.org/0.8/docs/migration.html#styling
>    2. if using layout add hostAttributes ''`hostAttributes: {class: 
>    "layout horizontal wrap"}``` to Polymer({
>       - see 
>       
> https://www.polymer-project.org/0.8/docs/migration.html#layout-attributes
>    
>
>
> On Friday, April 10, 2015 at 12:30:17 PM UTC-7, Chuck Horton wrote:
>>
>> Thanks Scott for pointing that out. I have fixed it. It now should work 
>> with FF and Safari now.
>>
>> On Thursday, April 9, 2015 at 10:24:32 PM UTC-7, Scott Miles wrote:
>>>
>>> Wrt not working in FF, it looks like 'webcomponents.min.js'  (
>>> http://chuckh.github.io/road-to-polymer/bower_components/webcomponentsjs/webcomponents.min.js)
>>>  
>>> is empty.
>>>
>>> On Thu, Apr 9, 2015 at 7:15 AM, Chuck Horton <[email protected]> wrote:
>>>
>>>> Possibly in the future. Not sure why it is not working on FF or Safari. 
>>>> I am not getting any errors when loading in FF or Safari just not working. 
>>>> It does work in my development environment. Maybe has to do with grunt 
>>>> build process. So for now it only works with Chrome. Sorry.
>>>>
>>>>
>>>> On Wednesday, April 8, 2015 at 7:09:34 PM UTC-7, [email protected] 
>>>> wrote:
>>>>>
>>>>> It doesn't seem to work on FF. Do you have any plans to support that?
>>>>>
>>>>> On Thursday, April 2, 2015 at 7:23:09 AM UTC+13, Chuck Horton wrote:
>>>>>>
>>>>>> Carl, thanks for letting me know. I have fixed this. I also added 
>>>>>> more functionality to 0.5 to 0.8 conversion in compare-code. Look for 
>>>>>> lines 
>>>>>> with CONVERTED to see what it has done. 
>>>>>>
>>>>>> Simple example of auto converted code:
>>>>>> http://chuckh.github.io/road-to-polymer/compare-code.html?
>>>>>> el=core-item&convert=true
>>>>>>
>>>>>> More complex example:
>>>>>> http://chuckh.github.io/road-to-polymer/compare-code.html?
>>>>>> el=core-animation&convert=true 
>>>>>> <http://www.google.com/url?q=http%3A%2F%2Fchuckh.github.io%2Froad-to-polymer%2Fcompare-code.html%3Fel%3Dcore-animation%26convert%3Dtrue&sa=D&sntz=1&usg=AFQjCNF-PPNLq4Bpw6p_T7CbY5LbUvnyEQ>
>>>>>>
>>>>>> Link to Road to Polymer:
>>>>>> http://chuckh.github.io/road-to-polymer/
>>>>>>
>>>>>> On Wednesday, April 1, 2015 at 8:31:56 AM UTC-7, Carl Youngblood 
>>>>>> wrote:
>>>>>>>
>>>>>>> Thanks for your work on this Chuck. Just a small typo. There is a 
>>>>>>> menu option in the sidebar called "Polymer 0.9 sneak peek" but it links 
>>>>>>> to 
>>>>>>> an article titled "Polymer 0.8 sneak peek".
>>>>>>>
>>>>>>> On Tuesday, March 31, 2015 at 2:10:02 PM UTC-6, Chuck Horton wrote:
>>>>>>>>
>>>>>>>> I have created a Road to Polymer app at 
>>>>>>>> http://chuckh.github.io/road-to-polymer/. It has a sidebar menu 
>>>>>>>> for Repositories Status Report, Polymer Compare Code, related 
>>>>>>>> websites, 
>>>>>>>> articles and notes regarding Polymer 0.8.
>>>>>>>>
>>>>>>>> I also created a very basic converter for Polymer elements that 
>>>>>>>> does not have 0.8 code yet. To see it go to: 
>>>>>>>> http://chuckh.github.io/road-to-polymer/compare-code.
>>>>>>>> html?el=core-menu-button, then click on the Convert button. Next 
>>>>>>>> look for lines with CONVERTED comment to see what changed.
>>>>>>>>
>>>>>>>>
>>>>>>>> The convert button will show for any Polymer repositories that 
>>>>>>>> don't have 0.8 code yet. Still lots of functionality to add. What do 
>>>>>>>> you 
>>>>>>>> think?
>>>>>>>>
>>>>>>>> On Saturday, March 21, 2015 at 5:35:00 PM UTC-7, Chuck Horton wrote:
>>>>>>>>>
>>>>>>>>> I created a web page to compare Polymer elements such as 
>>>>>>>>> core-toolbar 0.5.5 code vs 0.8.0 code side by side. I am comparing 
>>>>>>>>> the 
>>>>>>>>> master branch's code vs 08-preview branch's code. You can input other 
>>>>>>>>> Polymer elements such paper-shadow then press the enter key to load 
>>>>>>>>> the 
>>>>>>>>> code.  I did this to help see the difference between 0.5 and 0.8 
>>>>>>>>> code. Let 
>>>>>>>>> me know what you think.
>>>>>>>>>
>>>>>>>>> http://chuckh.github.io/road-to-polymer/compare-code.html
>>>>>>>>>
>>>>>>>>> On Saturday, March 21, 2015 at 11:52:11 AM UTC-7, Chuck Horton 
>>>>>>>>> wrote:
>>>>>>>>>>
>>>>>>>>>> I added the ability to search the Repositories by name. I fixed 
>>>>>>>>>> the report to work with other browsers besides Chrome. You can see 
>>>>>>>>>> the 
>>>>>>>>>> changes at: http://chuckh.github.io/road-to-polymer/repos.html  
>>>>>>>>>> <http://chuckh.github.io/road-to-polymer/repos.html>
>>>>>>>>>>
>>>>>>>>>> On Thursday, March 19, 2015 at 8:45:59 AM UTC-7, Chuck Horton 
>>>>>>>>>> wrote:
>>>>>>>>>>>
>>>>>>>>>>> The other links to report are broken. The correct link is:
>>>>>>>>>>>
>>>>>>>>>>> *http://chuckh.github.io/road-to-polymer/repos.html* 
>>>>>>>>>>> <http://chuckh.github.io/road-to-polymer/repos.html>
>>>>>>>>>>>
>>>>>>>>>>>
>>>>>>>>>>> On Thursday, March 19, 2015 at 8:42:13 AM UTC-7, Chuck Horton 
>>>>>>>>>>> wrote:
>>>>>>>>>>>>
>>>>>>>>>>>> Carl, This is a live report. *Go 
>>>>>>>>>>>> to http://chuckh.github.io/road-to-polymer/repos.html 
>>>>>>>>>>>> <http://chuckh.github.io/road-to-polymer/repos.html>*. By 
>>>>>>>>>>>> going to this web page the formatting will be good and you be 
>>>>>>>>>>>> getting live 
>>>>>>>>>>>> data pulled from Github's API for the Polymer repositories. So no 
>>>>>>>>>>>> need for 
>>>>>>>>>>>> a spreadsheet to manually update. 
>>>>>>>>>>>>
>>>>>>>>>>>> On Thursday, March 19, 2015 at 8:34:26 AM UTC-7, Carl 
>>>>>>>>>>>> Youngblood wrote:
>>>>>>>>>>>>>
>>>>>>>>>>>>> Chuck, please consider making this a google spreadsheet so we 
>>>>>>>>>>>>> can read it more easily and help update it.
>>>>>>>>>>>>>
>>>>>>>>>>>>> On Wednesday, March 18, 2015 at 3:20:26 PM UTC-6, Chuck Horton 
>>>>>>>>>>>>> wrote:
>>>>>>>>>>>>>>
>>>>>>>>>>>>>> To help me prepare to migrate to Polymer 0.8 I created a 
>>>>>>>>>>>>>> report to show what Polymer github repositories have a branch of 
>>>>>>>>>>>>>> 0-8-preview. I exclude any repos that have NOT FOR PRODUCTION 
>>>>>>>>>>>>>> USE 
>>>>>>>>>>>>>> or DEPRECATED in the description.
>>>>>>>>>>>>>> You can view this report live at 
>>>>>>>>>>>>>> http://chuckh.github.io/road-to-polymer/repos.htm 
>>>>>>>>>>>>>> <http://www.google.com/url?q=http%3A%2F%2Fchuckh.github.io%2Froad-to-polymer%2Frepos.htm&sa=D&sntz=1&usg=AFQjCNHCk1O7pe8coZH6wTFy4Ack7TZjxw>
>>>>>>>>>>>>>> l. 
>>>>>>>>>>>>>>
>>>>>>>>>>>>>> *Findings as of 3/28/15:*
>>>>>>>>>>>>>> Total Repositories: *141*
>>>>>>>>>>>>>> Repositories with 0.8-preview branch: *37 *
>>>>>>>>>>>>>> Core and Paper Repositories with 0.8-preview branch: *31 *
>>>>>>>>>>>>>> Core and Paper Repositories no  0.8-preview branch: *51 *
>>>>>>>>>>>>>>
>>>>>>>>>>>>>> This report was built using Polymer 0.5.5 and Github API. It 
>>>>>>>>>>>>>> is hosted on Github Pages.
>>>>>>>>>>>>>>
>>>>>>>>>>>>>> *Cavets*:
>>>>>>>>>>>>>>
>>>>>>>>>>>>>>    1. If your window is less the 1200px wide the filter 
>>>>>>>>>>>>>>    radio buttons will be hidden
>>>>>>>>>>>>>>    2. When you filter the report you may need to scroll up 
>>>>>>>>>>>>>>    to see the data
>>>>>>>>>>>>>>
>>>>>>>>>>>>>> Let me know what you think. 
>>>>>>>>>>>>>>
>>>>>>>>>>>>>> *Polymer core and paper repositories with 0.8-preview branch:*
>>>>>>>>>>>>>>
>>>>>>>>>>>>>>  Follow Polymer on Google+: 
>>>> plus.google.com/107187849809354688692
>>>> --- 
>>>> You received this message because you are subscribed to the Google 
>>>> Groups "Polymer" group.
>>>> To unsubscribe from this group and stop receiving emails from it, send 
>>>> an email to [email protected].
>>>> To view this discussion on the web visit 
>>>> https://groups.google.com/d/msgid/polymer-dev/a201d884-9abe-469a-ae2a-b4ea00e29ab2%40googlegroups.com
>>>>  
>>>> <https://groups.google.com/d/msgid/polymer-dev/a201d884-9abe-469a-ae2a-b4ea00e29ab2%40googlegroups.com?utm_medium=email&utm_source=footer>
>>>> .
>>>>
>>>> For more options, visit https://groups.google.com/d/optout.
>>>>
>>>
>>>

Follow Polymer on Google+: plus.google.com/107187849809354688692
--- 
You received this message because you are subscribed to the Google Groups 
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/6f0b8930-7982-47e7-be65-c7e75e4b8c12%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to