msbfox/dnssash
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add

Browse Source
This commit is contained in:
msbfox
2026-06-14 10:39:56 +09:00
parent 4ee992e855
commit 0345b8cd08
514 changed files with 492 additions and 953 deletions
Download Patch File Download Diff File Expand all files Collapse all files
theme/rd.dnssash/rb.layout/dnssash_main/index.php
+158 -74
View File
@@ -3,7 +3,7 @@ if (!defined('_GNUBOARD_')) exit;
$skin_url = G5_THEME_URL . '/rb.layout/dnssash_main';
$today = G5_TIME_YMD;
function process_product_positions(&$db_products, $main_visual_data) {
/*function process_product_positions(&$db_products, $main_visual_data) {
if (empty($db_products)) return;
foreach ($db_products as &$product) {
@@ -21,8 +21,54 @@ function process_product_positions(&$db_products, $main_visual_data) {
}
}
unset($product);
}
}*/
function process_product_positions(&$db_products, $main_visual_data) {
if (empty($db_products)) return;
// 1. $db_products를 title을 키로 하는 맵으로 변환하여 빠른 조회를 가능하게 합니다.
$db_products_map = [];
foreach ($db_products as $product) {
$db_products_map[$product['title']] = $product;
}
$ordered_products = [];
// 2. $main_visual_data의 순서에 따라 제품을 정렬하고 속성을 업데이트합니다.
foreach ($main_visual_data as $main_item) {
$title = $main_item['title'];
if (isset($db_products_map[$title])) {
$product = $db_products_map[$title];
// 기존 로직: pos 및 img_url 업데이트
if (isset($main_item['pos'])) {
$product['pos'] = $main_item['pos'];
}
if (isset($main_item['img_url'])) {
$product['img_url'] = $main_item['img_url'];
}
// main_visual_data에 xPct, yPct가 있다면 db_products의 값보다 우선합니다.
// if (isset($main_item['xPct'])) {
// $product['xPct'] = $main_item['xPct'];
// }
// if (isset($main_item['yPct'])) {
// $product['yPct'] = $main_item['yPct'];
// }
$ordered_products[] = $product;
unset($db_products_map[$title]); // 처리된 항목은 맵에서 제거합니다.
}
}
// 3. $main_visual_data에 포함되지 않은 나머지 제품들을 뒤에 추가합니다.
foreach ($db_products_map as $remaining_product) {
$ordered_products[] = $remaining_product;
}
// 4. 원본 $db_products 배열을 새로 정렬된 배열로 교체합니다.
$db_products = $ordered_products;
unset($product);
}
// 1. 게시판 데이터 로드 시도
$bo_table = 'bconstruction'; // 게시판 ID
$sql = " select * from {$g5['write_prefix']}$bo_table
@@ -32,20 +78,22 @@ $sql = " select * from {$g5['write_prefix']}$bo_table
$result = sql_query($sql);
$db_products = array();
$main_visual_product_data = [
["title" => "입면분할창","pos"=>"left", "page" => "20p", "desc" => "조망권과 환기를 극대화한 시스템", "img_url" => $skin_url . '/images/1.webp', 'xPct'=> 63.0, 'yPct'=> 24.0],
["title" => "프로젝트창","pos"=>"left", "page" => "48p", "desc" => "기밀성이 우수한 상부 개폐식 창호", "img_url" => $skin_url . '/images/2' . '.webp', "xPct" => 71.0, "yPct" => 30.3],
["title" => "소형단창,이중창","pos"=>"left", "page" => "36p", "desc" => "침실 소형 전용 슬라이딩 창호", "img_url" => $skin_url . '/images/3' . '.webp', "xPct" => 80.7, "yPct" => 43.6],
["title" => "학교창","pos"=>"left", "page" => "40p", "desc" => "안전 기능이 강화된 환기창", "img_url" => $skin_url . '/images/5' . '.webp', "xPct" => 78.7, "yPct" => 41.4],
["title" => "판넬창", "pos"=>"left","page" => "44p", "desc" => "벽체 마감용 내구성 우수 창호", "img_url" => $skin_url . '/images/4' . '.webp', "xPct" => 5.7, "yPct" => 91.4],
["title" => "대형단창","pos"=>"right", "page" => "32p", "desc" => "발코니 전용 단열 슬라이딩 단창", "img_url" => $skin_url . '/images/6' . '.webp', "xPct" => 25.6, "yPct" => 36.0],
["title" => "대형이중창","pos"=>"right", "page" => "28p", "desc" => "방음 및 풍압 견딤력이 우수한 이중창", "img_url" => $skin_url . '/images/7' . '.webp', "xPct" => 36.9, "yPct" => 29.8],
["title" => "스마트 발코니 전용창","pos"=>"right", "page" => "12p", "desc" => "외창 전용 고기밀 샷시", "img_url" => $skin_url . '/images/8' . '.webp', "xPct" => 23.0, "yPct" => 37.8],
["title" => "스마트 이중창","pos"=>"right", "page" => "24p", "desc" => "보안이 강화된 자동잠금 이중창", "img_url" => $skin_url . '/images/9' . '.webp', "xPct" => 46.7, "yPct" => 22.8],
["title" => "발코니 확장 이중창","pos"=>"right", "page" => "16p", "desc" => "거실 확장용 고단열 이중창", "img_url" => $skin_url . '/images/10' . '.webp', "xPct" => 50.4, "yPct" => 20.8],
$main_visual_product_data = [
["title" => "입면분할창", "pos"=>"left", "page" => "20p", "desc" => "조망권과 환기를 극대화한 시스템", "pruimg_url" => $skin_url . '/images/1.webp',"img_url" => $skin_url . '/images/1.webp', 'xPct'=> 46.4, 'yPct'=> 12.5],
["title" => "프로젝트창","pos"=>"left", "page" => "48p", "desc" => "기밀성이 우수한 상부 개폐식 창호", "pruimg_url" => $skin_url . '/images/2.webp',"img_url" => $skin_url . '/images/2' . '.webp', "xPct" => 25.4, "yPct" => 24.8],
["title" => "소형단창","pos"=>"left", "page" => "36p", "desc" => "침실 소형 전용 슬라이딩 창호", "pruimg_url" => $skin_url . '/images/3.webp',"img_url" => $skin_url . '/images/3' . '.webp', "xPct" => 7.6, "yPct" => 33.0],
["title" => "학교창","pos"=>"left", "page" => "40p", "desc" => "안전 기능이 강화된 환기창", "pruimg_url" => $skin_url . '/images/5.webp',"img_url" => $skin_url . '/images/5' . '.webp' ],
["title" => "판넬창", "pos"=>"left", "page" => "44p", "desc" => "벽체 마감용 내구성 우수 창호", "pruimg_url" => $skin_url . '/images/4.webp',"img_url" => $skin_url . '/images/4' . '.webp'],
["title" => "대형단창","pos"=>"right", "page" => "32p", "desc" => "발코니 전용 단열 슬라이딩 단창", "pruimg_url" => $skin_url . '/images/6.webp',"img_url" => $skin_url . '/images/6' . '.webp', "xPct" => 62.1, "yPct" => 16.1],
["title" => "대형이중창","pos"=>"right", "page" => "28p", "desc" => "방음 및 풍압 견딤력이 우수한 이중창","pruimg_url" => $skin_url . '/images/7.webp', "img_url" => $skin_url . '/images/7' . '.webp', "xPct" => 62.1, "yPct" => 16.1],
["title" => "스마트 발코니 전용창","pos"=>"right", "page" => "12p", "desc" => "외창 전용 고기밀 샷시","pruimg_url" => $skin_url . '/images/8.webp', "img_url" => $skin_url . '/images/8' . '.webp', "xPct" => 62.1, "yPct" => 16.1],
["title" => "스마트 이중창","pos"=>"right", "right" => "24p", "desc" => "보안이 강화된 자동잠금 이중창","pruimg_url" => $skin_url . '/images/9.webp', "img_url" => $skin_url . '/images/9' . '.webp', "xPct" => 93.5, "yPct" => 41.6],
["title" => "발코니 확장 이중창","pos"=>"right", "page" => "16p", "desc" => "거실 확장용 고단열 이중창","pruimg_url" => $skin_url . '/images/10.webp', "img_url" => $skin_url . '/images/10' . '.webp', "xPct" => 93.5, "yPct" => 41.6],
];
while($row = sql_fetch_array($result)) {
@@ -78,21 +126,20 @@ while($row = sql_fetch_array($result)) {
);
}
//$db_products =null;
if (empty($db_products)) {
$db_products = [
["title" => "입면분할창", "pos"=>"left", "page" => "20p", "desc" => "조망권과 환기를 극대화한 시스템", "pruimg_url" => $skin_url . '/images/1.webp',"img_url" => $skin_url . '/images/1.webp', 'xPct'=> 63.0, 'yPct'=> 24.0,],
["title" => "프로젝트창","pos"=>"left", "page" => "48p", "desc" => "기밀성이 우수한 상부 개폐식 창호", "pruimg_url" => $skin_url . '/images/2.webp',"img_url" => $skin_url . '/images/2' . '.webp', "xPct" => 71.0, "yPct" => 30.3],
["title" => "소형단창,이중창","pos"=>"left", "page" => "36p", "desc" => "침실 소형 전용 슬라이딩 창호", "pruimg_url" => $skin_url . '/images/3.webp',"img_url" => $skin_url . '/images/3' . '.webp', "xPct" => 80.7, "yPct" => 43.6],
["title" => "학교창","pos"=>"left", "page" => "40p", "desc" => "안전 기능이 강화된 환기창", "pruimg_url" => $skin_url . '/images/5.webp',"img_url" => $skin_url . '/images/5' . '.webp', "xPct" => 78.7, "yPct" => 41.4],
["title" => "판넬창", "pos"=>"left", "page" => "44p", "desc" => "벽체 마감용 내구성 우수 창호", "pruimg_url" => $skin_url . '/images/4.webp',"img_url" => $skin_url . '/images/4' . '.webp', "xPct" => 5.7, "yPct" => 91.4],
["title" => "입면분할창", "pos"=>"left", "page" => "20p", "desc" => "조망권과 환기를 극대화한 시스템", "pruimg_url" => $skin_url . '/images/1.webp',"img_url" => $skin_url . '/images/1.webp', 'xPct'=> 46.4, 'yPct'=> 12.5],
["title" => "프로젝트창","pos"=>"left", "page" => "48p", "desc" => "기밀성이 우수한 상부 개폐식 창호", "pruimg_url" => $skin_url . '/images/2.webp',"img_url" => $skin_url . '/images/2' . '.webp', "xPct" => 25.4, "yPct" => 24.8],
["title" => "소형단창","pos"=>"left", "page" => "36p", "desc" => "침실 소형 전용 슬라이딩 창호", "pruimg_url" => $skin_url . '/images/3.webp',"img_url" => $skin_url . '/images/3' . '.webp', "xPct" => 7.6, "yPct" => 33.0],
["title" => "학교창","pos"=>"left", "page" => "40p", "desc" => "안전 기능이 강화된 환기창", "pruimg_url" => $skin_url . '/images/5.webp',"img_url" => $skin_url . '/images/5' . '.webp' ],
["title" => "판넬창", "pos"=>"left", "page" => "44p", "desc" => "벽체 마감용 내구성 우수 창호", "pruimg_url" => $skin_url . '/images/4.webp',"img_url" => $skin_url . '/images/4' . '.webp'],
["title" => "대형단창","pos"=>"right", "page" => "32p", "desc" => "발코니 전용 단열 슬라이딩 단창", "pruimg_url" => $skin_url . '/images/6.webp',"img_url" => $skin_url . '/images/6' . '.webp', "xPct" => 25.6, "yPct" => 36.0],
["title" => "대형이중창","pos"=>"right", "page" => "28p", "desc" => "방음 및 풍압 견딤력이 우수한 이중창","pruimg_url" => $skin_url . '/images/7.webp', "img_url" => $skin_url . '/images/7' . '.webp', "xPct" => 36.9, "yPct" => 29.8],
["title" => "스마트 발코니 전용창","pos"=>"right", "page" => "12p", "desc" => "외창 전용 고기밀 샷시","pruimg_url" => $skin_url . '/images/8.webp', "img_url" => $skin_url . '/images/8' . '.webp', "xPct" => 23.0, "yPct" => 37.8],
["title" => "스마트 이중창","pos"=>"right", "right" => "24p", "desc" => "보안이 강화된 자동잠금 이중창","pruimg_url" => $skin_url . '/images/9.webp', "img_url" => $skin_url . '/images/9' . '.webp', "xPct" => 46.7, "yPct" => 22.8],
["title" => "발코니 확장 이중창","pos"=>"right", "page" => "16p", "desc" => "거실 확장용 고단열 이중창","pruimg_url" => $skin_url . '/images/10.webp', "img_url" => $skin_url . '/images/10' . '.webp', "xPct" => 50.4, "yPct" => 20.8],
["title" => "대형단창","pos"=>"right", "page" => "32p", "desc" => "발코니 전용 단열 슬라이딩 단창", "pruimg_url" => $skin_url . '/images/6.webp',"img_url" => $skin_url . '/images/6' . '.webp', "xPct" => 62.1, "yPct" => 16.1],
["title" => "대형이중창","pos"=>"right", "page" => "28p", "desc" => "방음 및 풍압 견딤력이 우수한 이중창","pruimg_url" => $skin_url . '/images/7.webp', "img_url" => $skin_url . '/images/7' . '.webp', "xPct" => 62.1, "yPct" => 16.1],
["title" => "스마트 발코니 전용창","pos"=>"right", "page" => "12p", "desc" => "외창 전용 고기밀 샷시","pruimg_url" => $skin_url . '/images/8.webp', "img_url" => $skin_url . '/images/8' . '.webp', "xPct" => 62.1, "yPct" => 16.1],
["title" => "스마트 이중창","pos"=>"right", "right" => "24p", "desc" => "보안이 강화된 자동잠금 이중창","pruimg_url" => $skin_url . '/images/9.webp', "img_url" => $skin_url . '/images/9' . '.webp', "xPct" => 93.5, "yPct" => 41.6],
["title" => "발코니 확장 이중창","pos"=>"right", "page" => "16p", "desc" => "거실 확장용 고단열 이중창","pruimg_url" => $skin_url . '/images/10.webp', "img_url" => $skin_url . '/images/10' . '.webp', "xPct" => 93.5, "yPct" => 41.6],
];
} else {
@@ -119,6 +166,9 @@ function render_product_side($db_products, $side) {
data-x1="'.$item['xPct'].'"
data-y1="'.$item['yPct'].'"
data-img="'.$item['pruimg_url'].'"
data-title="'.htmlspecialchars($item['title']).'"
data-desc="'.htmlspecialchars($item['desc']).'"
data-content="'.htmlspecialchars(isset($item['content']) ? $item['content'] : "").'"
'.$link_attr.'>
<div class="product-img">
<img src="'.$item['img_url'].'" alt="'.htmlspecialchars($item['title']).'">
@@ -160,8 +210,11 @@ add_stylesheet('<link rel="stylesheet" href="'.G5_THEME_URL.'/rb.layout/'.$rb_co
//add_stylesheet('<link rel="stylesheet" href="'.G5_THEME_URL.'/rb.layout/'.$rb_core['layout'].'/css/style.css?ver='.G5_CSS_VER.'">', 0);
add_stylesheet('<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" />', 0);
add_javascript('<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>', 0);
//add_javascript('<script src="'.G5_THEME_URL.'/rb.layout/'.$rb_core['layout'].'/js/products.js?ver='.G5_CSS_VER.'"></script>', 0);
add_javascript('<script src="'.G5_THEME_URL.'/rb.layout/'.$rb_core['layout'].'/js/products.js?ver='.G5_CSS_VER.'"></script>', 0);
add_javascript('<script src="'.G5_THEME_URL.'/rb.layout/'.$rb_core['layout'].'/js/products2.js?ver='.G5_CSS_VER.'"></script>', 0);
// JS 추가 (GSAP 라이브러리를 먼저 로드하고, 그 뒤에 custom.js를 로드)
add_javascript('<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>', 0);
include_once(G5_ADMIN_PATH . '/order_manage/components/_expert_visit_popups.php');
?>
<div class="main-container">
@@ -211,11 +264,18 @@ include_once(G5_ADMIN_PATH . '/order_manage/components/_expert_visit_popups.php'
<?php echo render_product_side( $db_products, 'left');?>
</div>
<div class="product-main">
<img src='<?php echo $skin_url?>/images/main.webp' alt="메인 사진">
<div class="product-main" >
<img id="main-map" src='<?php echo $skin_url?>/images/main.png' alt="메인 사진">
<div class="product-hotspot"></div>
</div>
<div id="popup-box" style="position:absolute; width:0; height:0; display:none; overflow:hidden; z-index:100; box-shadow:0 10px 30px rgba(0,0,0,0.3);">
<div class="content" >
팝업 내용
</div>
</div>
<div class="product-side right">
<?php echo render_product_side( $db_products, 'right');?>
</div>
@@ -224,7 +284,7 @@ include_once(G5_ADMIN_PATH . '/order_manage/components/_expert_visit_popups.php'
<div class="main-container">
<div class="main-visual">
<section class="process-section">
<!-- <section class="process-section">-->
<div class="container">
<main class="layout-main-content1">
@@ -258,60 +318,67 @@ include_once(G5_ADMIN_PATH . '/order_manage/components/_expert_visit_popups.php'
</main>
</div>
</section>
<section class="min-h-screen flex flex-col items-center justify-center p-6">
<div class="mb-10 text-center">
<h1 class="text-3xl md:text-4xl font-bold text-white mb-3">
고객의 공간을 완성하는 프리미엄 창호 시스템 <span class="highlight_blue">이끌림샤시</span>로 시작하세요
</h1>
<!-- </section>-->
<p class="text-gray-300 text-sm md:text-base max-w-2xl mx-auto leading-relaxed">
고객의 생활 공간을 고려한 설계와 정밀한 기술력으로<br>
최고의 품질과 안정적인 A/S를 제공합니다.
</p>
</div>
</div>
</div>
<section class="min-h-screen flex flex-col items-center justify-center p-6">
<div class="mb-10 text-center">
<h1 class="text-3xl md:text-4xl font-bold text-white mb-3">
고객의 공간을 완성하는 프리미엄 창호 시스템 <span class="highlight_blue">이끌림샤시</span>로 시작하세요
</h1>
<section class="hero_container">
<div class="content_inner">
<p class="text-gray-300 text-sm md::text-base max-w-2xl mx-auto leading-relaxed">
고객의 생활 공간을 고려한 설계와 정밀한 기술력으로<br>
최고의 품질과 안정적인 A/S를 제공합니다.
</p>
</div>
<!-- <img src="--><?php //echo G5_THEME_URL ?><!--/rb.layout/dnssash/img/main1.png" alt="메인 배경 이미지" class="main_bg_img">-->
<div class="text_area">
<p class="label_blue">SMART WINDOW ORDERING</p>
<h1 class="main_title">
창호의 새로운 기준,<br>
<span class="highlight_blue">이끌림샤시</span>로 시작하세요
</h1>
<p class="sub_description">
복잡한 창호 교체, 이제 온라인 견적으로 투명하게.<br>
고품질 자재와 전문가의 손길을 클릭 한 번으로 만나보세요.
</p>
<!-- 전문가 상담 및 예약 버튼 (상단 오른쪽) -->
<div class="main_action_row">
<a href="<?php echo G5_BBS_URL ?>/board.php?bo_table=order" class="btn_box white" >
<div class="btn_icon">🏢</div>
<div class="btn_txt">
<strong>창호 온라인 주문</strong>
<p>실시간 직접 견적 및 주문 확정</p>
</div>
</a>
<div class="btn_box white" onclick="openExpertVisitPopup(<?php /*echo $wr_id; */?>)">
<div class="btn_icon">👨‍🔧</div>
<div class="btn_txt">
<strong>창호 전문가 부르기</strong>
<p>방문 실측 및 맞춤 상담 신청</p>
</div>
</section>
<div class="main-container">
<!-- 1. 메인 비주얼 섹션 (클래스명 변경됨) -->
<section class="map-main-visual">
<section class="hero_container">
<div class="content_inner">
<!-- <img src="--><?php //echo G5_THEME_URL ?><!--/rb.layout/dnssash/img/main1.png" alt="메인 배경 이미지" class="main_bg_img">-->
<div class="text_area">
<p class="label_blue">SMART WINDOW ORDERING</p>
<h1 class="main_title">
창호의 새로운 기준,<br>
<span class="highlight_blue">이끌림샤시</span>로 시작하세요
</h1>
<p class="sub_description">
복잡한 창호 교체, 이제 온라인 견적으로 투명하게.<br>
고품질 자재와 전문가의 손길을 클릭 한 번으로 만나보세요.
</p>
<!-- 전문가 상담 및 예약 버튼 (상단 오른쪽) -->
<div class="main_action_row">
<a href="<?php echo G5_BBS_URL ?>/board.php?bo_table=order" class="btn_box white" >
<div class="btn_icon">🏢</div>
<div class="btn_txt">
<strong>창호 온라인 주문</strong>
<p>실시간 직접 견적 및 주문 확정</p>
</div>
</a>
<div class="btn_box white" onclick="openExpertVisitPopup(<?php echo $wr_id; ?>)">
<div class="btn_icon">👨‍🔧</div>
<div class="btn_txt">
<strong>창호 전문가 부르기</strong>
<p>방문 실측 및 맞춤 상담 신청</p>
</div>
</div>
</div>
<div class="floating_as_badge">
<p>전국 대리점망</p>
<strong>A/S 10년 보장</strong>
</div>
</div>
</section>
</div>
<div class="floating_as_badge">
<p>전국 대리점망</p>
<strong>A/S 10년 보장</strong>
</div>
</section>
</div>
</section>
</div>
@@ -321,6 +388,23 @@ include_once(G5_ADMIN_PATH . '/order_manage/components/_expert_visit_popups.php'
if (typeof initProducts === 'function') {
initProducts(productsData);
}
// Get the house map container
const houseMapContainer = document.getElementById('house-map-container');
// Get all product items
const productItems = document.querySelectorAll('.product-item');
// Add click event listener to each product item
productItems.forEach(item => {
item.addEventListener('click', function() {
// Get the image URL from the data-img attribute
const imageUrl = this.getAttribute('data-img');
if (imageUrl) {
// Update the background image of the house map container
houseMapContainer.style.backgroundImage = `url('${imageUrl}')`;
}
});
});
});
</script>
@@ -377,4 +461,4 @@ include_once(G5_ADMIN_PATH . '/order_manage/components/_expert_visit_popups.php'
}
});
</script>
</script>