fix the CSS and add pretty colors

jrockway · Sep 5, 2007 · 555bca1 · 555bca1
1 parent 2a1a896
commit 555bca1
Show file tree

Hide file tree

Showing 6 changed files with 87 additions and 67 deletions.
diff --git a/Makefile.PL b/Makefile.PL
@@ -9,10 +9,20 @@ requires 'Catalyst::Plugin::Static::Simple';
 requires 'Catalyst::Action::RenderView';
 requires 'YAML';
 requires 'DateTime';
-requires 'Catalyst::View::Template::Declare';
+requires 'Catalyst::View::Template::Declare' => '0.02';
 requires 'Catalyst::Model::DBIC::Schema';
+requires 'DBIx::Class';
 requires 'DBD::SQLite';
 requires 'DateTime::Format::MySQL';
+requires 'Catalyst::Controller::BindLex';
+requires 'Catalyst::Controller::FormBuilder';
+requires 'Catalyst::Plugin::Authentication::Credential::OpenID' => '0.03';
+requires 'Catalyst::Plugin::Authentication' => '0.10';
+requires 'Catalyst::Plugin::Authentication::Store::DBIx::Class';
+requires 'Graphics::ColorUtils';
+
+build_requires 'Test::TableDriven';
+build_requires 'Test::More';
 
 catalyst;
 

diff --git a/lib/DoQueue/Controller/Queue.pm b/lib/DoQueue/Controller/Queue.pm
@@ -26,7 +26,7 @@ sub queue_setup :Chained('/') PathPart('queue') CaptureArgs(1) {
 
 sub display :Chained('queue_setup') PathPart('display') Args(0) {
     my ($self, $c) = @_;
-    $c->stash->{template} = 'show_queue';
+    $c->view->template('queue/show');
 }
 
 1;
diff --git a/lib/DoQueue/Controller/Queue/Add.pm b/lib/DoQueue/Controller/Queue/Add.pm
@@ -20,8 +20,8 @@ sub add_with_form :Path('/queue/add') Args(0) Form('add_task') {
     if ($task && !$parses) {
         $c->stash->{error} = 'There was an error parsing the task.';
     }
-
-    $c->view->template('add_task_form');
+    
+    $c->view->template('queue/add/task');
 }
 
 sub add_from_args :Path('/queue/add') Args(1) {
@@ -31,6 +31,7 @@ sub add_from_args :Path('/queue/add') Args(1) {
     my $task = eval {
         $user->add_task($task_def);
     };
+
     if (ref $@ && $@->isa('DoQueue::Error::User')){
         $c->flash->{error} = "There was an error parsing the task.";
         $c->res->redirect($c->uri_for('/queue/add'));

diff --git a/lib/DoQueue/View/TD/AddTask.pm b/lib/DoQueue/View/TD/AddTask.pm
@@ -7,7 +7,7 @@ use warnings;
 use Template::Declare::Tags;
 use DoQueue::View::TD::Wrapper;
 
-template 'add_task_form' => sub {
+template 'queue/add/task' => sub {
     wrapper {
         outs_raw(c->stash->{FormBuilder}->render);
     };

diff --git a/lib/DoQueue/View/TD/Queue.pm b/lib/DoQueue/View/TD/Queue.pm
@@ -4,19 +4,31 @@ use warnings;
 
 use DoQueue::View::TD::Wrapper;
 use Template::Declare::Tags;
+use Graphics::ColorUtils;
 
+my %colors;
+my $i = 1;
 sub fmt_metadata($) {
     my $metadata = shift;
     return if keys %$metadata == 0;
 
-    div {
+    span {
         attr { class => 'task_metadata'};
         ul {
+            attr { class => 'metadata' };
             foreach my $key (keys %$metadata){
-                li {
-                    my $values = join ', ', @{$metadata->{$key}};
-                    "$key: $values";
-                };
+                foreach my $value (@{$metadata->{$key}}){
+                    my $color = 
+                      $colors{"$key|$value"} ||= 
+                        hsv2rgb((51*$i++)%360, .3, 1);
+                    li {
+                        span {
+                            attr { class => "one_metadata",
+                                   style => "background-color: $color"};
+                            "$key: $value";
+                        }
+                    }
+                }
             }
         };
     };
@@ -27,6 +39,7 @@ sub fmt_task($) {
     div { 
         attr { class => 'task' }; 
         span {
+            no warnings 'uninitialized';
             my $class = 'task_text';
             $class .= ' added' if $task->id == c->stash->{added_id};
 
@@ -66,24 +79,36 @@ sub add_task_form() {
     }
 }
 
-template show_queue => sub {
+template 'queue/show' => sub {
+    # reset colors;
+    %colors = ();
+    $i = 1;
     wrapper {
         my $user = c->stash->{user}->username ."'s";
         $user = 'your' if c->stash->{user}->id == c->user->id; 
         p { "Here's $user doqueue." };
 
-        my @tasks = @{c->stash->{tasks}};
-        if (@tasks) {
-            ul {
-                foreach my $task (@tasks) {
-                    li { fmt_task $task }
-                }
-            };
-        }
-        else {
-            p { "Your life is meaningless!  You have nothing to do!" }
-        }
-       add_task_form;
+        div {
+            attr { id => 'my_queue' };
+            my @tasks = @{c->stash->{tasks}};
+            if (@tasks) {
+                ul {
+                    foreach my $task (@tasks) {
+                        li { 
+                            fmt_task $task;
+                            p {
+                                attr { class => 'task_links' };
+                                "Here are the links";
+                            }
+                        }
+                    }
+                };
+            }
+            else {
+                p { "Your life is meaningless!  You have nothing to do!" }
+            }
+        };
+        add_task_form;
     }
 };
 

diff --git a/root/static/main.css b/root/static/main.css
@@ -4,42 +4,6 @@
 
 h2 { margin: 0 }
 
-span.positive_score {
-    color: green; 
-}
-span.negative_score {
-    color: red;   
-}
-a.thing {
-    color: black; 
-    text-decoration: none; 
-}
-
-.pair {
-    width: 30em;
-}
-.pair h3 {
-    margin: 0; 
-    padding: 0; 
-}
-.box   {
-    width: 47%; 
-}
-.pair .left  {
-    float: left;  
-}
-.pair .right {
-    float: right; 
-}
-
-.clearfix:after {
-    content: ".";
-    display: block;
-    height: 0px;
-    clear: both;
-    visibility: hidden;
-}
-
 #logos {
     padding-top: 2em;
 }
@@ -48,13 +12,6 @@ a.thing {
     border: none;
 }
 
-.written_by:before {
-   content: "--";
-}
-.written_by {
-   font-size: 85%;
-}
-
 .opinion_reason:before {
    content: "\"";
 }
@@ -101,4 +58,31 @@ a.thing {
 
 .added {
   background-color: #ff0;
-}
+}
+
+
+ul.metadata {
+    display: inline;
+}
+ul.metadata li {
+    display: inline;
+}
+
+.one_metadata {
+    background: #eee;
+    border: 1px solid #ddd;
+}
+
+#my_queue ul {
+    list-style-type: none;
+    padding: 0;
+    margin: 0 0 0 1em;
+}
+
+#my_queue ul li {
+    padding: 0 0 .6em 0;
+    margin: 0 0 0 0;
+}
+
+.task_text { font-size: 1.3em; }
+.task_links { margin: 0; padding: 0; font-size: .7em; }