Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Initial prototyping, dashboard page

  • Loading branch information...
commit d93ce2171315fd9cb52f266aed9433a41ff94442 0 parents
@caseman authored
11 .gitignore
@@ -0,0 +1,11 @@
+MANIFEST
+build
+dist
+doc/build
+doc/tutorial
+env
+*.pyc
+*.egg
+*.egg-info
+.coverage
+.DS_Store
0  README
No changes.
117 proto/dashboard.html
@@ -0,0 +1,117 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Super Sample App - Johnny5 Dashboard</title>
+ <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
+
+ <link rel="stylesheet" href="j5.css" type="text/css" media="screen" charset="utf-8">
+</head>
+<body>
+ <div class="top-bar">
+ <h1>
+ <!--<img src="icons/johnny5.jpg" width="42" height="42" />-->
+ &nbsp;
+ Super Sample App
+ </h1>
+ <div class="actions">
+ <img src="icons/run.png" title="Run App" width="32" height="32"/>
+ &nbsp;&nbsp;<img src="icons/undo.png" title="Undo Changes" width="32" height="32"/>
+ &nbsp;&nbsp;<img src="icons/more.png" title="More Actions" width="32" height="32"/>
+ </div>
+ </div>
+ <br style="clear: both"/>
+
+ <div class="component">
+ <div class="title">
+ Views
+ <a href="#" class="help"><img src="icons/help.png" width="24" height="24" border="0" />
+ <span>more info</span>
+ </a>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/home-view.png"/>
+ <span class="name">Home</span>
+ <span class="descr">Initial application view</span>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/view.png"/>
+ <span class="name">Preferences</span>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/view.png"/>
+ <span class="name">View Document</span>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/view.png"/>
+ <span class="name">Edit Document</span>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/add.png" alt="Add view" />
+ <span class="action">Add a new view...</span>
+ </div>
+ </div>
+
+ <div class="component">
+ <div class="title">
+ Widgets
+ <a href="#" class="help"><img src="icons/help.png" width="24" height="24" border="0" />
+ <span>more info</span>
+ </a>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/widget.png"/>
+ <span class="name">Fancypants Text Editor</span>
+ <span class="descr">Text editor for styled text</span>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/widget.png"/>
+ <span class="name">Spellcheck</span>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/widget.png"/>
+ <span class="name">Disqus</span>
+ <span class="descr">Embeds comments hosted by Disqus</span>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/add.png" alt="Add view" />
+ <span class="action">Add a new widget...</span>
+ </div>
+ </div>
+
+ <div class="component">
+ <div class="title">
+ Stores
+ <a href="#" class="help"><img src="icons/help.png" width="24" height="24" border="0" />
+ <span>more info</span>
+ </a>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/local-store.png"/>
+ <span class="name">local web storage</span>
+ <span class="descr">HTML5 local storage (stored by browser)</span>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/file-store.png"/>
+ <span class="name">app-server</span>
+ <span class="descr">File server at <tt>app.supersample.org/app-server</tt></span>
+ <a href="#store,app-server" class="status">connected</a>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/remote-store.png"/>
+ <span class="name">super-sample-docs</span>
+ <span class="descr">Couchdb database server at <tt>docs.supersample.org</tt></span>
+ <a href="#store,super-sample-reports" class="status">connected</a>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/remote-store.png"/>
+ <span class="name">super-sample-reports</span>
+ <span class="descr">PostgreSQL database server at <tt>pgsql.supersample.org</tt></span>
+ <a href="#store,super-sample-reports" class="status">connected</a>
+ </div>
+ <div class="item">
+ <img class="icon" src="icons/add.png" alt="Add store" />
+ <span class="action">Add a new store...</span>
+ </div>
+ </div>
+</body>
+</html>
BIN  proto/icons/add.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/editor.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/file-store.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/gear.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/help.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/home-view.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/info.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/johnny5.jpg
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/local-store.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/more.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/plugin.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/remote-store.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/run.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/script.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/tools.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/undo.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/view.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/icons/widget.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
BIN  proto/images/background.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
131 proto/j5.css
@@ -0,0 +1,131 @@
+* {
+ margin: 0;
+}
+
+body {
+ font-family: 'Open Sans', helvetica, arial, sans-serif;
+ background: url('images/background.png');
+}
+
+.top-bar {
+ background-image: url("icons/johnny5.jpg");
+ background-repeat: no-repeat;
+ background-color: white;
+ border-bottom: 2pt solid #ccc;
+ height: 40px;
+ box-shadow: -5px 1px 15px #555;
+}
+
+h1 {
+ float: left;
+ margin: 5px;
+ font-size: 1.25em;
+ font-weight: 300;
+ -moz-border-radius: 16px;
+ -webkit-border-radius: 16px;
+ border-radius: 16px;
+ left: 4.5em;
+ position: relative;
+}
+
+.title {
+ padding: 5px;
+ background-color: #858F99;
+ font-size: 1.15em;
+ font-weight: 300;
+}
+
+.help {
+ float: right;
+ text-decoration: none;
+ font-size: 0.7em;
+ margin-right: 7px;
+}
+
+.help:hover {
+ text-decoration: underline;
+}
+
+.help span {
+ position: relative;
+ top: -0.6em;
+}
+
+.actions {
+ padding: 5px;
+ background: black;
+ -moz-border-radius: 0 0 0 18px;
+ -webkit-border-radius: 0 0 0 18px;
+ border-radius: 0 0 0 18px;
+ position: fixed;
+ right: 0%;
+ z-index: 999;
+ box-shadow: -1px 1px 10px #fff;
+}
+
+.component {
+ margin-left: 0.5em;
+ margin-right: 0.5em;
+ margin-bottom: 1em;
+ border: solid 2pt #aaa;
+ background-color: #cde;
+ -moz-border-radius: 8px;
+ -webkit-border-radius: 8px;
+ border-radius: 8px;
+ min-width: 300px;
+ max-width: 600px;
+ float: left;
+ box-shadow: 2px 2px 10px #bbb;
+}
+
+.component h2 {
+ margin: 0.25em;
+}
+
+.component .item {
+ padding: 0.25em;
+ border-top: 1pt solid #eee;
+ clear: both;
+ min-height: 68px;
+ background: #ccddee; /* Old browsers */
+ background: -moz-linear-gradient(top, #ccddee 0%, #bac9d8 100%); /* FF3.6+ */
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ccddee), color-stop(100%,#bac9d8)); /* Chrome,Safari4+ */
+ background: -webkit-linear-gradient(top, #ccddee 0%,#bac9d8 100%); /* Chrome10+,Safari5.1+ */
+ background: -o-linear-gradient(top, #ccddee 0%,#bac9d8 100%); /* Opera11.10+ */
+ background: -ms-linear-gradient(top, #ccddee 0%,#bac9d8 100%); /* IE10+ */
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccddee', endColorstr='#bac9d8',GradientType=0 ); /* IE6-9 */
+ background: linear-gradient(top, #ccddee 0%,#bac9d8 100%); /* W3C */
+}
+
+.component .item:hover {
+ background: #aaccee; /* Old browsers */
+ background: -moz-linear-gradient(top, #ccddee 0%, #aaccee 100%); /* FF3.6+ */
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ccddee), color-stop(100%,#aaccee)); /* Chrome,Safari4+ */
+ background: -webkit-linear-gradient(top, #ccddee 0%,#aaccee 100%); /* Chrome10+,Safari5.1+ */
+ background: -o-linear-gradient(top, #ccddee 0%,#aaccee 100%); /* Opera11.10+ */
+ background: -ms-linear-gradient(top, #ccddee 0%,#aaccee 100%); /* IE10+ */
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccddee', endColorstr='#aaccee',GradientType=0 ); /* IE6-9 */
+ background: linear-gradient(top, #ccddee 0%,#aaccee 100%); /* W3C */
+}
+
+.component .name {
+ display: block;
+ font-weight: bold;
+ margin-top: 0.5em;
+}
+
+.component .status {
+ display: block;
+}
+
+.component .icon {
+ float: left;
+ margin-right: 0.5em;
+}
+
+.component .action {
+ display: block;
+ font-weight: bold;
+ margin-top: 1.5em;
+}
+
Please sign in to comment.
Something went wrong with that request. Please try again.