Compare commits

...

17 Commits

Author SHA1 Message Date
Aadil Ayub 38974a8253 Update 'README.md' 2023-05-03 06:16:50 +00:00
Aadil Ayub c95cba3389 add cursor:pointer for button inputs 2022-01-14 17:26:57 +06:00
Aadil Ayub 63aedc7bbe make all media full bleed 2022-01-14 17:11:34 +06:00
Aadil Ayub 45c2a01cac add todo 2022-01-13 22:24:20 +06:00
Aadil Ayub 8a1983b439 add todo 2022-01-13 22:23:01 +06:00
Aadil Ayub 2311b3c74e add todo 2022-01-13 22:22:04 +06:00
Aadil Ayub 690561d1a5 create todo 2022-01-13 22:20:25 +06:00
Aadil Ayub bbe1a96a61 fix typo 2022-01-13 22:10:09 +06:00
Aadil Ayub 0ca9a3c06d align post text and username 2022-01-13 21:54:19 +06:00
Aadil Ayub abf00ad597 reformat scripts.js 2022-01-13 11:09:24 +06:00
Aadil Ayub 63cac05f1a Update settings sidebar 2022-01-13 10:49:40 +06:00
Aadil Ayub 2ebd7ba865 use break-word instead of break-all everywhere 2022-01-13 10:47:26 +06:00
Aadil Ayub 866348e9b5 update settings sidebar and contact info in readme 2022-01-13 10:45:54 +06:00
Aadil Ayub 7b4191c07c update about page 2022-01-13 10:42:33 +06:00
Aadil Ayub ddd5651243 update about page 2022-01-13 10:35:42 +06:00
Aadil Ayub 99765dc4f6 align sidebar with posts column 2022-01-12 19:42:54 +06:00
Aadil Ayub 980d3dff30 update gitignore 2022-01-12 19:42:01 +06:00
13 changed files with 200 additions and 197 deletions

3
.gitignore vendored
View File

