OpenStack Horizon: Controlling the Cloud using Django

50 %
50 %
Information about OpenStack Horizon: Controlling the Cloud using Django

Published on February 19, 2014

Author: delapsley1



OpenStack is an open source cloud computing project that is implemented predominantly in Python. OpenStack’s goal is to provide the "ubiquitous open source cloud computing platform for public and private clouds”. The OpenStack project was launched by Rackspace and NASA in July 2010. Since then the project has gained considerable momentum with over 200 companies joining the project, and the launch of commercial services and products that use OpenStack.

The OpenStack Horizon project provides a web-based User Interface to OpenStack services. It is constructed in two parts: (1) a core set of libraries for implementing a Dashboard; (2) a reference dashboard implementation that uses the core set of libraries. Customization is a core part of the Horizon Framework. The framework enables developers to construct their own dashboards, panel groups and panels, and enables them to assemble them together via a common navigation/presentation framework.

In this presentation, we will provide a brief introduction to OpenStack and Horizon. Then we will dive into the details of Horizon. We will review Horizon’s overall architecture and how it integrates with other OpenStack services. We will look at some of Horizon’s interesting features and describe how to get started developing with Horizon. Finally, we will discuss some of the current challenges facing Horizon and some future directions.

OpenStack Horizon Controlling the Cloud using Django LA Django Meetup, February 18, 2014 David Lapsley OpenStack Engineer, @metacloudinc @devlaps,

About the Presenter • David is a Lead OpenStack Software Engineer at Metacloud • David has been using Python for over 10 years and Django for 5 years • Education: – Ph. D in Electrical and Electronics Engineering from the University of Melbourne – B. Sc. and B. E. from Monash University. • Personal Stuff: – Originally from Melbourne, Australia. Now based in LA (via Boston). In his spare time, he enjoys spending time with his family, cycling, and not shoveling snow

Our Agenda • Introduction to Cloud Computing and OpenStack • OpenStack Horizon – Controlling the Cloud with Django – Interesting Patterns – Example – Contributing to Horizon – Challenges and Future Directions

OpenStack Linux for the Cloud

Cloud Computing in Action Creating a virtual server on a Public OpenStack Cloud

Cloud Computing in Action

Cloud Computing in Action

Cloud Computing in Action

Cloud Computing in Action

Cloud Computing in Action

Cloud Computing Model

Virtualization Server Virtual+ Machine Virtual+ Machine Virtual+ Machine Virtual+ Machine Virtual+ Machine Virtual+ Machine Virtual+ Machine Virtual+ Machine Virtual+ Machine Virtual+ Machine Hypervisor (KVM) Physical+ Hardware (CPU,+ Disk,+ Network)

Cloud Computing “Cloud computing is a model for enabling convenient, on-demand network access to a shared pool of configurable computing resources (e.g., networks, servers, storage, applications, an d services) that can be rapidly provisioned and released with minimal management effort or service provider interaction.”

OpenStack • Open Source Cloud Platform – Build public/private clouds – Multi-tenant – Virtual machines on demand – Storage volumes • Founded in 2010 by Rackspace and NASA • Since then, enormous growth…

Some interesting OpenStack facts …

OpenStack Source Code

OpenStack Source Code

OpenStack Contributors

14, 175 People 132 Countries

“Linux for the Cloud”

OpenStack Projects • Nova (Compute) – Virtual servers on demand • Nova (Network) – Manages virtual network resources • VM Registration (Glance) – Catalog and manage server images • Identity (Keystone) – Unified authentication and authorization

OpenStack Projects • Object Storage (Swift) – Secure, reliable object storage • Block Storage (Cinder) – Persistent block storage to VMs • Dashboard (Horizon) – Web-based UI for all OpenStack Services – Many, many, more: Heat, Neutron, Ceilometer, Reddwarf, ..

OpenStack Horizon Controlling the Cloud with Django

Horizon Overview • Django-based application that provides access to OpenStack services • Typically deployed as an Apache WSGI application • Leverages well known existing technologies – Bootstrap, jQuery, Underscore.js, AngularJS, D3.js, Rickshaw, LESS CSS • Extends Django stack to enhance application extensibility

