[openstack-dev] [Horizon] the future of angularjs development in Horizon

Richard Jones r1chardj0n3s at gmail.com
Tue Nov 11 10:21:28 UTC 2014


On 11 November 2014 20:10, Anton Zemlyanov <azemlyanov at mirantis.com> wrote:

> Modernizing Horizon using Angular is really great. I would suggest a
> couple of minor things to consider.
>
> First, font-awesome is excellent and free font, but there are two
> problems: it has lots of icons that are not used, it also miss some other
> icons worth to have. I would suggest Fontello, it is tool for picking
> glyphs from all the free fonts round there and building custom fonts
>

Thanks for bringing this up. We discussed the need for additional symbols
at the meetup, and it may very well be that we do come up with a custom
font with a selection from font-awesome plus additional symbols designed as
we go along. Very good idea.



> Grunt is being forced out by Gulp that is times faster while having the
> same level of plugins and tools and is easier to use
>

Thanks for the pointer. I mentioned grunt in particular because it's quite
mature at this point, was the default tool for the yoeman project builder I
used and is also the tool of choice for Storyboard. If there is a
compelling reason to switch though, I imagine the Storyboard folk may also
be interested. From a brief look around there does seem to be a lot of
enthusiasm for gulp. I will look at making a branch of angboard that uses
gulp to get a good feeling for it (unless someone produces a PR that does
it for me ;)


     Richard


> On Tue, Nov 11, 2014 at 11:02 AM, Richard Jones <r1chardj0n3s at gmail.com>
> wrote:
>
>> Hi all,
>>
>> At the summit last week, we developed a plan for moving forward with
>> modernising Horizon's UI using AngularJS. If you weren't at that meeting
>> and are interested in helping out with this effort please let me know!
>>
>> The relevant etherpad from the meeting:
>> https://etherpad.openstack.org/p/kilo-horizon-contributors-meetup
>>
>> TL;DR: piece by piece we will replace Django views in Horizon with
>> angular views, and we're going to start with Identity
>>
>> First up, I'd like to ask the UX folk who raised their hands in that
>> meeting to indicate which of the Identity panes we should start with. I
>> believe a wizard was mentioned, as a way to exercise the new wizard code
>> from Maxime.
>>
>> At the same time, I'm looking at updating the AngularJS recommendations
>> in the wiki. I believe other aspects of the current approach to angular
>> code should also be revisited, if we're to scale up to the full angular
>> front-end envisaged. I'd appreciate if those interested in this aspect in
>> particular could contact me so we can sort this out as a team!
>>
>> I'd like to start the design work for the new REST API layer we'll be
>> exposing to the angular application code, but that is also part of the
>> broader discussion about the structure of the angular code in the Horizon
>> application as mentioned above. Should it be a new blueprint/spec?
>>
>> There were some discussions around tooling. We're using xstatic to manage
>> 3rd party components, but there's a lot missing from that environment. I
>> hesitate to add supporting xstatic components on to the already large pile
>> of work we have to do, so would recommend we switch to managing those
>> components with bower instead. For reference the list of 3rd party
>> components I used in angboard* (which is really only a teensy fraction of
>> the total application we'd end up with, so this components list is probably
>> reduced):
>>
>>     json3
>>     es5-shim
>>     angular
>>     angular-route
>>     angular-cookies
>>     angular-animate
>>     angular-sanitize
>>     angular-smart-table
>>     angular-local-storage
>>     angular-bootstrap
>>     angular-translate
>>     font-awesome
>>     boot
>>     underscore
>>     ng-websocket
>>
>> Just looking at PyPI, it looks like only a few of those are in xstatic,
>> and those are out of date.
>>
>> grunt provides a lot of features for developing an angular interface. In
>> particular LiveReload accelerates development significantly. There's a
>> django-livereload but it uses tiny-lr under the hood, so we're still using
>> a node application for LiveReload support... so it might make sense to just
>> use grunt. grunt provides many other features as well (wiredep integration
>> with bower, build facilities with ngMin, test monitoring and reload etc).
>>
>> There seemed to be agreement to move to jasmine (from qunit) for writing
>> the tests. It's not noted in the etherpad, but I recall karma was accepted
>> as a given for the test runner. For those not in the meeting, angboard uses
>> mocha+chai for test writing, but I agreed that jasmine is acceptable, and
>> is already used by Storyboard (see below).
>>
>> Also, phantomjs so we don't have to fire up a browser for exercising
>> (what should hopefully be an extensive) unit test suite.
>>
>> The Storyboard project has successfully integrated these tools into the
>> OpenStack CI environment.
>>
>>
>>      Richard
>>
>> * https://github.com/r1chardj0n3s/angboard
>>
>> _______________________________________________
>> OpenStack-dev mailing list
>> OpenStack-dev at lists.openstack.org
>> http://lists.openstack.org/cgi-bin/mailman/listinfo/openstack-dev
>>
>>
>
> _______________________________________________
> OpenStack-dev mailing list
> OpenStack-dev at lists.openstack.org
> http://lists.openstack.org/cgi-bin/mailman/listinfo/openstack-dev
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstack.org/pipermail/openstack-dev/attachments/20141111/1d17ebdd/attachment.html>


More information about the OpenStack-dev mailing list