mirror of
https://github.com/twisterarmy/twister-html.git
synced 2025-03-11 13:01:19 +00:00
show post retwists with comment as posts with citation
This commit is contained in:
Simon Grim
parent
29e4130e72
commit
6537515dac
@ -1253,6 +1253,41 @@ ol.toptrends-list {
|
||||
border-left: solid 3px #E34F42;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
.post-rt-reference {
|
||||
background-color: #FAFAFA;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.post-rt-reference:hover {
|
||||
background-color: #FFF;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-photo {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-photo img {
|
||||
width: 24px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-info-name {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-text {
|
||||
font-size: 10px;
|
||||
margin: 2px 10px 4px 10px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-info-time {
|
||||
font-size: 9px;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/***********************************
|
||||
******** LOGIN AND NETWORK PAGES ***
|
||||
***********************************/
|
||||
|
||||
@ -222,11 +222,7 @@
|
||||
<a class="post-info-time"></a>
|
||||
</div>
|
||||
<p class="post-text"></p>
|
||||
<div class="post-context" style="display: none;">
|
||||
<i class="post-retransmited-icon"></i>
|
||||
<span>twisted again by</span>
|
||||
<a class="post-retransmited-by open-profile-modal" href=""></a>
|
||||
</div>
|
||||
<div class="post-context" style="display: none;"></div>
|
||||
<span class="post-expand">Expand</span>
|
||||
<!-- elementos de interação com o post que são exibidos no hover -->
|
||||
<div class="post-interactions">
|
||||
@ -261,6 +257,25 @@
|
||||
</div> <!-- post-data -->
|
||||
</li> <!-- post-template -->
|
||||
|
||||
<div id="post-rt-reference-template">
|
||||
<div class="post-rt-reference">
|
||||
<div class="post-photo"><img class="avatar" src="img/grayed_avatar_placeholder_24.png" alt="user-photo" /></div>
|
||||
<div class="post-info">
|
||||
<a href="#" class="post-info-name open-profile-modal"></a>
|
||||
<span class="post-info-tag"></span>
|
||||
<span class="post-info-sent"></span>
|
||||
<a class="post-info-time"></a>
|
||||
</div>
|
||||
<p class="post-text"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="post-retransmited-by-template">
|
||||
<i class="post-retransmited-icon"></i>
|
||||
<span>twisted again by</span><span> </span>
|
||||
<a class="post-retransmited-by open-profile-modal" href=""></a>
|
||||
</div>
|
||||
|
||||
<!-- template for user links in message (open profile modal) -->
|
||||
<a id="msg-user-link-template" class="open-profile-modal"></a>
|
||||
<!-- template for user links in message (open profile modal) -->
|
||||
|
||||
25
home.html
25
home.html
@ -314,11 +314,7 @@
|
||||
<a class="post-info-time"></a>
|
||||
</div>
|
||||
<p class="post-text"></p>
|
||||
<div class="post-context" style="display: none;">
|
||||
<i class="post-retransmited-icon"></i>
|
||||
<span>twisted again by</span>
|
||||
<a class="post-retransmited-by open-profile-modal" href=""></a>
|
||||
</div>
|
||||
<div class="post-context" style="display: none;"></div>
|
||||
<span class="post-expand">Expand</span>
|
||||
<!-- elementos de interação com o post que são exibidos no hover -->
|
||||
<div class="post-interactions">
|
||||
@ -353,6 +349,25 @@
|
||||
</div> <!-- post-data -->
|
||||
</li> <!-- post-template -->
|
||||
|
||||
<div id="post-rt-reference-template">
|
||||
<div class="post-rt-reference">
|
||||
<div class="post-photo"><img class="avatar" src="img/grayed_avatar_placeholder_24.png" alt="user-photo" /></div>
|
||||
<div class="post-info">
|
||||
<a href="#" class="post-info-name open-profile-modal"></a>
|
||||
<span class="post-info-tag"></span>
|
||||
<span class="post-info-sent"></span>
|
||||
<a class="post-info-time"></a>
|
||||
</div>
|
||||
<p class="post-text"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="post-retransmited-by-template">
|
||||
<i class="post-retransmited-icon"></i>
|
||||
<span>twisted again by</span><span> </span>
|
||||
<a class="post-retransmited-by open-profile-modal" href=""></a>
|
||||
</div>
|
||||
|
||||
<!-- template for user links in message (open profile modal) -->
|
||||
<a id="msg-user-link-template" class="open-profile-modal"></a>
|
||||
<!-- template for user links in message (open profile modal) -->
|
||||
|
||||
@ -3,12 +3,16 @@
|
||||
//
|
||||
// Format JSON posts and DMs to HTML.
|
||||
|
||||
var _templatePostRtReference
|
||||
var _templatePostRtBy
|
||||
var _htmlFormatMsgLinkTemplateExternal;
|
||||
var _htmlFormatMsgLinkTemplateUser;
|
||||
var _htmlFormatMsgLinkTemplateHashtag;
|
||||
|
||||
$(document).ready(function() {
|
||||
// we're setting it here for perfomance improvement purpose // to not search and prepare it for for every post every time
|
||||
_templatePostRtReference = $('#post-rt-reference-template').children().clone(true);
|
||||
_templatePostRtBy = $('#post-retransmited-by-template').children().clone(true);
|
||||
_htmlFormatMsgLinkTemplateExternal = $('#external-page-link-template')
|
||||
if (_htmlFormatMsgLinkTemplateExternal.length) {
|
||||
_htmlFormatMsgLinkTemplateExternal = _htmlFormatMsgLinkTemplateExternal[0].cloneNode();
|
||||
@ -29,6 +33,18 @@ $(document).ready(function() {
|
||||
// format "userpost" to html element
|
||||
// kind = "original"/"ancestor"/"descendant"
|
||||
function postToElem(post, kind, promoted) {
|
||||
|
||||
function setPostCommon(elem, username, time) {
|
||||
var postInfoName = elem.find('.post-info-name')
|
||||
.text(username).attr('href', $.MAL.userUrl(username));
|
||||
|
||||
getFullname(username, postInfoName);
|
||||
//elem.find('.post-info-tag').text("@" + username); // FIXME
|
||||
getAvatar(username, elem.find('.avatar'));
|
||||
|
||||
elem.find('.post-info-time').text(timeGmtToText(time)).attr('title', timeSincePost(time));
|
||||
}
|
||||
|
||||
/*
|
||||
"userpost" :
|
||||
{
|
||||
@ -49,23 +65,33 @@ function postToElem(post, kind, promoted) {
|
||||
}
|
||||
"sig_userpost" : signature by userpost.n
|
||||
*/
|
||||
var username, k, t, msg, rt, content_to_rt, content_to_sigrt, retweeted_by;
|
||||
|
||||
var username, k, time, msg, rt, content_to_rt, content_to_sigrt, retweeted_by;
|
||||
|
||||
// Obtain data from userpost
|
||||
var userpost = post.userpost;
|
||||
if (userpost.rt) {
|
||||
rt = userpost.rt;
|
||||
username = rt.n;
|
||||
k = rt.k;
|
||||
t = rt.time;
|
||||
msg = rt.msg;
|
||||
content_to_rt = $.toJSON(rt);
|
||||
content_to_sigrt = userpost.sig_rt;
|
||||
if (userpost.msg) {
|
||||
username = userpost.n;
|
||||
k = userpost.k;
|
||||
time = userpost.time;
|
||||
msg = userpost.msg;
|
||||
content_to_rt = $.toJSON(userpost);
|
||||
content_to_sigrt = post.sig_userpost;
|
||||
} else {
|
||||
username = rt.n;
|
||||
k = rt.k;
|
||||
time = rt.time;
|
||||
msg = rt.msg;
|
||||
content_to_rt = $.toJSON(rt);
|
||||
content_to_sigrt = userpost.sig_rt;
|
||||
}
|
||||
retweeted_by = userpost.n;
|
||||
} else {
|
||||
username = userpost.n;
|
||||
k = userpost.k;
|
||||
t = userpost.time;
|
||||
time = userpost.time;
|
||||
msg = userpost.msg;
|
||||
content_to_rt = $.toJSON(userpost);
|
||||
content_to_sigrt = post.sig_userpost;
|
||||
@ -75,7 +101,7 @@ function postToElem(post, kind, promoted) {
|
||||
var elem = $.MAL.getPostTemplate().clone(true);
|
||||
elem.removeAttr('id')
|
||||
.addClass(kind)
|
||||
.attr('data-time', t)
|
||||
.attr('data-time', time)
|
||||
;
|
||||
|
||||
if (post.isNew)
|
||||
@ -103,12 +129,7 @@ function postToElem(post, kind, promoted) {
|
||||
;
|
||||
}
|
||||
|
||||
var postInfoName = elem.find('.post-info-name')
|
||||
.text(username).attr('href', $.MAL.userUrl(username));
|
||||
getFullname(username, postInfoName);
|
||||
//elem.find('.post-info-tag').text("@" + username);
|
||||
getAvatar(username, elem.find('.avatar'));
|
||||
elem.find('.post-info-time').text(timeGmtToText(t)).attr('title', timeSincePost(t));
|
||||
setPostCommon(elem, username, time);
|
||||
|
||||
msg = htmlFormatMsg(msg);
|
||||
elem.find('.post-text').html(msg.html);
|
||||
@ -138,11 +159,19 @@ function postToElem(post, kind, promoted) {
|
||||
postData.attr('data-reply-to', replyTo);
|
||||
|
||||
if (typeof retweeted_by !== 'undefined') {
|
||||
elem.find('.post-context').show();
|
||||
elem.find('.post-retransmited-by')
|
||||
.attr('href', $.MAL.userUrl(retweeted_by))
|
||||
.text('@' + retweeted_by)
|
||||
;
|
||||
var postContext = elem.find('.post-context');
|
||||
if (userpost.msg) {
|
||||
postContext.append(_templatePostRtReference.clone(true))
|
||||
.find('.post-text').html(htmlFormatMsg(rt.msg).html);
|
||||
;
|
||||
setPostCommon(postContext, rt.n, rt.time)
|
||||
} else {
|
||||
postContext.append(_templatePostRtBy.clone(true))
|
||||
.find('.post-retransmited-by')
|
||||
.attr('href', $.MAL.userUrl(retweeted_by)).text('@' + retweeted_by)
|
||||
;
|
||||
}
|
||||
postContext.show();
|
||||
}
|
||||
|
||||
if (typeof promoted !== 'undefined' && promoted) {
|
||||
|
||||
@ -1616,6 +1616,41 @@ textarea.splited-post {
|
||||
border-left: solid 3px #43464d;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
.post-rt-reference {
|
||||
background-color: #FAFAFA;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.post-rt-reference:hover {
|
||||
background-color: #FFF;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-photo {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-photo img {
|
||||
width: 24px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-info-name {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-text {
|
||||
font-size: 10px;
|
||||
margin: 2px 10px 4px 10px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-info-time {
|
||||
font-size: 9px;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/***********************************
|
||||
******** LOGIN AND NETWORK PAGES ***
|
||||
***********************************/
|
||||
|
||||
@ -1101,6 +1101,40 @@ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu,
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
.post-rt-reference {
|
||||
background-color: #FAFAFA;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.post-rt-reference:hover {
|
||||
background-color: #FFF;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-photo {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-photo img {
|
||||
width: 24px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-info-name {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-text {
|
||||
font-size: 10px;
|
||||
margin: 2px 10px 4px 10px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-info-time {
|
||||
font-size: 9px;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/* MODAL */
|
||||
/* line 316, ../sass/_postboard.sass */
|
||||
.modal-content .postboard {
|
||||
|
||||
@ -311,6 +311,26 @@
|
||||
border-left: solid 3px $main-color-color
|
||||
margin-left: 1px
|
||||
|
||||
.post-rt-reference
|
||||
background-color: #FAFAFA
|
||||
border: 1px solid #ccc
|
||||
&:hover
|
||||
background-color: #FFF
|
||||
cursor: pointer
|
||||
.post-photo
|
||||
width: 24px
|
||||
height: 24px
|
||||
img
|
||||
width: 24px
|
||||
height: auto
|
||||
.post-info-name
|
||||
font-size: 10px
|
||||
.post-text
|
||||
font-size: 10px
|
||||
margin: 2px 10px 4px 10px
|
||||
.post-info-time
|
||||
font-size: 9px
|
||||
color: #000
|
||||
|
||||
|
||||
|
||||
|
||||
67
tmobile.html
67
tmobile.html
@ -75,8 +75,45 @@
|
||||
.header {position:fixed;z-index:10;top:0;width:100%}
|
||||
.content {padding:15px 20px 20px 20px;}
|
||||
.footer {position:fixed;z-index:10;bottom:0;width:100%}
|
||||
|
||||
.post-rt-reference {
|
||||
background-color: #FAFAFA;
|
||||
border: 1px solid #ccc;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.post-rt-reference:hover {
|
||||
background-color: #FFF;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-photo {
|
||||
float: left;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-photo img {
|
||||
width: 24px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-info-name {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-text {
|
||||
font-size: 10px;
|
||||
margin: 2px 10px 4px 10px;
|
||||
}
|
||||
|
||||
.post-rt-reference .post-info-time {
|
||||
font-size: 9px;
|
||||
font-weight: lighter;
|
||||
color: #000 !important;
|
||||
float: right;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="index" data-role="page">
|
||||
@ -710,11 +747,7 @@
|
||||
<span style='font-weight:lighter;font-size:12px;' class="post-info-time ui-li-aside"></span>
|
||||
</h4>
|
||||
<p class="post-text no-ellipsis"></p>
|
||||
<div class="post-context" style="display: none;">
|
||||
<i class="post-retransmited-icon"></i>
|
||||
<span style="font-size:60%;">twisted again by</span>
|
||||
<a style="font-size:60%;" class="post-retransmited-by open-profile-modal" href=""></a>
|
||||
</div>
|
||||
<div class="post-context" style="display: none;"></div>
|
||||
</div>
|
||||
</li> <!-- post-template -->
|
||||
|
||||
@ -733,11 +766,7 @@
|
||||
<span style='font-weight:lighter;font-size:12px;' class="post-info-time ui-li-aside"></span>
|
||||
</h4>
|
||||
<p class="post-text no-ellipsis"></p>
|
||||
<div class="post-context" style="display: none;">
|
||||
<i class="post-retransmited-icon"></i>
|
||||
<span style="font-size:60%;">twisted again by</span>
|
||||
<a style="font-size:60%;" class="post-retransmited-by open-profile-modal" href=""></a>
|
||||
</div>
|
||||
<div class="post-context" style="display: none;"></div>
|
||||
<!-- elementos de interação com o post que são exibidos no hover -->
|
||||
<fieldset class="post-interactions ui-grid-a" data-role="fieldcontain">
|
||||
<div class="ui-block-a">
|
||||
@ -761,6 +790,24 @@
|
||||
</div> <!-- post-data -->
|
||||
</li> <!-- post-template -->
|
||||
|
||||
<div id="post-rt-reference-template">
|
||||
<div class="post-rt-reference">
|
||||
<div class="post-photo"><img class="avatar" src="img/grayed_avatar_placeholder_24.png" alt="user-photo" /></div>
|
||||
<div class="post-info">
|
||||
<a href="#" class="post-info-name open-profile-modal"></a>
|
||||
<span class="post-info-tag"></span>
|
||||
<span class="post-info-sent"></span>
|
||||
<a class="post-info-time"></a>
|
||||
</div>
|
||||
<p class="post-text"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="post-retransmited-by-template">
|
||||
<i class="post-retransmited-icon"></i>
|
||||
<span style="font-size:60%;">twisted again by</span><span> </span>
|
||||
<a style="font-size:60%;" class="post-retransmited-by open-profile-modal" href=""></a>
|
||||
</div>
|
||||
|
||||
<!-- template for user links in message (open profile modal) -->
|
||||
<a id="msg-user-link-template" class="open-profile-modal"></a>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user