Django Stack Web'Browser Django'Stack Test'Infrastructure Template URL'Dispatcher View Framework Model Database

Horizon Stack

Horizon UI Structure (logical) Branding User Info Dashboard Panel Group Panel Sidebar Panel Content

Horizon UI Structure (logical) Project Dashboard Project Dropdown

Horizon UI Structure (CSS) body #container .sidebar #main_content .topbar .page4 header #user_info .messages <panel9 content> #footer

Horizon Base Demo

Admin Overview

Project Overview

Launching an Instance

Horizon Base Demo

Horizon Base Demo

Horizon Base Demo

Instance List



Horizon Base Demo

Row Actions

Table Actions

Table Actions

Table Actions

Instance Details

Instance Details

Instance Console

OpenStack Horizon Interesting Patterns

Dashboards and Panels • Horizon provides a flexible framework for creating Dashboards and Panels • Panels are grouped into PanelGroups • PanelGroups into Dashboards

Dashboard App • Dashboards are created as Django Applications • Dashboard modules partitioned into: – static/ • Static media (css, js, img) – templates/ • Django templates – python modules: • module which includes the class used by Horizon

‣ openstack_dashboard ‣ dashboards ‣ admin ‣ ladjango ‣ static ‣ ladjango ‣ css ‣ img ‣ js ‣ templates ‣ ladjango Dashboard Directory Structure

INSTALLED_APPS = ( ... 'horizon', 'openstack_dashboard.dashboards.project', 'openstack_dashboard.dashboards.admin', 'openstack_dashboard.dashboards.metacloud', 'openstack_dashboard.dashboards.settings', 'openstack_dashboard.dashboards.ladjango', ... )

