twisterarmy
/
twister-html
mirror of https://github.com/twisterarmy/twister-html.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Merge pull request #276 from slr/tasty-markdown 

post preview
master
miguelfreitas 9 years ago
parent
cae8989f21 27256788ed
commit
de1334706b
14 changed files with 207 additions and 69 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 14
      css/style.css
  2. 6
      following.html
  3. 5
      home.html
  4. 31
      js/interface_common.js
  5. 13
      js/interface_localization.js
  6. 8
      js/options.js
  7. 1
      js/tmobile.js
  8. 2
      js/twister_directmsg.js
  9. 2
      js/twister_formatpost.js
  10. 3
      options.html
  11. 43
      theme_calm/css/style.css
  12. 16
      theme_nin/css/style.css
  13. 11
      theme_nin/sass/style.sass
  14. 5
      tmobile.html

14
css/style.css
Unescape View File

@ -626,7 +626,6 @@ button.follow:hover, button.unfollow:hover, .following-list button.private:hover
padding: 4px; padding: 4px;
font-size: 13px; font-size: 13px;
} }
.post-area-new textarea:focus { .post-area-new textarea:focus {
border: solid 1px rgba( 227, 79, 66, .5 ); border: solid 1px rgba( 227, 79, 66, .5 );
} }
@ -648,6 +647,19 @@ textarea.splited-post {
box-shadow: none!important; box-shadow: none!important;
height: 28px; height: 28px;
} }
#post-preview {
background-color: #F2FFBA;
border: solid 1px #B4C669;
font-size: 11px;
margin: 4px 0;
padding: 4px;
}
#post-preview a {
color: #E34F42;
}
.splited-post-counter { .splited-post-counter {
color: rgba(0, 0, 0, 0.3); color: rgba(0, 0, 0, 0.3);
font-weight: bold; font-weight: bold;

6
following.html
Unescape View File

@ -206,6 +206,12 @@
<li class="ancestor module post"> <li class="ancestor module post">
</li> </li>
<div id="post-preview-template">
<div id="post-preview">
</div>
</div>
<li id="post-template" class="module post" data-time=""> <li id="post-template" class="module post" data-time="">
<div class="post-data" data-userpost="" data-content_to_rt="" data-content_to_sigrt="" <div class="post-data" data-userpost="" data-content_to_rt="" data-content_to_sigrt=""
data-screen-name="" data-id="" data-text="" data-text-mentions=""> data-screen-name="" data-id="" data-text="" data-text-mentions="">

5
home.html
Unescape View File

@ -298,6 +298,11 @@
<li class="ancestor module post"> <li class="ancestor module post">
</li> </li>
<div id="post-preview-template">
<div id="post-preview">
</div>
</div>
<li id="post-template" class="module post" data-time=""> <li id="post-template" class="module post" data-time="">
<div class="post-data" data-userpost="" data-content_to_rt="" data-content_to_sigrt="" <div class="post-data" data-userpost="" data-content_to_rt="" data-content_to_sigrt=""
data-screen-name="" data-id="" data-text="" data-text-mentions=""> data-screen-name="" data-id="" data-text="" data-text-mentions="">

31
js/interface_common.js
Unescape View File

@ -573,11 +573,34 @@ function composeNewPost(e, postAreaNew) {
var textArea = postAreaNew.find('textarea'); var textArea = postAreaNew.find('textarea');
if (textArea.attr('data-reply-to') && !textArea.val().length) { if (textArea.attr('data-reply-to') && !textArea.val().length) {
textArea.val(textArea.attr('data-reply-to')); textArea.val(textArea.attr('data-reply-to'));
posPostPreview(e);
} }
if (!postAreaNew.find('textarea:focus').length) if (!postAreaNew.find('textarea:focus').length)
postAreaNew.find('textarea:last').focus(); postAreaNew.find('textarea:last').focus();
} }
function posPostPreview(event) {
if (!$.Options.postPreview.val)
return;
var textArea = $(event.target);
var postPreview = textArea.siblings('#post-preview');
if (!postPreview.length) {
postPreview = $('#post-preview-template').children().clone()
.css('margin-left', textArea.css('margin-left'))
.css('margin-right', textArea.css('margin-right'))
;
postPreview.width(textArea.width());
postPreview.width(postPreview.width() // width is not accurate if we do it with textArea.width() directly, don't know why
- postPreview.css('padding-left') - postPreview.css('padding-right'));
}
if (textArea[0].value.length)
postPreview.html(htmlFormatMsg(textArea[0].value, [])).show();
else
postPreview.hide();
textArea.before(postPreview);
}
// Reduz Área do Novo post // Reduz Área do Novo post
function unfocusThis() { function unfocusThis() {
$(this).removeClass('open'); $(this).removeClass('open');
@ -680,6 +703,11 @@ function replyTextInput(event) {
textArea.caret(caretPos); textArea.caret(caretPos);
} }
} }
if (textArea[0].value.length)
textAreaForm.find('#post-preview').html(htmlFormatMsg(textArea[0].value, [])).show();
else
textAreaForm.find('#post-preview').html('').hide();
} }
function getPostSplitingPML() { function getPostSplitingPML() {
@ -1196,6 +1224,8 @@ function postSubmit(e, oldLastPostId) {
var $replyText = $this.closest('.post-area-new').find('textarea'); var $replyText = $this.closest('.post-area-new').find('textarea');
$replyText.siblings('#post-preview').hide();
var $postOrig = $this.closest('.post-data'); var $postOrig = $this.closest('.post-data');
if (!$postOrig.length) { if (!$postOrig.length) {
$postOrig = $this.closest('.modal-content').find('.post-data'); $postOrig = $this.closest('.modal-content').find('.post-data');
@ -1372,6 +1402,7 @@ function initInterfaceCommon() {
.clickoutside(unfocusThis) .clickoutside(unfocusThis)
.children('textarea') .children('textarea')
.on({ .on({
'focus': posPostPreview,
'input': replyTextInput, // input event fires in modern browsers (IE9+) on any changes in textarea (and copypasting with mouse too) 'input': replyTextInput, // input event fires in modern browsers (IE9+) on any changes in textarea (and copypasting with mouse too)
'input focus': replyTextUpdateRemaining, 'input focus': replyTextUpdateRemaining,
'keyup': replyTextKeySend 'keyup': replyTextKeySend

13
js/interface_localization.js
Unescape View File

@ -207,6 +207,7 @@ if(preferredLanguage == "en"){
"Send key": "Send key", "Send key": "Send key",
"Posts display": "Posts display", "Posts display": "Posts display",
"Post editor": "Post editor", "Post editor": "Post editor",
"Post preview": "Post preview",
"Inline image preview": "Inline image preview", "Inline image preview": "Inline image preview",
"Display": "Display", "Display": "Display",
"Line feeds": "Line feeds", "Line feeds": "Line feeds",
@ -501,6 +502,7 @@ if(preferredLanguage == "es"){
"Send key": "Send key", "Send key": "Send key",
"Posts display": "Presentación de mensajes", "Posts display": "Presentación de mensajes",
"Post editor": "Post editor", "Post editor": "Post editor",
"Post preview": "Post preview",
"Inline image preview": "Vista previa de imágenes en línea", "Inline image preview": "Vista previa de imágenes en línea",
"Display": "Mostrar", "Display": "Mostrar",
"Line feeds": "Avances de línea", "Line feeds": "Avances de línea",
@ -776,6 +778,7 @@ if(preferredLanguage == "uk"){
"Send key": "Надсилання твістів", "Send key": "Надсилання твістів",
"Posts display": "Відображення твістів", "Posts display": "Відображення твістів",
"Post editor": "Редактор твістів", "Post editor": "Редактор твістів",
"Post preview": "Post preview",
"Inline image preview": "Контекстний перегляд зображення", "Inline image preview": "Контекстний перегляд зображення",
"Display": "Відображати", "Display": "Відображати",
"Line feeds": "Line feeds", "Line feeds": "Line feeds",
@ -1055,6 +1058,7 @@ if(preferredLanguage == "zh-CN"){
"Send key": "发送键", "Send key": "发送键",
"Posts display": "推文显示", "Posts display": "推文显示",
"Post editor": "信息编辑器", "Post editor": "信息编辑器",
"Post preview": "Post preview",
"Inline image preview": "内嵌图像预览", "Inline image preview": "内嵌图像预览",
"Display": "显示", "Display": "显示",
"Line feeds": "Line feeds", "Line feeds": "Line feeds",
@ -1350,6 +1354,7 @@ if(preferredLanguage == "nl"){
"Send key": "Send key", "Send key": "Send key",
"Posts display": "Posts display", "Posts display": "Posts display",
"Post editor": "Post editor", "Post editor": "Post editor",
"Post preview": "Post preview",
"Inline image preview": "Inline image preview", "Inline image preview": "Inline image preview",
"Display": "Display", "Display": "Display",
"Line feeds": "Line feeds", "Line feeds": "Line feeds",
@ -1625,6 +1630,7 @@ if(preferredLanguage == "it"){
"Send key": "Send key", "Send key": "Send key",
"Posts display": "Posts display", "Posts display": "Posts display",
"Post editor": "Post editor", "Post editor": "Post editor",
"Post preview": "Post preview",
"Inline image preview": "Inline image preview", "Inline image preview": "Inline image preview",
"Display": "Display", "Display": "Display",
"Line feeds": "Line feeds", "Line feeds": "Line feeds",
@ -1903,6 +1909,7 @@ if(preferredLanguage == "fr"){
"Send key": "Send key", "Send key": "Send key",
"Posts display": "Posts display", "Posts display": "Posts display",
"Post editor": "Post editor", "Post editor": "Post editor",
"Post preview": "Post preview",
"Inline image preview": "Inline image preview", "Inline image preview": "Inline image preview",
"Display": "Display", "Display": "Display",
"Line feeds": "Line feeds", "Line feeds": "Line feeds",
@ -2183,6 +2190,7 @@ if(preferredLanguage == "ru"){
"Send key": "Отправка сообщения", "Send key": "Отправка сообщения",
"Posts display": "Отображение сообщений", "Posts display": "Отображение сообщений",
"Post editor": "Редактор сообщения", "Post editor": "Редактор сообщения",
"Post preview": "Предпросмотр сообщений",
"Inline image preview": "Предпросмотр изображений", "Inline image preview": "Предпросмотр изображений",
"Display": "Показывать", "Display": "Показывать",
"Line feeds": "Переходы на новую строку", "Line feeds": "Переходы на новую строку",
@ -2468,6 +2476,7 @@ if(preferredLanguage == "de"){
"Send key": "Send key", "Send key": "Send key",
"Posts display": "Posts display", "Posts display": "Posts display",
"Post editor": "Nachrichten-Editor", "Post editor": "Nachrichten-Editor",
"Post preview": "Post preview",
"Inline image preview": "Inline image preview", "Inline image preview": "Inline image preview",
"Display": "Display", "Display": "Display",
"Line feeds": "Line feeds", "Line feeds": "Line feeds",
@ -2743,6 +2752,7 @@ if(preferredLanguage == "ja"){
"Send key": "Send key", "Send key": "Send key",
"Posts display": "Posts display", "Posts display": "Posts display",
"Post editor": "Post editor", "Post editor": "Post editor",
"Post preview": "Post preview",
"Inline image preview": "Inline image preview", "Inline image preview": "Inline image preview",
"Display": "Display", "Display": "Display",
"Line feeds": "Line feeds", "Line feeds": "Line feeds",
@ -3024,6 +3034,7 @@ if(preferredLanguage == "pt-BR"){
"Send key": "Send key", "Send key": "Send key",
"Posts display": "Posts display", "Posts display": "Posts display",
"Post editor": "Post editor", "Post editor": "Post editor",
"Post preview": "Post preview",
"Inline image preview": "Inline image preview", "Inline image preview": "Inline image preview",
"Display": "Display", "Display": "Display",
"Line feeds": "Line feeds", "Line feeds": "Line feeds",
@ -3292,6 +3303,7 @@ if(preferredLanguage == "tr"){
"Send key": "Gönderme tuşu", "Send key": "Gönderme tuşu",
"Posts display": "Gönderiler", "Posts display": "Gönderiler",
"Post editor": "Gönderi düzenleyici", "Post editor": "Gönderi düzenleyici",
"Post preview": "Post preview",
"Inline image preview": "Dahili resim ön izleme", "Inline image preview": "Dahili resim ön izleme",
"Display": "Göster", "Display": "Göster",
"Line feeds": "Satır sonları", "Line feeds": "Satır sonları",
@ -3577,6 +3589,7 @@ if(preferredLanguage == "cs"){
"Send key": "Klávesa pro odeslání", "Send key": "Klávesa pro odeslání",
"Posts display": "Zobrazení příspěvků", "Posts display": "Zobrazení příspěvků",
"Post editor": "Editor příspěvků", "Post editor": "Editor příspěvků",
"Post preview": "Post preview",
"Inline image preview": "Náhled vložených obrázků", "Inline image preview": "Náhled vložených obrázků",
"Display": "Zobrazit", "Display": "Zobrazit",
"Line feeds": "Nové řádky", "Line feeds": "Nové řádky",

8
js/options.js
Unescape View File

@ -142,9 +142,15 @@ function twisterOptions() {
valDefault: 'apply' valDefault: 'apply'
}); });
this.add({ this.add({
name: 'displayPreview', name: 'displayPreview', // it's inline image preview // FIXME we need some mechanism to rename options safely
valDefault: 'disable' valDefault: 'disable'
}); });
this.add({
name: 'postPreview',
selector: '#optPostPreview',
type: 'checkbox',
valDefault: true
});
this.add({ this.add({
name: 'unicodeConversion', name: 'unicodeConversion',
valDefault: 'disable', valDefault: 'disable',

1
js/tmobile.js
Unescape View File

@ -26,6 +26,7 @@ function initializeTwister( redirectNetwork, redirectLogin, cbFunc, cbArg ) {
// reply text counter both newmsg and dmchat // reply text counter both newmsg and dmchat
$('.post-area-new textarea') $('.post-area-new textarea')
.off('input keyup') .off('input keyup')
.on('focus', posPostPreview)
.on('keyup', replyTextInput) .on('keyup', replyTextInput)
.on('keyup', function() { replyTextUpdateRemaining(this); }) .on('keyup', function() { replyTextUpdateRemaining(this); })
; ;

2
js/twister_directmsg.js
Unescape View File

@ -94,6 +94,8 @@ function directMsgSubmit(e) {
var replyText = $(this).closest('.post-area-new').find('textarea'); var replyText = $(this).closest('.post-area-new').find('textarea');
replyText.siblings('#post-preview').hide();
newDirectMsg(replyText.val(), $('.directMessages').attr('data-dm-screen-name')); newDirectMsg(replyText.val(), $('.directMessages').attr('data-dm-screen-name'));
replyText.val(''); replyText.val('');

2
js/twister_formatpost.js
Unescape View File

@ -196,7 +196,7 @@ function dmDataToSnippetItem(dmData, remoteUser) {
getGroupChatName( remoteUser, dmItem.find("a.post-info-name") ); getGroupChatName( remoteUser, dmItem.find("a.post-info-name") );
else else
getFullname( remoteUser, dmItem.find("a.post-info-name") ); getFullname( remoteUser, dmItem.find("a.post-info-name") );
dmItem.find(".post-text").html(htmlFormatMsg(dmData.text)); dmItem.find(".post-text").html(htmlFormatMsg(dmData.text, []));
dmItem.find(".post-info-time").text(timeGmtToText(dmData.time)).attr("title",timeSincePost(dmData.time)); dmItem.find(".post-info-time").text(timeGmtToText(dmData.time)).attr("title",timeSincePost(dmData.time));
return dmItem; return dmItem;

3
options.html
Unescape View File

@ -374,6 +374,9 @@
<div class="post-editor"> <div class="post-editor">
<div class="module"> <div class="module">
<p class="label label-h"> Post editor </p> <p class="label label-h"> Post editor </p>
<div class="container">
<p><span class="label">Post preview</span> <input type="checkbox" id="optPostPreview" /></p>
</div>
<div class="container"> <div class="container">
<form action="" id="unicodeConversionOpt"> <form action="" id="unicodeConversionOpt">
<p class="label">Automatic unicode conversion options</p> <p class="label">Automatic unicode conversion options</p>

43
theme_calm/css/style.css
Unescape View File

@ -776,6 +776,15 @@ textarea.splited-post {
box-shadow: none!important; box-shadow: none!important;
height: 28px; height: 28px;
} }
#post-preview {
background-color: #F2FFBA;
border: solid 1px #B4C669;
font-size: 11px;
margin: 4px 0;
padding: 4px;
}
.splited-post-counter { .splited-post-counter {
color: rgba(0, 0, 0, 0.3); color: rgba(0, 0, 0, 0.3);
font-weight: bold; font-weight: bold;
@ -1252,8 +1261,9 @@ textarea.splited-post {
{ {
color: #76b2ce; color: #76b2ce;
} }
/* external http links */ /* external http links */
.post-text a[href^="http"] { .post-text a[href^="http"], #post-preview a[href^="http"] {
font: italic 13px "Open Sans", sans-serif; font: italic 13px "Open Sans", sans-serif;
text-decoration: none; text-decoration: none;
color: #b46e67; color: #b46e67;
@ -1263,11 +1273,13 @@ textarea.splited-post {
-o-transition: all 200ms; -o-transition: all 200ms;
transition: all 200ms; transition: all 200ms;
} }
.post-text a[href^="http"]:hover{
.post-text a[href^="http"]:hover, #post-preview a[href^="http"]:hover {
color: #e18881; color: #e18881;
opacity: .8; opacity: .8;
} }
.post-text a[href^="http"]:after {
.post-text a[href^="http"]:after, #post-preview a[href^="http"]:after {
content: ''; content: '';
display: inline-block; display: inline-block;
position: relative; position: relative;
@ -1284,10 +1296,13 @@ textarea.splited-post {
-o-transition: all 200ms; -o-transition: all 200ms;
transition: all 200ms; transition: all 200ms;
} }
.post-text a[href^="http"]:hover:after {
.post-text a[href^="http"]:hover:after, #post-preview a[href^="http"]:hover:after {
opacity: .8; opacity: .8;
} }
.post-text a[href^="#profile"], .follow-suggestions a[href^="#profile"] {
.post-text a[href^="#profile"], .follow-suggestions a[href^="#profile"],
#post-preview a[href^="#profile"] {
color: #5e8da4; color: #5e8da4;
text-decoration: none; text-decoration: none;
-webkit-transition: all 200ms; -webkit-transition: all 200ms;
@ -1296,10 +1311,18 @@ textarea.splited-post {
-o-transition: all 200ms; -o-transition: all 200ms;
transition: all 200ms; transition: all 200ms;
} }
.post-text a[href^="#profile"]:hover, .follow-suggestions a[href^="#profile"]:hover {
.post-text a[href^="#profile"]:hover, .follow-suggestions a[href^="#profile"]:hover,
#post-preview a[href^="#profile"]:hover {
color: #76b2ce; color: #76b2ce;
} }
.toptrends-list a[href^="#hashtag"], .post-text a[href^="#hashtag"]{
#post-preview a {
font-size: 11px;
}
.toptrends-list a[href^="#hashtag"], .post-text a[href^="#hashtag"],
#post-preview a[href^="#hashtag"] {
color: #5e72a4; color: #5e72a4;
text-decoration: none; text-decoration: none;
-webkit-transition: all 200ms; -webkit-transition: all 200ms;
@ -1308,7 +1331,9 @@ textarea.splited-post {
-o-transition: all 200ms; -o-transition: all 200ms;
transition: all 200ms; transition: all 200ms;
} }
.toptrends-list a[href^="#hashtag"]:hover, .post-text a[href^="#hashtag"]:hover{
.toptrends-list a[href^="#hashtag"]:hover, .post-text a[href^="#hashtag"]:hover,
#post-preview a[href^="#hashtag"]:hover {
color: #768fce; color: #768fce;
} }
@ -1320,10 +1345,12 @@ textarea.splited-post {
-o-transition: all 200ms; -o-transition: all 200ms;
transition: all 200ms; transition: all 200ms;
} }
.post-info a[href^="#profile"]:hover, .followers a[href^="#profile"]:hover, a[href^="#profile"].post-retransmited-by:hover { .post-info a[href^="#profile"]:hover, .followers a[href^="#profile"]:hover, a[href^="#profile"].post-retransmited-by:hover {
color: #5e8da4; color: #5e8da4;
text-decoration: none; text-decoration: none;
} }
/* Inpost previw */ /* Inpost previw */
.preview-container .preview-container
{ {

16
theme_nin/css/style.css
Unescape View File

@ -2270,6 +2270,22 @@ textarea.splited-post {
height: 28px; height: 28px;
} }
#post-preview {
background-color: #FCFFF3;
border: solid 1px #ECEFE3;
font-size: 12px;
margin: 4px 0;
padding: 4px;
}
#post-preview a {
color: #AAA;
}
#post-preview a:hover {
color: #B4C669;
}
/* line 384, ../sass/style.sass */ /* line 384, ../sass/style.sass */
.splited-post-counter { .splited-post-counter {
color: rgba(0, 0, 0, 0.3); color: rgba(0, 0, 0, 0.3);

11
theme_nin/sass/style.sass
Unescape View File

@ -354,6 +354,17 @@ ul.userMenu-search-profiles
&:focus &:focus
border-bottom: solid 2px $color-green border-bottom: solid 2px $color-green
#post-preview
background-color: #FCFFF3
border: solid 1px #ECEFE3
font-size: 12px
margin: 4px 0
padding: 4px
a
color: #AAA
a:hover
color: $color-green
#postboard-top #postboard-top
clear: both clear: both
position: relative position: relative

5
tmobile.html
Unescape View File

@ -718,6 +718,11 @@
</div> </div>
</li> <!-- post-template --> </li> <!-- post-template -->
<div id="post-preview-template">
<div id="post-preview">
</div>
</div>
<li id="post-template-post" class="module post" data-time=""> <li id="post-template-post" class="module post" data-time="">
<img class="avatar" src="img/grayed_avatar_placeholder_24.png" alt="user-photo"/> <img class="avatar" src="img/grayed_avatar_placeholder_24.png" alt="user-photo"/>
<div class="post-data" data-userpost="" data-content_to_rt="" data-content_to_sigrt="" <div class="post-data" data-userpost="" data-content_to_rt="" data-content_to_sigrt=""

Write Preview
Loading…
Cancel
Save