Update to 3D transforms?

[coverflowjs]

Update to 3D transforms?

[basti1253]

Hi PizzaBrandon,

nice! Now I'm really nosy ;)

Additionally, it will (somewhat) gracefully fall back to matrix transforms for unsupported browsers (tested in IE8 successfully).

The "somewhat" really matters here for me - as I'm using the plugin commercially and it has to look nearly the same when using IE8 - as the employees are on IE8 and ipads only.

Anyways (I don't know if you've seen #10 yet) I'd like to polish the demos and really release a stable version first before bringing in new features (or a new look).

TODOs left:

• some unit tests
• polishing the gh-pages docu example
• update the README

I have not yet updated the tests since I don't have my test suite set up

I don't get you there as qunit is already included as a git submodule ;) You can run any test from your browser (look into tests/qunit dir).

P.S.: I'd like to add you to Authors.txt. If you want your name/mail address listed there please mail it to me.

best regards

[addyosmani]

I just took a look at the demo with adjusted transforms. Nice work! I'm afraid I have to agree that visual parity is something the project has always cared about where possible. We could certainly consider adding an optional mode or plugin to bring improved 3D transforms into the mix for those that don't have this hard requirement. Would that be of interest?

As @basti1253 mentions above, we're hoping to wrap up a new release sometime in the near future and would hugely appreciate any help with the unit tests or examples that are on our gh-pages at the moment.

[addyosmani]

btw, @basti1253 is there a list of what needs to be updated in the readme around?

[PizzaBrandon]

@basti1253 The initial 3D transform changes are for a project at work that is phone-focused with no direct support of IE8. That said, I did test it in IE8 and the fallback to matrix transforms worked, it just didn't look as good as before without the reflections (removed because of some display bug with the 3d transforms). The project will eventually move beyond just phones, so I wanted to make sure it still operated. The only reason I qualified it as "somewhat" is due to the minimal testing I ran. In the current form of my changes, it will never look the same in <= IE8, but it will still work.

When I was at work, I was developing on the file directly. Now I've transferred it to a personal project and have checked out the full repo. That is why I couldn't run the tests previously. On my personal machine I've set up node, grunt, etc and am now updating tests. My 3dtransforms branch is now working with the existing tests and I'm ready to start adding new tests.

Now that I've moved this to a personal project, I can start working on other needs of the project as a whole. You can include me as: Brandon Belvin [email protected]

@addyosmani I like the idea of making this a plugin and was thinking the original renderer could also be extracted so they can become user-selectable as well as easily-testable. I have some ideas on how to attack this and will see what I come up with in the next few days.

[PizzaBrandon]

In my 3dtransforms branch, I've converted both the original and new 3d transformer to a user-selectable option. There's still a decent amount of duplicated code between the two, but I'm not sure yet how to reconcile that and still keep the renderers from being too closely related.

I've started on the process of adding tests. I'll start by tackling the ones I brought up, but then I need to move back to new features for my work such as adding scrolling momentum to the swipe action (taking advantage of a new feature I requested and added to jquery-mobile). Once I've handled that, I'll be able to move back to the core tasks.

[basti1253]

Hi Brandon,

sorry for my rare and late responses - I'm currently in a very big workathon :(

Regarding your changes: Nice! Just had time for a very short review, but I like the rendering and the code ;)

@addyosmani I'll should have time to add some tests + update the readme next weekend. Delay the release and switch to Brandons rendering? I think we could get IE8 close enough to make it look kinda the same. I'd drop the old rendering then.

[PizzaBrandon]

I'm not going to say the 3D rendering is all the way there, yet. I want to audit the code to reduce the code duplication between renderers first. I also downloaded the IE test images for IE7 through IE10 and will test both renderers there to see if we can safely change the logic in isOldie. Then I'll merge it into my master and publish a pull request to the main.

If you have time in your next session, could you look at why the reflections don't render correctly when in the 3d renderer? I had to remove them because they ended up offset from the parent object. It would be nice to be able to put them back in before a public launch to keep feature parity with the classic renderer.

Based on the plugin suggestion from @addyosmani , I extracted both renderers to an internal plugin and was considering adding support for third-party renderers by exposing that feature through the options object. I don't have a use for it, but somebody might! Thoughts?

[addyosmani]

I think extracting the renderders and internal plugin was the right call. To be honest, I imagine others would indeed find third-party render support useful if it meant that it didn't come with too much of an overhead.

@basti1253 My opinion is that the default path should be the most performant with 3D transforms being optional. We can showcase it alongside default on the homepage but I want to make sure a fast user experience is the first priority. Does that sound okay?

[PizzaBrandon]

Once I complete the 3D code and prepare it for merge, we can run tests to see how (or if) the performance is different between the two renderers.

[basti1253]

Just a short headsup: I merged all your changes locally and refactored the widget's rendering plugin architecture (no internal method calls from inside the renderer, code cleanup,..). There are still some stumpling blocks like using perspective on any webkit alike browser when there's no 3d acceleration support etc.

I'll release the plugin and push a more stable "next" branch to this repo asap. Would be cool to discuss renderer plugin architecture with you.

best regards

Sebastian

[PizzaBrandon]

How are we looking on this?

[basti1253]

Hi Brandon,

It's pushed to master ;) Thank you very much again for your renderer!

best regards