Switch between pictures,full-height pictures in timeline,remove duplicated threads,many small bugfixes

README.md

@@ -26,6 +26,7 @@ We moved our instances list to a wiki page: https://notabug.org/halcyon-suite/ha
 or read our new documentation pages to install it manually: https://www.halcyon.social/documentation.php?page=install
 
 ## Blog
+- Release of Version 2.2.4 - Easily switch between pictures in overlay,show pictures in full height in timeline,duplicated threads removed,many smaller bugfixes
 - Release of Version 2.2.3 - Fixed login with Pleroma,fixed compatibility with Pawoo (older Mastodon),added support for prefers-color-scheme,some more fixes
 - Our new information website [halcyon.social](https://www.halcyon.social) came online
 - Release of Version 2.2.2 - Fix autocomplete,fix double scrollbars in overlay,add emojis at cursor position,confirm when closing compose window,add czech translation

assets/css/style.css

@@ -872,6 +872,10 @@ position: relative;
 box-sizing: border-box;
 border: 1px solid #DCDFE1;
 }
+.media_views.media_full_height {
+height:auto;
+min-height:336px;
+}
 .media_views .media_attachment {
 overflow: hidden;
 width: 100%;
@@ -955,6 +959,21 @@ height: calc( 100% / 3 );
 .media_views[media_length="4"] .media_attachments_right .media_attachment[mediacount="3"] {
 padding-bottom: 0;
 }
+.media_backward,.media_forward {
+color:#CCCCCC;
+position:absolute;
+top:50%;
+cursor:pointer;
+}
+.media_backward {
+left:-50px;
+}
+.media_forward {
+right:-50px;
+}
+.media_backward:hover,.media_forward:hover {
+color:#FFFFFF;
+}
 .timeline .notice_entry {
 padding: 10px 12px 10px 70px;
 font-size: 14px;
@@ -2258,7 +2277,6 @@ padding: 12px;
 .toot_entry.descendants_status .toot_entry_body::after {
 content: "";
 display: block;
-border: 2px solid #76BFEC;
 position: absolute;
 border-radius: 2px;
 position: absolute;
@@ -2266,6 +2284,10 @@ left: 62px;
 height: calc(100% - 57px);
 top: 68px;
 }
+.toot_entry.ancestors_status .toot_entry_body::after,
+.toot_entry.descendants_status.direct_answer .toot_entry_body::after {
+border: 2px solid #76BFEC;
+}
 .toot_entry.ancestors_status.default_padding .toot_entry_body::after,
 .toot_entry.descendants_status.default_padding .toot_entry_body::after {
 left: 35px;

assets/js/halcyon/halcyonSettings.js

@@ -207,6 +207,12 @@ $("#setting_show_content_warning")[0].checked = true;
 if(localStorage.setting_show_nsfw == "true") {
 $("#setting_show_nsfw")[0].checked = true;
 }
+if(localStorage.setting_full_height == "true") {
+$("#setting_full_height")[0].checked = true;
+}
+if(localStorage.setting_thread_view == "true") {
+$("#setting_thread_view")[0].checked = true;
+}
 });
 $(document).on('change',".post_streaming_wrap input[name='post_streaming']:checked", function(e) {
 localStorage.setItem("setting_post_stream", $(this).val());
@@ -330,6 +336,26 @@ localStorage.setItem("setting_show_nsfw","false");
 putMessage(__("NSFW content hidden"));
 }
 });
