[Checkins] SVN: grok/branches/ulif-adminui/src/grok/admin/ First
silly design-study for admin-UI.
Uli Fouquet
uli at mediamorphose.org
Sat Jun 2 23:03:09 EDT 2007
Log message for revision 76190:
First silly design-study for admin-UI.
Changed:
U grok/branches/ulif-adminui/src/grok/admin/README.txt
A grok/branches/ulif-adminui/src/grok/admin/static/
A grok/branches/ulif-adminui/src/grok/admin/static/Develop_btn.jpg
A grok/branches/ulif-adminui/src/grok/admin/static/Eval_btn.jpg
A grok/branches/ulif-adminui/src/grok/admin/static/Fire.gif
A grok/branches/ulif-adminui/src/grok/admin/static/GROK_Logo.jpg
A grok/branches/ulif-adminui/src/grok/admin/static/GROK_Ornament.jpg
A grok/branches/ulif-adminui/src/grok/admin/static/Highlight_Bkgrnd.jpg
A grok/branches/ulif-adminui/src/grok/admin/static/Learn_btn.jpg
A grok/branches/ulif-adminui/src/grok/admin/static/Sidebar_Bottom.jpg
A grok/branches/ulif-adminui/src/grok/admin/static/Sidebar_Middle.jpg
A grok/branches/ulif-adminui/src/grok/admin/static/Sidebar_Top.jpg
A grok/branches/ulif-adminui/src/grok/admin/static/grok.css
U grok/branches/ulif-adminui/src/grok/admin/view.py
U grok/branches/ulif-adminui/src/grok/admin/view_templates/index.pt
A grok/branches/ulif-adminui/src/grok/admin/view_templates/macros.pt
-=-
Modified: grok/branches/ulif-adminui/src/grok/admin/README.txt
===================================================================
--- grok/branches/ulif-adminui/src/grok/admin/README.txt 2007-06-03 02:55:07 UTC (rev 76189)
+++ grok/branches/ulif-adminui/src/grok/admin/README.txt 2007-06-03 03:03:09 UTC (rev 76190)
@@ -1,6 +1,9 @@
A basic grok admin UI
-====================
+=====================
+The internal name of the admin UI is:
+Grok Application Interface Application or, for short gaia.
+
Overview
--------
@@ -11,3 +14,29 @@
* "Delete application" form: checkboxes displayed with listed installed
applications. Selected items may be deleted.
+
+
+To Do
+-----
+
+* Better application handling
+
+ - Configure apps.
+
+* Maintenance tools
+
+ - Start/stop/restart Zope3.
+
+* Debugging tools
+
+ - Show error logs.
+
+* Introspection tool
+
+ - Give information concerning installed apps, their containers
+ and contained objects.
+
+* Nicer layout
+
+* AJAXification using some framework (MojiKit or KSS most probably)
+
Added: grok/branches/ulif-adminui/src/grok/admin/static/Develop_btn.jpg
===================================================================
(Binary files differ)
Property changes on: grok/branches/ulif-adminui/src/grok/admin/static/Develop_btn.jpg
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Added: grok/branches/ulif-adminui/src/grok/admin/static/Eval_btn.jpg
===================================================================
(Binary files differ)
Property changes on: grok/branches/ulif-adminui/src/grok/admin/static/Eval_btn.jpg
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Added: grok/branches/ulif-adminui/src/grok/admin/static/Fire.gif
===================================================================
(Binary files differ)
Property changes on: grok/branches/ulif-adminui/src/grok/admin/static/Fire.gif
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Added: grok/branches/ulif-adminui/src/grok/admin/static/GROK_Logo.jpg
===================================================================
(Binary files differ)
Property changes on: grok/branches/ulif-adminui/src/grok/admin/static/GROK_Logo.jpg
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Added: grok/branches/ulif-adminui/src/grok/admin/static/GROK_Ornament.jpg
===================================================================
(Binary files differ)
Property changes on: grok/branches/ulif-adminui/src/grok/admin/static/GROK_Ornament.jpg
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Added: grok/branches/ulif-adminui/src/grok/admin/static/Highlight_Bkgrnd.jpg
===================================================================
(Binary files differ)
Property changes on: grok/branches/ulif-adminui/src/grok/admin/static/Highlight_Bkgrnd.jpg
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Added: grok/branches/ulif-adminui/src/grok/admin/static/Learn_btn.jpg
===================================================================
(Binary files differ)
Property changes on: grok/branches/ulif-adminui/src/grok/admin/static/Learn_btn.jpg
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Added: grok/branches/ulif-adminui/src/grok/admin/static/Sidebar_Bottom.jpg
===================================================================
(Binary files differ)
Property changes on: grok/branches/ulif-adminui/src/grok/admin/static/Sidebar_Bottom.jpg
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Added: grok/branches/ulif-adminui/src/grok/admin/static/Sidebar_Middle.jpg
===================================================================
(Binary files differ)
Property changes on: grok/branches/ulif-adminui/src/grok/admin/static/Sidebar_Middle.jpg
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Added: grok/branches/ulif-adminui/src/grok/admin/static/Sidebar_Top.jpg
===================================================================
(Binary files differ)
Property changes on: grok/branches/ulif-adminui/src/grok/admin/static/Sidebar_Top.jpg
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Added: grok/branches/ulif-adminui/src/grok/admin/static/grok.css
===================================================================
--- grok/branches/ulif-adminui/src/grok/admin/static/grok.css (rev 0)
+++ grok/branches/ulif-adminui/src/grok/admin/static/grok.css 2007-06-03 03:03:09 UTC (rev 76190)
@@ -0,0 +1,384 @@
+/* @override http://www.urbantalk.se/DEVELOPER/grok_2/grok.css */
+
+body {
+ background: #ffe;
+ background: #eee;
+ ba/ckground: #bbb;
+ margin: 0px;
+ font-size: 13px;
+ font-family: verdana;
+ line-height: 20px;
+ color: #555555;
+
+}
+
+h1 {
+ font-size: 15px;
+ font-family: verdana;
+ line-height: 20px;
+ color: #CC9900;
+ width: 100%;
+ margin: 23px auto 8px auto;
+ border-bottom: 1px solid #CC9900;
+}
+h2 {
+ font-size: 13px;
+ font-family: verdana;
+ line-height: 20px;
+ color: #CC9900;
+ width: 100%;
+ margin: 16px auto 8px auto;
+ border-bottom: 1px dotted #cccccc;
+}
+h3 {
+ font-size: 12px;
+ font-family: verdana;
+ line-height: 12px;
+ color: #555555;
+ width: 100%;
+ margin: 16px auto -4px auto;
+}
+p {
+ font-size: 13px;
+ font-family: verdana;
+ line-height: 20px;
+ color: #555555;
+ wi/dth: 540px;
+ margin: 8px auto;
+}
+p.download {
+ font-size: 10px;
+ font-weight: normal;
+ font-family: verdana;
+ line-height: 18px;
+ color: #555555;
+ margin: 4px 12px;
+ width: 176px;
+
+}
+#menu {
+ font-size: 11px;
+ font-family: verdana;
+ line-height: 20px;
+ color: #A90101;
+}
+pre {
+ font-size: 11px;
+ font-family: courier;
+ line-height: 18px;
+ color: #A90101;
+ width: 540px;
+ margin: 8px auto;
+ padding: 16px 8px;
+ border-top: 1px solid #cccccc;
+ border-bottom: 1px solid #dddddd;
+ background: #eeeeee;
+}
+ul {
+ font-size: 11px;
+ font-family: verdana;
+ line-height: 20px;
+ color: #555555;
+ width: 540px;
+ margin: 16px auto;
+ list-style-type: none;
+}
+li {
+ margin: 0 50px 0 0;
+ left: 0;
+ padding: 0;
+}
+
+legend {
+ font-size: 12px;
+ font-family: verdana;
+ font-weight: bold;
+ line-height: 12px;
+ color: #555555;
+ color: #CC9900;
+ width: 100%;
+ margin: 16px auto -4px auto;
+}
+
+fieldset {
+ background: url("Highlight_Bkgrnd.jpg");
+ border: 1px solid #c90;
+ width: 550px;
+}
+
+a:link {
+ color: #555555;
+ text-decoration: none;
+ border-bottom-style: dotted;
+ border-bottom-width: 1px;
+}
+
+a:hover {
+ color: #CC9900;
+ border-bottom-style: dotted;
+ background-color: #ffffff;
+ border-width: 1px;
+}
+
+a:visited {
+ color: #555555;
+ text-decoration: none;
+ border-bottom-style: dotted;
+ border-bottom-width: 1px;
+}
+
+div#tag_cloud {
+ margin: 16px 0px;
+}
+
+.tag_cloud>p {
+ font-family: verdana;
+ font-size: 13px;
+ line-height: 22px;
+ color: #555555;
+ width: 100%;
+ margin: 0 8px 8px 8px;
+}
+
+.tag_cloud>a:link {
+ color: #F7DA4A;
+}
+
+.tag_cloud>h3 {
+ font-family: verdana;
+ font-size: 10px;
+ font-weight: normal;
+ line-height: 20px;
+ color: #cccccc;
+ width: 100%;
+ margin: 0 8px -4px 8px;
+}
+
+div.track {
+ margin: 0;
+ padding: 0;
+ w/idth: 257px;
+
+}
+
+.track>h2 {
+ padding: 0 8px;
+ font-size: 13px;
+ font-family: verdana;
+ line-height: 0px;
+ wi/dth: 253px;
+ border: none;
+}
+.track>a>p {
+ font-size: 13px;
+ font-family: verdana;
+ line-height: 20px;
+ color: #777777;
+ wi/dth: 249px;
+ margin: 0 2px;
+ padding: 3px 5px;
+}
+div.track>a>p:hover {
+ background-color: #ffffff;
+ color: #cc9900;
+}
+.track>p>a {
+ color: #555555;
+}
+.track>p>a:link {
+ border-style: none;
+}
+.track>p>a:hover {
+ background-color: #dddddd;
+ border-style: none;
+}
+
+.menu_img {
+ margin: 0;
+ border-width: 0;
+}
+.menu_link {
+ margin: 0;
+ border-width: 0;
+ border-style: none;
+}
+.menu_link:hover {
+ margin: 0;
+ border-width: 0;
+ border-style: none;
+}
+
+div#version_info {
+ margin: 32px 0px;
+}
+
+.version_info>p {
+ font-family: verdana;
+ font-size: 13px;
+ line-height: 22px;
+ color: #CC9900;
+ width: 100%;
+ margin: 0 8px 8px 8px;
+}
+
+.version_info>h3 {
+ font-family: verdana;
+ font-size: 10px;
+ font-weight: normal;
+ line-height: 20px;
+ color: #cccccc;
+ width: 100%;
+ margin: 0 8px;
+}
+div.feature {
+ w/idth: 538px;
+ min-height: 64px;
+ bac/kground: url('Highlight_Bkgrnd.jpg');
+ border-left: 1px solid #F7DA4A;
+ border-left: 1px solid #ddd;
+ bord/er-right: 1px solid #F7DA4A
+ border-right: 5px solid #ddd;
+}
+
+div.feature > p {
+ wi/dth: 522px;
+ min-height: 64px;
+ padding: 8px 8px 0 8px;
+ color: #888888;
+ margin: 0;
+}
+
+div.feature > p:hover {
+ bac/kground-color: #ffffff;
+ background: url('Highlight_Bkgrnd.jpg');
+ color: #cc9900;
+}
+
+div.feature_top {
+ width: 540px;
+ height: 7px;
+ background: url('Highlight_T.jpg') repeat-x
+}
+div.feature_bottom {
+ width: 540px;
+ height: 7px;
+ background: url('Highlight_B.jpg') repeat-x
+}
+
+img.track_button {
+ float: left;
+ border-width: 0;
+ margin-left: 6px;
+ margin-right: 16px;
+}
+
+div#sidebar > h1 {
+ padding: 5px auto 0 auto;
+ text-align: center;
+ color: #777;
+ font-family: verdana;
+ font-size: 12px;
+ font-weight: bold;
+ width: 264px; height: 27px;
+ background: url("Sidebar_Top.jpg") no-repeat;
+ border: none;
+ margin: 0;
+}
+
+img.sidebar_divider {
+ padding: 0 0 3px 0;
+}
+
+img.people {
+ float: left;
+ border: 0px solid #F7DA4A;
+}
+
+div#Breadcrumbs {
+ padding-left: 5px;
+ font-size: 15px;
+ font-family: verdana;
+ li/ne-height: 20px;
+ color: #CC9900;
+ po/sition: absolute;
+ l/eft: 10px;
+ font-style: verdana;
+ top: 89px;
+ wi/dth: 95%;
+ he/ight: 40px;
+ background: url("Highlight_Bkgrnd.jpg");
+ border-top: 1px solid #CC9900;
+}
+
+div#Content {
+ position: absolute;
+ left: 290px;
+ top: 91px;
+ m/in-width: 400px;
+ m/ax-width: 540px;
+}
+
+div#Fireplace {
+ position: absolute;
+ right: 0px;
+ top: 0px;
+ width: 136px;
+ height: 110px;
+}
+div#Banner {
+ height: 81px;
+ background: #eeeeee url("GROK_Ornament.jpg") repeat-x;
+}
+
+#Footer-marker {
+ text-align: center;
+ font-size: 10px;
+ color: #CC9900;
+ margin-top: 20px
+}
+#Footer-copyright {
+ text-align: right;
+ font-size: 11px
+}
+#Sidebar {
+ position: absolute;
+ left: 10px;
+ top: 112px;
+ width: 264px;
+ background: #dddddd url("Sidebar_Middle.jpg") repeat-y;
+}
+#SearchBox {
+ padding: 5px 8px;
+}
+
+input,select {
+ border: 1px solid #CC9900;
+ padding-left: 2px;
+}
+
+.button {
+ background-color: #ccc;
+ font-size: 12px;
+ padding: 0px;
+ border: groove #CC9900 2px;
+}
+
+a.button {
+ color: #000;
+ padding: 2px;
+ padding-top: 0px;
+ border-bottom: groove #CC9900 2px;
+}
+
+a:hover.button {
+ background-color: #ccc;
+ color: #000;
+ padding: 2px;
+ padding-top: 0px;
+ border: groove #CC9900 2px;
+ border-bottom: groove #CC9900 2px;
+}
+
+.checkbox {
+ border: groove #CC9900 2px;
+}
\ No newline at end of file
Modified: grok/branches/ulif-adminui/src/grok/admin/view.py
===================================================================
--- grok/branches/ulif-adminui/src/grok/admin/view.py 2007-06-03 02:55:07 UTC (rev 76189)
+++ grok/branches/ulif-adminui/src/grok/admin/view.py 2007-06-03 03:03:09 UTC (rev 76190)
@@ -15,10 +15,18 @@
self.applications = ("%s.%s" % (x.__module__, x.__name__)
for x in apps)
+class Macros(grok.View):
+ """Only to contain the standard macros."""
+ grok.context(IRootFolder)
+ pass
+
class Add(grok.View):
grok.require('grok.ManageApplications')
def render(self, application, name):
+ if name is None or name == "":
+ self.redirect(self.url(self.context))
+ return
app = zope.component.getUtility(grok.interfaces.IApplication,
name=application)
self.context[name] = app()
@@ -27,7 +35,10 @@
class Delete(grok.View):
grok.require('grok.ManageApplications')
- def render(self, items):
+ def render(self, items=None):
+ if items is None:
+ self.redirect(self.url(self.context))
+ return
if not isinstance(items, list):
items = [items]
for name in items:
Modified: grok/branches/ulif-adminui/src/grok/admin/view_templates/index.pt
===================================================================
--- grok/branches/ulif-adminui/src/grok/admin/view_templates/index.pt 2007-06-03 02:55:07 UTC (rev 76189)
+++ grok/branches/ulif-adminui/src/grok/admin/view_templates/index.pt 2007-06-03 03:03:09 UTC (rev 76190)
@@ -1,50 +1,50 @@
-<html>
- <head>
- <title>grok administration interface</title>
- </head>
+<html metal:use-macro="context/@@macros/gaia-page">
+ <div metal:fill-slot="content">
+ <h1>Grok Applications:</h1>
- <body tal:define="apps context/values">
- <h1>Grok Applications</h1>
-
<form tal:attributes="action string:${context/@@absolute_url}/delete"
- tal:condition="apps|nothing">
+ tal:condition="apps|nothing">
<fieldset>
- <legend>Installed applications</legend>
+ <legend>Installed applications</legend>
+ <div tal:repeat="app apps">
+ <input type="checkbox"
+ class="checkbox"
+ tal:attributes="value app/__name__;
+ name string:items" />
+ <a tal:attributes="href string:${context/@@absolute_url}/${app/__name__}">
+ <span tal:replace="app/__name__"/>
+ (<span tal:replace="app/__class__/__name__"/>)
+ </a>
+
+ <a href="" class="button">Inspect...</a>
+ </div>
- <ul>
- <li tal:repeat="app apps">
- <input type="checkbox" tal:attributes="value app/__name__;
- name string:items" />
- <a tal:attributes="href string:${context/@@absolute_url}/${app/__name__}">
- <span tal:replace="app/__name__"/>
- (<span tal:replace="app/__class__/__name__"/>)
- </a>
- </li>
- </ul>
-
- <p><input type="submit" value="Delete Selected"/></p>
- </fieldset>
+ <p><input class="button" type="submit" value="Delete Selected"/></p>
+ </fieldset>
</form>
<form tal:attributes="action string:${context/@@absolute_url}/add">
<fieldset>
- <legend>Add application</legend>
+ <legend>Add application</legend>
+
+ <p>
+ <label>Application:
+ <select height="1" name="application">
+ <option tal:repeat="app view/applications"
+ tal:attributes="value app"
+ tal:content="app"
+ />
+ </select>
+ </label>
+ <a href="" class="button">Tell me more about this app...</a>
+<!-- <input type="submit" class="button" value="Tell me more about this app..." /> -->
+ </p>
- <p>
- <label>Application:
- <select height="1" name="application">
- <option tal:repeat="app view/applications"
- tal:attributes="value app"
- tal:content="app"
- />
- </select>
- </label>
- </p>
+ <p><label>Name your new app: <input type="text" name="name"/></label></p>
+
+ <p><input class="button" type="submit" value="Add"/></p>
- <p><label>Name: <input type="text" name="name"/></label></p>
-
- <p><input type="submit" value="Add"/></p>
-
</fieldset>
</form>
- </body>
+ </div>
+
</html>
Added: grok/branches/ulif-adminui/src/grok/admin/view_templates/macros.pt
===================================================================
--- grok/branches/ulif-adminui/src/grok/admin/view_templates/macros.pt (rev 0)
+++ grok/branches/ulif-adminui/src/grok/admin/view_templates/macros.pt 2007-06-03 03:03:09 UTC (rev 76190)
@@ -0,0 +1,110 @@
+<html xmlns="http://www.w3.org/1999/xhtml"
+ metal:define-macro="gaia-page">
+ <head>
+ <title
+ metal:define-slot="title"
+ >grok administration interface</title>
+ <link metal:define-slot="header"
+ rel="stylesheet" type="text/css" href="static/grok.css"
+ tal:attributes="href view/static/grok.css" />
+ </head>
+
+ <body tal:define="apps context/values">
+ <div>
+ <div id="Banner">
+ <img alt="Grok" src="images/GROK_Logo.jpg"
+ tal:attributes="src view/static/GROK_Logo.jpg" />
+ </div>
+ <div id="Breadcrumbs">
+ Grok Admin Interface
+ </div>
+ <div id="Fireplace">
+ <img alt="Fire" src="images/Fire.gif"
+ tal:attributes="src view/static/Fire.gif" />
+ </div>
+ <div id="Content">
+ <div metal:define-slot="content">
+
+ <h1>Welcome to Grok!</h1>
+
+ <div>
+ Your friendly and easy way to Zope 3.
+ </div>
+
+ </div>
+ <p id="Footer-marker">
+ - <a href="http://grok.zope.org">GROK</a>|<a href="http://www.zope.org">ZOPE3</a> -</p>
+ <p id="Footer-copyright">© Copyright 2007, The Grok Community</p>
+
+ </div>
+
+
+ <div id="Sidebar" metal:define-slot="sidebar">
+ <h1>GROK Navigator</h1>
+
+ <div id="SearchBox">
+ <input type="text" value="Full-text search..." />
+ <input type="submit" class="button" value="Go" />
+ </div>
+
+ <img alt="---" class="sidebar_divider" src="Sidebar_Bottom.jpg"
+ tal:attributes="src view/static/Sidebar_Bottom.jpg" />
+
+ <a href="">
+ <div class="feature">
+ <p>
+ <img alt="Manage Zope3" src="Develop_btn.jpg" class="track_button"
+ tal:attributes="src view/static/Develop_btn.jpg" />
+ <b>Manage Zope3</b>: Manage your Zope3 Server
+ </p>
+ </div>
+ </a>
+
+<!--
+ <img alt="---" class="sidebar_divider" src="Sidebar_Bottom.jpg"
+ tal:attributes="src view/static/Sidebar_Bottom.jpg" />
+-->
+
+ <a href="">
+ <div class="feature">
+ <p>
+ <img alt="Debug" src="Eval_btn.jpg" class="track_button"
+ tal:attributes="src view/static/Eval_btn.jpg" />
+ <b>Debug</b> your Grok Applications.
+ </p>
+ </div>
+ </a>
+
+<!--
+ <img alt="---" class="sidebar_divider" src="Sidebar_Bottom.jpg"
+ tal:attributes="src view/static/Sidebar_Bottom.jpg" />
+-->
+
+ <a href="">
+ <div class="feature">
+ <p>
+ <img alt="Documentation" src="Learn_btn.jpg" class="track_button"
+ tal:attributes="src view/static/Learn_btn.jpg" />
+ <b>Documentation</b>: Learn all about Grok and friends.
+ </p>
+ </div>
+ </a>
+
+ <img alt="---" class="sidebar_divider" src="Sidebar_Bottom.jpg"
+ tal:attributes="src view/static/Sidebar_Bottom.jpg" />
+ <div class="version_info">
+ <h3>Current version:</h3>
+ <p>
+ This is just developer stuff and by no means ready for
+ production use.
+ </p>
+ </div>
+ <img src="images/Sidebar_Bottom.jpg"
+ tal:attributes="src view/static/Sidebar_Bottom.jpg" />
+ </div>
+
+ </div>
+
+
+ </body>
+</html>
More information about the Checkins
mailing list