Visibility and CSS tweaks
FossilOrigin-Name: d45822206ba3c4bb2be994e4443a909f5c6d5896642703f11d901a2f5f1a37ab
This commit is contained in:
parent
a11470cfd7
commit
e19f1f854e
5 changed files with 66 additions and 136 deletions
26
dist/treebird.css
vendored
26
dist/treebird.css
vendored
|
@ -815,9 +815,9 @@ input[type=checkbox].hidden:not(:checked) + .reply-form
|
|||
.status.focused,
|
||||
.status:target
|
||||
{
|
||||
background-color: #ffdddd;
|
||||
border-left: 3px solid #aa0000;
|
||||
padding-left: 7px;
|
||||
background: #ffdddd;
|
||||
border-left: 2px solid #aa0000;
|
||||
padding-left: 8px;
|
||||
}
|
||||
|
||||
.notification-info + .status,
|
||||
|
@ -1034,10 +1034,17 @@ input[type=checkbox].hidden:not(:checked) + .reply-form
|
|||
cursor: pointer;
|
||||
color: #808080;
|
||||
display: inline;
|
||||
font-size: 12px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.status-visibility .visibility
|
||||
{
|
||||
stroke: #808080;
|
||||
vertical-align: middle;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
}
|
||||
|
||||
.status-interact
|
||||
{
|
||||
margin: 6px 0 0 0;
|
||||
|
@ -1461,7 +1468,7 @@ p}
|
|||
.status-interact .statbtn
|
||||
{
|
||||
display: block;
|
||||
padding: 3px 2px 5px;
|
||||
padding: 3px 0px 5px;
|
||||
min-width: 42px;
|
||||
}
|
||||
|
||||
|
@ -1469,6 +1476,8 @@ p}
|
|||
{
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
stroke: #666;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.view-btn
|
||||
|
@ -1583,6 +1592,7 @@ p}
|
|||
padding-top: 3px;
|
||||
font-size: 12px;
|
||||
padding-bottom: 3px;
|
||||
padding-right: 7px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
@ -1635,12 +1645,6 @@ p}
|
|||
border: 1px solid #cacaca;
|
||||
}
|
||||
|
||||
.emoji-btn
|
||||
{
|
||||
position: relative;
|
||||
top: 2px;
|
||||
}
|
||||
|
||||
/* Emojo picker */
|
||||
.emoji-picker
|
||||
{
|
||||
|
|
|
@ -4,7 +4,7 @@ use warnings;
|
|||
|
||||
use Exporter 'import';
|
||||
|
||||
our @EXPORT = qw( &get_icon &get_icon_svg &get_icon_png );
|
||||
our @EXPORT = qw( &get_icon &get_icon_svg &get_icon_png &visibility_to_icon );
|
||||
|
||||
sub get_icon
|
||||
{
|
||||
|
@ -18,12 +18,48 @@ sub get_icon_svg
|
|||
{
|
||||
my %res = (
|
||||
repeat => '<svg class="repeat" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 2.1l4 4-4 4"/><path d="M3 12.2v-2a4 4 0 0 1 4-4h12.8M7 21.9l-4-4 4-4"/><path d="M21 11.8v2a4 4 0 0 1-4 4H4.2"/></svg>',
|
||||
|
||||
like => '<svg class="like" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg>',
|
||||
|
||||
expand => '<svg class="expand" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 3h6v6M14 10l6.1-6.1M9 21H3v-6M10 14l-6.1 6.1"/></svg>',
|
||||
|
||||
reply => '<svg class="reply" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 9l6 6-6 6"/><path d="M4 4v7a4 4 0 0 0 4 4h11"/></svg>',
|
||||
|
||||
emoji => '<svg class="emoji-btn" width="20" height="20" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="12" r="10"/><g><line x1="9" x2="9" y1="6.9367" y2="11.755" stroke-width="1.7916"/><line x1="15" x2="15" y1="6.9367" y2="11.755" stroke-width="1.7916"/><path d="m7.0891 15.099s4.7206 4.7543 9.7109 0" stroke-linecap="round" stroke-linejoin="miter" stroke-width="1.9764"/></g></svg>',
|
||||
|
||||
likeboost => '<svg class="one-click-software" width="20" height="20" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" version="1.1" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g><g stroke-width="1.98"><path d="m19.15 8.5061 2.7598 2.7598-2.7598 2.7598"/><path d="m14.756 11.325s2.5484-0.05032 6.3258 0.01026m-15.639 10.807-2.7598-2.7598 2.7598-2.7598"/><path d="m22.4 15.327v1.2259c0 1.156-1.2356 2.7598-2.7598 2.7598h-16.664"/></g><polygon transform="matrix(.60736 0 0 .60736 .60106 .63577)" points="18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2 15.09 8.26 22 9.27 17 14.14" stroke-width="2.9656"/></g></svg>',
|
||||
|
||||
fileclip => '<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"></path></svg>',
|
||||
|
||||
'local' => '<svg class="visibility vis-local" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 9v11a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V9"/><path d="M9 22V12h6v10M2 10.6L12 2l10 8.6"/></svg>',
|
||||
|
||||
direct => '<svg class="visibility vis-direct xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>',
|
||||
|
||||
private => '<svg class="visibility vis-private" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg>',
|
||||
|
||||
list => '<svg class="visibility vis-list" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="8" y1="6" x2="21" y2="6"></line><line x1="8" y1="12" x2="21" y2="12"></line><line x1="8" y1="18" x2="21" y2="18"></line><line x1="3" y1="6" x2="3.01" y2="6"></line><line x1="3" y1="12" x2="3.01" y2="12"></line><line x1="3" y1="18" x2="3.01" y2="18"></line></svg>',
|
||||
|
||||
unlisted => '<svg class="visibility vis-unlisted" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 9.9-1"></path></svg>',
|
||||
|
||||
public => '<svg class="visibility vis-public" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="2" y1="12" x2="22" y2="12"></line><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path></svg>',
|
||||
);
|
||||
|
||||
$res{$_[0]};
|
||||
}
|
||||
|
||||
sub visibility_to_icon
|
||||
{
|
||||
# I thought of an array, but I don't want to call get_icon UNLESS
|
||||
# we know the visibility
|
||||
my $vis = $_[0];
|
||||
|
||||
return get_icon('public') if $vis == 1;
|
||||
return get_icon('unlisted') if $vis == 2;
|
||||
return get_icon('private') if $vis == 3;
|
||||
return get_icon('list') if $vis == 4;
|
||||
return get_icon('direct') if $vis == 5;
|
||||
return get_icon('local') if $vis == 6;
|
||||
|
||||
# Assume local for anything else, because well... I'm not sure
|
||||
get_icon('local');
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
package status;
|
||||
use strict;
|
||||
use warnings;
|
||||
use icons 'get_icon';
|
||||
use icons qw( get_icon visibility_to_icon );
|
||||
use Exporter 'import';
|
||||
|
||||
our @EXPORT = qw( status );
|
||||
|
@ -17,6 +17,7 @@ sub status
|
|||
ssn => $ssn,
|
||||
status => $status,
|
||||
icon => \&get_icon,
|
||||
vis_to_icon => \&visibility_to_icon,
|
||||
);
|
||||
|
||||
to_template(\%vars, \$data->{'status.tt'});
|
||||
|
|
121
src/status.c
121
src/status.c
|
@ -265,124 +265,7 @@ char* construct_interaction_buttons(struct session* ssn,
|
|||
size_t* size,
|
||||
uint8_t flags)
|
||||
{
|
||||
int use_img = ssn->config.interact_img;
|
||||
char* interaction_html;
|
||||
char* repeat_btn;
|
||||
char* like_btn;
|
||||
char* likeboost_html = NULL;
|
||||
char* reply_count = NULL;
|
||||
char* repeat_count = NULL;
|
||||
char* reply_btn;
|
||||
char* favourites_count = NULL;
|
||||
char* emoji_picker_html = NULL;
|
||||
char* reactions_btn_html = NULL;
|
||||
char* time_str;
|
||||
int show_nums = (flags & STATUS_NO_DOPAMEME) != STATUS_NO_DOPAMEME &&
|
||||
ssn->config.stat_dope;
|
||||
size_t s;
|
||||
|
||||
// Emojo picker
|
||||
if ((flags & STATUS_EMOJI_PICKER) == STATUS_EMOJI_PICKER)
|
||||
{
|
||||
emoji_picker_html = construct_emoji_picker(status->id, NULL);
|
||||
}
|
||||
|
||||
struct reactions_btn_template tdata = {
|
||||
.prefix = config_url_prefix,
|
||||
.status_id = status->id,
|
||||
.emoji_picker = emoji_picker_html
|
||||
};
|
||||
reactions_btn_html = tmpl_gen_reactions_btn(&tdata, NULL);
|
||||
|
||||
if (show_nums)
|
||||
{
|
||||
if (status->replies_count)
|
||||
easprintf(&reply_count, NUM_STR, status->replies_count);
|
||||
if (status->reblogs_count)
|
||||
easprintf(&repeat_count, NUM_STR, status->reblogs_count);
|
||||
if (status->favourites_count)
|
||||
easprintf(&favourites_count, NUM_STR, status->favourites_count);
|
||||
}
|
||||
|
||||
struct likeboost_template lbdata = {
|
||||
.prefix = config_url_prefix,
|
||||
.status_id = status->id,
|
||||
};
|
||||
likeboost_html = tmpl_gen_likeboost(&lbdata, NULL);
|
||||
|
||||
time_str = reltime_to_str(status->created_at);
|
||||
|
||||
// TODO cleanup?
|
||||
if (use_img)
|
||||
{
|
||||
struct repeat_btn_img_template rpbdata = { .prefix = config_url_prefix, .repeat_active = status->reblogged ? "active" : "" };
|
||||
repeat_btn = tmpl_gen_repeat_btn_img(&rpbdata, NULL);
|
||||
struct like_btn_img_template ldata = { .prefix = config_url_prefix, .favourite_active = status->favourited ? "active" : "" };
|
||||
like_btn = tmpl_gen_like_btn_img(&ldata, NULL);
|
||||
}
|
||||
else {
|
||||
struct repeat_btn_template rpbdata = { .repeat_active = status->reblogged ? "active" : "" };
|
||||
repeat_btn = tmpl_gen_repeat_btn(&rpbdata, NULL);
|
||||
struct like_btn_template ldata = { .favourite_active = status->favourited ? "active" : "" };
|
||||
like_btn = tmpl_gen_like_btn(&ldata, NULL);
|
||||
}
|
||||
|
||||
// Weather it should be a link or a <label> button
|
||||
if ((flags & STATUS_NO_QUICKREPLY) != STATUS_NO_QUICKREPLY)
|
||||
{
|
||||
struct reply_checkbox_template tmpl = {
|
||||
.reply_btn = use_img ? data_reply_btn_img : data_reply_btn,
|
||||
.reply_count = reply_count,
|
||||
.status_id = status->id,
|
||||
};
|
||||
reply_btn = tmpl_gen_reply_checkbox(&tmpl, NULL);
|
||||
}
|
||||
else {
|
||||
struct reply_link_template tmpl = {
|
||||
.prefix = config_url_prefix,
|
||||
.reply_btn = use_img ? data_reply_btn_img : data_reply_btn,
|
||||
.reply_count = reply_count,
|
||||
.status_id = status->id,
|
||||
};
|
||||
reply_btn = tmpl_gen_reply_link(&tmpl, NULL);
|
||||
}
|
||||
|
||||
struct interaction_buttons_template data = {
|
||||
// Icons
|
||||
.reply_btn = reply_btn,
|
||||
.expand_btn = use_img ? data_expand_btn_img : data_expand_btn,
|
||||
.repeat_btn = repeat_btn,
|
||||
.like_btn = like_btn,
|
||||
// Interactions data
|
||||
.prefix = config_url_prefix,
|
||||
.status_id = status->id,
|
||||
.unrepeat = status->reblogged ? "un" : "",
|
||||
.repeats_count = repeat_count,
|
||||
.repeat_text = "Repeat",
|
||||
.unfavourite = status->favourited ? "un" : "",
|
||||
.favourites_count = favourites_count,
|
||||
.favourites_text = "Favorite",
|
||||
.likeboost_btn = (likeboost_html &&
|
||||
ssn->config.stat_oneclicksoftware &&
|
||||
(flags & STATUS_NO_LIKEBOOST) != STATUS_NO_LIKEBOOST ? likeboost_html : ""),
|
||||
.reactions_btn = reactions_btn_html,
|
||||
.rel_time = time_str
|
||||
};
|
||||
|
||||
interaction_html = tmpl_gen_interaction_buttons(&data, size);
|
||||
|
||||
// Cleanup
|
||||
free(emoji_picker_html);
|
||||
free(reply_count);
|
||||
free(repeat_count);
|
||||
free(favourites_count);
|
||||
free(reactions_btn_html);
|
||||
free(likeboost_html);
|
||||
free(time_str);
|
||||
free(reply_btn);
|
||||
free(like_btn);
|
||||
free(repeat_btn);
|
||||
return interaction_html;
|
||||
return "";
|
||||
}
|
||||
|
||||
char* construct_status_interactions(char* status_id,
|
||||
|
@ -875,7 +758,6 @@ char* construct_status(struct session* ssn,
|
|||
free(formatted_display_name);
|
||||
if (serialized_display_name != status->account.display_name)
|
||||
free(serialized_display_name);
|
||||
free(interaction_btns);
|
||||
free(in_reply_to_str);
|
||||
free(attachments);
|
||||
free(post_response);
|
||||
|
@ -1137,6 +1019,7 @@ HV* perlify_status(const struct mstdnt_status* status)
|
|||
hvstores_int(status_hv, "muted", status->muted);
|
||||
hvstores_int(status_hv, "bookmarked", status->bookmarked);
|
||||
hvstores_int(status_hv, "pinned", status->pinned);
|
||||
hvstores_int(status_hv, "visibility", ((int)(status->visibility)));
|
||||
hvstores_int(status_hv, "reblogs_count", status->reblogs_count);
|
||||
hvstores_int(status_hv, "favourites_count", status->favourites_count);
|
||||
hvstores_int(status_hv, "replies_count", status->replies_count);
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
<a class="instance-info" href="$prefix/@[% status.account.acct %]">[% status.account.acct %]</a>
|
||||
<span class="alignend">
|
||||
<div class="menu-container status-visibility">
|
||||
{{%s:visibility}}
|
||||
[% vis_to_icon(status.visibility) %]
|
||||
<div class="menu">
|
||||
<ul>
|
||||
<li>
|
||||
|
@ -67,7 +67,9 @@
|
|||
<td>
|
||||
<label for="status-quickreply-{{%s:status_id}}" class="pointer statbtn reply-btn">
|
||||
[% icon('reply') %]
|
||||
<span class="count">[% status.replies_count %]</span>
|
||||
[% IF status.replies_count %]
|
||||
<span class="count">[% status.replies_count %]</span>
|
||||
[% END %]
|
||||
</label>
|
||||
|
||||
|
||||
|
@ -77,7 +79,9 @@
|
|||
<input class="itype" type="hidden" name="itype" value="{{%s:unrepeat}}repeat">
|
||||
<label class="repeat-btn pointer statbtn">
|
||||
[% icon('repeat') %]
|
||||
<span class="count">[% status.reblogs_count %]</span>
|
||||
[% IF status.reblogs_count %]
|
||||
<span class="count">[% status.reblogs_count %]</span>
|
||||
[% END %]
|
||||
<input class="hidden" type="submit" value="Repeat">
|
||||
</label>
|
||||
</form>
|
||||
|
@ -87,7 +91,9 @@
|
|||
<input class="itype" type="hidden" name="itype" value="{{%s:unfavourite}}like">
|
||||
<label class="pointer statbtn like-btn">
|
||||
[% icon('like') %]
|
||||
<span class="count">[% status.favourites_count %]</span>
|
||||
[% IF status.favourites_count %]
|
||||
<span class="count">[% status.favourites_count %]</span>
|
||||
[% END %]
|
||||
<input class="hidden" type="submit" value="Like">
|
||||
</label>
|
||||
</form>
|
||||
|
|
Loading…
Reference in a new issue