Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update components to be on par with angular material v1 #249

Open
36 of 39 tasks
miguelcobain opened this issue Dec 16, 2015 · 52 comments
Open
36 of 39 tasks

Update components to be on par with angular material v1 #249

miguelcobain opened this issue Dec 16, 2015 · 52 comments

Comments

@miguelcobain
Copy link
Collaborator

miguelcobain commented Dec 16, 2015

Angular material has reached v1.0.0.
It is now a good time for us to update ember-paper to be on par with angular material.

Component List

Components should be updated using the automatically-imported Angular Material stylesheets. See
Angular Material v1.0.6 for reference: https://github.com/angular/material/tree/v1.0.6

How to get started

For each component in the above list, one should:

  1. do your work in a branch based on the master branch.
  2. angular-material 1.0 styles are now included. Check if we need to update our markup to conform the styles (the "hbs" part).
  3. Double check for missing or buggy functionality (the "js" part, you can use the docs, the dummy app, to quickly test 1 and 2).
  4. use new ember features when applicable (e.g closure actions, contextual components, ddau in general).
  5. write/review tests. convert unit to integration tests. check angular material tests to make sure we're not forgetting anything.
  6. update the docs if necessary. The website hosted at http://miguelcobain.github.io/ember-paper/ is the "dummy" app in the tests/ folder. It's a regular ember application. Don't waste too much time on docs for now. We'll update the docs later using angular material docs for inspiration, where applicable.
  7. document changes, especially breaking changes if any, in CHANGELOG.md (see other examples there)

Example commit (paper-progress-circular): 1a9b641
Try to follow the same style.

Current work for ember-paper v1 is being done at master Reference in issues to branch wip/v1.0.0 now refer to master as the wip branch was merged into master.

FAQ

See this comment for some more info: FAQ

@miguelcobain miguelcobain added this to the 1.0 milestone Dec 16, 2015
@miguelcobain miguelcobain changed the title Update components to be on par to angular material v1 Update components to be on par with angular material v1 Dec 16, 2015
@SirZach
Copy link
Contributor

SirZach commented Dec 16, 2015

Does updating also mean including closure actions?

@miguelcobain
Copy link
Collaborator Author

@SirZach Sure! Just added "use new ember features when applicable (e.g closure actions)" as a part of the update process.

@SirZach
Copy link
Contributor

SirZach commented Dec 16, 2015

@miguelcobain if you can describe how you would best like to see that implemented, I'll give a stab at a PR. I know you like the ember-actions(?) addon that you're using ember-leaflet.

@miguelcobain
Copy link
Collaborator Author

@SirZach A PR that uses ember-actions will be accepted, of course. People could use them immediately. However, feels easier if that was to be made part of the update process.

@joukevandermaas
Copy link
Contributor

Will this lead to breaking changes? If so can we make an effort to document them with a clear migration path?

@miguelcobain
Copy link
Collaborator Author

@joukevandermaas It may lead to breaking changes or may not. I'm not into angular 1 changes yet.
But good point I'll add that as a part of the update process.

@jamesdixon
Copy link

@miguelcobain do you want to work from the 1.0 branch or the 1.0.1 branch that was released a couple of days ago?

@miguelcobain
Copy link
Collaborator Author

Currently working for 1.0.0 release. Shouldn't be hard to take it to
further patch versions later (1.0.x).

A sáb, 19/12/2015, 23:28, James Dixon [email protected] escreveu:

@miguelcobain https://github.com/miguelcobain do you want to work from
the 1.0 branch or the 1.0.1 branch that was released a couple of days ago?


Reply to this email directly or view it on GitHub
#249 (comment)
.

@jamesdixon
Copy link

thanks, @miguelcobain. before I start, anything special when bringing over the style sheets -- literally just a copy/paste or is there anything else that needs to be done to prep for EP?

@miguelcobain
Copy link
Collaborator Author

One of the main features of ember-paper 1.0 will be the automatic pulling
of angular material stylesheets. So you won't need to copy paste anything.
Just "import" it.

A dom, 20/12/2015, 00:23, James Dixon [email protected] escreveu:

