OpenStack Horizon: Controlling the Cloud using Django

OpenStack Horizon
Controlling the Cloud using Django
LA Django Meetup, February 18, 2014

David Lapsley
OpenStack Engineer, @metacloudinc
@devlaps, dlapsley@metacloud.com

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

Cloud Computing in Action

Creating a virtual server on a Public OpenStack
Cloud

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.”
http://www.nist.gov/itl/cloud/

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 …

14, 175 People
132 Countries
http://www.openstack.org

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 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

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:
• dashboard.py module which includes the class used by
Horizon

‣ openstack_dashboard
‣ dashboards
‣ admin
‣ ladjango
‣ static
‣ ladjango
‣ css
‣ img
‣ js
‣ templates
‣ ladjango
__init__.py
dashboard.py
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',
...
)

settings.py

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)

dashboard.py

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:
• urls.py, views.py, panel.py
• tables.py, forms.py, tabs.py, tests.py

‣ladjango
‣ hypervisors
__init__.py
panel.py
urls.py
views.py
tests.py
tables.py
...
‣ static
‣ ladjango
‣ hypervisors
‣ css
‣ img
‣ js
‣ templates
‣ ladjango
‣ hypervisors
index.html
...
__init__.py
dashboard.py

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)

panel.py

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.host] = {'state': state.state,
'status': state.status}
for h in hypervisors:
h.service.update(states[getattr(h, h.NAME_ATTR)])
return hypervisors

views.py

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 hypervisor.name.lower()]

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')

tables.py

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")

tables.py

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'),
)

urls.py

Completed Dashboard!

Table Action

Column Sorting
Nav Entries
Panel Rendering
Data Retrieval

Linking
State Aware Row Actions

RPC

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

backend.py

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,
}

local_settings.py

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', )

overrides.py

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

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.”
– http://devstack.org

• Contributing to Horizon:
– http://docs.openstack.org/developer/horizon/con
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 (freenode.net)
– #openstack-dev
– #openstack-horizon
– #openstack-meeting

• Web:
–
–
–
–
–
–
–

http://docs.openstack.org/developer/horizon/
https://launchpad.net/horizon
http://devstack.org
https://github.com/openstack
https://github.com/openstack/horizon
http://docs.openstack.org/developer/horizon/
http://docs.openstack.org/developer/horizon/topics/setti
ngs.html
– https://wiki.openstack.org/wiki/Gerrit_Workflow

References

• Web:
– http://www.stackalytics.com
– http://activity.openstack.org/dash/browser/
– http://gabrielhurley.github.io/slides/openstack/bu
ilding_on_horizon/
– http://www.solinea.com/blog/openstack-grizzlyarchitecture-revisited

Thank You
dlapsley@metacloud.com
@devlaps
For more information visit:

metacloud.com

OpenStack Horizon: Controlling the Cloud using Django

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to OpenStack Horizon: Controlling the Cloud using Django

Similar to OpenStack Horizon: Controlling the Cloud using Django (20)

More from David Lapsley

More from David Lapsley (7)

Recently uploaded

Recently uploaded (20)

OpenStack Horizon: Controlling the Cloud using Django