+$("#setting_full_height").change(function() {
+if(this.checked) {
+localStorage.setItem("setting_full_height","true");
+putMessage(__("Pictures shown in full height"));
+}
+else {
+localStorage.setItem("setting_full_height","false");
+putMessage(__("Pictures shown in default height"));
+}
+});
+$("#setting_thread_view").change(function() {
+if(this.checked) {
+localStorage.setItem("setting_thread_view","true");
+putMessage(__("Threads shown in thread view"));
+}
+else {
+localStorage.setItem("setting_thread_view","false");
+putMessage(__("Threads shown in chronological order"));
+}
+});
 }
 else if(window.location.pathname == "/settings/filters") {
 $('#js-settings_nav_filters').toggleClass('view');

assets/js/halcyon/halcyonTemplates.js

@@ -1,18 +1,24 @@
 function mediaattachments_template(status) {
 let media_views = "";
 var border = "";
+var mvfullheight = "";
+var dsplength = status.media_attachments.length;
 if(status.media_attachments[0].remote_url != null) {
 status.media_attachments[0].url = status.media_attachments[0].remote_url;
 }
 if(status.media_attachments[0].type === "video" && localStorage.setting_play_video != "false") border = ' style="border:0;border-radius:0"';
+if(localStorage.setting_full_height == "true") {
+mvfullheight = " media_full_height";
+dsplength = "1";
+}
 if(status.media_attachments[0].url === "/files/original/missing.png") {
 return "";
 }
 else if(!status.sensitive || localStorage.setting_show_nsfw == "true") {
-media_views = `<div class='media_views' sid="${status.id}" media_length='${status.media_attachments.length}'${border}>`;
+media_views = `<div class='media_views${mvfullheight}' sid="${status.id}" media_length='${dsplength}'${border}>`;
 }
 else {
-media_views = `<div class='media_views sensitive' media_length='${status.media_attachments.length}'${border}>
+media_views = `<div class='media_views sensitive${mvfullheight}' media_length='${dsplength}'${border}>
 <div class='sensitive_alart'>
 <span class="text1">${__('Sensitive content')}</span>
 <span class="text2">${__('Click to view')}</span>
@@ -1202,7 +1208,7 @@ const html=$(`
 <div class="icon_box">
 <img src="${status.reblog.account.avatar}">
 </div>
-<a href="${status_account_link}">
+<a href="${status_reblog_account_link}">
 <span class="displayname emoji_poss">
 ${status.reblog.account.display_name}
 </span>
@@ -1341,21 +1347,34 @@ html.find(".toot_article").append(media_views);
 return html
 }
 }
-function media_template(status, mediaURL) {
-if ( !status ) {
+function media_template(status,media) {
+if(!status) {
 const html = (`
 <div class="media_detail">
 <div class="media_box">
-<img src="${mediaURL}" />
+<img src="${media}">
 </div>
 </div>`);
 return $(html)
-} else {
+}
+else {
+var pictures = new Array;
+var hidebackward = "";
+var hideforward ="";
+for(var i=0;i<status.media_attachments.length;i++) {
+if(status.media_attachments[i].remote_url != null) {
+status.media_attachments[i].url = status.media_attachments[i].remote_url;
+pictures.push(status.media_attachments[i].url);
+}
+}
+if(media == 0) hidebackward = " style='display:none'";
+if(media == status.media_attachments.length-1) hideforward = " style='display:none'";
 const status_template = timeline_template(status).html(),
-html = (`
-<div class="media_detail">
+html = (`<div class="media_detail" pictures='${JSON.stringify(pictures)}' cid="${media}">
 <div class="media_box">
-<img src="${mediaURL}" />
+<span class="media_backward"${hidebackward}><i class="fa fa-2x fa-chevron-left"></i></span>
+<img src="${status.media_attachments[media].url}">
+<span class="media_forward"${hideforward}><i class="fa fa-2x fa-chevron-right"></i></span>
 </div>
 <div class="toot_entry" sid="${status.id}">
 ${status_template}

assets/js/halcyon/halcyonUI.js

@@ -281,7 +281,7 @@ if(load_options === undefined) {
 var load_options = [];
 }
 api.get(level, load_options, function(statuses) {
-let reply_sources = {};
+timeline_hide_status = new Array;
 for(let i in statuses) {
 var filterstatus = false;
 for(var a=0;a<current_filters.length;a++) {
@@ -297,25 +297,31 @@ if(statuses[i].content.match(new RegExp("[^a-zA-Z1-9]"+current_filters[a].phrase
 if(filterstatus == false && !(show_replies == "false" && statuses[i].in_reply_to_id) && !(localStorage.setting_show_bots == "false" && statuses[i].account.bot == true && !level.match(/accounts\/\d+\/statuses/)) && !(statuses[i].visibility == "direct" && level == "timelines/home")) {
 timeline_template(statuses[i]).appendTo("#js-timeline");
 if(statuses[i].in_reply_to_id && level === "timelines/home" | level === "timelines/public") {
-if(!reply_sources[statuses[i].in_reply_to_id] & !$(".toot_entry[sid='"+statuses[i].in_reply_to_id+"']").length) {
-reply_sources[statuses[i].in_reply_to_id] = statuses[i].id;
-api.get('statuses/'+statuses[i].in_reply_to_id, function(in_reply_statuses) {
+if(localStorage.setting_thread_view == "true") {
+(function(this_id) {
+api.get('statuses/'+statuses[i].id+"/context", function(context) {
+console.log(this_id);
+for(var b=0;b<context.ancestors.length;b++) {
 var filterreplystatus = false;
 for(var a=0;a<current_filters.length;a++) {
 if(current_filters[a].context.indexOf("thread") != -1) {
 if(current_filters[a].whole_word == false) {
-if(in_reply_statuses.content.match(new RegExp(current_filters[a].phrase))) filterreplystatus = true;
+if(context.ancestors[b].content.match(new RegExp(current_filters[a].phrase))) filterreplystatus = true;
 }
 else {
-if(in_reply_statuses.content.match(new RegExp("[^a-zA-Z1-9]"+current_filters[a].phrase+"[^a-zA-Z1-9]"))) filterreplystatus = true;
+if(context.ancestors[b].content.match(new RegExp("[^a-zA-Z1-9]"+current_filters[a].phrase+"[^a-zA-Z1-9]"))) filterreplystatus = true;
 }
 }
 }
 if(filterreplystatus == false) {
-$("#js-timeline .toot_entry[sid='"+reply_sources[in_reply_statuses.id]+"']").before(context_template(in_reply_statuses, 'ancestors_status default_padding'));
+$("#js-timeline .toot_entry[sid='"+context.ancestors[b].id+"']").remove();
+$("#js-timeline .toot_entry[sid='"+this_id+"']").before(context_template(context.ancestors[b], 'ancestors_status default_padding'));
+timeline_hide_status.push(context.ancestors[b].id);
 replace_emoji();
 }
+}
 });
+})(statuses[i].id);
 }
 }
 }
@@ -335,7 +341,6 @@ isSyncing = true;
 load_options.unshift( {name:"max_id",data:links['next'].match(/max_id=(.+)&?/)[1]} );
 api.get(level, load_options, function(statuses) {
 if (statuses.length) {
-let reply_sources = {};
 for(let i in statuses) {
 var filterstatus = false;
 for(var a=0;a<current_filters.length;a++) {
@@ -348,28 +353,34 @@ if(statuses[i].content.match(new RegExp("[^a-zA-Z1-9]"+current_filters[a].phrase
 }
 }
 }
-if(filterstatus == false && !(show_replies == "false" && statuses[i].in_reply_to_id) && !(localStorage.setting_show_bots == "false" && statuses[i].account.bot == true && !level.match(/accounts\/\d+\/statuses/)) && !(statuses[i].visibility == "direct" && level == "timelines/home")) {
+if(filterstatus == false && timeline_hide_status.indexOf(statuses[i]) == -1 && !(show_replies == "false" && statuses[i].in_reply_to_id) && !(localStorage.setting_show_bots == "false" && statuses[i].account.bot == true && !level.match(/accounts\/\d+\/statuses/)) && !(statuses[i].visibility == "direct" && level == "timelines/home")) {
 timeline_template(statuses[i]).appendTo("#js-timeline");
 if(statuses[i].in_reply_to_id && level === "timelines/home" | level === "timelines/public") {
-if(!reply_sources[statuses[i].in_reply_to_id] & !$(".toot_entry[sid='"+statuses[i].in_reply_to_id+"']").length) {
-reply_sources[statuses[i].in_reply_to_id] = statuses[i].id;
-api.get('statuses/'+statuses[i].in_reply_to_id, function(in_reply_statuses) {
+if(localStorage.setting_thread_view == "true") {
+(function(this_id) {
+api.get('statuses/'+statuses[i].id+"/context", function(context) {
+console.log(this_id);
+for(var b=0;b<context.ancestors.length;b++) {
 var filterreplystatus = false;
 for(var a=0;a<current_filters.length;a++) {
 if(current_filters[a].context.indexOf("thread") != -1) {
 if(current_filters[a].whole_word == false) {
-if(in_reply_statuses.content.match(new RegExp(current_filters[a].phrase))) filterreplystatus = true;
+if(context.ancestors[b].content.match(new RegExp(current_filters[a].phrase))) filterreplystatus = true;
 }
 else {
-if(in_reply_statuses.content.match(new RegExp("[^a-zA-Z1-9]"+current_filters[a].phrase+"[^a-zA-Z1-9]"))) filterreplystatus = true;
+if(context.ancestors[b].content.match(new RegExp("[^a-zA-Z1-9]"+current_filters[a].phrase+"[^a-zA-Z1-9]"))) filterreplystatus = true;
 }
 }
 }
 if(filterreplystatus == false) {
-$("#js-timeline .toot_entry[sid='"+reply_sources[in_reply_statuses.id]+"']").before(context_template(in_reply_statuses, 'ancestors_status default_padding'));
+$("#js-timeline .toot_entry[sid='"+context.ancestors[b].id+"']").remove();
+$("#js-timeline .toot_entry[sid='"+this_id+"']").before(context_template(context.ancestors[b], 'ancestors_status default_padding'));
+timeline_hide_status.push(context.ancestors[b].id);
 replace_emoji();
 }
+}
 });
+})(statuses[i].id);
 }
 }
 }
@@ -1120,7 +1131,12 @@ if(status.descendants[i].content.match(new RegExp("[^a-zA-Z1-9]"+current_filters
 }
 }
 }
-if(filterreplystatus == false) context_template(status.descendants[i], 'descendants_status').appendTo("#js-overlay_content .temporary_object .toot_detail_wrap");
+if(filterreplystatus == false) {
+if(i < status.descendants.length-1 && status.descendants[i].id == status.descendants[parseInt(i)+1].in_reply_to_id) {
+context_template(status.descendants[i], 'descendants_status direct_answer').appendTo("#js-overlay_content .temporary_object .toot_detail_wrap");
+}
+else context_template(status.descendants[i], 'descendants_status').appendTo("#js-overlay_content .temporary_object .toot_detail_wrap");
+}
 }
 }
 replaceInternalLink();
@@ -1140,18 +1156,19 @@ $(document).on('click','.toot_entry', function(e) {
 setOverlayStatus($(this).attr('sid'));
 });
 })
-function setOverlayMedia(sid,url) {
+function setOverlayMedia(sid,mediacount) {
 $("#js-overlay_content .temporary_object").empty();
 $('#js-overlay_content_wrap').addClass('view');
 $('#js-overlay_content_wrap').addClass('black_08');
 $('#js-overlay_content .temporary_object').addClass('visible');
 api.get("statuses/"+sid, function(status) {
-if ( !status.reblog ) {
-media_template(status, url).appendTo("#js-overlay_content .temporary_object");
+if(!status.reblog) {
+media_template(status,mediacount).appendTo("#js-overlay_content .temporary_object");
 replaceInternalLink();
 replace_emoji();
-} else {
-media_template(status.reblog, url).appendTo("#js-overlay_content .temporary_object");
+}
+else {
+media_template(status.reblog,mediacount).appendTo("#js-overlay_content .temporary_object");
 replaceInternalLink();
 replace_emoji();
 }
@@ -1160,7 +1177,7 @@ replace_emoji();
 $(function() {
 $(document).on('click','.media_attachment[otype="image"]', function(e) {
 e.stopPropagation();
-setOverlayMedia($(this).attr('sid'),$(this).attr('url'));
+setOverlayMedia($(this).attr('sid'),$(this).attr('mediacount'));
 $('.media_detail .toot_entry .media_views').addClass('invisible');
 });
 })
@@ -1471,7 +1488,9 @@ $('#header_status_form .status_textarea textarea').trigger({"type":"keyup","key"
 }
 $('#header_status_form .status_bottom').removeClass('invisible');
 $('#header_status_form .submit_status_label').addClass('active_submit_button');
-$('#header_status_form .character_count').html(current_instance_charlimit);
+const textCount = $('#header_status_form textarea').val().length + $('#header_status_form .status_spoiler').val().length;
+let textLen = (current_instance_charlimit - textCount);
+$('#header_status_form .character_count').html(textLen);
 $('#header_status_emoji').lsxEmojiPicker({
 closeOnSelect:true,
 twemoji:!checkEmojiSupport(),
@@ -1601,7 +1620,9 @@ $('#reply_status_form .status_textarea textarea').trigger({"type":"keyup","key":
 $('#reply_status_form .status_bottom').removeClass('invisible');
 $('#reply_status_form .submit_status_label').addClass('active_submit_button');
 $('#reply_status_form textarea').val(replyto);
-$('#reply_status_form .character_count').html(current_instance_charlimit);
+const textCount = $('#reply_status_form textarea').val().length + $('#reply_status_form .status_spoiler').val().length;
+let textLen = (current_instance_charlimit - textCount);
+$('#reply_status_form .character_count').html(textLen);
 $('label[for=reply_status_emoji]').click(function(e) {$('#reply_status_emoji').trigger('click',e)});
 $('#reply_status_emoji').lsxEmojiPicker({
 closeOnSelect:true,
@@ -1787,7 +1808,9 @@ $('#single_reply_status_form .expand_privacy_menu_button > i').attr('class', "fa
 $('#single_reply_status_form').attr('tid',sid);
 $('.single_reply_status .single_reply_status_header span').addClass("emoji_poss").html(__("Reply to")+" "+display_name);
 $('#single_reply_status_form textarea').val(replyto);
-$('#single_reply_status_form .character_count').html(current_instance_charlimit);
+const textCount = $('#single_reply_status_form textarea').val().length + $('#single_reply_status_form .status_spoiler').val().length;
+let textLen = (current_instance_charlimit - textCount);
+$('#single_reply_status_form .character_count').html(textLen);
 $('#single_reply_status_emoji').lsxEmojiPicker({
 closeOnSelect:true,
 twemoji:!checkEmojiSupport(),
@@ -2126,6 +2149,18 @@ $("#js-overlay_content_wrap").attrchange(function(attr) {
 if(attr == "class" && $("#js-overlay_content_wrap").hasClass("view")) $(document.body).css("overflow-y","hidden");
 else $(document.body).css("overflow-y","auto");
 });
+$(document).on("click",".media_detail .media_backward",function() {
+$(".media_detail").attr("cid",$(".media_detail").attr("cid")-1);
+if($(".media_detail").attr("cid") == 0) $(".media_detail .media_backward").fadeOut();
+$(".media_detail .media_forward").fadeIn();
+$(".media_detail .media_box img").attr("src",JSON.parse($(".media_detail").attr("pictures"))[$(".media_detail").attr("cid")]);
+});
+$(document).on("click",".media_detail .media_forward",function() {
+$(".media_detail").attr("cid",parseInt($(".media_detail").attr("cid"))+1);
+if($(".media_detail").attr("cid") == JSON.parse($(".media_detail").attr("pictures")).length-1) $(".media_detail .media_forward").fadeOut();
+$(".media_detail .media_backward").fadeIn();
+$(".media_detail .media_box img").attr("src",JSON.parse($(".media_detail").attr("pictures"))[$(".media_detail").attr("cid")]);
+});
 shortcut.add("n",function() {
 $("#creat_status").click();
 },{

authorize/mastodon.php

@@ -19,7 +19,8 @@ $this->instances[$domain] = $res['html'];
 file_put_contents($this->datadir."/".substr($domain,8).".txt",json_encode(array("client_id" => $res['html']['client_id'],"client_secret" => $res['html']['client_secret'])));
 }
 else {
-throw new Exception("Invalid instance");
+header("Location: /login/?cause=domain");
+die();
 }
 }
 public function selectInstance($domain) {

login/auth.php

@@ -44,6 +44,8 @@ localStorage.setItem('setting_show_replies', 'true');
 localStorage.setItem('setting_show_bots', 'true');
 localStorage.setItem('setting_show_content_warning', 'false');
 localStorage.setItem('setting_show_nsfw', 'false');
+localStorage.setItem('setting_full_height', 'false');
+localStorage.setItem('setting_thread_view', 'true');
 localStorage.setItem('setting_compose_autocomplete', 'true');
 localStorage.setItem('setting_play_gif','true');
 localStorage.setItem('setting_play_video','true');

login/login.php

@@ -209,7 +209,7 @@ var cause = "<?= htmlspecialchars((string)filter_input(INPUT_GET, 'cause'), ENT_
 if(cause === "domain") {
 $('.login_form_main').addClass('error');
 $('.session_aleart').removeClass('invisible');
-$('.session_aleart > span').text('This instance does not exsist.');
+$('.session_aleart > span').text('This instance does not exist.');
 }
 });
 $(document).on('click','.login_form_main', function(e) {

media/ytclass.php

@@ -59,7 +59,7 @@ private $itag_ext = array(
 function __construct(){
 $this->cache_dir = dirname(__FILE__).'/.cache';
 $this->cookie_dir = sys_get_temp_dir();
-if(!file_exists($this->cache_dir)) {
+if(!file_exists($this->cache_dir) && is_writeable(dirname(__FILE__))) {
 mkdir($this->cache_dir,0755);
 }
 }
@@ -95,7 +95,7 @@ $vInfo['ChannelName'] = $videoData['author'];
 $vInfo['ChannelId'] = $videoData['ucid'];
 $vInfo['Thumbnail'] = str_replace('default', 'maxresdefault', $videoData['thumbnail_url']);
 $vInfo['Duration'] = $videoData['length_seconds'];
-$vInfo['Rating'] = $videoData['avg_rating'];
+//$vInfo['Rating'] = $videoData['avg_rating'];
 }
 if (isset($videoData['url_encoded_fmt_stream_map']) && isset($videoData['adaptive_fmts'])) {
 $draft1 = explode(',',$videoData['url_encoded_fmt_stream_map']);
@@ -177,6 +177,7 @@ return unserialize(file_get_contents($cache_player));
 $js_code = $this->curlGet($playerLink);
 $instructions = $this->sig_js_decode($js_code);
 if($instructions){
+if(file_exists($this->cache_dir) && is_writeable($this->cache_dir))
 file_put_contents($cache_player, serialize($instructions));
 return $instructions;
 }

settings_appearance.php

@@ -101,6 +101,28 @@
 </div>
 </div>
 </div>
+<div style="float:left;width:50%;text-align:right;margin-top:16px">
+<h3><?=_('Show pictures in full height')?></h3>
+</div>
+<div class="full_height_wrap" style="float:left;width:50%">
+<div class="switch">
+<input type="checkbox" id="setting_full_height">
+<div class="switch-btn">
+<span></span>
+</div>
+</div>
+</div>
+<div style="float:left;width:50%;text-align:right;margin-top:16px">
+<h3><?=_('Show threads in thread view in timeline')?></h3>
+</div>
+<div class="thread_view_wrap" style="float:left;width:50%">
+<div class="switch">
+<input type="checkbox" id="setting_thread_view">
+<div class="switch-btn">
+<span></span>
+</div>
+</div>
+</div>
 <span style="visibility:hidden">-</span>
 </div>
 </article>

version.txt

@@ -1 +1 @@
-2.2.3
+2.2.4