add CSS and refactor to new file

config/application.yml

@@ -0,0 +1,151 @@
+#   Copyright (c) 2011, Diaspora Inc.  This file is
+#   licensed under the Affero General Public License version 3 or later.  See
+#   the COPYRIGHT file.
+
+defaults: &defaults
+
+  # Hostname of the machine you're running Diaspora on, as seen from the internet.
+  # For development and testing, you can leave this as is.
+  pod_url: "http://localhost:3000"
+
+  # Set this to true to prevent people from signing up for your pod without an invitation.
+  registrations_closed: false
+
+  # Set this to true to prevent users from sending invitations.
+  invites_off: false
+
+  #
+  # Logging setup
+  #
+
+  # Enable extensive logging to log/{development,test,production}.log
+  debug: false
+
+  # If you want normal Rails logs, set this to false in the appropriate environment.
+  # It is false by default in development and test.
+  enable_splunk_logging: true
+
+  #
+  # Websocket server setup - see script/websocket_server.rb
+  #
+
+  # Enable extensive logging to websocket server.
+  socket_debug : false
+
+  # Websocket host - leave as 0.0.0.0 unless you know what you are doing
+  socket_host: 0.0.0.0
+
+  # File containing pid of running script/websocket_server.rb
+  socket_pidfile: "log/diaspora-wsd.pid"
+
+  # Websocket port - should normally be 8080 or 8081.
+  socket_port: 8090
+  socket_collection_name: 'websocket'
+
+  # Secure websocket confguration (wss://).
+  # Requires SSL cert and key
+  socket_secure: false
+  socket_cert_chain_location: '/full/path/to/cert_chain.crt'
+  socket_private_key_location: '/full/path/to/file.key'
+
+  #
+  # Federation setup
+  #
+
+  # Diaspora is only tested against this default pubsub server. You probably don't want to change this.
+  pubsub_server: 'https://pubsubhubbub.appspot.com/'
+
+  #
+  # Email setup
+  #
+
+  # Setting this to true enables Diaspora's "send email" functionality,
+  # requiring meaningful smtp_* settings. These are options for RoR's
+  # ActionMailer class.
+  mailer_on: false
+
+  # This chooses which mailer should be used. 'smtp' for a smtp
+  # connection or 'sendmail' to use the sendmail binary.
+  mailer_method: 'smtp'
+
+  # Address/port to smtp server handling outgoing mail.
+  smtp_address: 'smtp.example.com'
+  smtp_port: '587'
+
+  # Domain of smtp server.
+  smtp_domain: 'example.com'
+
+  # Sender address in Diaspora's outgoing mail.
+  smtp_sender_address: 'no-reply@joindiaspora.com'
+
+  # Authentication required to send mail. Use one of 'one', 'plain',
+  # 'login' or 'cram-md5'. Use 'none' if server does not support
+  # authentication
+  smtp_authentication: 'plain'
+
+  # Automatically enable TLS? Ignored if smtp_authentication is set to none
+  smtp_starttls_auto: true
+
+  # Credentials to log in to the SMTP server - may be necessary if
+  # smtp_authentication is not 'none'
+  smtp_username: 'smtp_username'
+  smtp_password: 'secret'
+
+  # The path to the sendmail binary.
+  sendmail_location: '/usr/sbin/sendmail'
+
+  #
+  # Web tracking setup
+  #
+
+  # google analytics key - if false, no javascript included
+  google_a_site: false
+
+  # piwik integration - if not set, no javascript included
+  piwik_id:
+  # the site url in raw format (e.g. pikwik.examplehost.com)
+  piwik_url:
+
+  #
+  # Miscellaneous setup
+  #
+
+  # cloudfiles username and api-key - used for backups
+  cloudfiles_username: 'example'
+  cloudfiles_api_key:  'abc123'
+
+  # List of users who have admin privileges
+  admins:
+    - 'example_user1dsioaioedfhgoiesajdigtoearogjaidofgjo'
+
+  # s3 config - if set, carrierwave will store your photos on s3. Otherwise they're on the filesystem.
+  #s3_key: 'key'
+  #s3_secret: 'secret'
+  #s3_bucket: 'my_photos'
+  s3_region: 'us-east-1'
+
+  # Set this to true if you want to do everything synchronously instead of using resque, our redis-backed queue system.
+  single_process_mode: true
+
+
+# Use this section to override default settings in specific environments
+development:
+  <<: *defaults
+  enable_splunk_logging: false
+
+production:
+  <<: *defaults
+  single_process_mode: false
+
+  # Setting the root certificate bundle (this is operating system specific). Defaults:
+  # CentOS: '/etc/pki/tls/certs/ca-bundle.crt'
+  # Debian: '/etc/ssl/certs/ca-certificates.crt'
+  ca_file: '/etc/pki/tls/certs/ca-bundle.crt'
+
+# Do not touch unless you know what you're doing
+test:
+  <<: *defaults
+  pod_url: "http://example.org"
+  socket_port: 8081
+  enable_splunk_logging: false
+

