ss.com improver userscript.js

// ==UserScript==
// @name        SS.com improver
// @description Makes ss.com bearable
// @match          *://ss.com/*
// @match          *://*.ss.com/*
// @match          *://ss.lv/*
// @match          *://*.ss.lv/*
// ==/UserScript==

function deleteElem(elem) {
  let tmpElem = document.getElementById(elem);
  tmpElem.parentNode.removeChild(tmpElem);
}

// add global style
let style = document.createElement('style');
style.innerHTML = `
    #hd_image > table > tbody > tr > td > img {
        max-width: 100%;
        max-height: 100vh;
        height: auto;
    }

    .isfoto:hover {
      transform: scale(2);
      z-index: 1;
      position: relative;
    }

    #img_div_scroll {
      height: auto !important;
    }

    #msg_img_img {
      top: 0 !important;
    }

    #big_pic_div {
      height: auto !important;
    }

    #big_pic_div > div {
      overflow: hidden !important;
    }
`;
document.head.appendChild(style);

window.onload = () => {
  // Open links in new tab
  // iterate over tr elements in second table in #filter_frm
  try {
    let trs = document
      .getElementById('filter_frm')
      .getElementsByTagName('table')[2]
      .getElementsByTagName('tr');
    for (let i = 0; i < trs.length; i++) {
      // iterate over all links
      let links = trs[i].getElementsByTagName('a');
      for (let j = 0; j < links.length; j++) {
        links[j].target = '_blank';
      }
    }
  } catch (error) {
    // do nothing
  }

  // add price per square meter to the table
  try {
    if (window.location.href.split('/').includes('all')) {
      let trs = document
        .getElementById('filter_frm')
        .getElementsByTagName('table')[2]
        .getElementsByTagName('tr');
      for (let i = 0; i < trs.length; i++) {
        // skip first row
        if (i === 0) {
          continue;
        }
        let squareMeters = trs[i].getElementsByTagName('td')[5].innerText;
        let price = trs[i]
          .getElementsByTagName('td')[8]
          .innerText.replace(/\D/g, '');
        let pricePerSquareMeter = price / squareMeters;

        // add price per square meter after price
        let newHTML =
          trs[i].getElementsByTagName('td')[8].children[0].innerHTML + '<br><br>';
        if (pricePerSquareMeter < 900) {
          newHTML +=
            '<span style="color: #A3B86C;">' +
            pricePerSquareMeter.toFixed(2) +
            ' €/m²</span>';
        } else if (pricePerSquareMeter < 1000) {
          newHTML +=
            '<span style="color: #EBC944;">' +
            pricePerSquareMeter.toFixed(2) +
            ' €/m²</span>';
        } else if (pricePerSquareMeter < 1200) {
          newHTML +=
            '<span style="color: #F26D21;">' +
            pricePerSquareMeter.toFixed(2) +
            ' €/m²</span>';
        } else {
          newHTML +=
            '<span style="color: #C02F1D;">' +
            pricePerSquareMeter.toFixed(2) +
            ' €/m²</span>';
        }
        trs[i].getElementsByTagName('td')[8].children[0].innerHTML = newHTML;
      }
    }
  } catch (error) {
    // do nothing
  }
  // Google Maps link
  const regex_gps = /.*&c=(\d*\.\d*, ?\d*\.\d*).*/g;
  const gps = [
    ...document
      .getElementById('mnu_map')
      .getAttribute('onclick')
      .matchAll(regex_gps),
  ][0][1];

  // Replace old map URL
  let mapLink = document.getElementById('mnu_map');
  mapLink.onclick = '';
  mapLink.target = '_blank';
  mapLink.href = 'http://maps.google.com/?q=' + encodeURI(gps);

  // Replace ads with a map
  deleteElem('ads_sys_div1');
  let gMaps = document.createElement('iframe');
  gMaps.width = 300;
  gMaps.height = 650;
  gMaps.id = 'gmap_canvas';
  gMaps.src = `https://maps.google.com/maps?q=${encodeURI(
    gps
  )}&t=&z=13&ie=UTF8&iwloc=&output=embed`;
  gMaps.frameborder = 0;
  gMaps.scrolling = 'no';
  gMaps.marginheight = 0;
  gMaps.marginwidth = 0;
  document.getElementById('page_right').appendChild(gMaps);

  // Google Translate button
  // create div
  let translateDiv = document.createElement('div');
  translateDiv.id = 'google_translate_element';
  translateDiv.style.paddingBottom = '0.5rem';
  // append as child of #msg_div_msg before the first table
  document
    .getElementById('msg_div_msg')
    .insertBefore(
      translateDiv,
      document.getElementById('msg_div_msg').getElementsByTagName('table')[0]
    );

  var script = document.createElement('script');
  script.type = 'text/javascript';
  script.src =
    'https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit&hl=en';
  document.getElementsByTagName('head')[0].appendChild(script);
  setTimeout(() => {
    new google.translate.TranslateElement(
      { pageLanguage: 'lv', includedLanguages: 'en,ru,lv' },
      'google_translate_element'
    );
  }, 500);

  // create a div with p that says "looping" and append to beginning of #img_div_scroll
  let loopDiv = document.createElement('div');
  loopDiv.id = 'loop_div';
  loopDiv.style.paddingBottom = '0.5rem';
  loopDiv.innerHTML = `<p>Looping</p>`;
  loopDiv.style.position = 'absolute';
  loopDiv.style.top = '0';
  loopDiv.style.left = '0';
  loopDiv.style.width = '100%';
  loopDiv.style.height = '100%';
  loopDiv.style.backgroundColor = 'rgba(0,0,0,0.5)';
  loopDiv.style.zIndex = '1';
  loopDiv.style.display = 'none';
  loopDiv.style.fontSize = '2rem';
  loopDiv.style.color = 'white';
  loopDiv.style.fontWeight = 'bold';
  loopDiv.style.textShadow = '0 0 1rem black';
  loopDiv.style.lineHeight = '1.5';
  loopDiv.style.justifyContent = 'center';
  loopDiv.style.alignItems = 'center';

  // monitor changes in #msg_div_preload, enables looping of the image gallery
  let msg_div_preload = document.getElementById('msg_div_preload');
  msg_div_preload.addEventListener('DOMSubtreeModified', () => {
    // if style contains "display: none", trigger onclick of first a in .pic_dv_thumbnail
    if (msg_div_preload.style.display === 'none') {
      document
        .getElementsByClassName('pic_dv_thumbnail')[0]
        .children[0].click();
      document
        .getElementById('img_div_scroll')
        .insertBefore(
          loopDiv,
          document.getElementById('img_div_scroll').firstChild
        );
      loopDiv.style.display = 'flex';
      setTimeout(() => {
        loopDiv.style.display = 'none';
      }, 1000);
    } else {
      loopDiv.style.display = 'none';
    }
  });
};

// listen for keyboard button a and d
document.addEventListener('keydown', (e) => {
  if (e.key === 'a') {
    // trigger onclick of first a in .pic_dv_thumbnail
    document.getElementById('pic_menu_prev').click();
  }
  if (e.key === 'd') {
    // trigger onclick of first a in .pic_dv_thumbnail
    document.getElementById('pic_menu_next').click();
  }
}); 

• added google translate toolbar
• ss.com map URL now points to google maps