<?php get_header(); ?>
<?php include get_template_directory() . '/inc/menus/menu.php'; ?>

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

<?php
$url_raw = get_permalink();
$url = urlencode($url_raw);
$title = urlencode(get_the_title());
?>

<section class="single-hero">
    <?php if (has_post_thumbnail()) : ?>
        <?php the_post_thumbnail('full', ['class' => 'single-hero-bg']); ?>
    <?php endif; ?>

    <div class="single-hero-content">
        <h1 class="single-hero-title"><?php the_title(); ?></h1>
    </div>
</section>


<section class="single-wrapper">




<div class="single-grid">

<article class="single-content">

  <!-- META BAR INSIDE ARTICLE -->
  <div class="single-meta">
    <div class="meta-left">
      <span><?php echo get_the_date(); ?></span>
      <span>By <?php the_author(); ?></span>
    </div>

<div class="meta-actions">
  <a class="meta-icon x" href="https://twitter.com/intent/tweet?url=<?php echo $url; ?>&text=<?php echo $title; ?>" target="_blank" rel="noopener">
    <i class="fa-brands fa-x-twitter"></i>
  </a>
  <a class="meta-icon print" href="#" onclick="window.print();return false;">
    <i class="fa-solid fa-print"></i>
  </a>
  <a class="meta-icon share" id="openShare">
    <i class="fa-solid fa-share-nodes"></i>
  </a>
</div>
    </div>

  <h1><?php the_title(); ?></h1>
  <?php the_content(); ?>

</article>

<aside class="single-sidebar">

<?php
$related = new WP_Query([
  'post_type'      => 'post',
  'posts_per_page' => 6,
  'post__not_in'   => [ get_the_ID() ]
]);

while ($related->have_posts()) : $related->the_post();
?>
<a href="<?php the_permalink(); ?>" class="sidebar-item">
  <span><?php echo get_the_date(); ?></span>
  <p class="sidebar-item"><?php the_title(); ?></p>
</a>
<?php endwhile; wp_reset_postdata(); ?>
</aside>

</div>

</section>


<!-- SHARE POPUP -->
<div id="shareOverlay">
<div class="share-box">

