<link rel="stylesheet" type="text/css" href="reset.css"/>
<link rel="stylesheet" type="text/css" href="hermes.css"/>
-<script src="js/jquery-1.3.1.min.js" type="text/javascript"></script>
+<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
+<script src="js/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script>
<script src="js/jquery.corner.js" type="text/javascript"></script>
<script src="js/jquery.juitter.js" type="text/javascript"></script>
<script src="js/system.js" type="text/javascript"></script>
<script type="text/javascript">
-
$(document).ready(function() {
// Rounded Corners
$("div#content,div#devmenu").corner("round");
-
- //Default Tab Action
- $(".tab_content").hide(); //Hide all content
- $("ul.tabs li:first").addClass("active").show(); //Activate first tab
- $(".tab_content:first").show(); //Show first tab content
-
- //onClick Tab Event
- $("ul.tabs li").click(function() {
- $("ul.tabs li").removeClass("active"); //Remove any "active" class
- $(this).addClass("active"); //Add "active" class to selected tab
- $(".tab_content").hide(); //Hide all tab content
- var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
- $(activeTab).fadeIn(); //Fade in the active content
- return false;
- });
+
+ // Tabs\r
+ $('#tabs').tabs({ fx: { opacity: 'toggle' } });
});
</script>
<div id="header">
<h1><a href="index.htm">Hermes</a></h1>
<img src="ui/hermes-logo.png" alt="Hermes" class="logo" />
+</div>
- <!-- Tab Navigation -->
- <ul class="tabs">
- <li><a href="#tab1">About Hermes</a></li>
- <li><a href="#tab2">What it does</a></li>
- <li><a href="#tab3">Get it</a></li>
- <li class="last"><a href="#tab4">Development</a></li>
+<!-- Tab Navigation -->
+<div id="tabs">
+
+ <ul class="nav">
+ <li><a href="#about">About Hermes</a></li>
+ <li><a href="#what">What it does</a></li>
+ <li><a href="#download">Get it</a></li>
+ <li class="last"><a href="#development">Development</a></li>
</ul>
-</div>
<!-- Page Content -->
<div id="content">
- <div class="tab_container">
<!-- Tab #1 -->
- <div id="tab1" class="tab_content">
+ <div id="about">
<p>So, you've copied an address book full of contacts to your new N900. Unfortunately, the lovely interface and gorgeous screen are completely let down by the fact that all you see are generic, blue men as you contacts' pictures. Contacting people via the <em>Phone</em> or <em>Conversations</em> just doesn't seem very slick.</p>
<p>With Hermes, you will enrich your Maemo 5 address book with photos, birthdates, homepage addresses, and more from online services such as Facebook and Twitter.</p>
</div>
<!-- Tab #2 -->
- <div id="tab2" class="tab_content">
-
+ <div id="what">
<!-- YouTube Video -->
<object type="application/x-shockwave-flash" style="width:560px; height:340px;" data="http://www.youtube.com/v/G_6ZC8n9nKs&hl=en&fs=1&">
<param name="movie" value="http://www.youtube.com/v/G_6ZC8n9nKs&hl=en&fs=1&" />
<p>If a contact is matched between the Contacts app and an online identity, Hermes will update the contact on the device with a photo (from Facebook or Twitter), birthday (from Facebook), profile URLs (on Facebook and Twitter) and homepage (from Twitter). As an added bonus, all birthdates will also appear automatically in your Calendar.</p>
<p>There are two modes of operation, "Retrieve" and "Update." Retrieve will fill in <strong>missing</strong> data for a contact. Update will <strong>overwrite</strong> any contacts that have matches on the social networks (i.e., your Contacts entries will be reset to the information found online).</p>
<p>Hermes uses the official Facebook and Twitter APIs, designed and intended by these companies to allow third party applications such as Hermes.</p>
-
</div>
<!-- Tab #3 -->
- <div id="tab3" class="tab_content">
-
+ <div id="download">
<img src="ui/application_install.png" alt="" class="download" />
<p>Hermes is currently under development. It can be installed from the <a href="http://maemo.org/packages/view/hermes/">Extras Testing</a> repository.</p>
<p class="note"><strong>Note:</strong> It is not yet suitable for end-users.</p>
-
</div>
<!-- Tab #4 -->
- <div id="tab4" class="tab_content">
-
+ <div id="development">
<div id="devmenu">
<ul>
<li><a href="https://bugs.maemo.org/buglist.cgi?product=Hermes">Current bug list</a></li>
<li>Store a history of all images that Hermes has ever downloaded to allow the user to pick from them.</li>
</ul>
</div>
-
- </div>
+
+</div>
</div>
<!-- Footer Content -->
projects / hermes / blobdiff