<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Introducing Horizon — Horizon 2012.2.3 documentation</title>
<link rel="stylesheet" href="_static/nature.css" type="text/css" />
<link rel="stylesheet" href="_static/pygments.css" type="text/css" />
<link rel="stylesheet" href="_static/tweaks.css" type="text/css" />
<script type="text/javascript">
var DOCUMENTATION_OPTIONS = {
URL_ROOT: '',
VERSION: '2012.2.3',
COLLAPSE_INDEX: false,
FILE_SUFFIX: '.html',
HAS_SOURCE: true
};
</script>
<script type="text/javascript" src="_static/jquery.js"></script>
<script type="text/javascript" src="_static/underscore.js"></script>
<script type="text/javascript" src="_static/doctools.js"></script>
<script type="text/javascript" src="_static/jquery.tweet.js"></script>
<link rel="top" title="Horizon 2012.2.3 documentation" href="index.html" />
<link rel="next" title="Horizon Quickstart" href="quickstart.html" />
<link rel="prev" title="Horizon: The OpenStack Dashboard Project" href="index.html" />
</head>
<body>
<div id="header">
<h1 id="logo"><a href="http://www.openstack.org/">OpenStack</a></h1>
<ul id="navigation">
<li><a href="http://www.openstack.org/" title="Go to the Home page" class="link">Home</a></li>
<li><a href="http://www.openstack.org/projects/" title="Go to the OpenStack Projects page">Projects</a></li>
<li><a href="http://www.openstack.org/user-stories/" title="Go to the User Stories page" class="link">User Stories</a></li>
<li><a href="http://www.openstack.org/community/" title="Go to the Community page" class="link">Community</a></li>
<li><a href="http://www.openstack.org/blog/" title="Go to the OpenStack Blog">Blog</a></li>
<li><a href="http://wiki.openstack.org/" title="Go to the OpenStack Wiki">Wiki</a></li>
<li><a href="http://docs.openstack.org/" title="Go to OpenStack Documentation" class="current">Documentation</a></li>
</ul>
</div>
<div class="document">
<div class="documentwrapper">
<div class="bodywrapper">
<div class="body">
<div class="section" id="introducing-horizon">
<h1>Introducing Horizon<a class="headerlink" href="#introducing-horizon" title="Permalink to this headline">¶</a></h1>
<div class="contents local topic" id="contents">
<p class="topic-title first">Contents:</p>
<ul class="simple">
<li><a class="reference internal" href="#values" id="id1">Values</a></li>
<li><a class="reference internal" href="#history" id="id2">History</a></li>
<li><a class="reference internal" href="#the-current-architecture-how-it-meets-our-values" id="id3">The Current Architecture & How It Meets Our Values</a><ul>
<li><a class="reference internal" href="#core-support" id="id4">Core Support</a></li>
<li><a class="reference internal" href="#extensible" id="id5">Extensible</a></li>
<li><a class="reference internal" href="#manageable" id="id6">Manageable</a></li>
<li><a class="reference internal" href="#consistent" id="id7">Consistent</a></li>
<li><a class="reference internal" href="#stable" id="id8">Stable</a></li>
<li><a class="reference internal" href="#usable" id="id9">Usable</a></li>
</ul>
</li>
</ul>
</div>
<div class="section" id="values">
<h2><a class="toc-backref" href="#id1">Values</a><a class="headerlink" href="#values" title="Permalink to this headline">¶</a></h2>
<blockquote>
<div><p>“Think simple” as my old master used to say - meaning reduce
the whole of its parts into the simplest terms, getting back
to first principles.</p>
<p class="attribution">—Frank Lloyd Wright</p>
</div></blockquote>
<p>Horizon holds several key values at the core of its design and architecture:</p>
<blockquote>
<div><ul class="simple">
<li>Core Support: Out-of-the-box support for all core OpenStack projects.</li>
<li>Extensible: Anyone can add a new component as a “first-class citizen”.</li>
<li>Manageable: The core codebase should be simple and easy-to-navigate.</li>
<li>Consistent: Visual and interaction paradigms are maintained throughout.</li>
<li>Stable: A reliable API with an emphasis on backwards-compatibility.</li>
<li>Usable: Providing an <em>awesome</em> interface that people <em>want</em> to use.</li>
</ul>
</div></blockquote>
<p>The only way to attain and uphold those ideals is to make it <em>easy</em> for
developers to implement those values.</p>
</div>
<div class="section" id="history">
<h2><a class="toc-backref" href="#id2">History</a><a class="headerlink" href="#history" title="Permalink to this headline">¶</a></h2>
<p>Horizon started life as a single app to manage OpenStack’s compute project.
As such, all it needed was a set of views, templates, and API calls.</p>
<p>From there it grew to support multiple OpenStack projects and APIs gradually,
arranged rigidly into “dash” and “syspanel” groupings.</p>
<p>During the “Diablo” release cycle an initial plugin system was added using
signals to hook in additional URL patterns and add links into the “dash”
and “syspanel” navigation.</p>
<p>This incremental growth served the goal of “Core Support” phenomenally, but
left “Extensible” and “Manageable” behind. And while the other key values took
shape of their own accord, it was time to re-architect for an extensible,
modular future.</p>
</div>
<div class="section" id="the-current-architecture-how-it-meets-our-values">
<h2><a class="toc-backref" href="#id3">The Current Architecture & How It Meets Our Values</a><a class="headerlink" href="#the-current-architecture-how-it-meets-our-values" title="Permalink to this headline">¶</a></h2>
<p>At its core, <strong>Horizon should be a registration pattern for
applications to hook into</strong>. Here’s what that means and how it is
implemented in terms of our values:</p>
<div class="section" id="core-support">
<h3><a class="toc-backref" href="#id4">Core Support</a><a class="headerlink" href="#core-support" title="Permalink to this headline">¶</a></h3>
<p>Horizon ships with three central dashboards, a “User Dashboard”, a
“System Dashboard”, and a “Settings” dashboard. Between these three they
cover the core OpenStack applications and deliver on Core Support.</p>
<p>The Horizon application also ships with a set of API abstractions
for the core OpenStack projects in order to provide a consistent, stable set
of reusable methods for developers. Using these abstractions, developers
working on Horizon don’t need to be intimately familiar with the APIs of
each OpenStack project.</p>
</div>
<div class="section" id="extensible">
<h3><a class="toc-backref" href="#id5">Extensible</a><a class="headerlink" href="#extensible" title="Permalink to this headline">¶</a></h3>
<p>A Horizon dashboard application is based around the <a class="reference internal" href="ref/horizon.html#horizon.Dashboard" title="horizon.Dashboard"><tt class="xref py py-class docutils literal"><span class="pre">Dashboard</span></tt></a>
class that provides a consistent API and set of capabilities for both
core OpenStack dashboard apps shipped with Horizon and equally for third-party
apps. The <a class="reference internal" href="ref/horizon.html#horizon.Dashboard" title="horizon.Dashboard"><tt class="xref py py-class docutils literal"><span class="pre">Dashboard</span></tt></a> class is treated as a top-level
navigation item.</p>
<p>Should a developer wish to provide functionality within an existing dashboard
(e.g. adding a monitoring panel to the user dashboard) the simple registration
pattern makes it possible to write an app which hooks into other dashboards
just as easily as creating a new dashboard. All you have to do is import the
dashboard you wish to modify.</p>
</div>
<div class="section" id="manageable">
<h3><a class="toc-backref" href="#id6">Manageable</a><a class="headerlink" href="#manageable" title="Permalink to this headline">¶</a></h3>
<p>Within the application, there is a simple method for registering a
<a class="reference internal" href="ref/horizon.html#horizon.Panel" title="horizon.Panel"><tt class="xref py py-class docutils literal"><span class="pre">Panel</span></tt></a> (sub-navigation items). Each panel contains the
necessary logic (views, forms, tests, etc.) for that interface. This granular
breakdown prevents files (such as <tt class="docutils literal"><span class="pre">api.py</span></tt>) from becoming thousands of
lines long and makes code easy to find by correlating it directly to the
navigation.</p>
</div>
<div class="section" id="consistent">
<h3><a class="toc-backref" href="#id7">Consistent</a><a class="headerlink" href="#consistent" title="Permalink to this headline">¶</a></h3>
<p>By providing the necessary core classes to build from, as well as a
solid set of reusable templates and additional tools (base form classes,
base widget classes, template tags, and perhaps even class-based views)
we can maintain consistency across applications.</p>
</div>
<div class="section" id="stable">
<h3><a class="toc-backref" href="#id8">Stable</a><a class="headerlink" href="#stable" title="Permalink to this headline">¶</a></h3>
<p>By architecting around these core classes and reusable components we
create an implicit contract that changes to these components will be
made in the most backwards-compatible ways whenever possible.</p>
</div>
<div class="section" id="usable">
<h3><a class="toc-backref" href="#id9">Usable</a><a class="headerlink" href="#usable" title="Permalink to this headline">¶</a></h3>
<p>Ultimately that’s up to each and every developer that touches the code,
but if we get all the other goals out of the way then we are free to focus
on the best possible experience.</p>
<div class="admonition-see-also admonition seealso">
<p class="first admonition-title">See also</p>
<dl class="last docutils">
<dt><a class="reference internal" href="quickstart.html"><em>Quickstart</em></a></dt>
<dd>A short guide to getting started with using Horizon.</dd>
<dt><a class="reference internal" href="faq.html"><em>Frequently Asked Questions</em></a></dt>
<dd>Common questions and answers.</dd>
<dt><a class="reference internal" href="glossary.html"><em>Glossary</em></a></dt>
<dd>Common terms and their definitions.</dd>
</dl>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="sphinxsidebar">
<div class="sphinxsidebarwrapper">
<h3><a href="index.html">Table Of Contents</a></h3>
<ul>
<li><a class="reference internal" href="#">Introducing Horizon</a><ul>
<li><a class="reference internal" href="#values">Values</a></li>
<li><a class="reference internal" href="#history">History</a></li>
<li><a class="reference internal" href="#the-current-architecture-how-it-meets-our-values">The Current Architecture & How It Meets Our Values</a><ul>
<li><a class="reference internal" href="#core-support">Core Support</a></li>
<li><a class="reference internal" href="#extensible">Extensible</a></li>
<li><a class="reference internal" href="#manageable">Manageable</a></li>
<li><a class="reference internal" href="#consistent">Consistent</a></li>
<li><a class="reference internal" href="#stable">Stable</a></li>
<li><a class="reference internal" href="#usable">Usable</a></li>
</ul>
</li>
</ul>
</li>
</ul>
<h4>Previous topic</h4>
<p class="topless"><a href="index.html"
title="previous chapter">Horizon: The OpenStack Dashboard Project</a></p>
<h4>Next topic</h4>
<p class="topless"><a href="quickstart.html"
title="next chapter">Horizon Quickstart</a></p>
<h3>This Page</h3>
<ul class="this-page-menu">
<li><a href="_sources/intro.txt"
rel="nofollow">Show Source</a></li>
</ul>
<div id="searchbox" style="display: none">
<h3>Quick search</h3>
<form class="search" action="search.html" method="get">
<input type="text" name="q" size="18" />
<input type="submit" value="Go" />
<input type="hidden" name="check_keywords" value="yes" />
<input type="hidden" name="area" value="default" />
</form>
<p class="searchtip" style="font-size: 90%">
Enter search terms or a module, class or function name.
</p>
</div>
<script type="text/javascript">$('#searchbox').show(0);</script>
</div>
</div>
<div class="clearer"></div>
</div>
<div class="related">
<h3>Navigation</h3>
<ul>
<li class="right" style="margin-right: 10px">
<a href="genindex.html" title="General Index"
accesskey="I">index</a></li>
<li class="right" >
<a href="py-modindex.html" title="Python Module Index"
>modules</a> |</li>
<li class="right" >
<a href="quickstart.html" title="Horizon Quickstart"
accesskey="N">next</a> |</li>
<li class="right" >
<a href="index.html" title="Horizon: The OpenStack Dashboard Project"
accesskey="P">previous</a> |</li>
<li><a href="index.html">Horizon 2012.2.3 documentation</a> »</li>
</ul>
</div>
<div class="footer">
© Copyright 2012, OpenStack, LLC.
Last updated on Feb 08, 2013.
Created using <a href="http://sphinx.pocoo.org/">Sphinx</a> 1.1.3.
</div>
</body>
</html>
