attempt at CSS-ing.

eprochasson · Jul 17, 2013 · 6a6f27f · 6a6f27f
1 parent 1b93578
commit 6a6f27f
Show file tree

Hide file tree

Showing 13 changed files with 104 additions and 57 deletions.
diff --git a/.meteor/packages b/.meteor/packages
@@ -19,3 +19,4 @@ spin
 publish-with-relations
 paginated-subscription
 filepicker
+less
diff --git a/TODO b/TODO
@@ -2,12 +2,15 @@ Browse/search users
 User geolocalisation.
 
 Make sure logout users are redirected to the front page, always.
-Make sure non login users don't get much subscription nor database insert.
+
 Check user security: do not allow user to change all their profile.
 Check filepicker secret/security thingy. Not sure it's cool.
 
 
 Setting page
 
-Thing needs serious design work.
-Complete Lexicon...
+Thing needs serious design work. Finish notification template (for single notification)
+Complete Lexicon...
+
+Subscription process + email validation.
+Check input security (not too long, invalid characters, injection...).
diff --git a/client/css/style.less b/client/css/style.less
@@ -0,0 +1,11 @@
+
+// Mixins
+.border-box{
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+body {
+  font-family:  'Karla', sans-serif;
+}
diff --git a/client/lexicon/lexicon.js → client/helpers/lexicon.js b/client/lexicon/lexicon.js → client/helpers/lexicon.js
@@ -45,4 +45,8 @@ Meteor.i18nMessages.messages = {
 
 Meteor.i18nMessages.button = {
     close: 'Close'
+};
+
+Meteor.i18nMessages.friends = {
+    friends_online: 'Friends online'
 };
diff --git a/client/helpers/presence.js b/client/helpers/presence.js
@@ -17,10 +17,11 @@ Meteor.Presence = {
 // Update last seen date.
 Meteor.autorun(function(){
     Session.get('last-presence-at'); // Just to hit the context.
-
-    Meteor.call('setUserPresence', function(err,res){
-        if(err){
-            console.log('setUserPresence: huho');
-        }
-    })
+    if(Meteor.userId()){
+        Meteor.call('setUserPresence', function(err,res){
+            if(err){
+                console.log('setUserPresence: huho');
+            }
+        })
+    }
 });
diff --git a/client/main.html b/client/main.html
@@ -1,5 +1,6 @@
 <head>
     <title>Socialite</title>
+    <link href='http://fonts.googleapis.com/css?family=Karla:400,400italic,700' rel='stylesheet' type='text/css'>
 </head>
 <body>
 

diff --git a/client/main.js b/client/main.js
@@ -1,21 +1,29 @@
 Meteor.startup(function(){
-    // All my data
-    Meteor.subscribe('myData', function(){
-        Session.set('settings', Meteor.user().settings||{});
-    });
-    Meteor.subscribe('myPictures');
-    Meteor.subscribe('myNotifications');
 
-        Meteor.subscribe('myFriendList');
+    Deps.autorun(function(){
+        // All my data. Provide only to logged-in users.
+        if(!Meteor.loggingIn() && Meteor.userId()){
+            Meteor.subscribe('myData', function(){
+                Session.set('settings', Meteor.user().settings||{});
+            });
+            Meteor.subscribe('myPictures');
+            Meteor.subscribe('myNotifications');
+
+            Meteor.subscribe('myFriendList');
+            myNewsFeedHandle = Meteor.subscribeWithPagination('myNewsfeed', Newsfeed.activitiesPerPage);
 
-    myNewsFeedHandle = Meteor.subscribeWithPagination('myNewsfeed', Newsfeed.activitiesPerPage);
+            // My conversations
+            conversationsHandle = Meteor.subscribeWithPagination('myConversations', 3);
 
-    // My conversations
-    conversationsHandle = Meteor.subscribeWithPagination('myConversations', 3);
+            oneConversationHandle = Meteor.subscribeWithPagination('oneConversation', function(){
+                return Session.get('currentConversation') || null;
+            }, Messages.messagePerPage);
 
-    oneConversationHandle = Meteor.subscribeWithPagination('oneConversation', function(){
-        return Session.get('currentConversation') || null;
-    }, Messages.messagePerPage);
+            // Questions for the profile form.
+            Meteor.subscribe('questions');
+
+        }
+    });
 
     // When visiting someone's profile
     Deps.autorun(function () {
@@ -26,8 +34,5 @@ Meteor.startup(function(){
         }, Activities.activitiesPerPage);
     });
 
-    // Questions for the profile form.
-    Meteor.subscribe('questions');
-
 //    Meteor.subscribe('adminShowEveryone');
 });
diff --git a/client/views/home/home.html b/client/views/home/home.html
@@ -1,6 +1,11 @@
 <template name="home">
 
-    {{> newsfeed}}
-    {{> online_friends}}
+
+    <div class="span9">
+        {{> newsfeed}}
+    </div>
+    <div class="span3 pull-right">{{> online_friends}}</div>
+
+
 
 </template>
diff --git a/client/views/includes/header.html b/client/views/includes/header.html
@@ -7,23 +7,28 @@
                 <li class="{{activeRouteClass 'profile'}}">
                     <a href="{{profilePath}}">Profile</a>
                 </li>
-                <li class="{{activeRouteClass 'settings'}}">
-                    <a href="{{settingsPath}}">Settings</a>
+                <li class="{{activeRouteClass 'profile'}}">
+                    <a href="{{searchPath}}"><i class="icon-search"> </i></a>
                 </li>
 
-                {{#if currentUser}}
+            </ul>
+            {{/if}}
+            <ul class="nav pull-right">
                 <li class="dropdown">
                     {{> mailbox_header}}
                 </li>
                 <li class="dropdown">
                     {{> notifications}}
                 </li>
-                {{/if}}
-            </ul>
-            {{/if}}
-            <ul class="nav pull-right">
+
                 <li>{{loginButtons}}</li>
+                {{#if currentUser}}
+                <li class="{{activeRouteClass 'settings'}}">
+                    <a href="{{settingsPath}}"><i class="icon-cog"> </i></a>
+                </li>
+                {{/if}}
             </ul>
+
         </div>
     </header>
 </template>
diff --git a/client/views/newsfeed/newsfeed.html b/client/views/newsfeed/newsfeed.html
@@ -1,10 +1,12 @@
 <template name="newsfeed">
-    <h2>Newsfeed</h2>
-    <ul>
-    {{#each news}}
-    {{> news}}
-    {{else}}
-    Nothing to show here
-    {{/each}}
-    </ul>
+    <div class="newsfeed widget">
+        <h2>Newsfeed</h2>
+        <ul class="unstyled">
+        {{#each news}}
+        {{> news}}
+        {{else}}
+        Nothing to show here
+        {{/each}}
+        </ul>
+    </div>
 </template>
diff --git a/client/views/widgets/online_friends.html b/client/views/widgets/online_friends.html
@@ -1,20 +1,23 @@
 <template name="online_friends">
-
-    <h2>Online Users</h2>
-    {{#if count}}
-    You have {{count}} friend(s) online
-    <ul>
-        {{#with onlinefriends}}
-        {{#each friends}}
-            {{> online_friend}}
-        {{/each}}
-        {{/with}}
-    </ul>
-    {{else}}
-    No friend online
-    {{/if}}
+    <div class="online-user widget">
+        <h2>{{Lex 'friends.friends_online'}}</h2>
+        {{#if count}}
+        <ul class="unstyled">
+            {{#with onlinefriends}}
+            {{#each friends}}
+                {{> online_friend}}
+            {{/each}}
+            {{/with}}
+        </ul>
+        {{else}}
+        No friend online
+        {{/if}}
+    </div>
 </template>
 
 <template name="online_friend">
-    <li><img src="{{thumbnail profile.picture 100 100 'max'}}" /><a href="{{profilePath}}/{{_id}}">{{profile.name}}</a> is online (<a class="startChat" href="#">chat</a>)</a></li>
+    <li>
+        <img src="{{thumbnail profile.picture 30 30 'crop'}}" />
+        <a href="{{profilePath}}/{{_id}}">{{profile.name}}</a>
+    </li>
 </template>
diff --git a/server/publications.js b/server/publications.js
@@ -72,6 +72,9 @@ Meteor.publish('myNewsfeed', function(limit){
 });
 
 Meteor.publish("oneConversation", function(conversation, limit){
+    if(!this.userId){
+        return;
+    }
     if(conversation){
         var conv = Conversations.findOne(conversation);
         if(conv.owner == this.userId){
@@ -98,6 +101,9 @@ Meteor.publish("oneConversation", function(conversation, limit){
 Meteor.publish("myFriendList", function(limit){
     // load a very light version of the friendlist
     // Not very reactive.
+    if(!this.userId){
+        return;
+    }
 
     if(this.userId){
         Meteor.publishWithRelations({

diff --git a/test/unit/client/message.js b/test/unit/client/message.js