config/assets.yml

@@ -33,6 +33,7 @@ javascripts:
     - public/javascripts/widgets/infinite-scroll.js
     - public/javascripts/widgets/directionDetector.js
     - public/javascripts/widgets/notifications.js
+    - public/javascripts/widgets/notifications-badge.js
     - public/javascripts/widgets/flashes.js
     - public/javascripts/widgets/post.js
     - public/javascripts/view.js

public/javascripts/diaspora.js

@@ -35,42 +35,7 @@
         this.collection[widgetId].start();
       }
     };
-    $("#notification_badge a").click(function(event){
+  
-      event.preventDefault();
-      $.ajax({
-        "url":"/notifications",
-        "success":function(data){
-          $("#notifications_overlay").show();
-          var hash = eval("(" + data + ")");
-          var notifications_element =  $("#notifications_overlay .notifications");
-          var day_element_template = $("#notifications_overlay .day_group").clone();
-          day_element_template.find(".notifications_for_day").empty();
-          var stream_element_template = $("#notifications_overlay .stream_element").clone();
-          notifications_element.empty();
-          $.each(hash["group_days"], function(day){
-            var day_element = day_element_template.clone();
-            day_element.find(".month").text(day.split(" ")[0])
-            day_element.find(".day").text(day.split(" ")[1])
-            var notifications_for_day = hash["group_days"][day]
-            var notifications_for_day_element = day_element.find('.notifications_for_day');
-            $.each(notifications_for_day, function(i, notification_hash){
-              $.each(notification_hash, function(notification_type, notification){
-                var stream_element = stream_element_template.clone();
-                console.log(notification_type);
-                console.log(notification);
-                stream_element.find(".actor").
-                  text(notification["actors"][0]["name"]).
-                  attr("href", notification["actors"][0]["url"]);
-                console.log(notification["created_at"]);
-                stream_element.find('time').text(notification["created_at"]);
-                notifications_for_day_element.append(stream_element);
-              });
-            });
-            notifications_element.append(day_element);
-          })
-        }
-      });
-    });
   };
 
   Diaspora.WidgetCollection.prototype.subscribe = function(id, callback, context) {
@@ -88,4 +53,3 @@
 
 
 $(document).ready(function() { Diaspora.widgets.init(); });
-

public/javascripts/templates/notification-badge.mustache

@@ -0,0 +1,25 @@
+<div class="span-24 last" id="notifications_overlay">
+  <div class="stream notifications">
+      {{# group_days}}
+      
+        <div class="day_group span-24 last">
+            <div class="span-3">
+              <div class="date">
+                <div class="day">20</div>
+                <div class="month">June</div>
+              </div>
+            </div>
+            <div class="span-8 notifications_for_day"><div class="stream_element">
+                <div class="right"></div>
+                <span class="from">
+                  <a href="/people/1" class="actor">Alice Smith</a>
+                  <a href="#" class="object"></a>
+                </span>
+                <br>
+                <time>2011-06-20T20:20:55Z</time>
+              </div></div>
+          </div></div>
+      </div>
+      {{/ group_days}}
+  </div>
+</div>

public/javascripts/widgets/notifications-badge.js

@@ -0,0 +1,34 @@
+(function() {
+  $("#notification_badge a").live("click", function(event){
+    event.preventDefault();
+    $.getJSON("/notifications", function(hash) {
+      $("#notifications_overlay").show();
+      var notificationsElement =  $("#notifications_overlay .notifications");
+      var dayElementTemplate = $("#notifications_overlay .day_group").clone();
+      dayElementTemplate.find(".notifications_for_day").empty();
+      var streamElementTemplate = $("#notifications_overlay .stream_element").clone();
+      notificationsElement.empty();
+      $.each(hash["group_days"], function(day){
+        var dayElement = dayElementTemplate.clone();
+        var dayParts = day.split(" ");
+        dayElement.find(".month").text(dayParts[0])
+        dayElement.find(".day").text(dayParts[1])
+        var notificationsForDay = hash["group_days"][day],
+          notificationsForDayElement = dayElement.find('.notifications_for_day');
+          
+        $.each(notificationsForDay, function(i, notificationHash) {
+          $.each(notificationHash, function(notificationType, notification) {
+            var actor = notification.actors[0];
+            var streamElement = streamElementTemplate.clone().appendTo(notificationsForDayElement);
+            streamElement.find(".actor")
+              .text(actor.name)
+              .attr("href", notification.actors[0]["url"]);
+            streamElement.find('time').text(notification["created_at"]);
+          });
+        });
+        notificationsElement.append(dayElement);
+      });
+    });
+  });
+  
+})();

public/stylesheets/sass/application.sass

@@ -3055,3 +3055,13 @@ ul#left_nav
     :height 30px
     :width 30px
 
+#notifications_overlay
+  display: none
+  position: absolute
+  border: 4px solid black
+  background-color: white
+  width: 700px
+  padding: 10px
+  top: 75.5px
+  left: 217.5px
+