<?php
require_once($_SERVER['DOCUMENT_ROOT'] . "/session.php");  
// draw_use.php: draw.php 함수형 샘플 사용 예시
include $_SERVER['DOCUMENT_ROOT'] . '/load_header.php';
$title_message = '절곡품 (가이드레일)'; 
?>
<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>draw.php 함수형 샘플</title> 
    <link rel="stylesheet" href="css/style.css">
    <style>
        body { background: #f4f4f4; padding: 40px; }
        .sample-wrap { max-width: 600px; margin: 0 auto; background: #fff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); padding: 32px; }
        #previewContainerSample { margin-bottom: 16px; }
    </style>
</head>
<body>
   
<div class="container">
<div class="card shadow-sm">
    <div class="card-header bg-primary text-white">
        <h5 class="card-title mb-0">draw.php 함수형 샘플</h5>
    </div>
    <div class="card-body">
        <div id="previewContainerSample" class="text-center mb-3 border rounded bg-light p-3" style="min-height:240px;"></div>
        <button id="drawBtn" class="btn btn-primary mb-3">그리기</button>
        <?php
            // 함수형 draw.php를 include (id를 파라미터로 전달)
            $previewContainerId = 'previewContainerSample';
            $drawBtnId = 'drawBtn';
            include __DIR__.'/draw.php';
        ?>
        <p class="card-text text-muted small">draw.php를 함수형으로 불러와 원하는 위치에 그리기 기능을 붙일 수 있습니다.</p>
    </div>
</div>
</div>

<script>
$(document).ready(function() {
    var loader = document.getElementById('loadingOverlay');
	if(loader)
		loader.style.display = 'none';

    $('#drawBtn').click(function() {
        $('#previewContainerSample').html(''); 
        $('#previewContainerSample').append('<img src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIwIiBoZWlnaHQ9IjI0MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB3aWR0aD0iMzIwIiBoZWlnaHQ9IjI0MCIgZmlsbD0iI2Y5ZjlmOSIvPjx0ZXh0IHg9IjE2MCIgeT0iMTIwIiBmb250LWZhbWlseT0iQXJpYWwiIGZvbnQtc2l6ZT0iMTQiIGZpbGw9IiM5OTkiIHRleHQtYW5jaG9yPSJtaWRkbGUiIGR5PSIuM2VtIj7snbTrgqjrj4Qg7YWM7Zek7Yq567OE7IucIOuPmeuCqOq1rCDsl4bsnYw8L3RleHQ+PC9zdmc+" alt="sample" style="width:320px; height:240px;">');
    });
});

</script>
</body>
</html> 