107 lines
		
	
	
		
			3.4 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
			
		
		
	
	
			107 lines
		
	
	
		
			3.4 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
| let tplUrl = 'json/mas-tpl.html';
 | |
| let response = await fetch(tplUrl);
 | |
| var tpl = "";
 | |
| let log = document.getElementById('log');
 | |
| log.innerHTML = "";
 | |
| 
 | |
| const controller = new AbortController();
 | |
| const signal = controller.signal;
 | |
| 
 | |
| // Cancel the fetch request in 500ms
 | |
| setTimeout(() => controller.abort(), 500);
 | |
| 
 | |
| try {
 | |
|     const response = await fetch(tplUrl, { signal });
 | |
|     tpl = await response.text();
 | |
| 
 | |
| } catch (error) {
 | |
|     // DOMException: The user aborted a request.
 | |
|     console.log('Error: ', error)
 | |
|     log.innerHTML = "<p>1) Ой всё сломалось :(</p>";
 | |
| }
 | |
| 
 | |
| if (!tpl) {
 | |
|     log.innerHTML = "<p>2) Ой всё сломалось :(</p>";
 | |
| }
 | |
| // else {
 | |
| //     log.innerHTML = tpl;
 | |
| // }
 | |
| 
 | |
| async function fetchData() {
 | |
|     var log = document.getElementById('log');
 | |
| 
 | |
|     var server_address = `techhub.social`;
 | |
| 
 | |
|     const response = await fetch('json/posts.json');
 | |
| 
 | |
|     // const response = await fetch(`https://${server_address}/api/v1/accounts/111518136987654656/statuses`);
 | |
| 
 | |
|     const data = await response.json();
 | |
| 
 | |
|     data.forEach(obj => {
 | |
|         let post_tpl = tpl;
 | |
|         var media_link = "";
 | |
|         Object.entries(obj).forEach(([key, value]) => {
 | |
|             if (key == "id") {
 | |
|                 post_tpl = post_tpl.replace(/{post_id}/g, `${value}`);
 | |
|             }
 | |
| 
 | |
|             if (key == "account") {
 | |
|                 post_tpl = post_tpl.replace(/{id}/g, `${value.id}`);
 | |
|                 post_tpl = post_tpl.replace(/{name}/g, `${value.display_name}`);
 | |
|                 post_tpl = post_tpl.replace(/{server_address}/g, `${server_address}`);
 | |
|                 post_tpl = post_tpl.replace(/{account_name}/g, `<a href="https://${server_address}/@${value.username}" target="_blank">@${value.username}@${server_address}</a>`);
 | |
|                 // post_tpl = post_tpl.replace('{avatar}', `<img src="${value.avatar}" alt="${value.username}'s Avatar" style="width:48px;height:48px;">`);
 | |
|                 post_tpl = post_tpl.replace(/{avatar}/g, `${value.avatar}`);
 | |
|                 post_tpl = post_tpl.replace(/{profile_link}/g, `${value.url}`);
 | |
|             }
 | |
| 
 | |
|             if (key == "content") {
 | |
|                 post_tpl = post_tpl.replace('{content}', `${value}`);
 | |
|             }
 | |
| 
 | |
|             if (key == "media_attachments") {
 | |
|                 value.forEach(obj1 => {
 | |
|                     Object.entries(obj1).forEach(([k, v]) => {
 | |
|                         if (k == "preview_url") {
 | |
|                             media_link += `<img src="${v}">`;
 | |
|                         }
 | |
| 
 | |
|                     });
 | |
|                 });
 | |
| 
 | |
|                 post_tpl = post_tpl.replace('{media_attachments}', `${media_link}`);
 | |
|             }
 | |
| 
 | |
|             if (key == "created_at") {
 | |
|                 post_tpl = post_tpl.replace(/{created_at}/g, `${value}`);
 | |
|             }
 | |
| 
 | |
|             if (key == "edited_at") {
 | |
|                 post_tpl = post_tpl.replace(/{edited_at}/g, `${value}`);
 | |
|             }
 | |
| 
 | |
|             if (key == "favorites_count") {
 | |
|                 post_tpl = post_tpl.replace(/{favorites_count}/g, `${value}`);
 | |
|             }
 | |
| 
 | |
|             if (key == "replies_count") {
 | |
|                 post_tpl = post_tpl.replace(/{replies_count}/g, `${value}`);
 | |
|             }
 | |
| 
 | |
|             if (key == "reblogs_count") {
 | |
|                 post_tpl = post_tpl.replace(/{reblogs_count}/g, `${value}`);
 | |
|             }
 | |
| 
 | |
|             // log.innerHTML  = log.innerHTML + `${key} ${value}` + '<br>';
 | |
|         });
 | |
|         log.innerHTML += `${post_tpl}<br>`;
 | |
|     });
 | |
| }
 | |
| 
 | |
| async function openInNewTab(url) {
 | |
|     window.open(url, '_blank').focus();
 | |
| }
 | |
| 
 | |
| fetchData();
 |