<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html401/loose.dtd">
<html>
<!--This manual describes what the CentOS Artwork Repository is and what
can you do inside it.
Copyright C 2009, 2010 CentOS Artwork SIG. All rights
reserved.
Permission is granted to copy, distribute and/or modify this document
under the terms of the GNU Free Documentation License, Version 1.2 or
any later version published by the Free Software Foundation; with no
Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts. A
copy of the license is included in the section entitled GNU Free
Documentation License.
-->
<!-- Created on October, 2 2010 by texi2html 1.76 -->
<!--
Written by: Lionel Cons <Lionel.Cons@cern.ch> (original author)
Karl Berry <karl@freefriends.org>
Olaf Bachmann <obachman@mathematik.uni-kl.de>
and many others.
Maintained by: Many creative people <dev@texi2html.cvshome.org>
Send bugs and suggestions to <users@texi2html.cvshome.org>
-->
<head>
<title>CentOS Artwork Repository: 3.8 trunk/Identity/Models/Tpl/Promo/Web</title>
<meta name="description" content="CentOS Artwork Repository: 3.8 trunk/Identity/Models/Tpl/Promo/Web">
<meta name="keywords" content="CentOS Artwork Repository: 3.8 trunk/Identity/Models/Tpl/Promo/Web">
<meta name="resource-type" content="document">
<meta name="distribution" content="global">
<meta name="Generator" content="texi2html 1.76">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
@import "/home/centos/artwork/trunk/Identity/Themes/Motifs/Modern/Web/Css/Texi2html/common.css";
a.summary-letter {text-decoration: none}
pre.display {font-family: serif}
pre.format {font-family: serif}
pre.menu-comment {font-family: serif}
pre.menu-preformatted {font-family: serif}
pre.smalldisplay {font-family: serif; font-size: smaller}
pre.smallexample {font-size: smaller}
pre.smallformat {font-family: serif; font-size: smaller}
pre.smalllisp {font-size: smaller}
span.sansserif {font-family:sans-serif; font-weight:normal;}
ul.toc {list-style: none}
-->
</style>
</head>
<body lang="en" bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#800080" alink="#FF0000">
<table cellpadding="1" cellspacing="1" border="0">
<tr><td valign="middle" align="left">[<a href="repository_10.html#SEC49" title="Previous section in reading order"> < </a>]</td>
<td valign="middle" align="left">[<a href="#SEC51" title="Next section in reading order"> > </a>]</td>
<td valign="middle" align="left"> </td>
<td valign="middle" align="left">[<a href="repository_3.html#SEC3" title="Beginning of this chapter or previous chapter"> << </a>]</td>
<td valign="middle" align="left">[<a href="repository_3.html#SEC3" title="Up section"> Up </a>]</td>
<td valign="middle" align="left">[<a href="repository_62.html#SEC320" title="Next chapter"> >> </a>]</td>
<td valign="middle" align="left"> </td>
<td valign="middle" align="left"> </td>
<td valign="middle" align="left"> </td>
<td valign="middle" align="left"> </td>
<td valign="middle" align="left">[<a href="repository.html#SEC_Top" title="Cover (top) of document">Top</a>]</td>
<td valign="middle" align="left">[<a href="repository_toc.html#SEC_Contents" title="Table of contents">Contents</a>]</td>
<td valign="middle" align="left">[<a href="repository_62.html#SEC320" title="Index">Index</a>]</td>
<td valign="middle" align="left">[<a href="repository_abt.html#SEC_About" title="About (help)"> ? </a>]</td>
</tr></table>
<a name="trunk-Identity-Models-Tpl-Promo-Web"></a>
<a name="SEC50"></a>
<h2 class="section"> 3.8 trunk/Identity/Models/Tpl/Promo/Web </h2>
<a name="SEC51"></a>
<h3 class="subsection"> 3.8.1 Goals </h3>
<p>Organize scalable vector graphics (svg) to help describe the CentOS
web environment.
</p>
<a name="SEC52"></a>
<h3 class="subsection"> 3.8.2 The CentOS web environment </h3>
<p>Inside CentOS corporate identity, the CentOS web environment is
considered a promotion component. The CentOS web environment is formed
by a central web application --to cover base needs (e.g., per-major
release information like release notes, lifetime, downloads,
documentation, support, security advisories, bugs, etc.)-- and many
different free web applications --to cover specific needs (e.g.,
wiki, mailing lists, etc.)--.
</p>
<p>The CentOS web environment is addressed to solve the following issues:
</p>
<ul class="toc">
<li> One unique name and one unique visual style to all web
applications used inside the web environment.
</li><li> One-step navigation to web applications inside the environment.
</li><li> High degree of customization to change the visual style of all
web applications with few changes (e.g, updating just two or three
images plus common style sheet [CSS] definitions).
</li></ul>
<p>The CentOS project is attached to a monolithic corporate visual
identity (see section <a href="repository_4.html#SEC4">trunk/Identity</a>), where all visual manifestations
have one unique name and one unique visual style. This way, the CentOS
web environment has one unique name (the CentOS brand) and one unique
visual style (the CentOS default theme) for all its visual
manifestations, the web applications in this case.
</p>
<p>Since a maintainance point of view, achiving the one unique visual
style inside CentOS web environment is not a simple task. The CentOS
web environment is built upon many different web applications which
have different visual styles and different internal ways to customize
their own visual styles. For example: MoinMoin, the web application
used to support the CentOS wiki (<a href="http://wiki.centos.org/">http://wiki.centos.org/</a>) is
highly customizable but Mailman (in its 2.x.x serie), the web
application used to support the CentOS mailing list, doesn't
support<a name="DOCF1" href="repository_fot.html#FOOT1">(1)</a> a customization system that separates
presentation from logic, similar to MoinMoin's one.
</p>
<p>This visual style diversity complicates our goal of one unique visual
style for all web applications. So, if we want one unique visual style
for all web applications used, it is innevitable to modify the web
applications in order to implement the CentOS one unique visual style
customization in them. Direct modification of upstream applications is
not convenient because upstream applications come with their one
visual style and administrators take the risk of loosing all
customization changes the next time the application be updated (since
not all upstream web applications, used in CentOS web environment,
separate presentation from logic).
</p>
<p>To solve the "one unique visual style" issue, installation and
actualization of web applications --used inside CentOS web
environment-- need to be independent from upstream web applications
development line; in a way that CentOS web environment administrators
can install and update web applications freely without risk of loosing
the one unique visual style customization changes.
</p>
<p>At the surface of this issue we can see the need of one specific yum
repository to store CentOS web environment customized web applications.
</p>
<a name="SEC53"></a>
<h4 class="subsubsection"> 3.8.2.1 Design model (without ads) </h4>
<div class="float"><a name="fig_003aturnk_002fIdentity_002fModels_002fTpl_002fPromo_002fWeb_002fcustomization"></a>
<p><img src="/home/centos/artwork/trunk/Identity/Models/Img/Promo/Web/customization.png" alt="The CentOS web customization design model">
</p></div><p><strong>Figure 3.1: The CentOS web customization design model.
</strong>
</p>
<a name="SEC54"></a>
<h4 class="subsubsection"> 3.8.2.2 Design model (with ads) </h4>
<div class="float"><a name="fig_003aturnk_002fIdentity_002fModels_002fTpl_002fPromo_002fWeb_002fcustomization_002dwith_002dads"></a>
<p><img src="/home/centos/artwork/trunk/Identity/Models/Img/Promo/Web/customization-with-ads.png" alt="The CentOS web customization design model using promotion">
</p></div><p><strong>Figure 3.2: The CentOS web customization using promotion design model.
</strong>
</p>
<a name="SEC55"></a>
<h4 class="subsubsection"> 3.8.2.3 Controlling visual style </h4>
<p>Inside CentOS web environment, the visual style is controlled by the
following compenents:
</p>
<dl compact="compact">
<dt> <strong>Webenv header background</strong></dt>
<dd><pre class="verbatim">trunk/Identity/Themes/Motifs/$THEME/Promo/Web/Img/header-bg-top.png
</pre>
</dd>
<dt> <strong>Webapp header background</strong></dt>
<dd><pre class="verbatim">trunk/Identity/Themes/Motifs/$THEME/Promo/Web/Img/header-bg-app.png
</pre>
</dd>
<dt> <strong>Webapp footer background</strong></dt>
<dd><pre class="verbatim">trunk/Identity/Themes/Motifs/$THEME/Promo/Web/Img/footer-bg-app.png
</pre>
</dd>
<dt> <strong>CSS definitions</strong></dt>
<dd><pre class="verbatim">trunk/Identity/Themes/Motifs/$THEME/Promo/Web/CSS/stylesheet.css
</pre></dd>
</dl>
<a name="SEC56"></a>
<h4 class="subsubsection"> 3.8.2.4 Producing visual style </h4>
<p>The visual style of CentOS web environment is defined in the following
files:
</p>
<pre class="verbatim">trunk/Identity/Themes/Motifs/$THEME/Backgrounds/Xcf/1024x250.xcf
trunk/Identity/Themes/Motifs/$THEME/Backgrounds/Img/1024x250.png
trunk/Identity/Themes/Motifs/$THEME/Backgrounds/Img/1024x250-bg.png
trunk/Identity/Themes/Motifs/$THEME/Backgrounds/Tpl/1024x250.svg
</pre>
<p>As graphic designer you use <tt>`1024x250.xcf'</tt> file to produce
<tt>`1024x250-bg.png'</tt> file. Later, inside <tt>`1024x250.svg'</tt> file,
you use the <tt>`1024x250-bg.png'</tt> file as background layer to draw
your vectorial design. When you consider you artwork ready, use the
<code>centos-art.sh</code> script, as described below, to produce the
visual style controller images of CentOS web environment.
</p>
<pre class="verbatim">centos-art render --entry=trunk/Identity/Themes/Motifs/$THEME/Promo/Web
</pre>
<p>The image files which control the visual style of CentOS web
environment are stored in the location:
</p>
<pre class="verbatim">trunk/Identity/Themes/Motifs/$THEME/Promo/Web
</pre>
<p>Once you have rendered required image files, changing the visual style
of CentOS web environment is a matter of replacing old image files
with new ones, inside webenv repository file system structure. The
visual style changes will take effect the next time customization line
of CentOS web applications be packaged, uploded, and installed from
[webenv] or [webenv-test] repositories.
</p>
<a name="SEC57"></a>
<h4 class="subsubsection"> 3.8.2.5 Development and release cycle </h4>
<p>The CentOS web environment development and relase cycle is described
below:
</p>
<dl compact="compact">
<dt> <strong>Download</strong></dt>
<dd>
<p>The first action is download the source code of web applications we
want to use inside CentOS web environment.
</p>
<blockquote class="orange"><img src="/home/centos/artwork/trunk/Identity/Widgets/Img/icon-admonition-attention.png" alt="Important"><h3>Important</h3><p> The source location from which web application are
downloaded is very important. Use SRPMs from CentOS <strong>[base]</strong>
and <strong>[updates]</strong> repositories as first choise, and third party
repositories (e.g. RPMForge, EPEL, etc.) as last resource.
</p></blockquote>
</dd>
<dt> <strong>Prepare</strong> </dt>
<dd>
<p>Once web application source code has been downloaded, our duty is
organize its files inside <samp>`webenv'</samp> version controlled repository.
</p>
<p>When preparing the structure keep in mind that different web
applications have different visual styles, and also different ways to
implement it. A convenient way to organize the file system structure
would be create one development line for each web application we use
inside CentOS web environment. For example, consider the following
file system structure:
</p>
<pre class="verbatim">https://projects.centos.org/svn/webenv/trunk/
|-- WebApp1/
| |-- Sources/
| | `-- webapp1-0.0.1/
| |-- Rpms/
| | `-- webapp1-0.0.1.rpm
| |-- Srpms/
| | `-- webapp1-0.0.1.srpm
| `-- Specs/
| `-- webapp1-0.0.1.spec
|-- WebApp2/
`-- WebAppN/
</pre>
</dd>
<dt> <strong>Customize</strong></dt>
<dd>
<p>Once web applications have been organized inside the version
controlled repository file system, use subversion to create the CentOS
customization development line of web applications source code. For
example, using the above file system structure, you can create the
customization development line of <tt>`webapp1-0.0.1/'</tt> with the
following command:
</p>
<pre class="verbatim">svn cp trunk/WebApp1/Sources/webapp1-0.0.1 trunk/WebApp1/Sources/webapp1-0.0.1-webenv
</pre>
<p>The command above creates the following structure:
</p>
<pre class="verbatim">https://projects.centos.org/svn/webenv/trunk/
|-- WebApp1/
| |-- Sources/
| | |-- webapp1-0.0.1/
| | `-- webapp1-0.0.1-webenv/
| |-- Rpms/
| | `-- webapp1-0.0.1.rpm
| |-- Srpms/
| | `-- webapp1-0.0.1.srpm
| `-- Specs/
| `-- webapp1-0.0.1.spec
|-- WebApp2/
`-- WebAppN/
</pre>
<p>In the above structure, the <tt>`webapp1-0.0.1-webenv/'</tt> directory is
the place where you customize the visual style of
<tt>`webapp1-0.0.1/'</tt> web application.
</p>
<blockquote class="orange"><img src="/home/centos/artwork/trunk/Identity/Widgets/Img/icon-admonition-idea.png" alt="Info"><h3>Tip</h3><p> Use Subversion's <code>diff</code> between CentOS
customization and upstream development lines to know what you are
changing exactly.
</p></blockquote>
</dd>
<dt> <strong>Build packages</strong></dt>
<dd>
<p>When web application has been customized, build the web application
RPM and SRPM using the source location with <samp>`-webenv'</samp> prefix.
</p>
<pre class="verbatim">https://projects.centos.org/svn/webenv/trunk/
|-- WebApp1/
| |-- Sources/
| | |-- webapp1-0.0.1/
| | `-- webapp1-0.0.1-webenv/
| |-- Rpms/
| | |-- webapp1-0.0.1.rpm
| | `-- webapp1-0.0.1-webenv.rpm
| |-- Srpms/
| | |-- webapp1-0.0.1.srpm
| | `-- webapp1-0.0.1-webenv.srpm
| `-- Specs/
| |-- webapp1-0.0.1.spec
| `-- webapp1-0.0.1-webenv.spec
|-- WebApp2/
`-- WebAppN/
</pre>
</dd>
<dt> <strong>Release for testing</strong></dt>
<dd>
<p>When the customized web application has been packaged, make packages
available for testing and quality assurance. This can be achives using
a [webenv-test] yum repository.
</p>
<blockquote class="blue"><img src="/home/centos/artwork/trunk/Identity/Widgets/Img/icon-admonition-info.png" alt="info"><h3>Note</h3><p> The [webenv-test] repository is not shipped inside
CentOS distribution default yum configuraiton. In order to use
[webenv-test] repository you need to configure it first.
</p></blockquote>
<p>If some problem is found to install/update/use the customized version
of web application, the problem is notified somewhere (a bugtracker
maybe) and the customization face is repated in order to fix the
problem. To release the new package add a number after <samp>`-webenv'</samp>
prefix. For example, if some problem is found in
<tt>`webapp1-0.0.1-webenv.rpm'</tt>, when it be fixed the new package will
be named <tt>`webapp1-0.0.1-webenv-1.rpm'</tt>. If a problem is found in
<tt>`webapp1-0.0.1-webenv-1.rpm'</tt>, when it be fixed the new package
will be named <tt>`webapp1-0.0.1-webenv-2.rpm'</tt>, and so on.
</p>
<p>The "customization -- release for testing" process is repeated
until CentOS quality assurance team considers the package is ready for
production.
</p>
</dd>
<dt> <strong>Release for production</strong></dt>
<dd>
<p>When customized web application packages are considered ready for
production they are moved from [webenv-test] to [webenv] repository.
This action is commited by CentOS quality assurance team.
</p>
<blockquote class="blue"><img src="/home/centos/artwork/trunk/Identity/Widgets/Img/icon-admonition-info.png" alt="info"><h3>Note</h3><p> The [webenv] repository is not shipped inside CentOS
distribution default yum configuraiton. In order to use [webenv]
repository you need to configure it first.
</p></blockquote>
</dd>
</dl>
<a name="SEC58"></a>
<h4 class="subsubsection"> 3.8.2.6 The [webenv-test] repository </h4>
<pre class="verbatim">/etc/yum.repos.d/CentOS-Webenv-test.repo
</pre>
<pre class="verbatim">[webenv-test]
name=CentOS-$releasever - Webenv-test
mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=webenv-test
#baseurl=http://mirror.centos.org/centos/$releasever/webenv-test/$basearch/
gpgcheck=1
gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-$releasever
enabled=1
priority=10
</pre>
<a name="SEC59"></a>
<h4 class="subsubsection"> 3.8.2.7 The [webenv] repository </h4>
<pre class="verbatim">/etc/yum.repos.d/CentOS-Webenv.repo
</pre>
<pre class="verbatim">[webenv]
name=CentOS-$releasever - Webenv
mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=webenv
#baseurl=http://mirror.centos.org/centos/$releasever/webenv/$basearch/
gpgcheck=1
gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-$releasever
enabled=1
priority=10
</pre>
<a name="SEC60"></a>
<h4 class="subsubsection"> 3.8.2.8 Priority configuration </h4>
<p>Both [webenv] and [webenv-test] repositories update packages inside
CentOS [base] and CentOS [updates] repositories.
</p>
<a name="SEC61"></a>
<h4 class="subsubsection"> 3.8.2.9 Navigation </h4>
<p>Inside CentOS web environment, the one-step navegation between web
applications is addressed using the web environment navigation bar.
The web environment navigation bar contains links to main applications
and is always visible no matter where you are inside the web
environment.
</p>
<div class="float"><a name="fig_003aturnk_002fIdentity_002fModels_002fTpl_002fPromo_002fWeb_002fnavigation"></a>
<p><img src="/home/centos/artwork/trunk/Identity/Models/Img/Promo/Web/navigation.png" alt="The CentOS web navigation design model">
</p></div><p><strong>Figure 3.3: The CentOS web navigation design model.
</strong>
</p>
<a name="SEC62"></a>
<h3 class="subsection"> 3.8.3 Usage </h3>
<ul class="toc">
<li> ...
</li></ul>
<a name="SEC63"></a>
<h3 class="subsection"> 3.8.4 See also </h3>
<table class="menu" border="0" cellspacing="0">
<tr><td align="left" valign="top"><a href="repository_10.html#SEC45">3.7 trunk/Identity/Models/Img/Promo/Web</a></td><td> </td><td align="left" valign="top">
</td></tr>
</table>
<table cellpadding="1" cellspacing="1" border="0">
<tr><td valign="middle" align="left">[<a href="#SEC62" title="Previous section in reading order"> < </a>]</td>
<td valign="middle" align="left">[<a href="repository_12.html#SEC64" title="Next section in reading order"> > </a>]</td>
<td valign="middle" align="left"> </td>
<td valign="middle" align="left">[<a href="repository_3.html#SEC3" title="Beginning of this chapter or previous chapter"> << </a>]</td>
<td valign="middle" align="left">[<a href="#SEC50" title="Up section"> Up </a>]</td>
<td valign="middle" align="left">[<a href="repository_62.html#SEC320" title="Next chapter"> >> </a>]</td>
</tr></table>
<p>
<font size="-1">
This document was generated on <i>October, 2 2010</i> using <a href="http://texi2html.cvshome.org/"><i>texi2html 1.76</i></a>.
</font>
<br>
</p>
</body>
</html>