6 the ui structure and the web api

BEXIS Tech Talk Series

#6: UI Structure and Web API

Javad ChamanaraAugust 2016

Jena, Germany

BEXIS Tech Talk #6: UI Structure and Web API

Reminder

• Extensibility Aspects– Modules– UI– Integration– Branding


Today

• In depth view to:– The UI Structure– The Web APIs


UI-> Tools

• ASP.NET MVC 5– Razor– Views• Sections

– Shared Views– Partial Views


UI-> Structure

• The Shell as the application view container– Composition– Default Contents

• Modules’ UI– Actions– Content– Placement

• Tenants


Shell ->Anatomy

• Themes– Layouts

• Arrangement• Content Providers

– Content Holders• Partial Views

– Styling• Images• CSSs

• Scripts• Menus


Shell -> Layout


Shell: Themes

• Changing themes affects:– Placement– Content


Shell ->Theme Configuration

• Current theme can be set– In the app’s config file

• Each theme may contain more than one layout

• Active layout of the current theme can be set– In the app’s config file


Shell -> Content Rendering

• @RenderSection – Renders a named section in the bound view

• @RenderBody– Renders the body, the default unnamed section

• @Html.RenderAuto– Renders an action result– Utilizes the content provider file (layout.xml)


Shell -> Content Descriptor

• Maps a content key (in the layout) to a content provider• A provider can be:

– an action– A view– An external service

• Providers may accept parameters• Multiple call to one provider with different parameters• Activating/ Inactivating providers’ mapping• Multiple provider per key and output concatenation• Providers should return string, HTML, or MvcString


Modules’ UI

• Layout Selection• Action Integration• Content Placement


Modules->Layout Application

• View Level• Module Level– At each area

• Fallback Layout

<Module>/Views/_ViewStart.cshtml


Module: UI


Modules-> Action Integration

• Registered by Modules• Integrated into Shell• Some are fixed


Modules-> Action Integration


Branding

• Details in Tech Talk #5


Tenants-> Folder Structure


Tenants->Catalog


Tenants -> Package Structure


Tenants-> Package’s Manifest

23BEXIS Tech Talk #6: UI Structure and Web API

Branding-> Applied


Web APIs

• MVC 5 Web API 2

• No Html Rendering• JSON and XML Outputs • Output Overriding–CSV


Web API-> Mechanics

• Project Structure– In respective modules’ Controller folder– Derived from ApiController class


Web API-> Mechanics

• Registration– In BExIS.Web.Shell->App_Start->WebApiConfig– The Register method– Provides a unified URL space for all the web APIs• For all modules


Web API-> Mechanics

• URL space– All APIs under one unified space /api– Base_URL/api/<entity>/<action>– No API versioning is considered!


Web API-> Mechanics

• Naming– Controller name: entity’s plural name– Http request carries verbs– URLs do not contain verbs


Web API-> Mechanics

• Actions:– /api/<entity>: list all the entities• Controller’s Get() method is called• May reduce the number of entity attributes reported• May omit some entities

– /api/<entity>/<id>: returns the entity with identifier <id>• Controller’s Get(id) method is called


Web API-> Mechanics

• Actions:– /api/<entity>: Creates a new entity• based on the received form data• Controller’s Post(value) method is called

– /api/<entity>/<id>: Updates the entity with identifier <id>• based on the received form data• Controller’s Put(id, value) method is called


Web API-> Mechanics

• Actions:– /api/<entity>/<id>: deletes the entity with

identifier <id>• Controller’s Delete(id) method is called


• Example– rBExIS package for R


Exemplary Use-Cases

• Authentication/Authorization• Dataset• Schema of a dataset• Metadata of a Dataset


Sample Web API calls: Data

• http://www.name.com/api/data• http://www.name.com/api/data/6– /api/data/6?header=id,name– /api/data/6?filter=(Grade>50 AND Grade <90)– /api/data/6?header=id,name&filter=(Grade>50)

http://www.name.com/api/data

http://www.name.com/api/data/6


Sample Web API calls: Metadata

• http://www.name.com/api/metadata• http://www.name.com/api/metadata/6• http://

www.name.com/api/metadata/6?ConvertTo=EML



http://www.name.com/api/metadata/6

http://www.name.com/api/metadata/6

http://www.name.com/api/metadata/6?ConvertTo=EML




Outlook

Whats next in the talk series?

Source ControlRelease Management


37

Thanks!Questions?

Contact:[email protected]://bexis2.uni-jena.de

Acknowledgment

6 the ui structure and the web api

Software