<div class="share-grid">
<?php
$socials = [
  // Popular
  'facebook'      => 'https://www.facebook.com/sharer/sharer.php?u='.$url,
  'twitter'       => 'https://twitter.com/intent/tweet?url='.$url.'&text='.$title,
  'linkedin'      => 'https://www.linkedin.com/sharing/share-offsite/?url='.$url,
  'whatsapp'      => 'https://wa.me/?text='.$title.'%20'.$url,
  'telegram'      => 'https://t.me/share/url?url='.$url.'&text='.$title,
  'reddit'        => 'https://www.reddit.com/submit?url='.$url.'&title='.$title,
  'pinterest'    => 'https://pinterest.com/pin/create/button/?url='.$url,
  'tumblr'        => 'https://www.tumblr.com/widgets/share/tool?canonicalUrl='.$url,
  'vk'            => 'https://vk.com/share.php?url='.$url,
  'line'          => 'https://social-plugins.line.me/lineit/share?url='.$url,

  // Blogging / reading
  'blogger'       => 'https://www.blogger.com/blog-this.g?u='.$url,
  'medium'        => 'https://medium.com/new-story?url='.$url,
  'flipboard'     => 'https://share.flipboard.com/bookmarklet/popout?v=2&url='.$url,
  'instapaper'   => 'https://www.instapaper.com/edit?url='.$url.'&title='.$title,
  'getpocket'    => 'https://getpocket.com/save?url='.$url.'&title='.$title,
  'evernote'     => 'https://www.evernote.com/clip.action?url='.$url,
  'douban'       => 'https://www.douban.com/share/service?href='.$url,

  // Dev / tech
  'hackernews'   => 'https://news.ycombinator.com/submitlink?u='.$url.'&t='.$title,
  'digg'         => 'https://digg.com/submit?url='.$url,
  'refind'       => 'https://refind.com/?url='.$url,
  'pinboard'     => 'https://pinboard.in/add?url='.$url.'&title='.$title,

  // Social / regional
  'weibo'        => 'https://service.weibo.com/share/share.php?url='.$url,
  'qzone'        => 'https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='.$url,
  'naver'        => 'https://share.naver.com/web/shareView?url='.$url,
  'kakao'        => 'https://sharer.kakao.com/talk/friends/picker/link',
  'odnoklassniki'=> 'https://connect.ok.ru/offer?url='.$url,
  'livejournal'  => 'https://www.livejournal.com/update.bml?event='.$url,
  'renren'       => 'http://widget.renren.com/dialog/share?resourceUrl='.$url,

  // Messaging / email
  'email'        => 'mailto:?subject='.$title.'&body='.$url,
  'gmail'        => 'https://mail.google.com/mail/?view=cm&body='.$url,
  'yahoomail'    => 'https://compose.mail.yahoo.com/?body='.$url,
  'outlook'      => 'https://outlook.live.com/owa/?body='.$url,
  'skype'        => 'https://web.skype.com/share?url='.$url,
  'viber'        => 'https://www.viber.com/en/share?url='.$url,
  'messenger'    => 'https://www.facebook.com/dialog/send?link='.$url,
  'wechat'       => 'https://www.addtoany.com/add_to/wechat?linkurl='.$url,
  'tencentqq'    => 'https://connect.qq.com/widget/shareqq/index.html?url='.$url,

  // Productivity
  'buffer'       => 'https://buffer.com/add?url='.$url.'&text='.$title,
  'trello'       => 'https://trello.com/add-card?url='.$url,
  'kindleit'     => 'https://fivefilters.org/kindle-it/send.php?url='.$url,

  // Misc
  'print'        => 'print',
  'threads'      => 'https://www.threads.net/intent/post?text='.$title.'%20'.$url,
    'discord'      => 'https://discord.com/channels/@me',
    'slack'        => 'https://slack.com/share?url='.$url.'&text='.$title,
    'mastodon'     => 'https://mastodon.social/share?text='.$title.'%20'.$url,
    'teams'        => 'https://teams.microsoft.com/share?href='.$url,
    'xing'         => 'https://www.xing.com/spi/shares/new?url='.$url,
    'baidu'        => 'https://cang.baidu.com/do/add?it='.$title.'&iu='.$url,
    'hatena'       => 'https://b.hatena.ne.jp/entry/'.$url,
    'mix'          => 'https://mix.com/add?url='.$url,
    'copylink'     => 'copy'
];
$icon_map = [
  'facebook'        => 'facebook',
  'twitter'         => 'x',
  'linkedin'        => 'linkedin',
  'whatsapp'        => 'whatsapp',
  'telegram'        => 'telegram',
  'reddit'          => 'reddit',
  'pinterest'       => 'pinterest',
  'tumblr'          => 'tumblr',
  'vk'              => 'vk',
  'line'            => 'line',

  'blogger'         => 'blogger',
  'medium'          => 'medium',
  'flipboard'       => 'flipboard',
  'instapaper'      => 'instapaper',
  'getpocket'       => 'pocket',
  'evernote'        => 'evernote',
  'douban'          => 'douban',

  'hackernews'      => 'ycombinator',
  'digg'            => 'digg',
  'refind'          => 'refind',
  'pinboard'        => 'pinboard',

  'weibo'           => 'sinaweibo',
  'qzone'           => 'qzone',
  'naver'           => 'naver',
  'kakao'           => 'kakaotalk',
  'odnoklassniki'   => 'odnoklassniki',
  'livejournal'     => 'livejournal',
  'renren'          => 'renren',

  'email'           => 'maildotru',
  'gmail'           => 'gmail',
  'yahoomail'       => 'yahoo',
  'outlook'         => 'microsoftoutlook',
  'skype'           => 'skype',
  'viber'           => 'viber',
  'messenger'       => 'messenger',
  'wechat'          => 'wechat',
  'tencentqq'       => 'tencentqq',

  'buffer'          => 'buffer',
  'trello'          => 'trello',
  'kindleit'        => 'amazonkindle',

  'print'           => 'printer',
  'threads'      => 'threads',
'discord'      => 'discord',
'slack'        => 'slack',
'mastodon'     => 'mastodon',
'teams'        => 'microsoftteams',
'xing'         => 'xing',
'baidu'        => 'baidu',
'hatena'       => 'hatena',
'mix'          => 'mix',
'copylink'     => 'link'

];


foreach ($socials as $name => $link) {

  $icon = $icon_map[$name] ?? $name;
  $label = ucfirst($name);

  if ($link === 'print') {
    echo '
      <button class="share-item" onclick="window.print()">
        <img src="https://cdn.simpleicons.org/'.$icon.'/ffffff">
        <span>'.$label.'</span>
      </button>
    ';
  } else {
    echo '
      <a class="share-item" href="'.$link.'" target="_blank" rel="noopener">
        <img src="https://cdn.simpleicons.org/'.$icon.'/ffffff">
        <span>'.$label.'</span>
      </a>
    ';
  }
}

?>

</div>

<button id="closeShare">✕</button>
</div>
</div>

<script>
document.addEventListener('DOMContentLoaded',function(){
const overlay=document.getElementById('shareOverlay');
document.getElementById('openShare').onclick=()=>{overlay.classList.add('active');document.body.style.overflow='hidden';};
document.getElementById('closeShare').onclick=()=>{overlay.classList.remove('active');document.body.style.overflow='';};
});
</script>

<?php endwhile; endif; ?>
<?php get_footer(); ?>