from django.utils.translation import ugettext_lazy as _ import horizon class BasePanelGroup(horizon.PanelGroup): slug = "overview" name = _("Overview") panels = (”hypervisors",) class LADjango(horizon.Dashboard): name = _("LA Django") slug = "ladjango" panels = (BasePanelGroup,) default_panel = "hypervisors" roles = ("admin",) horizon.register(LADjango)

Starting Point

LA Django Dashboard Dashboard Tab Panel Group

Panel • Panels are created as Python Modules • Panel modules partitioned into: – static/ • Static media (css, js, img) – templates/ • Django templates – python modules: •,, •,,,

‣ladjango ‣ hypervisors ... ‣ static ‣ ladjango ‣ hypervisors ‣ css ‣ img ‣ js ‣ templates ‣ ladjango ‣ hypervisors index.html ... Panel Directory Structure

from django.utils.translation import ugettext_lazy as _ import horizon from openstack_dashboard.dashboards.ladjango import dashboard class Hypervisors(horizon.Panel): name = _(”Hypervisors") slug = 'hypervisors' dashboard.LADjango.register(Hypervisors)

LA Django Dashboard Panel Nav Entry

View Module • View module ties together everything – Tables – Templates – API Calls • Horizon base views: – APIView, LoginView, MultiTableView, DataTableVie w, MixedDataTableView, TabView, TabbedTableVie w, WorkflowView

from openstack_dashboard import api from openstack_dashboard.dashboards.ladjango.hypervisors import tables as hypervisor_tables class HypervisorsIndexView(tables.DataTableView): table_class = hypervisor_tables.AdminHypervisorsTable template_name = 'ladjango/hypervisors/index.html’ def get_data(self): hypervisors = [] states = {} hypervisors = api.nova.hypervisor_list(self.request) for state in api.nova.service_list(self.request): if state.binary == 'nova-compute': states[] = {'state': state.state, 'status': state.status} for h in hypervisors: h.service.update(states[getattr(h, h.NAME_ATTR)]) return hypervisors

Table Module • Table classes provide framework for creating tables with: – consistent look and feel – configurable table_actions row – configurable row_actions – select/multi-select column – sorting – pagination • Functionality is split server- and clientside, however implementation is all serverside

class HypervisorsFilterAction(tables.FilterAction): def filter(self, table, hypervisors, filter_string): """Naive case-insensitive search.""" q = filter_string.lower() return [hypervisor for hypervisor in hypervisors if q in] class EnableAction(tables.BatchAction): ... class DisableAction(tables.BatchAction): name = 'disable' classes = ('btn-danger',) def allowed(self, request, hypervisor): return hypervisor.service.get('status') == 'enabled' def action(self, request, obj_id): hypervisor = api.nova.hypervisor_get(request, obj_id) host = getattr(hypervisor, hypervisor.NAME_ATTR) return api.nova.service_disable(request, host, 'nova-compute')

def search_link(x): return "/admin/instances?q={0}".format(x.hypervisor_hostname) class AdminHypervisorsTable(tables.DataTable): hypervisor_hostname = tables.Column( "hypervisor_hostname", verbose_name=_("Hostname")) state = tables.Column( lambda hyp: hyp.service.get('state', _("UNKNOWN")).title(), verbose_name=_("State")) running_vms = tables.Column( "running_vms", link=search_link, verbose_name=_("Instances")) ... class Meta: name = "hypervisors" verbose_name = _("Hypervisors")

Template • Standard Django template format • Typically leverage base horizon templates (e.g. base.html)

{% extends 'base.html' %} {% load i18n horizon humanize sizeformat %} {% block title %}{% trans "Hypervisors" %}{% endblock %} {% block page_header %} {% include "horizon/common/_page_header.html" with title=_("All Hypervisors") %} {% endblock page_header %} {% block main %} {{ table.render }} {% endblock %} index.html

URLs Modules • Provides URL to View mappings

from django.conf.urls import patterns from django.conf.urls import url from openstack_dashboard.dashboards.ladjango.hypervisors import views urlpatterns = patterns( 'openstack_dashboard.dashboards.ladjango.hypervisors.views' url(r'^$', views.IndexView.as_view(), name='index'), )

Completed Dashboard! Table Action Column Sorting Nav Entries Panel Rendering Data Retrieval Linking State Aware Row Actions RPC

Click through to Instances

Authentication • Keystone manages all Authentication for OpenStack • To access an OpenStack service: – authenticate with Keystone – Obtain a TOKEN – Use TOKEN for transactions with OpenStack service • Horizon passes all Auth requests to Keystone via CUSTOM_BACKENDS

class MetacloudKeystoneBackend(KeystoneBackend): def authenticate(self, request=None, username=None, password=None, user_domain_name=None, auth_url=None): keystone_client = get_keystone_client() client = keystone_client.Client( user_domain_name=user_domain_name, username=username, password=password, auth_url=auth_url, insecure=insecure, cacert=ca_cert, debug=settings.DEBUG) # auth_ref gets assigned here… # If we made it here we succeeded. Create our User! user = create_user_from_token( request, Token(auth_ref)) request.user = user return user

Customization Hooks • • • • • Change Site Title, Logo, Brand Links Modify Dashboards and Panels Change Button Styles Use Custom Stylesheets Use Custom Javascript

Custom Overrides Module • For site-wide customization, Horizon enables you to define a python module that will be loaded after Horizon Site has been configured • Customizations can include: – Registering or unregistering panels from an existing dashboard – Modifying dashboard or panel attributes – Moving panels between dashboards – Modifying attributes of existing UI elements

HORIZON_CONFIG = { ... 'customization_module': 'openstack_dashboard.dashboards.ladjango.overrides', 'test_enabled': True, }

from openstack_dashboard.dashboards.ladjango.test import panel as test_panel from openstack_dashboard.dashboards.ladjango import dashboard as ladjango_dashboard from django.conf import settings import horizon LADJANGO_DASHBOARD_SETTINGS = horizon.get_dashboard('ladjango') if settings.HORIZON_CONFIG.get('test_enabled'): LADJANGO_DASHBOARD_SETTINGS.register(test_panel.Tests) ladjango_dashboard.BasePanels.panels += ('ui', )

Full LA Django Dashboard

Test Panel

Custom CSS and Javascript • Horizon templates provides blocks for custom CSS and Javascript • To add custom CSS/JS, can either extend existing templates, or replace with your own custom templates

<!DOCTYPE html> <html> <head> <title>{% block title %}{% endblock %} - {% site_branding %}</title> {% block css %} {% include "_stylesheets.html" %} {% endblock %} . . . </head> <body id="{% block body_id %}{% endblock %}"> {% block content %} . . . {% endblock %} <div id="footer”>{% block footer %}{% endblock %}</div> {% block js %} {% include "horizon/_scripts.html" %} {% endblock %} </body> </html> base.html

{% extends 'base.html' %} {% load i18n %} {% block title %}{% trans "Volumes" %}{% endblock %} {% block css %} {% include "ladjango/_stylesheets.html" %} {% endblock %} {% block page_header %} {% include "horizon/common/_page_header.html" with title=_("Volumes") %} {% endblock page_header %} {% block main %} <div id="volumes">{{ volumes_table.render }}</div> <div id="volume-types">{{ volume_types_table.render }}</div> {% endblock %} {% block js%} {% include "ladjango/_scripts.html" %} {% endblock %} index.html

Horizon Base View

Custom View

About Metacloud

Metacloud Takes the best of OpenStack and enhances it to deliver a fully scalable, highly available, and customizable cloud platform.

Metacloud Metacloud OpenStack • High Availability • Scalability • Patches/Fixes • Enhanced UI Cloud Operations • Install • Monitor • Upgrade Services • On-Prem Private Cloud • Hosted Private Cloud

Metacloud • Community Support • Contribute to OpenStack as much as possible – Bug fixes, features – Help out with code reviews, documentation – Participate in design summits

OpenStack Horizon Contributing

Devstack and Contributing • Devstack: – “A documented shell script to build complete OpenStack development environments.” – • Contributing to Horizon: – tributing.html

Challenges and Future Directions

Challenges • Bugs! • Performance • Evolving Architecture in a Smooth Manner

Future Directions • Evolving the client: AngularJS • Search/Data Service Model


References • IRC channels ( – #openstack-dev – #openstack-horizon – #openstack-meeting • Web: – – – – – – – ngs.html –

References • Web: – – – ilding_on_horizon/ –

Thank You @devlaps For more information visit:

#container presentations

Add a comment

Related presentations

Related pages

OpenStack Horizon: Controlling the Cloud Using Django ...

OpenStack Horizon: Controlling the Cloud Using Django. March 17, 2014/0 Comments/by David Lapsley. As Alan (@aewaldman) discussed in his recent post ...
Read more

Home » OpenStack Open Source Cloud Computing Software

Open source software for creating private and public clouds. OpenStack software controls large pools of compute, storage, and networking ...
Read more

GitHub - openstack/horizon: Horizon is a Django-based ...

... (OpenStack Dashboard) Horizon is a Django-based project aimed at providing a complete OpenStack Dashboard along with an extensible ... Using Horizon.
Read more

horizon is not showing all nova services - Ask OpenStack ...

I have a cloud controller and four compute ... I have python-django-horizon 2012.1 ... I've built an openstack Essex cloud using the online ...
Read more

Installing Horizon ¶ - OpenStack Docs: Current

Installing Horizon ¶ This page covers ... You will either use the provided openstack_dashboard/wsgi/django.wsgi or generate an openstack_dashboard ...
Read more

Software » OpenStack Open Source Cloud Computing Software

OpenStack clouds are powered by various OpenStack projects. 1 st. How will you be using OpenStack? ... Horizon. Dashboard. Ceilometer. Telemetry.
Read more

Run OpenStack Keystone and Horizon using Nginx

The Rackspace Developer Center gives ... Run OpenStack Keystone and Horizon using ... env = DJANGO_SETTINGS_MODULE=openstack_dashboard ...
Read more

Quickstart — horizon 9.0.1.dev356 documentation

... // > cd ... (e.g. using Shift-F5) in the ... that can be used in any Django project. The openstack_dashboard directory ...
Read more