vk.md

// vk comunity wall api
//==================================================
const tempFunc = {};
const vkApiBlocks = document.querySelectorAll('.s-vk-wall__list');

vkApiBlocks.forEach((vkApiBlock) => {
  const comunityUrl = vkApiBlock.dataset.comunityUrl;
  const vkComunityId = parseInt(vkApiBlock.dataset.comunityId);

  vkComunityApiRequest(vkApiBlock, comunityUrl, vkComunityId);
})

function vkComunityApiRequest (wrapper, comunity_url, comunity_id) {
  const vkAccessToken = 'Указать токен';
  const callbackName = 'comunity' + comunity_id;
  let comunityPostRequestBody = {
    access_token: vkAccessToken,
    owner_id: -comunity_id,
    count: 10,
    v: 5.131,
  }

  // -- Make request params
  comunityPostRequestBody = Object.keys(comunityPostRequestBody).reduce((string, key, index) => {
    let newString = string;

    if (index !== 0) {
      newString += '&' + key + '=' + comunityPostRequestBody[key];
    } else {
      newString += key + '=' + comunityPostRequestBody[key];
    }

    return newString;
  }, '')

  // Create temp func
  tempFunc[callbackName] = function(data) {
    delete tempFunc[callbackName];
    getVkComunityData(data, wrapper, comunity_url);
  };

  addScript('https://api.vk.com/method/wall.get?' + comunityPostRequestBody + '&callback=tempFunc.' + callbackName);
}

function getVkComunityData (res, wrapper, comunity_url) {
  renderVkWrapperItems(wrapper, res, comunity_url);
}

function renderVkWrapperItems (wrapper, data, comunityUrl) {
  const items = data.response.items;
  const minPreviewSize = 250;
  const maxPreviewSize = 900;

  console.log(data);

  items.forEach(item => {
    const itemData = {
      url: `${comunityUrl}?w=wall${item.from_id}_${item.id}`,
      text: item.text,
      imageUrl: ''
    }

    let postAttachments = item.attachments;
    let postAttachmentsType = '';
    let previewPhoto = null;
    let previewPhotoSizes = null;
    let previewFilteredSizes = null;

    if (postAttachments && postAttachments.filter((attachment) => attachment.type === 'photo').length) {
      postAttachments = postAttachments.filter((attachment) => attachment.type === 'photo');
      postAttachmentsType = 'photo';
    } else if (postAttachments && postAttachments.filter((attachment) => attachment.type === 'video').length) {
      postAttachments = postAttachments.filter((attachment) => attachment.type === 'video');
      postAttachmentsType = 'video';
    }

    if (postAttachmentsType.length) {

      // Get image sizes from first attachment (video / image)
      if (postAttachmentsType === 'video') {
        previewPhotoSizes = postAttachments[0].video.image;
      } else if (postAttachmentsType === 'photo') {
        previewPhotoSizes = postAttachments[0].photo.sizes;
      }

      // Filter image sizes
      previewFilteredSizes = previewPhotoSizes.filter((size) =>  size.height <= maxPreviewSize && size.height >= minPreviewSize);

      if (previewFilteredSizes.length) {
        previewPhoto = previewFilteredSizes[0];
      } else {
        previewPhoto = previewPhotoSizes[0];
      }
    }

    if (previewPhoto) {
      itemData.imageUrl = previewPhoto.url;
      renderVkItem(wrapper, itemData);
    }

  });
}

function renderVkItem (wrapper, data) {
  const vkItemTemplate = `
    <a class="s-vk-wall__item" href="${data.url}" target="_blank" rel="noopener">
        <div class="s-vk-wall__item-inner">
            <div class="s-vk-wall__item-content">
                <div class="s-vk-wall__item-icon">
                    <svg class="ico ico-mono-ic-vk">
                        <use xlink:href="/assets/templates/redesign/img/sprite-mono.svg#ico-mono-ic-vk"></use>
                    </svg>
                </div>
                <div class="s-vk-wall__item-description">${data.text.replace(/\n/gm,' ')}</div>
            </div>
            <div class="s-vk-wall__item-bg">
                <img
                    src="${data.imageUrl}"
                    alt=""
                />
            </div>
        </div>
    </a>

  `

  wrapper.innerHTML += vkItemTemplate;
}

function addScript(src, callback = () => {}) {
  var elem = document.createElement("script");
  elem.src = src;
  document.head.appendChild(elem);
}