Skip to content

Commit

Permalink
- Adding introduction message
Browse files Browse the repository at this point in the history 
- Adding more data & alternatives
  • Loading branch information
@jhuet
jhuet authored and Jan-Christoph Borchardt committed Jan 31, 2012
1 parent 8357bf3 commit a7dcb78
Show file tree
Hide file tree
Showing 10 changed files with 46 additions and 30 deletions.
22 changes: 12 additions & 10 deletions css/default.css
View file
Expand Up @@ -75,21 +75,23 @@ h3+p, h3+p+p, h3+p+p+p { color:#777; }

/* project details lightbox */
#project-details { display:none; font-size: .9em; }
#project-details .introduction a span { border: none; font-size: 1.1em; padding-left: 10px; }
#project-details .introduction a img { height: 70px; width: 70px; }
#project-details .introduction p { float:left; margin-top: 0; }
#project-details .introduction p.cat-desc { margin-top: 23px; }
#project-details .introduction p.cat-desc span { padding-left: 10px; margin-left: 10px; border-left: 1px dotted #FFF; }
#project-details .introduction .tags { position:absolute; left: 95px; top: 60px;; font-size: 0.8em; }
#project-details .introduction .tags li { padding-right: 5px; }
#project-details .header a span { border: none; font-size: 1.1em; padding-left: 10px; }
#project-details .header a img { height: 70px; width: 70px; }
#project-details .header p { float:left; margin-top: 0; }
#project-details .header p.cat-desc { margin-top: 23px; }
#project-details .header p.cat-desc span { padding-left: 10px; margin-left: 10px; border-left: 1px dotted #FFF; }
#project-details .header .tags { position:absolute; left: 95px; top: 60px;; font-size: 0.8em; }
#project-details .header .tags li { padding-right: 5px; }

#project-details .label { clear: both; float: left; width: 100px; }
#project-details .details { clear: both; }
#project-details .introduction { font-size: 0.8em; line-height: 1.3em; }
#project-details .alternative-to a,
#project-details .similar-to a { padding: 12px 7px 15px 7px; }
#project-details .alternative-to img,
#project-details .similar-to img { width: 35px; height: 35px; }

#project-details .text {
#project-details .tip {
display: none;
font-size: 1.1em;
font-weight: bold;
Expand All @@ -102,8 +104,8 @@ h3+p, h3+p+p, h3+p+p+p { color:#777; }
left: 0;
padding: 10px 10px;
}
#project-details .text a { color: #888; }
#project-details .text a:hover, #project-details .text a:focus { color:#fff; }
#project-details .tip a { color: #888; }
#project-details .tip a:hover, #project-details .tip a:focus { color:#fff; }

#simplemodal-overlay { background-color:#000; }
#simplemodal-container { background-color:#333; border:8px solid #444; padding:12px; border-radius:.5em; }
5 changes: 3 additions & 2 deletions index.html
View file
Expand Up @@ -42,17 +42,18 @@ <h3 id="participate"><a href="#participate" class="translatable">Participate</a>
</footer>

<div id="project-details">
<div class="introduction">
<div class="header">
<p><a class="url"><img class="logo" /><span><strong class="name"></strong></span></a></p>
<p class="cat-desc"><span><a href="#" class="category translatable"></a></span><span class="description translatable"></span></p>
<ul class="tags"></ul>
</div>
<div class="details">
<p class="introduction translatable"></p>
<div class="similar-to"><p class="translatable label">Similar to</p><ul></ul></div>
<div class="alternative-to"><p class="translatable label">Alternative to</p><ul></ul></div>
<div class="license"></div>
</div>
<p class="text translatable"></p>
<p class="tip translatable"></p>
</div>

</body></html>
22 changes: 14 additions & 8 deletions js/data.json
View file
Expand Up @@ -7,23 +7,29 @@ var lp = {
{"id":"google plus","name":"Google +","url":"https:\/\/plus.google.com\/"},
{"id":"google calendar","name":"Google Calendar","url":"https:\/\/calendar.google.com\/"},
{"id":"twitter","name":"Twitter","url":"https:\/\/www.twitter.com\/"},
{"id":"yahoo","name":"Yahoo!","url":"https:\/\/yahoo.com\/"},
{"id":"yahoo groups","name":"Yahoo! Groups","url":"https:\/\/groups.yahoo.com\/"},
{"id":"hotmail","name":"Hotmail","url":"https:\/\/www.hotmail.com\/"}
{"id":"hotmail","name":"Hotmail","url":"https:\/\/www.hotmail.com\/"},
{"id":"delicious","name":"Delicious","url":"https:\/\/www.delicious.com\/"},
{"id":"diigo","name":"Diigo","url":"https:\/\/www.diigo.com\/"},
{"id":"google","name":"Google","url":"https:\/\/www.google.com\/"},
{"id":"bing","name":"Bing","url":"https:\/\/www.bing.com\/"},
{"id":"gtalk","name":"Gtalk","url":"https:\/\/www.google.com\/talk\/"}
],
"projects":[
{"id":"diaspora","category":"social","name":"Diaspora","description":"social network","url":"http:\/\/diasp.eu\/","tags":["social","network","decentralized"],"alternative":["facebook","google plus"]},
{"id":"diaspora","category":"social","name":"Diaspora","description":"social network","url":"http:\/\/diasp.eu\/","tags":["social","network","decentralized"],"alternative":["facebook","google plus"],"introduction":"Diaspora is a free personal web server that implements a distributed social networking service. Installations of the software form nodes (termed 'pods') which make up the distributed Diaspora social network."},
{"id":"identica","category":"social","name":"Identi.ca","description":"microblog","url":"http:\/\/identi.ca\/","tags":["social","network","decentralized", "microblog"],"alternative":["twitter"]},
{"id":"jappix","category":"social","name":"Jappix","description":"chat","url":"http:\/\/jappix.com\/"},
{"id":"freelishus","category":"social","name":"Freelish.us","description":"bookmarks","url":"http:\/\/freelish.us\/"},
{"id":"jappix","category":"social","name":"Jappix","description":"chat","url":"http:\/\/jappix.com\/","tags":["chat","jabber"],"alternative":["gtalk"]},
{"id":"freelishus","category":"social","name":"Freelish.us","description":"bookmarks","url":"http:\/\/freelish.us\/","tags":["bookmark","social"],"alternative":["delicious","diigo"]},
{"id":"reddit","category":"social","name":"Reddit","description":"discussion","url":"http:\/\/reddit.com\/"},
{"id":"riseup","category":"social","name":"Riseup","description":"email","url":"http:\/\/riseup.net\/","tags":["email","mailinglist","provider"],"alternative":["gmail","hotmail","yahoo groups"]},
{"id":"onlinegroups","category":"social","name":"OnlineGroups","description":"mailing lists","url":"http:\/\/onlinegroups.net\/","tags":["mailinglist","provider"],"alternative":["yahoo groups"]},
{"id":"freenode","category":"social","name":"Freenode","description":"IRC","url":"http:\/\/webchat.freenode.net\/"},
{"id":"seeks","category":"tools","name":"Seeks","description":"search engine","url":"http:\/\/seeks.fr\/"},
{"id":"yacy","category":"tools","name":"YaCy","description":"search engine","url":"http:\/\/www.yacyweb.de\/peer.htm"},
{"id":"freenode","category":"social","name":"Freenode","description":"IRC","url":"http:\/\/webchat.freenode.net\/","tags":["irc"]},
{"id":"seeks","category":"tools","name":"Seeks","description":"search engine","url":"http:\/\/seeks.fr\/","tags":["searchengine"],"alternative":["google","bing","yahoo"]},
{"id":"yacy","category":"tools","name":"YaCy","description":"search engine","url":"http:\/\/www.yacy.net\/","tags":["searchengine","decentralized"],"alternative":["google","bing","yahoo"]},
{"id":"etherpad","category":"tools","name":"Titanpad","description":"text editor","url":"http:\/\/titanpad.com\/"},
{"id":"funambol","category":"tools","name":"Funambol","description":"calendar","url":"http:\/\/my.funambol.com\/","tags":["calendar","mobile"],"alternative":["google calendar"]},
{"id":"grical","category":"tools","name":"GriCal","description":"open calendar","url":"http:\/\/grical.org\/"},
{"id":"grical","category":"tools","name":"GriCal","description":"open calendar","url":"http:\/\/grical.org\/","tags":["calendar","public"],"introduction":"GriCal (which is a short form for Grid Calendar) is an open web where people store quickly a few information about interesting events, so that others can also easily know about them.","presentation":"<p>GriCal also makes easy and fast to get notified and store interesting events in its own external calendars.</p><p>GriCal offers its content as free content allowing its reuse by any party under the conditions of the CC-BY-SA license. Its source code is Free Software and thus respects the Open Knowledge Definition and the Open Software Service Definition of the Open Knowledge Foundation.</p><p>Events in GriCal can be edited by anyone like pages of the Wikipedia. The description of an event is rendered using ReStructuredText syntax.</p><p>You can subscribe to an event (or to the result of filters) to get notified of any change, comment, or new event matching a filter.</p>"},
{"id":"wingman","category":"tools","name":"Wingman","description":"to-do list","url":"http:\/\/wingman.heroku.com\/"},
{"id":"wiktionary","category":"tools","name":"Wiktionary","description":"dictionary","url":"http:\/\/wiktionary.org\/"},
{"id":"dictcc","category":"tools","name":"dict.cc","description":"translator","url":"http:\/\/dict.cc\/"},
Expand Down
27 changes: 17 additions & 10 deletions js/default.js
View file
Expand Up @@ -347,25 +347,32 @@ lp = $.extend(lp, {
} );
} );