thanks, @miguelcobain https://github.com/miguelcobain. before I start,
anything special when bringing over the style sheets -- literally just a
copy/paste or is there anything else that needs to be done to prep for EP?


Reply to this email directly or view it on GitHub
#249 (comment)
.

@miguelcobain
Copy link
Collaborator Author

Styles are now being imported from angular material directly: d001c4a

Goodbye copy pasting and version inconsistency!

Current work being done in the wip/v1.0.0 branch.

@mike1o1 can I count on you to review theming? Colors seem a bit broken with AM v1.0.0 styles.

@mike1o1
Copy link
Contributor

mike1o1 commented Dec 22, 2015

Awesome work! I won't be able to work on this until the weekend, but I'll take a look then. 👍

@xomaczar
Copy link
Contributor

@miguelcobain how about converting components into pod structure, hbs next to the components js

@miguelcobain
Copy link
Collaborator Author

@xomaczar That would be awesome. Is that possible in addons?

@knownasilya
Copy link
Contributor

Yes, just do ember g component --pod my-comp and it'll set it up.

@miguelcobain
Copy link
Collaborator Author

pod discussion at #82

@knownasilya
Copy link
Contributor

Also, can 1.0 make use of contextual components (2.3+)?

@miguelcobain
Copy link
Collaborator Author

@knownasilya Yes, for a couple of reasons:

  • by the time ember-paper v1 is done, contextual components will hopefully be widespread
  • if backwards compatibility is desired, there is a way to provide specific templates for lower ember versions

Nevertheless, I think we should discuss the use of contextual components on a per component basis.

@miguelcobain miguelcobain changed the title Update components to be on par with angular material v1 [v1.0.0] Update components to be on par with angular material v1 Jan 6, 2016
@miguelcobain miguelcobain changed the title [v1.0.0] Update components to be on par with angular material v1 Update components to be on par with angular material v1 Jan 6, 2016
@jorgelainfiesta
Copy link
Contributor

I think we should start using getAttr instead of get for attributes. Right now, using just get works because of the attributes proxy. I now there's this article by locks stating we shouldn't get the attrs hash directly. However, getAttr helps us enforce one-way-bindings and makes variables more explicit in our code base.

@mellatone
Copy link
Contributor

@jaichandra I'm really glad that you were considering using Ember Paper in your organization. I wanted to follow up and see how things were going with that effort? I had to take the same considerations into account before adopting it at my organization. Are there any major blockers that you've run into so far?

Ember Paper has been gaining a lot of momentum, and community contributions are still welcome to help get [email protected] shipped. If you haven't joined already, I'd like to invite you to also connect with the Ember Community #ember-paper channel.

@DanChadwick DanChadwick mentioned this issue Apr 15, 2016
23 tasks
@chbonser
Copy link
Contributor

@miguelcobain are there any plans to support a subheader? https://material.angularjs.org/latest/demo/subheader

@mellatone
Copy link
Contributor

@chbonser We can hide it behind an officially maintained component, but I do this for now:

hbs: <md-subheader class="md-primary">Unread Messages</md-subheader>

@mellatone
Copy link
Contributor

But for anything more than static styles, we'll have to see about tying that into a pattern for "sticky" items.

@mansona
Copy link
Collaborator

mansona commented Apr 22, 2016

Do we want to add Chips to this list? #267 it has been rebased and will probably pass tests if the PR is reopened.

The only current issue with that PR at the moment is that Autocomplete seems to be broken. It's broken on the main Autocomplete demo page as well so it's not something silly I'm doing 😂

@v3ss0n
Copy link

v3ss0n commented May 18, 2016

Quite close to milestone and things looking quite solid.
Looks like its time for an alpha release for the cli users who would like to test drive?
Thanks

@miguelcobain
Copy link
Collaborator Author

@v3ss0n there are already alpha releases. :)

@v3ss0n
Copy link

v3ss0n commented May 18, 2016

how to get them on CLI ?

@v3ss0n
Copy link

v3ss0n commented May 18, 2016

i mean 0.2.14 is still 0.2x release right? not after new 1.0x branch merged , right?

@miguelcobain
Copy link
Collaborator Author

