Ekran Görüntüsünü Al ve Yapıştır

İnternette dolaşırken aklıma gelen basit ama kullanışlı olacağını düşündüğüm küçük bir betik uygulama yaptım.

Hepimiz internete herhangi bir resim yüklemişizdir ve bu yüklediğimiz resimlerin azı veya çoğu ekranda yaptığımız işlemlerle alakalı karşı tarafa göstermek için olabilmekte.

Buradan yola çıkarak ekran görünütüsü yakala tuşu olan klavyemizde bulunan “Print Screen” ile ekranı kaydedip, yapıştırma tuş kombinasyonu olan “Ctrl+V” tuşlarına basarak
yakaladığımız resmi internet sitesine dosyayı kaydetmeden yapmamıza sağlayan aşağıda örneği ve kodlaması olan bağlantı paylaştım.

Burada asıl işi yapan kısım aşağıdaki javascript kodu. Alınan ekran görüntüsünü bize dosya olarak vermekte. Bizden bundan faydalanarak aldığımız içeriği dosya olarak sunucumuza ajax ile gönderip kaydedip hatta birde küçük resmini ayarlayıp işlem yapanların arzusuna sunmaktayız.

document.onpaste = function(e){
	var items = e.clipboardData.items;
	var files = [];
	for( var i = 0, len = items.length; i < len; ++i ) {
		var item = items[i];
		if( item.kind === "file" ) {
			submitFileForm( item.getAsFile() );
		}
	}
};
<?php
function imgResize($filename, $source_dir, $new_source = '', $dest_width = '', $dest_height = '',$auto = true){	
	$full_path = $source_dir . $filename;
	
	$basefilename = preg_replace("/(.*)\.([^.]+)$/","\\1", $filename);
	$ext = preg_replace("/.*\.([^.]+)$/","\\1", $filename);
	$ext = strtolower($ext);
	
	switch ($ext) {
		case 'png':
			$image = imagecreatefrompng($full_path);
		break;
		
		case 'jpg':
			$image = imagecreatefromjpeg($full_path);
		break;
		
		case 'jpeg':
			$image = imagecreatefromjpeg($full_path);
		break;
		
		default:
			echo 'GD işlem için geçerli olmayan dosya formatı : '.$ext;
			return false;
		break;
	}

	$image_width = imagesx($image);
	$image_height = imagesy($image);
	
	if ( $auto ){
		if ( $image_width >= $image_height ){
			if ( $dest_width ){
				if ( $dest_width > $image_width )
					$dest_width = $image_width;    					
				$dest_height = (int) ( $image_height / ( (real)($image_width / $dest_width) ) );		
			} else {
				if ( $dest_height > $image_height )
					$dest_height = $image_height;    					
				$dest_width = (int) ( $image_width / ( (real)($image_height / $dest_height) ) );
			}
		} else {    			    			
			if ( $dest_height ){
				if ( $dest_height > $image_height )
					$dest_height = $image_height;    					
				$dest_width = (int) ( $image_width / ( (real)($image_height / $dest_height) ) );		
			} else {
				if ( $dest_width > $image_width )
					$dest_width = $image_width;    					
				$dest_height = (int) ( $image_height / ( (real)($image_width / $dest_width) ) );
			}    			
		}
	}
	
	
	
	
	if ('gd2' == checkGd()) { 
		$img_id = imagecreatetruecolor($dest_width, $dest_height);
		
		imagealphablending($img_id, false);
		imagesavealpha($img_id,true);
		$transparent = imagecolorallocatealpha($img_id, 255, 255, 255, 127);
		imagefilledrectangle($img_id, 0, 0, $image_width, $image_height, $transparent);
		
		imagecopyresampled($img_id, $image, 0, 0, 0, 0, $dest_width, $dest_height, $image_width, $image_height);
		
	} else {
		$img_id = imagecreate($dest_width, $dest_height);
		
		imagealphablending($img_id, false);
		imagesavealpha($img_id,true);
		$transparent = imagecolorallocatealpha($img_id, 255, 255, 255, 127);
		imagefilledrectangle($img_id, 0, 0, $image_width, $image_height, $transparent);
		
		imagecopyresized($img_id, $image, 0, 0, 0, 0, $dest_width, $dest_height, $image_width, $image_height);
	}
	
	$new_source = ( $new_source ) ? $new_source : $source_dir . $filename; 
	
	
	switch ($ext) {
		case 'png':
			imagepng($img_id, $new_source,9);
			break;
		
		case 'jpg':
			imagejpeg($img_id, $new_source,100);
			break;
		
		case 'jpeg':
			imagejpeg($img_id, $new_source,100);
			break;
	}
	
	imagedestroy($img_id);
	
	return true;
}

function checkGd(){
	$gd_content = get_extension_funcs('gd');
	if (!$gd_content) {
		return false; 
	} else {
		ob_start();
		phpinfo(8);
		$buffer = ob_get_contents();
		ob_end_clean(); 
		if (strpos($buffer, '2.0')) {
			return 'gd2';
		} else {
			return 'gd';
		}
	}
}

if ( isset( $_GET['uploadIMG'] ) ){
	
	function dosyaIslem(){
		$dosyaDegisken = 'icerikResim';
		if ( !isset($_FILES[$dosyaDegisken]) ){
			return false;
		}
		
		if ( $_FILES[$dosyaDegisken]['error'] ){ // Dosya yükleme işleminde hata olduysa
			return false;
		}
		
		$resimKontrol = getimagesize($_FILES[$dosyaDegisken]['tmp_name']);
		
		if ( $resimKontrol === FALSE ){ // Dosya resim kontrolü
			return false;
		}
		
		$dosyaYol = 'upload/';
		//$dosyaYol2 = $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI']; // Bu işlem resim yüklendikten sonra geçerli bir url adresi vermek için
		
		$_FILES[$dosyaDegisken]['name'] = 'VYZ_uploadIMG_'.rand(0,10000);
		
		$dosyaUzanti = explode('/',$_FILES[$dosyaDegisken]['type']);
		$dosyaAdi = ($_FILES[$dosyaDegisken]['name']) . '.' . $dosyaUzanti[1];
		
		if ( move_uploaded_file( $_FILES[$dosyaDegisken]['tmp_name'], $dosyaYol . $dosyaAdi ) ){
			return $dosyaYol . $dosyaAdi;
		} else {
			return false;
		}
		
	}

	if ( !isset($_POST['dosyaGenislik']) || !$_POST['dosyaGenislik'] ){
		$_POST['dosyaGenislik'] = 600;
	}
	if ( !isset($_POST['dosyaYukseklik']) || !$_POST['dosyaYukseklik'] ){
		$_POST['dosyaYukseklik'] = 400;
	}
	if ( !isset($_POST['dosyaOtomatik']) || !$_POST['dosyaOtomatik'] ){
		$_POST['dosyaOtomatik'] = true;
	}
	
	if ( $dosyaAdi = dosyaIslem() ){
		$dosyaYol = 'upload/';
		$yeniDosyaYol = str_replace( $dosyaYol, $dosyaYol . 'kucuk/', $dosyaAdi );
		
		if ( imgResize( $dosyaAdi, '', $yeniDosyaYol, $_POST['dosyaGenislik'], $_POST['dosyaYukseklik'], $_POST['dosyaOtomatik'] ) ){
			$returnMsg = array(
				'islemSonuc' => true,
				'islemMsj' => $yeniDosyaYol,
			);
		} else {
			$returnMsg = array(
				'islemSonuc' => false,
				'islemMsj' => 'Dosya yükleme işleminde hata oluştu. Lütfen tekrar deneyiniz',
			);
		}
	} else {
		$returnMsg = array(
			'islemSonuc' => false,
			'islemMsj' => 'Dosya yükleme işleminde hata oluştu. Lütfen tekrar deneyiniz',
		);
	}

	echo json_encode( $returnMsg );return;	
}			 
?>
<!DOCTYPE html>
<html>
<head>
	<title>Ekranı Yakala ve Yükle</title>
	<meta charset="UTF-8">
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

	<!-- Optional theme -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
	
	<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
	
	<!-- Latest compiled and minified JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
	<div class="panel panel-primary dialog-panel">
		<div class="panel-heading">
			<h5>Ekranı Yakala ve Yükle</h5>
		</div>
		<div class="panel-body">
			<?php if ( isset($returnMsg) ){ ?>
				<?php if ( $returnMsg['islemSonuc'] ){ ?>
					<p class="bg-success">
						<img src="<?php echo $returnMsg['islemMsj']?>" />
					</p>				
				<?php } else { ?>
					<p class="bg-danger"><?php echo $returnMsg['islemMsj'];?></p>				
				<?php } ?>
			<?php } ?>
			
			<form class="form-horizontal">
				<div class="form-group">
					<label class="control-label col-md-12" style="text-align:center;">
						Klavyenizden <img src="http://www.vyz.gen.tr/wp-content/uploads/print-screen-tusu.png" /> tuşuna basıp ekranın resmini aldıktan sonra CTRL+V yani yapıştır yapmanız yeter!
					</label>					
				</div>
				
				<div class="form-group">
					<div id="uploadIMG" class="col-md-10 col-md-offset-2">
						
					</div>
				</div>				
			</form>
		</div>
	</div>
</div>

<script type="text/javascript">
document.onpaste = function(e){
	var items = e.clipboardData.items;
	var files = [];
	for( var i = 0, len = items.length; i < len; ++i ) {
		var item = items[i];
		if( item.kind === "file" ) {
			submitFileForm( item.getAsFile() );
		} else {
			alert( 'Ekran görüntüsü yapıştırmanız gerekmektedir.' );
			return;
		}
	}
};

function submitFileForm(file) {
    
	var formData = new FormData();
    formData.append('icerikResim', file);
	
	$('#uploadIMG').html('Kopyalanıyor...');
	
	$.ajax({
		url: '?uploadIMG',
		data: formData,
		dataType:'json',
		processData: false,
		contentType: false,
		type: 'POST',
		success: function(data){
			if ( data.islemSonuc ){
				var tmpOrjinal = (data.islemMsj.replace('kucuk/',''));
				var tmpStr = '<a title="Büyük resmi için tıklayınız" href="'+tmpOrjinal+'" target="_blank"><img src="'+(data.islemMsj)+'" /></a> <br /><br />';
					tmpStr += '<input class="col-md-10" type="text" value="'+window.location.href+tmpOrjinal+'" />';
				$('#uploadIMG').html( tmpStr );
			} else {
				alert( data.islemMsj );
			}
		}
	});
}
</script>

</body>
</html>

Uygulama Örnek Sayfası

Javascript ve Php ile Ekranı Kaydet ve Yapıştır Uygulamasını İndir

Paylaş: