Widget:HouseTile

Loading image...

   <a href="" class="btn btn-primary" id="link">ANSEHEN</a>

<script> document.addEventListener('DOMContentLoaded', function() { var hideTitle = ""; var linkText = ""; var page = ""; var card_id = "HouseTile-"; var url = "https://wb.manorhouses.tibwiki.io/w/api.php"; var card = document.querySelector('#'+card_id); if (hideTitle) {

    card.querySelector('#title').style.display = "none";

} if (linkText) {

    card.querySelector('#link').innerHTML = linkText;

}

var params = {

   action: "query",
   prop: "images",
   titles: "",  // Page title whose first image you want to retrieve
   format: "json"

};

url = url + "?origin=*"; Object.keys(params).forEach(function(key) {

   url += "&" + key + "=" + params[key];

});

fetch(url)

   .then(function(response) {
       return response.json();
   })
   .then(function(response) {
       var pages = response.query.pages;
       var firstImageTitle = null;

       // Find the first image title
       for (var page in pages) {
           if (pages[page].images && pages[page].images.length > 0) {
               firstImageTitle = pages[page].images[0].title;
               break;  // Exit loop after getting the first image
           }
       }

       // If a first image is found, display it
       var card = document.querySelector('#'+card_id); 
      if (firstImageTitle) {
           // Construct the URL to display the image
           var imageUrl = "https://wb.manorhouses.tibwiki.io/wiki/Special:FilePath/" + firstImageTitle.replace('File:', );
        
          card.querySelector('#imageContainer').innerHTML = '<img src="' + imageUrl + '" alt="First Image" style="max-width:100%;">';
         //document.getElementById("imageContainer").innerHTML = '<img src="' + imageUrl + '" alt="First Image" style="max-width:100%;">';
          card.classList.add('processed1');
       } else {
          console.log("HouseTile: no image found in "+page);
          card.querySelector('#imageContainer').innerHTML = "";
           card.classList.add('processed1');
       }
   })
   .catch(function(error) {
       console.log("Error: " + error);
       card.querySelector('#imageContainer').innerHTML = "Error retrieving image.";
        var card = document.querySelector('.card:not(.processed1)'); 
       card.classList.add('processed1');
   });

// now get wikitext from page var params = {

   action: "parse",
   page: "",  
   format: "json"

}; url = "https://wb.manorhouses.tibwiki.io/w/api.php"; url = url + "?origin=*"; Object.keys(params).forEach(function(key) {

   url += "&" + key + "=" + params[key];

}); console.log(url); fetch(url)

   .then(function(response) {
       return response.json();
   })
   .then(function(response) {
       var pagehtml = response.parse.text['*'];
       // If a text is found, display it
        var card = document.querySelector('#'+card_id+':not(.processed2)'); 
        if (pagehtml) {
           var tempDiv = document.createElement('div');
           tempDiv.innerHTML = pagehtml;
           var mainTextElement = tempDiv.querySelector('#tileabstract');
           
            if (mainTextElement) {
              var mainTextContent = mainTextElement.textContent;
             
              card.querySelector('#textContainer').innerHTML = mainTextContent.substring(0,250) +"(...)";
            
           } else {
              firstTableCellText = extractFirstCellContent( pagehtml );
              if ( firstTableCellText ) {
                   card.querySelector('#textContainer').innerHTML = firstTableCellText.substring(0,250) +"(...)";
              } else {
                   card.querySelector('#textContainer').innerHTML = "No text found.";
              }
          }
    }       
    card.classList.add('processed2');
   })
   .catch(function(error) {
       console.log("Error: " + error);
       card.querySelector('#textContainer').innerHTML = "Error retrieving text.";
      card.classList.add('processed2');
   });

});

function extractFirstCellContent(html) {

// Define the regex pattern to match the first cell inside a var regex = /(.*?)<\/td>/s; // Using the 's' flag to handle multi-line content inside

   // Apply the regex to the HTML
   var match = regex.exec(html);
   
   if (match && match[1]) {

// Remove any HTML tags within the content

       var cellContent = match[1].replace(/<[^>]+>/g, ).trim();
       return cellContent;
   } else {
       return "";
   }

}

</script>