// ==UserScript==
// @name         Tweetdeck media zoom
// @namespace    http://tampermonkey.net/
// @version      0.1.2
// @description  タブレット専用に選択した画像を広げて表示
// @author       y_kahou
// @match        https://tweetdeck.twitter.com/
// @grant        none
// @noframes
// @require      http://code.jquery.com/jquery-3.5.1.min.js
// @downloadURL none
// ==/UserScript==

var $ = window.jQuery;

function __css__() {/*
.med-origlink { display: none; }
.med-flaglink { display: none; }
.med-embeditem {
    top: 0;
    bottom: 0;
}
.med-tweet {
    background: rgb(0, 0, 0, 0.8);
    right: 0px;
    left: 0px;
    transition: 0.5s;
}
.view {
    opacity: 0;
    pointer-events: none;
}

.js-med-tweet .item-box {
    padding-left: 100px;
    padding-right: 100px;
}
.js-med-tweet .account-link {
    flex: none;
}
.js-med-tweet .account-link > .nbfc{
    display: inline-block;
}
.js-med-tweet time {
    position: absolute;
    right: 100px;
}
*/}
function addStyle() {
    var css = (__css__).toString()
        .match(/[^]*\/\*([^]*)\*\/\}$/)[1]
        .replace(/\{\*/g, '/*')
        .replace(/\*\}/g, '*/');
        
    var font = $('html').css('font-family')
    css += `pre { font-family: ${font}; }`
    
    $('head').append(`<style id="mystyle" type="text/css">${css}</style>`)
}
(function() {
    'use strict';
    addStyle();
    
    var tapCount = 0;
    var tapCount2 = 0;
    
    var controll = function(modal) {
        
        $(modal).on('DOMSubtreeModified propertychange', function() {
            var tweet = $('p', modal)[0]
            if (tweet) {
                $(tweet).replaceWith(`<pre>${$(tweet).html()}</pre>`);
            }
        })
        
        
        $(modal).on('touchstart', 'a.js-media-image-link', function(e) {
            if (!tapCount) {
                e.preventDefault();
                ++tapCount;
                setTimeout(() => tapCount = 0, 350);
            } else {
                // ダブルタップ判定
                e.stopPropagation();
                tapCount = 0 ;
            }
        })
        $(modal).on('touchstart', '.js-modal-panel', function(e) {
            if (!tapCount2) {
                $('.med-tweet').toggleClass('view')
                ++tapCount2;
                setTimeout(() => tapCount2 = 0, 350);
            } else {
                // ダブルタップ判定
                e.preventDefault();
                $(modal).empty().hide();
                tapCount2 = 0 ;
            }
        })
    }
    var iv = setInterval(function() {
        var modal = $('#open-modal')[0];
        if (modal) {
            clearInterval(iv);
            controll(modal);
        }
    }, 500)
})();