miguelcobain commented May 18, 2016

@v3ss0n Correct.

Follow instructions on website to install latest version (the main website runs on alpha).
To install an alpha release ember install [email protected] should do it.

@v3ss0n
Copy link

v3ss0n commented May 18, 2016

thanks gonna try now.

@steven-ferguson
Copy link
Contributor

@miguelcobain it doesn't look like v1.0.0-alpha.1 has been published to npm, so ember install will not work unless you reference the git rep: ember install miguelcobain/ember-paper.git#1.0.0-alpha.1

@v3ss0n
Copy link

v3ss0n commented Jul 1, 2016

@steven-ferguson just use master version right now. it is much improved and stable ember install miguelcobain/ember-paper

@ghost
Copy link

ghost commented Feb 2, 2017

Can you do something similar for the latest release? Create a milestone document what needs to be done to reach 1.0.0 and we can all pitch in?

@miguelcobain
Copy link
Collaborator Author

@anthonycollini not sure I understand. This is the document to reach 1.0. we didn't reach it yet (although we're close).

@saerdnaer
Copy link

saerdnaer commented May 17, 2017

@miguelcobain Can you update the reference in "Tabs (@mellatone in #314)" in the top comment, to point to #578 ?

@miguelcobain
Copy link
Collaborator Author

@saerdnaer done. thanks.

@josiahbryan
Copy link

Just wanted to check in here - read most of this thread, but see no activity here in the last several months - totally cool, everyone has lives! :-) Just wanted to ask how the 1.0.0 release is coming, and how everyone feels - is it close? This-year-close? Next year perhaps? Just checking, no worries, just curious. Great work everyone!

@Subtletree
Copy link
Collaborator

Subtletree commented Aug 7, 2017

@josiahbryan It might be closer than you think. No one's commenting in this thread but the OP is being updated.

1.0.0-beta.1 was released 18 days ago and went into 1.0.0-beta.2 3 days ago.

I consider the current release to be fully stable and am using it in production and I know many others are too. #738 (comment)

@josiahbryan
Copy link

Wow, good job all! Thanks for the input, good to hear! I'll seriously consider it then for my next project for sure.

Quick question, since you and others are using it in prod quite successfully - does it play nice with bootstrap then? Or is bootstrap and this project (and styles) mutually exclusive?

@Subtletree
Copy link
Collaborator

Hmm i guess they are both class based so you might be able to use them both. Personally I'd just use one though since they accomplish the same task. Using 1 means a more cohesive style for your app and doesn't force your users to download 2 separate styling frameworks.

There's things like this out there too https://mdbootstrap.com/material-design-for-bootstrap/

@josiahbryan
Copy link

Yeah, tried m-d-for-bs but ...yeah...felt very poorly done in practice and left me gun-shy of material design in general....that is, until I started my latest project, based on bootstrap, and found myself constantly trying to emulate the navbars, buttons, side menus, input fields, et al - all manually, through my own CSS modifications on top of bootstrap. Then I realized (just today), that even though I started with a bootstrap base, I was constantly moving closer and closer to a material look and feel for it since I kept trying to emulate native android apps.

At this point, I'm too invested and too close to beta launch of Sept 1 (per management) on the project to switch to ember-paper, but the next project we start here, I absolutely will try ember-paper with at least one of the betas, even if not full 1.0.0 yet.

Thanks for the space to rant, sorry to clutter the thread. All that is to say, good work guys, and this looks like an awesome project. Stoked to get my hands dirty with your {{paper}} components in my hbs in my next project. Cheers!

@v3ss0n
Copy link

v3ss0n commented Aug 13, 2017

@jaichandra we are using it in production for a mobile + Desktop app medical consultation chat platform for medical consultation. We have it running : more than 10K monthly active users.Not in english tho.
https://play.google.com/store/apps/details?id=co.ondr.chat

@ghost
Copy link

ghost commented Sep 27, 2017

What stylesheets does 1.0.0 use? Are they the latest angular stylesheets (https://material.angular.io/)?

@miguelcobain
Copy link
Collaborator Author

@anthonycollini correct.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests