angular-dynamic-layout
angular-dynamic-layout copied to clipboard
[WIP] Refactored dynamic-layout to be more angular and easier to implement
Work in Progress (I'd just like comments/thoughts on the implementation) I've started a refactor of the angular-dynamic-layout to use more of angular. I've removed the filters/rankers and template functionality. You can check index.html for the implementation example:
<div dynamic-layout>
<div dynamic-layout-item ng-repeat="card in grid.cards | contains:'tabs':grid.contains" ng-include="card.template"></div>
</div>
ng was upped to 1.4 to fix the $animate.cancel(promise) errors you were experiencing. I was wondering if we need them at all really, we could just use CSS transition and change top/left. Not sure yet.
You apply the filters/ordering through ng-repeat pipes and just ng-include if you have additional templates.
The idea is that
The documentation and tests are largely missing as I've pretty much only just got it working. I did a bit of renaming/removing as I went through and tried to understand the logic. There should be less global state within the position.service.js now.
Gotta run, just wanted this to exist somewhere so I can continue on the weekend :)
That's a large refactoring, glad to see the effort you put in this but it's difficult to see the differences with the existing codebase right now because the files have been deleted and added again. Could you use git mv
to avoid this?
About the removal of filters and rankers I don't think the ng-repeat
pipe can achieve the same behavior that is currently in the demo and that reproduces the the jQuery isotope library behavior.
Will try git mv
. From looking at isotope again, I'm not sure why we can't use filters and orderBy within an ng-repeat.
Fixed the PR using git mv
. I've also got ordering working again (I never finished that).
I'm $watching the $index of each item and triggering a layout() to detect if the ordering changed. The items are now sorted before a layout.
So it still hasn't been moved properly, see the diff and two copies are now present in the folder: here and there. Also since this is a purely JS library I don't think we need to have a src/js
folder.
If you could have a separate repo/branch where to store the updated demo that would be great, you can even use a github page to have it live.
Just realised that whilst attempting to git mv
I had left files in /js
, I've removed them. To be honest I think having a gh-page branch right now would be a nightmare. I'd like to serve the content whilst developing it so have it within /src.
I typically have a gulp serve
task which serves the demo and watches for changes and recompiles the /src to /dist
Since you're not using gulp and I can't copy across my dev process, I'm just using live-server for now
Added ngAnnotate as an alternative to manually injecting as per JohnPapa styleguide: https://github.com/johnpapa/angular-styleguide#style-y100
Also replaced jshint with eslint with eslint-plugin-angular during build
Tests still don't run, didn't look at those.