Now linking to personal pages from the main timeline. Added Ind.ie logo to the...

Now linking to personal pages from the main timeline. Added Ind.ie logo to the pages (as an easter-egg-style/unobtrusive link back to the main timeline for now.
parent ad14731b
......@@ -101,7 +101,7 @@ module.exports = (app) ->
personHandle = messageID.substr(personHandleDelimeter+2)
# TODO: Once public profile pages are implemented, link to them.
return " by #{personHandle}."
return " by <a href='/person/#{personHandle}'>#{personHandle}</a>."
else
# This is the person themselves.
# TODO: Once the timestamps are in there, just return that.
......
/* Heartbeat public web server styles. */
*
*
{
box-sizing: border-box;
}
body
body
{
max-width: 600px;
margin-left: auto;
......@@ -15,7 +15,7 @@ body
color: #333;
}
h1
h1
{
font-size: 64px;
line-height: 1;
......@@ -25,11 +25,11 @@ h1
h2
{
font-weight: 400;
font-weight: 400;
font-size: 36px;
}
#profile-image
#profile-image
{
max-width: 148px;
border: 2px solid #ccc;
......@@ -39,6 +39,19 @@ h2
margin-right: auto;
}
#indieHopeBalloonLogo
{
width: 64px;
height: 64px;
display: inline-block;
margin-bottom:20px;
/* Don’t make the balloon affect the text alignment */
margin-right: -64px;
overflow:hidden;
}
.messageBody
{
line-height: 1.5em;
......@@ -148,4 +161,4 @@ header
.new-person-notification p:nth-child(2)
{
padding-top: 26px;
}
}
\ No newline at end of file
......@@ -64,9 +64,8 @@ function getOlderMessages(){
var repeaterNodeInnerHTML =
" <div class='messageBody' data-set-attribute='id message.key messageBodyIDFormatter'>"
+ " <div class='image-and-body'>"
+ " <img class='profileImage' data-set-attribute='src message.key profileImagePathFormatter'>"
+ " <div class='bodyText' data-set-text='html message.value'>Message body HTML</div>"
+ " <div class='meta'><a data-set-attribute='href message.key permanentLinkFormatter'><span class='postDate' data-set-attribute='data-timestamp message.key timestampFormatter' data-set-text='message.key postDateFormatter'></span></a> <span data-set-text='message.key personFormatter'></span> <a data-set-attribute='href message.key addFriendLinkFormatter' data-set-text='html message.key addFriendTextFormatter'></a></div>"
+ " <div class='meta'><a data-set-attribute='href message.key permanentLinkFormatter'><span class='postDate' data-set-attribute='data-timestamp message.key timestampFormatter' data-set-text='message.key postDateFormatter'></span></a></div>"
+ " </div>"
+ " </div>";
......@@ -302,9 +301,8 @@ window.addEventListener('load', function(){
var repeaterNodeInnerHTML =
" <div class='messageBody' data-set-attribute='id message.key messageBodyIDFormatter'>"
+ " <div class='image-and-body'>"
+ " <img class='profileImage' data-set-attribute='src message.key profileImagePathFormatter'>"
+ " <div class='bodyText' data-set-text='html message.value'>Message body HTML</div>"
+ " <div class='meta'><span class='postDate' data-set-attribute='data-timestamp message.key timestampFormatter' data-set-text='message.key postDateFormatter'></span><span data-set-text='message.key personFormatter'></span> <a data-set-attribute='href message.key addFriendLinkFormatter' data-set-text='html message.key addFriendTextFormatter'></a></div>"
+ " <div class='meta'><a data-set-attribute='href message.key permanentLinkFormatter'><span class='postDate' data-set-attribute='data-timestamp message.key timestampFormatter' data-set-text='message.key postDateFormatter'></span></a></div>"
+ " </div>"
+ " </div>";
......@@ -400,6 +398,14 @@ window.addEventListener('load', function(){
}
}
// Permanent link formatter
set.format['permanentLinkFormatter'] = function (messageID) {
var personHandleDelimeter = messageID.lastIndexOf('Z-');
personHandle = messageID.substr(personHandleDelimeter+2);
return '/person/' + personHandle + '/post/' + messageID
}
// Format the person’s name
set.format['personFormatter'] = function (messageID) {
var personHandleDelimeter = messageID.lastIndexOf('Z-');
......
......@@ -169,8 +169,7 @@ function getOlderMessages(){
// From someone else
personHandle = messageID.substr(personHandleDelimeter+2);
// TODO: Once public profile pages are implemented, link to them.
return " by "+personHandle+".";
return " by <a href='/person/" + personHandle + ">"+personHandle+"</a>.";
}
else {
// This is the person themselves.
......@@ -408,8 +407,7 @@ window.addEventListener('load', function(){
// From someone else
personHandle = messageID.substr(personHandleDelimeter+2);
// TODO: Once public profile pages are implemented, link to them.
return " by "+personHandle+".";
return " by <a href='/person/" + personHandle + ">"+personHandle+"</a>.";
}
else {
// This is the person themselves.
......
......@@ -32,7 +32,7 @@
<body>
<header>
<img id="profile-image" data-set-attribute='src profileImageURL'>
<h1 id='name' data-set-text='profile.displayName'></h1>
<h1 id='name'><span data-set-text='profile.displayName'></span><a href='/'><img id='indieHopeBalloonLogo' src='/images/indie-hope-balloon-logo.png'></a></h1>
<p id='bio' data-set-text='html profile.bio'></p>
<p><a data-set-attribute='href indieFriendURL'><img class='add-friend-icon' src='/images/person_add@2x.png' alt='Send friend request'></a></p>
</header>
......
......@@ -40,7 +40,7 @@
<div class="image-and-body">
<img class="profileImage" data-set-attribute='src message.key profileImagePathFormatter'>
<div class="bodyText" data-set-text='html message.value'>Message body HTML</div>
<div class="meta"><a data-set-attribute='href message.key permanentLinkFormatter'><span class='postDate' data-set-attribute='data-timestamp message.key timestampFormatter' data-set-text='message.key postDateFormatter'></span></a> <span data-set-text='message.key personFormatter'></span> <a data-set-attribute='href message.key addFriendLinkFormatter' data-set-text='html message.key addFriendTextFormatter'></a></div>
<div class="meta"><a data-set-attribute='href message.key permanentLinkFormatter'><span class='postDate' data-set-attribute='data-timestamp message.key timestampFormatter' data-set-text='message.key postDateFormatter'></span></a> <span data-set-text='html message.key personFormatter'></span> <a data-set-attribute='href message.key addFriendLinkFormatter' data-set-text='html message.key addFriendTextFormatter'></a></div>
</div>
</div>
<!-- <div class='messageStatus' data-set-attribute='id message.key messageStatusIDFormatter'></div>-->
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment