User:Docmoates/Social: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 95: | Line 95: | ||
<script> | <script> | ||
mw.loader.using(['jquery','mediawiki.api']).then(function(){ | |||
mw.loader.using(['mediawiki.api']).then(function(){ | |||
var user=mw.config.get('wgUserName')||'Guest'; | var user=mw.config.get('wgUserName')||'Guest'; | ||
var photo=localStorage.getItem('sf_photo_'+user)||''; | var photo=localStorage.getItem('sf_photo_'+user)||''; | ||
| Line 105: | Line 104: | ||
function esc(t){var d=document.createElement('div');d.textContent=t;return d.innerHTML;} | function esc(t){var d=document.createElement('div');d.textContent=t;return d.innerHTML;} | ||
function ago(d){var s=Math.floor((Date.now()-d)/1000);if(s<60)return'Just now';var m=Math.floor(s/60);if(m<60)return m+'m';var h=Math.floor(m/60);if(h<24)return h+'h';return Math.floor(h/24)+'d';} | function ago(d){var s=Math.floor((Date.now()-d)/1000);if(s<60)return'Just now';var m=Math.floor(s/60);if(m<60)return m+'m';var h=Math.floor(m/60);if(h<24)return h+'h';return Math.floor(h/24)+'d';} | ||
function gel(id){return document.getElementById(id);} | |||
function setAv(){ | function setAv(){ | ||
var el= | var el=gel('composer-avatar'); | ||
if(!el)return; | if(!el)return; | ||
el.innerHTML=photo?'<img src="'+photo+'">':init(user); | el.innerHTML=photo?'<img src="'+photo+'">':init(user); | ||
| Line 113: | Line 113: | ||
} | } | ||
setAv(); | setAv(); | ||
var postContent= | var postContent=gel('post-content'); | ||
if(postContent)postContent.placeholder='What is on your mind, '+user+'?'; | if(postContent)postContent.placeholder='What is on your mind, '+user+'?'; | ||
gel('composer-avatar').addEventListener('click',function(){ | |||
gel('profile-url-input').value=photo; | |||
gel('profile-modal').classList.add('active'); | |||
}); | }); | ||
gel('profile-cancel-btn').addEventListener('click',function(){gel('profile-modal').classList.remove('active');}); | |||
gel('profile-save-btn').addEventListener('click',function(){ | |||
photo= | photo=gel('profile-url-input').value.trim(); | ||
localStorage.setItem('sf_photo_'+user,photo); | localStorage.setItem('sf_photo_'+user,photo); | ||
setAv(); | setAv(); | ||
gel('profile-modal').classList.remove('active'); | |||
}); | }); | ||
gel('add-image-btn').addEventListener('click',function(){ | |||
var u=prompt('Enter image URL:'); | var u=prompt('Enter image URL:'); | ||
if(u){pendingImg=u; | if(u){pendingImg=u;gel('preview-img').src=u;gel('image-preview').style.display='block';} | ||
}); | }); | ||
gel('remove-image-btn').addEventListener('click',function(){pendingImg='';gel('image-preview').style.display='none';}); | |||
gel('post-btn').addEventListener('click',function(){ | |||
var c= | var c=gel('post-content').value.trim(); | ||
if(!(c||pendingImg)){alert('Write something or add image');return;} | if(!(c||pendingImg)){alert('Write something or add image');return;} | ||
var btn= | var btn=this;btn.disabled=true;btn.textContent='Posting...'; | ||
var p={action:'socialfeed',sfaction:'createpost',content:c||'(photo)'}; | var p={action:'socialfeed',sfaction:'createpost',content:c||'(photo)'}; | ||
if(pendingImg)p.image_url=pendingImg; | if(pendingImg)p.image_url=pendingImg; | ||
api.postWithToken('csrf',p).done(function(){ | api.postWithToken('csrf',p).done(function(){ | ||
gel('post-content').value=''; | |||
pendingImg=''; | pendingImg='';gel('image-preview').style.display='none'; | ||
btn. | btn.disabled=false;btn.textContent='Post'; | ||
load(); | load(); | ||
}).fail(function(code,data){var msg=code;if(data){if(data.error){msg=data.error.info;}}alert('Error: '+msg);btn. | }).fail(function(code,data){var msg=code;if(data){if(data.error){msg=data.error.info;}}alert('Error: '+msg);btn.disabled=false;btn.textContent='Post';}); | ||
}); | }); | ||
function load(){ | function load(){ | ||
api.get({action:'socialfeed',sfaction:'getposts',limit:20}).done(function(d){render(d.socialfeed.posts||[]);}).fail(function(){ | api.get({action:'socialfeed',sfaction:'getposts',limit:20}).done(function(d){render(d.socialfeed.posts||[]);}).fail(function(){ | ||
gel('timeline-container').innerHTML='<div class="sf-empty"><div class="sf-empty-icon">😕</div><div class="sf-empty-text">Error loading</div></div>'; | |||
}); | }); | ||
} | } | ||
function render(posts){ | function render(posts){ | ||
var c= | var c=gel('timeline-container'); | ||
if(!posts.length){c. | if(!posts.length){c.innerHTML='<div class="sf-empty"><div class="sf-empty-icon">📝</div><div class="sf-empty-text">No posts yet</div><div class="sf-empty-sub">Be the first to share!</div></div>';return;} | ||
var h=''; | var h=''; | ||
posts.forEach(function(p){ | posts.forEach(function(p){ | ||
| Line 173: | Line 173: | ||
h+='<div class="sf-comments" id="cmt-'+p.id+'" style="display:none"></div></div>'; | h+='<div class="sf-comments" id="cmt-'+p.id+'" style="display:none"></div></div>'; | ||
}); | }); | ||
c. | c.innerHTML=h; | ||
c. | c.querySelectorAll('[data-del]').forEach(function(b){b.addEventListener('click',function(){if(confirm('Delete?'))api.postWithToken('csrf',{action:'socialfeed',sfaction:'deletepost',post_id:b.dataset.del}).done(load);});}); | ||
c. | c.querySelectorAll('[data-like]').forEach(function(b){b.addEventListener('click',function(){api.postWithToken('csrf',{action:'socialfeed',sfaction:'react',post_id:b.dataset.like,reaction_type:'like'}).done(load);});}); | ||
c. | c.querySelectorAll('[data-cmt]').forEach(function(b){b.addEventListener('click',function(){var box=gel('cmt-'+b.dataset.cmt);if(box.style.display==='none'){box.style.display='block';loadCmt(b.dataset.cmt);}else{box.style.display='none';}});}); | ||
} | } | ||
function loadCmt(id){ | function loadCmt(id){ | ||
var box= | var box=gel('cmt-'+id); | ||
api.get({action:'socialfeed',sfaction:'getcomments',post_id:id}).done(function(d){ | api.get({action:'socialfeed',sfaction:'getcomments',post_id:id}).done(function(d){ | ||
var cmts=d.socialfeed.comments||[]; | var cmts=d.socialfeed.comments||[]; | ||
| Line 187: | Line 187: | ||
var myPic=photo?'<img src="'+photo+'">':init(user); | var myPic=photo?'<img src="'+photo+'">':init(user); | ||
h+='<div class="sf-add-comment"><div class="sf-avatar sf-avatar-small">'+myPic+'</div><input class="sf-comment-input" id="cinput-'+id+'" placeholder="Write a comment..."></div>'; | h+='<div class="sf-add-comment"><div class="sf-avatar sf-avatar-small">'+myPic+'</div><input class="sf-comment-input" id="cinput-'+id+'" placeholder="Write a comment..."></div>'; | ||
box. | box.innerHTML=h; | ||
gel('cinput-'+id).addEventListener('keypress',function(e){if(e.key==='Enter'){var v=this.value.trim();if(v){this.value='';api.postWithToken('csrf',{action:'socialfeed',sfaction:'comment',post_id:id,content:v}).done(function(){loadCmt(id);load();});}}}); | |||
}); | }); | ||
} | } | ||
load(); | load(); | ||
}); | }); | ||
</script> | </script> | ||
</div> | </div> | ||
</html> | </html> | ||
Revision as of 02:47, 3 February 2026
Upload to wiki first, then paste URL