@ -1 +1,2 @@
data/merveilles.town.php data/*.php
php-error.log

11
.todo Normal file
View File

@ -0,0 +1,11 @@
Tasks:
☐ Get rid of all inline css
☐ Get rid of all floats
☐ Replace icon set with feather icons
☐ Replace font with Favorit
☐ Style login page
☐ Make site open to home timeline by default
☐ Show login prompt when not logged in instead of showing federated timeline
✔ Add cursor:pointer for all buttons @done(22-01-14 17:26)
☐ Replace loading animation
☐ Implement content warnings properly

View File

@ -8,7 +8,6 @@ DashboardFE should work on a standard LAMP stack with the most common php extens
While the project works with a decent amount of stability, please note that it is still a work in progress, it can contain several not yet detected bugs or missing some features. The project it's in a constant state of change and improvement. While the project works with a decent amount of stability, please note that it is still a work in progress, it can contain several not yet detected bugs or missing some features. The project it's in a constant state of change and improvement.
If you wanna test it first to see if you like it you can check the testing instance here: http://aadils.computer/fedi
# Installation # Installation
@ -35,4 +34,4 @@ Delete everything (except settings.php on root and /data folder) and reupload.
# Contact # Contact
If you wish to make bug reports or suggestions to the project, it is easier if you do them directly to me, writing a message to my current fediverse profile. If you wish to make bug reports or suggestions to the project, it is easier if you do them directly to me, writing a message to my current fediverse profile.
@hideki@gameliberty.club @aadil@merveilles.town

View File

@ -341,7 +341,7 @@ foreach($_GET as $key => $value){
$post = api_get("statuses/".htmlentities($value)); $post = api_get("statuses/".htmlentities($value));
echo "<div class='notifContents' style='max-width:none;'> echo "<div class='notifContents' style='max-width:none;'>
<div style='flex: 0 0 60px; background-size:cover; background-image:url(".$post['account']['avatar']."); border-radius:5px;'></div> <div style='flex: 0 0 60px; background-size:cover; background-image:url(".$post['account']['avatar']."); border-radius:5px;'></div>
<div style='flex: 1; padding-left:5px; padding-right:5px; word-break: break-all; overflow:hidden;'> <div style='flex: 1; padding-left:5px; padding-right:5px; word-break: break-word; overflow:hidden;'>
<span><span style='font-size:12px; font-weight:bold;'><a class='link' style='font-size:12px;' href='?user=9hwsQhjN9oox1iSfK4'>".emojify($post['account']['display_name'],$post['account']['emojis'],20)."</a></span></span> <span><span style='font-size:12px; font-weight:bold;'><a class='link' style='font-size:12px;' href='?user=9hwsQhjN9oox1iSfK4'>".emojify($post['account']['display_name'],$post['account']['emojis'],20)."</a></span></span>
<a style='text-decoration:none;' class='ldr' href='?thread=9nngbBWBRHvILwEoF6' target='_blank'><span style='display:block; opacity:1; font-size:10px; line-height:12px;'>".emojify(strip_tags($post['content'],'<br>'),$post['emojis'],20)."</span></a> <a style='text-decoration:none;' class='ldr' href='?thread=9nngbBWBRHvILwEoF6' target='_blank'><span style='display:block; opacity:1; font-size:10px; line-height:12px;'>".emojify(strip_tags($post['content'],'<br>'),$post['emojis'],20)."</span></a>
</div> </div>

View File

@ -110,7 +110,7 @@ textarea {
display: inline-block; display: inline-block;
margin:0px !important; margin:0px !important;
text-align: left; text-align: left;
word-break: break-all; word-break: break-word;
font-size:12px !important; font-size:12px !important;
} }

View File

@ -114,7 +114,7 @@ textarea {
} }
aside { aside {
margin-top: 5px; margin-top: 2rem;
width: 280px; width: 280px;
float: left; float: left;
} }
@ -231,6 +231,10 @@ aside {
text-align: center; text-align: center;
} }
.profileheader {
border-radius: 3px;
}
.side_element li { .side_element li {
font-family: fontello, sans-serif; font-family: fontello, sans-serif;
height:30px; height:30px;
@ -240,6 +244,8 @@ aside {
list-style-type: none; list-style-type: none;
} }
/* posts area elements */ /* posts area elements */
.uploadedImage { .uploadedImage {
@ -545,6 +551,7 @@ aside {
.postbody { .postbody {
margin: 15px; margin: 15px;
margin-left: auto;
} }
.content { .content {
@ -552,7 +559,7 @@ aside {
display: inline-block; display: inline-block;
margin:0px !important; margin:0px !important;
text-align: left; text-align: left;
word-break: break-all; word-break: break-word;
} }
.post_footer { .post_footer {
@ -711,3 +718,11 @@ aside {
#loader { #loader {
display: none; display: none;
} }
.media > div {
width: 100%;
}
input[type="submit"] {
cursor: pointer;
}

View File

@ -1,66 +1,66 @@
$('body').on('click', '.spoiler', function() { $('body').on('click', '.spoiler', function () {
$(this).toggle(); $(this).toggle();
$(this).next('div').toggle(); $(this).next('div').toggle();
}); });
$('body').on('click', '.blur', function(e) { $('body').on('click', '.blur', function (e) {
e.stopPropagation(); e.stopPropagation();
$(this).prev().toggle(); $(this).prev().toggle();
$(this).toggle(); $(this).toggle();
$(this).next('a').toggle(); $(this).next('a').toggle();
}); });
$('body').on('click', '.toggleblur', function(e) { $('body').on('click', '.toggleblur', function (e) {
e.stopPropagation(); e.stopPropagation();
$(this).toggle(); $(this).toggle();
$(this).next('a').next('a').toggle(); $(this).next('a').next('a').toggle();
$(this).next('a').toggle(); $(this).next('a').toggle();
}); });
$('body').on('click', '#emoji', function(e) { $('body').on('click', '#emoji', function (e) {
$(this).closest(".element").find('.picker').toggle(); $(this).closest(".element").find('.picker').toggle();
$('#emojisearch').focus(); $('#emojisearch').focus();
}); });
$('body').on('click', '#contact', function(e) { $('body').on('click', '#contact', function (e) {
$(this).closest(".element").find('.contactpicker').toggle(); $(this).closest(".element").find('.contactpicker').toggle();
$('#contactsearch').focus(); $('#contactsearch').focus();
}); });
$('body').on('click', '.emoji', function(e) { $('body').on('click', '.emoji', function (e) {
var code = $(this).attr("title"); var code = $(this).attr("title");
console.log(code); console.log(code);
boxtxt = $(this).closest(".element").find("#status").val(); boxtxt = $(this).closest(".element").find("#status").val();
$(this).closest(".element").find("#status").val(boxtxt + ":"+code+":"); $(this).closest(".element").find("#status").val(boxtxt + ":" + code + ":");
}); });
$('body').on('click', '.contact', function(e) { $('body').on('click', '.contact', function (e) {
var code = $(this).attr("title"); var code = $(this).attr("title");
console.log(code); console.log(code);
boxtxt = $(this).closest(".element").find("#status").val(); boxtxt = $(this).closest(".element").find("#status").val();
$(this).closest(".element").find("#status").val(boxtxt + code+" "); $(this).closest(".element").find("#status").val(boxtxt + code + " ");
}); });
$(document).on("change paste keyup","#emojisearch",function () { $(document).on("change paste keyup", "#emojisearch", function () {
var val = $(this).val(); var val = $(this).val();
var list = $(this).closest('.element').find('.emojilist'); var list = $(this).closest('.element').find('.emojilist');
console.log(val); console.log(val);
$.get("action.php?a=true&emoji=" + val, function(data) { $.get("action.php?a=true&emoji=" + val, function (data) {
list.html(data); list.html(data);
}); });
}); });
$(document).on("change paste keyup","#contactsearch",function () { $(document).on("change paste keyup", "#contactsearch", function () {
var val = $(this).val(); var val = $(this).val();
var list = $(this).closest('.element').find('.contactlist'); var list = $(this).closest('.element').find('.contactlist');
console.log(val); console.log(val);
$.get("action.php?a=true&contact=" + val, function(data) { $.get("action.php?a=true&contact=" + val, function (data) {
list.html(data); list.html(data);
}); });
}); });
// Open Lightbox // Open Lightbox
$('body').on('click', '.open-lightbox', function(e) { $('body').on('click', '.open-lightbox', function (e) {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
var image = $(this).attr('href'); var image = $(this).attr('href');
@ -69,15 +69,15 @@ $('body').on('click', '.open-lightbox', function(e) {
}); });
// Close Lightbox // Close Lightbox
$('body').on('click', '.lightbox-opened', function() { $('body').on('click', '.lightbox-opened', function () {
$('html').removeClass('no-scroll'); $('html').removeClass('no-scroll');
$('.lightbox-opened').remove(); $('.lightbox-opened').remove();
}); });
window.addEventListener("scroll", function() { window.addEventListener("scroll", function () {
onScrollDiv() onScrollDiv()
}); });
window.addEventListener("DOMContentLoaded", function() { window.addEventListener("DOMContentLoaded", function () {
onScrollDiv() onScrollDiv()
}); });
@ -96,40 +96,40 @@ function onScrollDiv() {
} }
} }
$('body').on('click', '.replies', function(e) { $('body').on('click', '.replies', function (e) {
e.preventDefault; e.preventDefault;
$(".reply").remove(); $(".reply").remove();
$(".element").removeClass("element_pad"); $(".element").removeClass("element_pad");
$(this).closest(".element").addClass("element_pad"); $(this).closest(".element").addClass("element_pad");
/*$('.replies_container').html('');*/ /*$('.replies_container').html('');*/
var id = $(this).parent().parent().attr('id'); var id = $(this).parent().parent().attr('id');
if($('#' + id+'.replies_container').find('.reply').length < 1){ if ($('#' + id + '.replies_container').find('.reply').length < 1) {
$('#' + id+'.replies_container').html("<p><img src='img/loading.gif'></p>"); $('#' + id + '.replies_container').html("<p><img src='img/loading.gif'></p>");
} }
$.get("action.php?a=true&replies=" + id, function(data) { $.get("action.php?a=true&replies=" + id, function (data) {
$('#' + id+'.replies_container').html(data); $('#' + id + '.replies_container').html(data);
$('#' + id+'.replies_container').delay(800).fadeIn(400); $('#' + id + '.replies_container').delay(800).fadeIn(400);
$('#a' + id).html(''); $('#a' + id).html('');
$('#' + id+".replies_container .ancestor").appendTo('#a' + id); $('#' + id + ".replies_container .ancestor").appendTo('#a' + id);
}); });
}); });
$.fn.isOnScreen = function(){ $.fn.isOnScreen = function () {
var win = $(window); var win = $(window);
var viewport = { var viewport = {
top : win.scrollTop(), top: win.scrollTop(),
left : win.scrollLeft() left: win.scrollLeft()
}; };
viewport.right = viewport.left + win.width(); viewport.right = viewport.left + win.width();
viewport.bottom = viewport.top + win.height(); viewport.bottom = viewport.top + win.height();
var bounds = this.offset(); var bounds = this.offset();
bounds.right = bounds.left + this.outerWidth(); bounds.right = bounds.left + this.outerWidth();
bounds.bottom = bounds.top + this.outerHeight(); bounds.bottom = bounds.top + this.outerHeight();
return (!(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom)); return (!(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom));
}; };
/* /*
@ -178,13 +178,13 @@ $('body').on('click', '.postbody:not(a)', function(e) {
}); });
*/ */
$('body').on('click', '.ldr:not(.tlicon)', function(e) { $('body').on('click', '.ldr:not(.tlicon)', function (e) {
$('.tlicon').each(function(a){ $('.tlicon').each(function (a) {
$( this ).removeClass('tiselected') $(this).removeClass('tiselected')
}); });
}); });
$('body').on('click', '.ldr', function(e) { $('body').on('click', '.ldr', function (e) {
e.preventDefault(); e.preventDefault();
location.hash = "#top"; location.hash = "#top";
$('#loader').html(''); $('#loader').html('');
@ -193,7 +193,7 @@ $('body').on('click', '.ldr', function(e) {
var id = $(this).attr('id'); var id = $(this).attr('id');
localStorage.setItem("content", $('#content .element').detach()); localStorage.setItem("content", $('#content .element').detach());
$('#content').html('<center><div class="loadingImage"></div></center>'); $('#content').html('<center><div class="loadingImage"></div></center>');
$.get(url + "&ajax=1", function(data) { $.get(url + "&ajax=1", function (data) {
$('#content').html(data); $('#content').html(data);
history.pushState({}, "Dashboard FE", url); history.pushState({}, "Dashboard FE", url);
var thread = getUrlParameter('thread'); var thread = getUrlParameter('thread');
@ -201,7 +201,7 @@ $('body').on('click', '.ldr', function(e) {
}); });
$('body').on('click', '.gotop a', function(e) { $('body').on('click', '.gotop a', function (e) {
e.preventDefault(); e.preventDefault();
$('html, body').animate({ $('html, body').animate({
scrollTop: 0 scrollTop: 0
@ -209,8 +209,8 @@ $('body').on('click', '.gotop a', function(e) {
return false; return false;
}); });
$('body').on('click', '.topbar:not(a)', function(e) { $('body').on('click', '.topbar:not(a)', function (e) {
if(e.target !== e.currentTarget) return; if (e.target !== e.currentTarget) return;
e.preventDefault(); e.preventDefault();
$('html, body').animate({ $('html, body').animate({
scrollTop: 0 scrollTop: 0
@ -218,7 +218,7 @@ $('body').on('click', '.topbar:not(a)', function(e) {
return false; return false;
}); });
$('body').on('click', '#loader', function() { $('body').on('click', '#loader', function () {
var cnt = $("#loaded").contents(); var cnt = $("#loaded").contents();
// $("#content").prepend(cnt); // $("#content").prepend(cnt);
$('#content').find('.element').first().after(cnt); $('#content').find('.element').first().after(cnt);
@ -226,9 +226,9 @@ $('body').on('click', '#loader', function() {
$("#loader").html(''); $("#loader").html('');
}); });
$('body').on('click', '.nsfw', function() { $('body').on('click', '.nsfw', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
$.get("action.php?a=true&nsfw=" + id, function(data) { $.get("action.php?a=true&nsfw=" + id, function (data) {
if (data == '1') { if (data == '1') {
$('#' + id + '.nsfw').toggleClass('nsfw unnsfw'); $('#' + id + '.nsfw').toggleClass('nsfw unnsfw');
$('#' + id + '.unnsfw').html('NSFW <span class="fontello">&#xf205;</span>'); $('#' + id + '.unnsfw').html('NSFW <span class="fontello">&#xf205;</span>');
@ -236,9 +236,9 @@ $('body').on('click', '.nsfw', function() {
}); });
}); });
$('body').on('click', '.unnsfw', function() { $('body').on('click', '.unnsfw', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
$.get("action.php?a=true&nsfw=" + id, function(data) { $.get("action.php?a=true&nsfw=" + id, function (data) {
if (data == '1') { if (data == '1') {
$('#' + id + '.unnsfw').toggleClass('unnsfw nsfw'); $('#' + id + '.unnsfw').toggleClass('unnsfw nsfw');
$('#' + id + '.nsfw').html('NSFW <span class="fontello">&#xf204;</span>'); $('#' + id + '.nsfw').html('NSFW <span class="fontello">&#xf204;</span>');
@ -246,41 +246,41 @@ $('body').on('click', '.unnsfw', function() {
}); });
}); });
$('body').on('click', '.block', function() { $('body').on('click', '.block', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
$.get("action.php?a=true&mode=true&block=" + id, function(data) { $.get("action.php?a=true&mode=true&block=" + id, function (data) {
$('#' + id + '.block').removeClass('block').addClass('unblock'); $('#' + id + '.block').removeClass('block').addClass('unblock');
$('#' + id + '.unblock').html('Unblock'); $('#' + id + '.unblock').html('Unblock');
}); });
}); });
$('body').on('click', '.unblock', function() { $('body').on('click', '.unblock', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
$.get("action.php?a=true&mode=off&block=" + id, function(data) { $.get("action.php?a=true&mode=off&block=" + id, function (data) {
$('#' + id + '.unblock').removeClass('unblock').addClass('block'); $('#' + id + '.unblock').removeClass('unblock').addClass('block');
$('#' + id + '.block').html('Block'); $('#' + id + '.block').html('Block');
}); });
}); });
$('body').on('click', '.autl', function() { $('body').on('click', '.autl', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
var list = $(this).attr('list'); var list = $(this).attr('list');
$.get("action.php?a=true&mode=true&user=" + id + "&list=" + list, function(data) { $.get("action.php?a=true&mode=true&user=" + id + "&list=" + list, function (data) {
$('#' + id + '.autl').removeClass('autl').addClass('rutl'); $('#' + id + '.autl').removeClass('autl').addClass('rutl');
/* $('#' + id + '.rutl li').html('Added'); */ /* $('#' + id + '.rutl li').html('Added'); */
}); });
}); });
$('body').on('click', '.rutl', function() { $('body').on('click', '.rutl', function () {
var elem = $(this); var elem = $(this);
var id = $(this).attr('id'); var id = $(this).attr('id');
var list = $(this).attr('list'); var list = $(this).attr('list');
$.get("action.php?a=true&mode=off&user=" + id + "&list=" + list, function(data) { $.get("action.php?a=true&mode=off&user=" + id + "&list=" + list, function (data) {
$('#' + id + '.rutl').removeClass('rutl').addClass('autl'); $('#' + id + '.rutl').removeClass('rutl').addClass('autl');
/* $(elem).find('li').html('Removed');*/ /* $(elem).find('li').html('Removed');*/
}); });
@ -288,45 +288,45 @@ $('body').on('click', '.rutl', function() {
$('body').on('click', '.hide', function() { $('body').on('click', '.hide', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
$.get("action.php?a=true&mode=true&hide=" + id, function(data) { $.get("action.php?a=true&mode=true&hide=" + id, function (data) {
$('#' + id + '.hide').removeClass('hide').addClass('unhide'); $('#' + id + '.hide').removeClass('hide').addClass('unhide');
$('#' + id + '.unhide').html('Unhide Thread'); $('#' + id + '.unhide').html('Unhide Thread');
console.log(data); console.log(data);
}); });
}); });
$('body').on('click', '.unhide', function() { $('body').on('click', '.unhide', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
$.get("action.php?a=true&mode=off&hide=" + id, function(data) { $.get("action.php?a=true&mode=off&hide=" + id, function (data) {
$('#' + id + '.unhide').removeClass('unhide').addClass('hide'); $('#' + id + '.unhide').removeClass('unhide').addClass('hide');
$('#' + id + '.hide').html('Hide Thread'); $('#' + id + '.hide').html('Hide Thread');
console.log(data); console.log(data);
}); });
}); });
$('body').on('click', '.bookmark', function() { $('body').on('click', '.bookmark', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
$.get("action.php?a=true&mode=true&bookmark=" + id, function(data) { $.get("action.php?a=true&mode=true&bookmark=" + id, function (data) {
$('#' + id + '.bookmark').removeClass('bookmark').addClass('unbookmark'); $('#' + id + '.bookmark').removeClass('bookmark').addClass('unbookmark');
$('#' + id + '.unbookmark').html('Unbookmark'); $('#' + id + '.unbookmark').html('Unbookmark');
console.log(data); console.log(data);
}); });
}); });
$('body').on('click', '.unbookmark', function() { $('body').on('click', '.unbookmark', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
$.get("action.php?a=true&mode=off&bookmark=" + id, function(data) { $.get("action.php?a=true&mode=off&bookmark=" + id, function (data) {
$('#' + id + '.unbookmark').removeClass('unbookmark').addClass('bookmark'); $('#' + id + '.unbookmark').removeClass('unbookmark').addClass('bookmark');
$('#' + id + '.bookmark').html('Bookmark'); $('#' + id + '.bookmark').html('Bookmark');
console.log(data); console.log(data);
}); });
}); });
$('body').on('click', '.follow', function() { $('body').on('click', '.follow', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
$.get("action.php?a=true&follow=" + id, function(data) { $.get("action.php?a=true&follow=" + id, function (data) {
console.log(data); console.log(data);
if (data == '1') { if (data == '1') {
$('#' + id + '.follow').removeClass('follow').addClass('unfollow'); $('#' + id + '.follow').removeClass('follow').addClass('unfollow');
@ -335,10 +335,10 @@ $('body').on('click', '.follow', function() {
}); });
}); });
$('body').on('click', '.unfollow', function() { $('body').on('click', '.unfollow', function () {
var id = $(this).attr('id'); var id = $(this).attr('id');
$.get("action.php?a=true&unfollow=" + id, function(data) { $.get("action.php?a=true&unfollow=" + id, function (data) {
if (data == '1') { if (data == '1') {
$('#' + id + '.unfollow').removeClass('unfollow').addClass('follow'); $('#' + id + '.unfollow').removeClass('unfollow').addClass('follow');
$('#' + id + '.follow').html('Follow'); $('#' + id + '.follow').html('Follow');
@ -346,43 +346,43 @@ $('body').on('click', '.unfollow', function() {
}); });
}); });
$('.container').on('mouseenter', '.user', function(event) { $('.container').on('mouseenter', '.user', function (event) {
event.stopPropagation(); event.stopPropagation();
event.stopImmediatePropagation(); event.stopImmediatePropagation();
var id = $(this).attr('id'); var id = $(this).attr('id');
console.log(id); console.log(id);
$(this).append("<div class='userinfo' id='" + id + "'><img src='loading.gif'></div>"); $(this).append("<div class='userinfo' id='" + id + "'><img src='loading.gif'></div>");
$.when($.get("action.php?a=true&userinfo=" + id, function(data) { $.when($.get("action.php?a=true&userinfo=" + id, function (data) {
$('#' + id + '.userinfo').html(data); $('#' + id + '.userinfo').html(data);
})).then(function(){ })).then(function () {
$('#' + id + '.userinfo').fadeIn(); $('#' + id + '.userinfo').fadeIn();
}); });
}); });
$('.container').on('mouseleave', '.user', function(event) { $('.container').on('mouseleave', '.user', function (event) {
event.stopPropagation(); event.stopPropagation();
event.stopImmediatePropagation(); event.stopImmediatePropagation();
$(this).find('.userinfo').fadeOut(300, function() { $(this).remove(); }); $(this).find('.userinfo').fadeOut(300, function () { $(this).remove(); });
}); });
$('.container').on('mouseenter', '.preview', function(event) { $('.container').on('mouseenter', '.preview', function (event) {
event.stopPropagation(); event.stopPropagation();
event.stopImmediatePropagation(); event.stopImmediatePropagation();
var id = $(this).attr('id'); var id = $(this).attr('id');
console.log(id); console.log(id);
$(this).before("<div class='notif previewpost' id='" + id + "'></div>"); $(this).before("<div class='notif previewpost' id='" + id + "'></div>");
$.when($.get("action.php?a=true&previewpost=" + id, function(data) { $.when($.get("action.php?a=true&previewpost=" + id, function (data) {
$('#' + id + '.previewpost').html(data); $('#' + id + '.previewpost').html(data);
})).then(function(){ })).then(function () {
$('#' + id + '.previewpost').fadeIn(); $('#' + id + '.previewpost').fadeIn();
}); });
}); });
$('.container').on('mouseleave', '.preview', function(event) { $('.container').on('mouseleave', '.preview', function (event) {
event.stopPropagation(); event.stopPropagation();
event.stopImmediatePropagation(); event.stopImmediatePropagation();
$('.container').find('.previewpost').fadeOut(300, function() { $(this).remove(); }); $('.container').find('.previewpost').fadeOut(300, function () { $(this).remove(); });
}); });
var getUrlParameter = function getUrlParameter(sParam) { var getUrlParameter = function getUrlParameter(sParam) {
@ -424,7 +424,7 @@ function getMode() {
return "&mode=federated"; return "&mode=federated";
}; };
function loadmore(){ function loadmore() {
var thread = getUrlParameter('thread'); var thread = getUrlParameter('thread');
if (typeof thread !== 'undefined') { if (typeof thread !== 'undefined') {
return false; return false;
@ -439,7 +439,7 @@ function loadmore(){
pageMode = getMode(); pageMode = getMode();
var id = $('.post').last().attr('pid'); var id = $('.post').last().attr('pid');
$('.loadmore').html("<img src='img/loading.gif'>") $('.loadmore').html("<img src='img/loading.gif'>")
$.get("index.php?ajax=1&next=" + id + "" + pageMode, function(data) { $.get("index.php?ajax=1&next=" + id + "" + pageMode, function (data) {
$('.loadmore').parent().before(data); $('.loadmore').parent().before(data);
$('.loadmore').html("Load More Posts") $('.loadmore').html("Load More Posts")
/*$('.loadmore').parent().detach(); /*$('.loadmore').parent().detach();
@ -451,20 +451,20 @@ function loadmore(){
} }
} }
$(window).scroll(function() { $(window).scroll(function () {
if ($(window).scrollTop() == $(document).height() - $(window).height()) { if ($(window).scrollTop() == $(document).height() - $(window).height()) {
loadmore(); loadmore();
} }
}); });
$('body').on('click', '.loadmore', function() { $('body').on('click', '.loadmore', function () {
loadmore(); loadmore();
}); });
function newPosts() { function newPosts() {
var url = window.location.href; var url = window.location.href;
var thread = getUrlParameter('thread'); var thread = getUrlParameter('thread');
if (typeof thread !== 'undefined') { if (typeof thread !== 'undefined') {
return false; return false;
@ -486,17 +486,18 @@ function newPosts() {
if (typeof page !== 'undefined') { if (typeof page !== 'undefined') {
return false; return false;
} }
$.get("index.php?ajax=1&since=" + id + "" + pageMode, function(data) { $.get("index.php?ajax=1&since=" + id + "" + pageMode, function (data) {
if (window.location.href !== url){ if (window.location.href !== url) {
return false; return false;
} }
if (data) { if (data) {
var scroll = $(window).scrollTop(); var scroll = $(window).scrollTop();
if (scroll > 1000) { if (scroll > 1000) {
$('#loader').html("<div class='avatar' style='height:0px;'></div><div class='loader' style='display:table-cell; height:50px; line-height:50px;'><a class='link' style='margin:5px;' href='#'>Load Newer Posts</a></div>"); $('#loader').html("<div class='avatar' style='height:0px;'></div><div class='loader' style='display:table-cell; height:50px; line-height:50px;'><a class='link' style='margin:5px;' href='#'>Load Newer Posts</a></div>");
if ($('#loaded').length) { if ($('#loaded').length) {
$('#loaded').prepend(data); $('#loaded').prepend(data);
} else { } else {
@ -514,59 +515,58 @@ function newPosts() {
}); });
}; };
window.setInterval(function() { window.setInterval(function () {
var timestamp; var timestamp;
$('.postAge').each(function(a){ $('.postAge').each(function (a) {
timestamp = $(this).attr('id'); timestamp = $(this).attr('id');
$(this).html(timeSince(timestamp)+' ago'); $(this).html(timeSince(timestamp) + ' ago');
}); });
newPosts(); newPosts();
}, 25000); }, 25000);
function themecheck(name){ function themecheck(name) {
if(name.value == "custom"){ if (name.value == "custom") {
$('#customtheme').css("display","block"); $('#customtheme').css("display", "block");
} } else {
else{ $('#customtheme').css("display", "none");
$('#customtheme').css("display","none"); }
}
}; };
function timeSince(date) { function timeSince(date) {
/* https://stackoverflow.com/questions/3177836/how-to-format-time-since-xxx-e-g-4-minutes-ago-similar-to-stack-exchange-site */ /* https://stackoverflow.com/questions/3177836/how-to-format-time-since-xxx-e-g-4-minutes-ago-similar-to-stack-exchange-site */
var seconds = Math.floor((new Date() - (date*1000)) / 1000);
var interval = Math.floor(seconds / 31536000); var seconds = Math.floor((new Date() - (date * 1000)) / 1000);
if (interval >= 1) { var interval = Math.floor(seconds / 31536000);
return interval + " year"+(interval > 1 ? "s" : "");
} if (interval >= 1) {
interval = Math.floor(seconds / 2592000); return interval + " year" + (interval > 1 ? "s" : "");
if (interval >= 1) { }
return interval + " month"+(interval > 1 ? "s" : ""); interval = Math.floor(seconds / 2592000);
} if (interval >= 1) {
interval = Math.floor(seconds / 604800); return interval + " month" + (interval > 1 ? "s" : "");
if (interval >= 1) { }
return interval + " week"+(interval > 1 ? "s" : ""); interval = Math.floor(seconds / 604800);
} if (interval >= 1) {
interval = Math.floor(seconds / 86400); return interval + " week" + (interval > 1 ? "s" : "");
if (interval >= 1) { }
return interval + " day"+(interval > 1 ? "s" : ""); interval = Math.floor(seconds / 86400);
} if (interval >= 1) {
interval = Math.floor(seconds / 3600); return interval + " day" + (interval > 1 ? "s" : "");
if (interval >= 1) { }
return interval + " hour"+(interval > 1 ? "s" : ""); interval = Math.floor(seconds / 3600);
} if (interval >= 1) {
interval = Math.floor(seconds / 60); return interval + " hour" + (interval > 1 ? "s" : "");
if (interval >= 1) { }
return interval + " minute"+(interval > 1 ? "s" : ""); interval = Math.floor(seconds / 60);
} if (interval >= 1) {
return interval + " minute" + (interval > 1 ? "s" : "");
if (interval < 0) { }
return " just now";
} if (interval < 0) {
return Math.floor(seconds) + " seconds"; return " just now";
}
return Math.floor(seconds) + " seconds";
} }

View File

@ -242,7 +242,7 @@ $query = http_build_query(array_filter(array(
}, 15000); }, 15000);
function notificaton(message){ function notificaton(message){
var notif = "<div class='notif error' style='border-left:3px solid red; background-color:pink;'> <div class='notifContents'> <div style='flex: 0 0 60px; background-size:cover; border-radius:5px;'></div> <div style='flex: 1; padding-left:5px; padding-right:5px; word-break: break-all; overflow:hidden;'> <span>"+message+"</span> </div> </div> </div>"; var notif = "<div class='notif error' style='border-left:3px solid red; background-color:pink;'> <div class='notifContents'> <div style='flex: 0 0 60px; background-size:cover; border-radius:5px;'></div> <div style='flex: 1; padding-left:5px; padding-right:5px; word-break: break-word; overflow:hidden;'> <span>"+message+"</span> </div> </div> </div>";
$('#hiddenside').append(notif); $('#hiddenside').append(notif);
$('#hiddenside').children().each(function(index) { $('#hiddenside').children().each(function(index) {
$(this).delay(4000 + (1000 * index)).fadeOut("slow"); $(this).delay(4000 + (1000 * index)).fadeOut("slow");

View File

@ -356,7 +356,7 @@ if ((!isset($thread[0]['id']) && !empty($thread)) || !is_array($thread)) {
else { else {
if ($logedin){ if ($logedin){
$post['template'] = themes("get","templates/post.txt"); $post['template'] = themes("get","templates/post.txt");
} else { } else {
$post['template'] = themes("get","templates/post_logout.txt"); $post['template'] = themes("get","templates/post_logout.txt");
} }
} }

View File

@ -3,36 +3,13 @@
<div class='avatar' style='height:0px;'></div> <div class='avatar' style='height:0px;'></div>
<div class='post' style='text-align:left;'> <div class='post' style='text-align:left;'>
<div style='padding:15px; text-align:left; display:inline-block;' id="settings"> <div style='padding:15px; text-align:left; display:inline-block;' id="settings">
<h1><span class='fontello' style='font-size:inherit;'>&#xe814;</span> About Dashboard FE</h1> <h1><span class='fontello' style='font-size:inherit;'>&#xe814;</span> About Fedi Tumblr</h1>
<br> <br>
<p>Dashboard FE (#DashFE for short) is a third-party client or fronted for Pleroma and Mastodon servers, writen in PHP, which design inspires on the look and feel of the Tumblr user dashboard. This frontend puts special emphasis on displaying posts with attached media, being images, video or music.</p> <p>Fedi Tumblr is a frontend for interacting with the fediverse that is meant to replicate the feel of Tumblr.</p>
<br>
<p>Currently a work in progress, #DashFE is being developed by <a href='https://gameliberty.club/@hideki' target='_blank' class='link' style='font-weight:bold;'>@hideki@gameliberty.club</a> and it's in a constant state of change, so features present may change or improve over time.</p> <p>The source code for the project can be found <a href="https://git.autonomic.zone/aadil/fedi-tumblr">here</a>.</p>
<br>
<p>The source code of the project is currently being hosted at https://notabug.org/daisuke/DashboardFE</p> <p>This project is a fork of <a href="https://notabug.org/daisuke/DashboardFE">Dashboard FE</a></p>
<p>DashFE Key Features:
<ul>
<li>Emphasis on posts with media attachments</li>
<li>Ability to mark all posts by an user as NSFW</li>
</ul>
</p>
<p>DashFE Project Policies:
<ul>
<li>Keep things as simple as possible</li>
<li>Keep dependencies on external libraries at a minimum</li>
<li>Allow access to nojs users</li>
<li>Keep the user in contol of their data</li>
<li>Empower the user to create a custom fediverse experience</li>
</ul>
</p>
<p>Known issues:
<ul>
<li>If after entering your user@instance on the login page you are returned to the main page of DashFE witouth having being loged in, check if you are currently logged in into your Pleroma's MastoFE GUI. Try logging out and then logging in here again.</li>
</ul>
</p>
</div> </div>
</div> </div>
</div> </div>

View File

@ -7,7 +7,7 @@ $setting['appname'] = "Fedi Tumblr";
$setting['url'] = "http://aadils.computer/fedi"; $setting['url'] = "http://aadils.computer/fedi";
//Short description //Short description
$setting['description'] = "<p>Dashboard FE (or DashFE if you like it) it's a third party client/frontend for Pleroma and Mastodon that tries to mimic the look and feel of the Tumblr user dashboard, putting big emphasis in a timeline filled by media of all types</p> <p>Currently a Work in Progress, DashFE can actually be used but it's very possible that there are still rough edges, missing features and stuff that needs to be corrected and/or optimized. Issues, suggestion or sugerences please contact <b>@hideki@gameliberty.club</b> via your favorite fediverse account.</p><p>Thank You</p>"; $setting['description'] = "<br><p>A tumblr-like frontend for interacting with the fediverse.</p>";
//Locked Instance //Locked Instance
//If you prefer your instance of DashboardFE to be locked to a certain fediverse server (your own server, for example) and prevent it's use on another fediverse server, just uncomment the following line and put the url of the desired server //If you prefer your instance of DashboardFE to be locked to a certain fediverse server (your own server, for example) and prevent it's use on another fediverse server, just uncomment the following line and put the url of the desired server

View File

@ -4,7 +4,7 @@
<div class='post' id=':id:' pid=':pid:' mode="post"> <div class='post' id=':id:' pid=':pid:' mode="post">
<div id='a:id:' class='ancestors'>:ancestors:</div> <div id='a:id:' class='ancestors'>:ancestors:</div>
<div class='postHeader'> <div class='postHeader'>
<div style='width:80%; margin:5px; margin-left:10px; display:block; float:left; line-height:30px;'> <div style='width:80%; margin:5px; margin-left:1em; display:block; float:left; line-height:30px;'>
<img src=':avatar:' width=25 class='mobile' style='border-radius:10px; display:inline-block;'> <img src=':avatar:' width=25 class='mobile' style='border-radius:10px; display:inline-block;'>
<div style='max-width:50%; display:inline-block;' class='user' id=':uid:' title=':acct:'> <div style='max-width:50%; display:inline-block;' class='user' id=':uid:' title=':acct:'>
<div style='white-space: nowrap; overflow: hidden; text-overflow: ellipsis;'> <div style='white-space: nowrap; overflow: hidden; text-overflow: ellipsis;'>

View File

@ -4,7 +4,7 @@
<div class='post' id=':id:' pid=':pid:' mode="post"> <div class='post' id=':id:' pid=':pid:' mode="post">
<div id='a:id:' class='ancestors'>:ancestors:</div> <div id='a:id:' class='ancestors'>:ancestors:</div>
<div class='postHeader'> <div class='postHeader'>
<div style='width:80%; margin:5px; margin-left:10px; display:block; float:left; line-height:30px;'> <div style='width:80%; margin:5px; margin-left:1em; display:block; float:left; line-height:30px;'>
<img src=':avatar:' width=25 class='mobile' style='border-radius:10px; display:inline-block;'> <img src=':avatar:' width=25 class='mobile' style='border-radius:10px; display:inline-block;'>
<div style='max-width:50%; display:inline-block;' class='user' id=':uid:'> <div style='max-width:50%; display:inline-block;' class='user' id=':uid:'>
<div style='white-space: nowrap; overflow: hidden; text-overflow: ellipsis;'> <div style='white-space: nowrap; overflow: hidden; text-overflow: ellipsis;'>