var $introduction = $details.find('.introduction');
if (typeof lp.actualProject.introduction == 'string') {
$introduction.html(lp.actualProject.introduction)
.data('text', lp.actualProject.introduction);
}

if ($alternative.find('li').length == 0 ||
$similar.find('li').length == 0) {
$details.find('.text').html('This sheet is not complete <a href=\'#participate\'>help us</a> improve it.')
.data('translatable', 'This sheet is not complete <a href=\'#participate\'>help us</a> improve it.')
.show();
$similar.find('li').length == 0 ||
$introduction.html().length == 0) {
$details.find('.tip').html('This sheet is not complete <a href=\'#participate\'>help us</a> improve it.')
.data('translatable', 'This sheet is not complete <a href=\'#participate\'>help us</a> improve it.')
.show();
}

$details.find('a').unbind('hover').hover(function() {
var $a = $(this);
if ($a.data('text')) {
$details.find('.text').html($a.data('text')).show();
$details.find('.tip').html($a.data('text')).show();
}
}, function() {
var $text = $details.find('.text');
if ($text.data('translatable')) {
$text.html($text.data('translatable'));
lp.translateTo(lp.locale, $text.parent());
var $tip = $details.find('.tip');
if ($tip.data('translatable')) {
$tip.html($tip.data('translatable'));
lp.translateTo(lp.locale, $tip.parent());
} else {
$details.find('.text').html('').hide();
$details.find('.tip').html('').hide();
}
} );

Expand Down
Binary file added logos/alternatives/bing.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added logos/alternatives/delicious.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added logos/alternatives/diigo.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added logos/alternatives/google.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added logos/alternatives/gtalk.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified logos/alternatives/yahoo.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit a7dcb78

Please sign in to comment.