Re: Reusable Hydra components

Thanks Kev. I'll definitely look take a closer look at your work to gather some ideas!

Tom

January 26 2015 11:57 AM, "Kev Kirkland" <kev@dataunity.org> wrote: 
> Hi Tom, 
> 
> I've been working on similar themes with the AngularJS client [1].
> 
> Here's some links to GitHub which highlight some of the things you mentioned above.
> 
> I've used routing to have separate views for Forms, Collections and 'normal views'. These seem to
> be the three main view types in a Hydra client (judging by Marcus's implementation):
> 
> https://github.com/dataunity/dataunity-hydra-client/blob/master/js/dataunity-hydraclient-0.1.0.js#L3
> 8-403
> 
> There are directives for each of the different views:
> 
> Form directive:
> https://github.com/dataunity/dataunity-hydra-client/blob/master/js/dataunity-hydraclient-0.1.0.js#L1
> 90-2044
> 
> Screenshot: https://www.dropbox.com/s/xrhtguax980am52/du_dash_add_cell_contents_map_fields.png?dl=0
> (note I'm using OSLC to populate drop down values)
> 
> Collection directive:
> https://github.com/dataunity/dataunity-hydra-client/blob/master/js/dataunity-hydraclient-0.1.0.js#L1
> 17-1836
> 
> Sreenshot: https://www.dropbox.com/s/wh4xfi2dlq7sbgd/du_datatables_list.png?dl=0
> 
> Item directive:
> https://github.com/dataunity/dataunity-hydra-client/blob/master/js/dataunity-hydraclient-0.1.0.js#L1
> 32-1742
> 
> The directive 'duItem' represents a SupportedProperty (a 'pageItem' is a wrapper around a
> SupportedProperty with a bit of extra information to make it easier to display - I should improve
> the naming):
> https://github.com/dataunity/dataunity-hydra-client/blob/master/js/dataunity-hydraclient-0.1.0.js#L1
> 81-1629
> 
> The SupportedOperation directive is here:
> https://github.com/dataunity/dataunity-hydra-client/blob/master/js/dataunity-hydraclient-0.1.0.js#L1
> 53-1674
> 
> I've got a couple of extensions in my client, over and above the standard. These don't stop it
> functioning like a normal Hydra client, but help the client look and behave like a standard web
> app. CSS styling can be applied to SupportedProperties, so the EntryPoint for my app looks like
> this (CSS is applied to the SupportedOperations to make them look like buttons):
> 
> https://www.dropbox.com/s/lf1iqyycefbcp9x/du_home.png?dl=0
> 
> There is also an option to add custom routes. In my application there's a couple of screens which
> really need a very tailored user experience which involve a lot of javascript interaction (I make
> data visualisation software). The easiest way I've found of including them is to have a Provider
> which lets you insert new Routes into the Hydra client (by specifying a
> SupportedClass/SupportedOperation combination):
> 
> https://github.com/dataunity/dataunity-hydra-client/blob/master/js/dataunity-hydraclient-0.1.0.js#L5
> 266
> 
> I've supported supplying drop down value choices through OSLC. I chose OSLC from the current Hydra
> Shapes options because it was easy to understand and implement (drop downs are visible in the Form
> screenshot above):
> https://github.com/dataunity/dataunity-hydra-client/blob/master/js/dataunity-hydraclient-0.1.0.js#L1
> 31-1983
> https://github.com/dataunity/dataunity-hydra-client/blob/master/js/dataunity-hydraclient-0.1.0.js#L2
> 15-2435
> 
> I haven't done a very good job of sharing my work with the group yet (sorry guys). The main issues
> are intense workload, and the fact that I can't Open Source my Hydra API just yet (I need to
> improve some security options). However I hope some of the screenshots above show that Hydra can be
> used to create a familiar web experience for the user.
> 
> Thanks,
> 
> Kev
> 
> PS: there's more features to the AngularJS Hydra client, like allowing parallel routes through an
> API, but I think I've already put too much info into this email so I'll save it for future
> discussions.
> 
> [1] https://github.com/dataunity/dataunity-hydra-client
>

Received on Tuesday, 27 January 2015 11:26:15 UTC