diff --git a/.Backup/html/assets/css/style.css b/.Backup/html/assets/css/style.css index a69e6cb..0f553b3 100644 --- a/.Backup/html/assets/css/style.css +++ b/.Backup/html/assets/css/style.css @@ -1,14 +1,11 @@ -/* 기본 스타일 */ :root { scroll-behavior: smooth; } - body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: #f8fafc; color: #0f172a; } - .font-industrial { font-family: 'Space Grotesk', sans-serif; } .font-premium { font-family: 'Plus Jakarta Sans', sans-serif; } @@ -18,6 +15,13 @@ body { border-bottom: 1px solid rgba(255, 255, 255, 0.1); } +/* Premium Typography Styles */ +.premium-kerning { letter-spacing: -0.04em; } +.industrial-tracking { letter-spacing: 0.15em; } +.hero-title { + line-height: 1.05; +} + /* Animations */ @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } @@ -29,30 +33,21 @@ body { .no-scrollbar::-webkit-scrollbar { display: none; } .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; } -/* 서비스 카드 이미지 hover */ .service-card:hover .service-image { transform: scale(1.1); filter: grayscale(0); } -/* ==================== 이미지 보호 레이어 ==================== */ -.img-protect-wrapper { - position: relative; - display: inline-block; +/* ── 언어 전환 버튼 ───────────────────────────────────────── */ +.lang-btn { + background: transparent; + opacity: 0.5; + transition: all 0.2s; } - -.img-protect-wrapper img { - display: block; +.lang-btn:hover { + opacity: 0.8; } - -.img-protect-wrapper .img-overlay { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - cursor: default; - z-index: 10; - user-select: none; - -webkit-user-drag: none; +.lang-btn.active-lang { + background: #2563eb; + opacity: 1; } diff --git a/.Backup/html/assets/images/BatchControl.png b/.Backup/html/assets/images/BatchControl.png new file mode 100644 index 0000000..d40142f Binary files /dev/null and b/.Backup/html/assets/images/BatchControl.png differ diff --git a/.Backup/html/assets/images/ControlRoom7.png b/.Backup/html/assets/images/ControlRoom7.png new file mode 100644 index 0000000..3dc1357 Binary files /dev/null and b/.Backup/html/assets/images/ControlRoom7.png differ diff --git a/.Backup/html/assets/images/bearing.png b/.Backup/html/assets/images/bearing.png new file mode 100644 index 0000000..a4a5f31 Binary files /dev/null and b/.Backup/html/assets/images/bearing.png differ diff --git a/.Backup/html/assets/images/dcsintegration.png b/.Backup/html/assets/images/dcsintegration.png new file mode 100644 index 0000000..b75f848 Binary files /dev/null and b/.Backup/html/assets/images/dcsintegration.png differ diff --git a/.Backup/html/assets/images/favicon.ico b/.Backup/html/assets/images/favicon.ico new file mode 100644 index 0000000..4e62075 Binary files /dev/null and b/.Backup/html/assets/images/favicon.ico differ diff --git a/.Backup/html/assets/images/honeywell-logo.svg b/.Backup/html/assets/images/honeywell-logo.svg new file mode 100644 index 0000000..c745331 --- /dev/null +++ b/.Backup/html/assets/images/honeywell-logo.svg @@ -0,0 +1,3 @@ + + + diff --git a/.Backup/html/assets/images/instrument.png b/.Backup/html/assets/images/instrument.png new file mode 100644 index 0000000..1837d69 Binary files /dev/null and b/.Backup/html/assets/images/instrument.png differ diff --git a/.Backup/html/assets/images/reactor.png b/.Backup/html/assets/images/reactor.png new file mode 100644 index 0000000..e49ed39 Binary files /dev/null and b/.Backup/html/assets/images/reactor.png differ diff --git a/.Backup/html/assets/js/i18n.js b/.Backup/html/assets/js/i18n.js new file mode 100644 index 0000000..f94936b --- /dev/null +++ b/.Backup/html/assets/js/i18n.js @@ -0,0 +1,346 @@ +// ============================================================ +// 다국어 지원 (한국어 / 영어) +// ============================================================ +const translations = { + en: { + // NAV + 'nav.home' : 'Home', + 'nav.dcs' : 'DCS', + 'nav.batch' : 'Batch Process', + 'nav.dbsvr' : 'Database Server', + 'nav.products' : 'Instruments', + 'nav.services' : 'References', + 'nav.about' : 'About', + 'nav.contact' : 'Contact', + 'nav.quote' : 'Request Quote', + + // HERO + 'hero.badge' : 'Precision Industrial Control', + 'hero.title' : 'Engineering Precision Industrial Control', + 'hero.desc' : 'Hanmo Control & Network Co., Ltd. provides elite-tier DCS and SCADA architectures for critical infrastructure and modern digital transformation.', + 'hero.btn1' : 'Explore Expertise', + 'hero.btn2' : 'Consultation', + 'stat.nodes' : 'Reference Projects', + 'stat.uptime' : 'Downtime', + 'stat.engineers': 'Partners', + 'stat.years' : 'Years Excellence', + + // DCS + 'dcs.badge' : 'Advanced Control Systems', + 'dcs.title' : 'DCS Integration', + 'dcs.desc' : 'Enterprise-grade Distributed Control System architecture designed for the most critical industrial applications.', + 'dcs.f0.title' : 'Honeywell Experion PKS', + 'dcs.f0.desc' : 'Reliable DCS solutions with Honeywell\'s Experion PKS, ensuring seamless integration and optimal performance', + 'dcs.f1.title' : 'Redundant Architecture', + 'dcs.f1.desc' : 'Fault-tolerant systems with dual processing units ensuring 99.99% uptime', + 'dcs.f2.title' : 'Real-time Communication', + 'dcs.f2.desc' : 'Sub-millisecond response times with synchronized control across multiple nodes', + 'dcs.f3.title' : 'Security Certified', + 'dcs.f3.desc' : 'IEC 62443 compliance with military-grade encryption protocols', + 'dcs.btn' : 'Request Technical Specs', + + // BATCH + 'batch.badge' : 'Process Automation', + 'batch.title' : 'Batch Process Control', + 'batch.desc' : 'Not only precision control, but also production planning, process data & historical lot management, you can get it by our Batch Manager software.', + 'batch.f1.title': 'Batch Manager Software', + 'batch.f1.desc' : 'Process control data and production data management per lot no. in a software platform', + 'batch.f2.title': 'ControlEdge HC900', + 'batch.f2.desc' : 'Over the PLC for continuous and batch process control, Hybrid Controller from Honeywell. it is perfect solution of batch plant', + 'batch.f3.title': 'Process Data Management', + 'batch.f3.desc' : 'Setpoint scheduling & recipe for various products, lot management with single mouse click', + 'batch.f4.title': 'Quick Production Setup', + 'batch.f4.desc' : 'Real-time batch tracking with predictive quality monitoring', + 'batch.f5.title': 'Easy Historical Tracking', + 'batch.f5.desc' : 'FDA 21 CFR Part 11 compliance and complete data integrity', + 'batch.btn' : 'Start Implementation', + + // DBSVR + 'db.badge' : 'Data Infrastructure', + 'db.title' : 'Database Server Solutions', + 'db.desc' : 'Mission-critical historian and data management infrastructure for continuous industrial operations.', + 'db.c1.title' : 'High-Performance Historian', + 'db.c1.desc' : 'SQL Server-based architecture optimized for 1M+ data points per second with sub-second query response', + 'db.c2.title' : 'Disaster Recovery', + 'db.c2.desc' : 'Geo-redundant replication with RTO < 15 minutes and RPO < 5 minutes', + 'db.c3.title' : 'Security & Compliance', + 'db.c3.desc' : 'Role-based access control, encryption at rest/transit, and full audit logging', + 'db.btn' : 'Get Infrastructure Consultation', + + // INSTRUMENTS + 'inst.badge' : 'Precision Measurement', + 'inst.title' : 'Control Instruments', + 'inst.desc' : 'Smart field instruments engineered for accuracy and reliability in demanding industrial environments.', + 'inst.i1.title' : 'Flow Transmitters', + 'inst.i1.desc' : 'Magnetic, Coriolis, and vortex flow meters with ±0.5% accuracy', + 'inst.i2.title' : 'Pressure Transmitters', + 'inst.i2.desc' : 'Differential and absolute pressure sensors for ultra-high sensitivity', + 'inst.i3.title' : 'Temperature Sensors', + 'inst.i3.desc' : 'RTD, thermocouple, and infrared temperature measurement', + 'inst.i4.title' : 'Level Transmitters', + 'inst.i4.desc' : 'Ultrasonic, radar, and capacitive level sensors', + 'inst.i5.title' : 'Analytical Sensors', + 'inst.i5.desc' : 'pH, conductivity, oxygen, and dissolved gas analyzers', + 'inst.i6.title' : 'Control Valves', + 'inst.i6.desc' : 'Smart positioners with HART communication', + 'inst.i7.title' : 'Vibration Monitors', + 'inst.i7.desc' : 'Accelerometers and velocity sensors for predictive maintenance', + 'inst.i8.title' : 'Smart Data Loggers', + 'inst.i8.desc' : 'IoT-enabled data acquisition units with cloud connectivity', + 'inst.custom.title' : 'Custom Integration Available', + 'inst.custom.desc' : 'All instruments integrate seamlessly with our DCS and SCADA platforms. Custom configurations available for specialized applications.', + 'inst.custom.btn' : 'Request Custom Configuration', + 'inst.quote' : 'Get Quote →', + + // REFERENCES + 'svc.badge' : 'Referenced Plant Varieties', + 'svc.title' : 'Versatile Automation References', + 'svc.desc' : 'From Deep Understanding of various industry references to Seamless Execution.', + 'svc.s1.title' : 'DCS / SCADA', + 'svc.s1.desc' : 'Semiconductor Solvent Recovery Plant., 80% Hydrazin Plant, SNCR & SCR Envirionmental Plant, etc', + 'svc.s1.item1' : 'Semiconductor Solvent Recovery Plant', + 'svc.s1.item2' : '80% Hydrazin Plant', + 'svc.s1.item3' : 'SNCR & SCR in Power Plant', + 'svc.s1.item4' : 'Oil Tank Terminal', + 'svc.s1.link' : 'Learn More', + + 'svc.s2.title' : 'Batch Plant', + 'svc.s2.desc' : 'Real-time monitoring platforms with advanced HMI and secure remote access protocols.', + 'svc.s2.item1' : 'Micro Capsule forming agent plant', + 'svc.s2.item2' : 'ADCA,HDCA Plant', + 'svc.s2.item3' : 'Vacuum Furnace Plant - Decorative Stainless Plate', + 'svc.s2.link' : 'Case Studies', + + 'svc.s3.title' : 'Other Projects', + 'svc.s3.desc' : 'Various industrial automation projects.', + 'svc.s3.item1' : 'Waste to Energy Incineration Plant', + 'svc.s3.item2' : 'Copper Rod Continuous Casting Plant', + 'svc.s3.item3' : 'Bearing Continuous Heat Treatment Plant', + 'svc.s3.item4' : 'High Speed Cold Rolling Continuous Casting Plant', + 'svc.s3.link' : 'CASE STUDIES', + + 'svc.s4.title' : 'Instruments', + 'svc.s4.desc' : 'Smart field sensors for flow, pressure, and temperature with high-accuracy calibration.', + 'svc.s4.item1' : 'Honeywell', + 'svc.s4.item2' : 'Azbil', + 'svc.s4.item3' : 'Endress Hauser', + 'svc.s4.item4' : 'Flownics', + 'svc.s4.item5' : 'Komoto - (Motoyama Korea)', + 'svc.s4.item6' : 'Autonics - (Konics)', + 'svc.s4.link' : 'Product Catalog', + + // ABOUT + 'about.badge' : 'About Hanmo', + 'about.title' : 'Trusted Partner in Industrial Automation', + 'about.p1' : 'Since our founding, Hanmo Control & Network Co., Ltd. has been at the forefront of industrial automation engineering. We specialize in designing, implementing, and maintaining mission-critical control systems for the world\'s most demanding industries.', + 'about.p2' : 'Our certified engineers brings decades of combined experience in DCS, SCADA, instrumentation and industrial networking, ensuring your operations run with unmatched precision and reliability.', + 'about.cert' : 'Certified', + 'about.support' : 'Support', + 'about.years' : 'Years of Industrial Excellence', + + // CONTACT + 'contact.badge' : 'Get In Touch', + 'contact.title' : 'Start Your Project', + 'contact.desc' : 'Contact our engineering team for a detailed consultation and project assessment.', + 'contact.name' : 'Full Name', + 'contact.email' : 'Email Address', + 'contact.company': 'Company Name', + 'contact.msg' : 'Describe your project requirements...', + 'contact.btn' : 'Send Message', + 'contact.sending': 'Sending...', + 'contact.success': '✅ Message sent successfully. We will get back to you shortly.', + 'contact.error.required': '⚠ Name, email, and message are required.', + 'contact.error.email' : '⚠ Please enter a valid email address.', + 'contact.error.fail' : '❌ Failed to send. Please try again later.', + + // FOOTER + 'footer.copy' : '© 2024 Hanmo Control & Network Co., Ltd. All rights reserved.', + }, + + ko: { + // NAV + 'nav.home' : '홈', + 'nav.dcs' : 'DCS', + 'nav.batch' : '배치 프로세스', + 'nav.dbsvr' : '데이터베이스 서버', + 'nav.products' : '계측기기', + 'nav.services' : '실적 플랜트 분야', + 'nav.about' : '회사소개', + 'nav.contact' : '문의하기', + 'nav.quote' : '견적 요청', + + // HERO + 'hero.badge' : '정밀 공정 제어 시스템', + 'hero.title' : '정밀함을 설계하는 공정 제어 전문기업', + 'hero.desc' : '(주)한모씨앤앤은 핵심 인프라와 디지털 전환을 위한 최고 수준의 DCS 및 SCADA BATCH CONTROL 시스템을 제공합니다.', + 'hero.btn1' : '전문 분야 보기', + 'hero.btn2' : '상담 신청', + 'stat.nodes' : '프로젝트 실적', + 'stat.uptime' : '시스템 가동률', + 'stat.engineers': '파트너사', + 'stat.years' : '년 업계 경력', + + // DCS + 'dcs.badge' : '공정 제어 시스템', + 'dcs.title' : 'DCS 통합 솔루션', + 'dcs.desc' : '중요한 공정 현장을 위한 엔터프라이즈급 분산 제어 시스템(DCS) 아키텍처를 설계합니다.', + 'dcs.f0.title' : 'Honeywell Experion', + 'dcs.f0.desc' : 'Honeywell Experion 플랫폼을 기반으로 한 안정적이고 다양한 DCS 솔루션을 제공합니다.', + 'dcs.f1.title' : '이중화 아키텍처', + 'dcs.f1.desc' : '이중화 서버 & 컨트롤러,통신으로 99.99% 가동률을 보장하는 내결함성 시스템', + 'dcs.f2.title' : '실시간 통신', + 'dcs.f2.desc' : '밀리초 미만의 응답 시간으로 다중 노드 간 동기화된 제어 실현', + 'dcs.f3.title' : '보안 인증', + 'dcs.f3.desc' : 'IEC 62443 준수 및 군사 수준 암호화 프로토콜 적용', + 'dcs.btn' : '기술 사양 요청', + + // BATCH + 'batch.badge' : '배치 프로세스 자동화', + 'batch.title' : '배치 프로세스 제어', + 'batch.desc' : '배치 프로세스 자동화는 생산 제품의 다양성을 위한 정밀제어 및 제품별 설정 데이터 생성 및 관리, 생산 로트 이력관리가 하나의 시스템에서 실현됩니다. 반응기, 산업로(배치,연속 혼재공정) 등의 배치 플랜트에 최적화된 제어 시스템과 소프트웨어 솔루션을 제공합니다.', + 'batch.f1.title': '배치 매니저 소프트웨어', + 'batch.f1.desc' : '제품별 설정값 패턴 ,레시피, 로트관리 등의 제어와 생산 데이터베이스가 하나의 시스템에서 제공됩니다', + 'batch.f2.title': 'ControlEdge HC900', + 'batch.f2.desc' : '설정값 패턴 프로그램, 레시피, 정밀 PID 제어, PLC를 넘어서는 하이브리드 컨트롤러로 배치 플랜트에 최적화된 솔루션', + 'batch.f3.title': 'MES,ERP 연동', + 'batch.f3.desc' : '자사 데이터베이스 서버를 통한, 손쉬운 MES, ERP 연동으로 생산 스케쥴 관리 지원 가능', + 'batch.f4.title': '신속한 운전 설정', + 'batch.f4.desc' : '단 한번의 다운로드로, 제품별 생산 환경 설정이 초단위로 완료됩니다', + 'batch.f5.title': '생산 로트 이력 관리', + 'batch.f5.desc' : '생산 로트 관리 및 로트별 차트 그래프를 제공하여 이력 데이터 분석에 탁월.', + 'batch.btn' : '구축 상담 신청', + + // DBSVR + 'db.badge' : '데이터 인프라', + 'db.title' : '데이터베이스 서버 솔루션', + 'db.desc' : '지속적인 공정 운영을 위한 미션 크리티컬 히스토리안 및 데이터 관리 인프라를 제공합니다.', + 'db.c1.title' : '고성능 히스토리안', + 'db.c1.desc' : '초당 100만+ 데이터 포인트를 처리하는 SQL Server 기반 아키텍처', + 'db.c2.title' : '재해 복구', + 'db.c2.desc' : 'RTO 15분 미만, RPO 5분 미만의 지역 이중화 복제 시스템', + 'db.c3.title' : '보안 및 컴플라이언스', + 'db.c3.desc' : '역할 기반 접근 제어, 저장/전송 암호화 및 완전한 감사 로깅', + 'db.btn' : '인프라 상담 신청', + + // INSTRUMENTS + 'inst.badge' : '정밀 계측', + 'inst.title' : '계측 제어 기기', + 'inst.desc' : '가혹한 공정 환경에서도 정확성과 신뢰성을 발휘하는 스마트 현장 계측기기를 공급합니다.', + 'inst.i1.title' : '유량 변환기', + 'inst.i1.desc' : '±0.1% 정확도의 코리올리 질량 유량계, 마그네틱, 볼텍스 유량계', + 'inst.i2.title' : '압력 트랜스미터', + 'inst.i2.desc' : '초고감도 차압 및 절대압, 리모트실 트랜스미터', + 'inst.i3.title' : '온도 센서', + 'inst.i3.desc' : 'RTD, 열전대, 적외선 온도 측정기', + 'inst.i4.title' : '레벨 트랜스미터', + 'inst.i4.desc' : '초음파, 레이더, 정전용량식 레벨 트랜스미터', + 'inst.i5.title' : '분석 센서', + 'inst.i5.desc' : 'pH, 전도도, 산소, 용존 가스 분석기', + 'inst.i6.title' : '컨트롤 밸브', + 'inst.i6.desc' : 'HART 통신 지원 스마트 포지셔너', + 'inst.i7.title' : '진동 모니터', + 'inst.i7.desc' : '예측 유지보수를 위한 가속도계 및 속도 센서', + 'inst.i8.title' : '스마트 데이터 로거', + 'inst.i8.desc' : '클라우드 연결 기능을 갖춘 IoT 데이터 수집 장치', + 'inst.custom.title' : '맞춤형 통합 솔루션 제공', + 'inst.custom.desc' : '모든 계측기기는 당사의 DCS 및 SCADA 플랫폼과 원활하게 통합됩니다. 특수 응용 분야에 맞는 커스텀 구성이 가능합니다.', + 'inst.custom.btn' : '맞춤 구성 요청', + 'inst.quote' : '견적 요청 →', + + // REFERENCES + 'svc.badge' : '실적 플랜트 분야', + 'svc.title' : '다양한 산업 분야의 자동화 실적', + 'svc.desc' : '공정에 대한 깊이있는 이해와 경험을 바탕으로 복잡한 공정을 위한 특화된 엔지니어링을 제공합니다.', + 'svc.s1.title' : 'DCS / SCADA', + 'svc.s1.desc' : '반도체용 솔벤트 회수 플랜트, 발전소, 화학 플랜트 등 대규모 공정을 위한 이중화 제어 아키텍처', + 'svc.s1.item1' : '반도체용 솔벤트 회수 플랜트', + 'svc.s1.item2' : '80% 하이드라진 플랜트', + 'svc.s1.item3' : '발전소 SNCR & SCR 플랜트', + 'svc.s1.item4' : '오일 탱크 터미널 플랜트', + 'svc.s1.link' : '자세히 보기', + 'svc.s2.title' : '배치 플랜트', + 'svc.s2.desc' : '실시간 모니터링 플랫폼과 고급 HMI, 안전한 원격 액세스 프로토콜을 갖춘 배치 플랜트 제어 시스템', + 'svc.s2.item1' : '마이크로 캡슐 발포제 플랜트', + 'svc.s2.item2' : 'ADCA,HDCA 플랜트', + 'svc.s2.item3' : '진공 열처리로 플랜트', + 'svc.s2.link' : '사례 연구', + 'svc.s3.title' : '기타 프로젝트', + 'svc.s3.desc' : '기타 핵심 산업 자동화', + 'svc.s3.item1' : '쓰레기 소각장 플랜트', + 'svc.s3.item2' : '구리 환재 연속 주조로', + 'svc.s3.item3' : '베어링 연속 열처리로 플랜트', + 'svc.s3.item4' : '고속 냉간 연속 주조로 플랜트', + 'svc.s3.link' : '데이터 보안', + 'svc.s4.title' : '제어 계측기기 협력사', + 'svc.s4.desc' : '고객 현장에 대한 깊은 이해를 바탕으로 최적 계측기 선정', + 'svc.s4.item1' : '한국하니웰(주)', + 'svc.s4.item2' : '한국아즈빌(주)', + 'svc.s4.item3' : '엔드레스하우저', + 'svc.s4.item4' : '플로우닉스(주)', + 'svc.s4.item5' : '(주)코모토', + 'svc.s4.item6' : '오토닉스(주)', + 'svc.s4.link' : '제품 카탈로그', + + // ABOUT + 'about.badge' : '회사 소개', + 'about.title' : '공정 자동화의 신뢰할 수 있는 파트너', + 'about.p1' : '(주)한모씨앤앤는 창립 이래 공정 자동화 엔지니어링의 최전선에서 활동하고 있습니다. 세계에서 가장 까다로운 공정 현장을 위한 미션 크리티컬 제어 시스템 설계, 구현 및 유지보수를 전문으로 합니다.', + 'about.p2' : 'DCS, SCADA, 계측기기, 공정 네트워킹 분야에서 수십 년의 경험을 바탕으로 최고의 정밀도와 신뢰성을 보장합니다.', + 'about.cert' : '인증', + 'about.support' : '지원', + 'about.years' : '여년간의 공정 제어 전문성', + + // CONTACT + 'contact.badge' : '문의하기', + 'contact.title' : '프로젝트를 시작하세요', + 'contact.desc' : '엔지니어링 팀에 문의하여 상세 상담 및 프로젝트 평가를 받아보세요.', + 'contact.name' : '성명', + 'contact.email' : '이메일 주소', + 'contact.company': '회사명', + 'contact.msg' : '프로젝트 요구사항을 설명해 주세요...', + 'contact.btn' : '메시지 보내기', + 'contact.sending': '전송 중...', + 'contact.success': '✅ 메시지가 성공적으로 전송되었습니다. 빠른 시일 내에 회신 드리겠습니다.', + 'contact.error.required': '⚠ 이름, 이메일, 메시지는 필수 항목입니다.', + 'contact.error.email' : '⚠ 올바른 이메일 주소를 입력해 주세요.', + 'contact.error.fail' : '❌ 전송에 실패했습니다. 잠시 후 다시 시도해 주세요.', + + // FOOTER + 'footer.copy' : '© (주)한모씨앤앤. All rights reserved.', + } +}; + +// ── 현재 언어 (로컬스토리지 유지) ────────────────────────── +let currentLang = localStorage.getItem('hmLang') || 'en'; + +function t(key) { + return translations[currentLang][key] || translations['en'][key] || key; +} + +function applyTranslations() { + document.querySelectorAll('[data-i18n]').forEach(el => { + const key = el.getAttribute('data-i18n'); + const type = el.getAttribute('data-i18n-type') || 'text'; + if (type === 'html') { + el.innerHTML = t(key); + } else if (type === 'placeholder') { + el.setAttribute('placeholder', t(key)); + } else { + el.textContent = t(key); + } + }); + // 업데이트 + document.documentElement.lang = currentLang; + // 버튼 활성 상태 업데이트 + document.querySelectorAll('.lang-btn').forEach(btn => { + btn.classList.toggle('active-lang', btn.dataset.lang === currentLang); + }); +} + +function switchLang(lang) { + currentLang = lang; + localStorage.setItem('hmLang', lang); + applyTranslations(); +} + +document.addEventListener('DOMContentLoaded', applyTranslations); diff --git a/.Backup/html/assets/js/script.js b/.Backup/html/assets/js/script.js new file mode 100644 index 0000000..c144d8d --- /dev/null +++ b/.Backup/html/assets/js/script.js @@ -0,0 +1,89 @@ +// ============================================================ +// ★ EmailJS 설정 - 아래 3가지 값을 본인 계정으로 교체하세요 ★ +// ============================================================ +const EMAILJS_PUBLIC_KEY = 'HO6i369gX6X5HEXtJ'; +const EMAILJS_SERVICE_ID = 'service_4ur5lqd'; +const EMAILJS_TEMPLATE_ID = 'template_jp0v5qv'; +// ============================================================ + +emailjs.init(EMAILJS_PUBLIC_KEY); + +// ── Contact Form ───────────────────────────────────────────── +document.getElementById('contact-submit').addEventListener('click', function () { + const name = document.getElementById('contact-name').value.trim(); + const email = document.getElementById('contact-email').value.trim(); + const company = document.getElementById('contact-company').value.trim(); + const message = document.getElementById('contact-message').value.trim(); + const btn = document.getElementById('contact-submit'); + + if (!name || !email || !message) { + showStatus('error', t('contact.error.required')); return; + } + if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) { + showStatus('error', t('contact.error.email')); return; + } + + btn.disabled = true; + btn.textContent = t('contact.sending'); + + const templateParams = { + name : name, + message : 'Email : ' + email + '\nCompany : ' + (company || 'N/A') + '\n\n' + message, + reply_to : email + }; + + emailjs.send(EMAILJS_SERVICE_ID, EMAILJS_TEMPLATE_ID, templateParams) + .then(function () { + showStatus('success', t('contact.success')); + document.getElementById('contact-name').value = ''; + document.getElementById('contact-email').value = ''; + document.getElementById('contact-company').value = ''; + document.getElementById('contact-message').value = ''; + }) + .catch(function (error) { + console.error('EmailJS error:', error); + showStatus('error', t('contact.error.fail')); + }) + .finally(function () { + btn.disabled = false; + btn.textContent = t('contact.btn'); + }); +}); + +function showStatus(type, msg) { + const status = document.getElementById('contact-status'); + status.classList.remove('hidden', 'bg-green-500/20', 'text-green-400', 'bg-red-500/20', 'text-red-400'); + status.classList.add(type === 'success' ? 'bg-green-500/20' : 'bg-red-500/20', + type === 'success' ? 'text-green-400' : 'text-red-400'); + status.textContent = msg; +} + +// ── Header scroll ──────────────────────────────────────────── +const mainHeader = document.getElementById('main-header'); +const brandName = document.getElementById('brand-name'); +const navLinks = document.querySelectorAll('.nav-link'); + +window.addEventListener('scroll', () => { + if (window.scrollY > 50) { + mainHeader.classList.add('glass-effect', 'py-3'); + mainHeader.classList.remove('py-6'); + if (brandName) brandName.classList.replace('text-white', 'text-slate-900'); + navLinks.forEach(link => link.classList.replace('text-slate-100', 'text-slate-700')); + } else { + mainHeader.classList.remove('glass-effect', 'py-3'); + mainHeader.classList.add('py-6'); + if (brandName) brandName.classList.replace('text-slate-900', 'text-white'); + navLinks.forEach(link => link.classList.replace('text-slate-700', 'text-slate-100')); + } +}); + +// ── Mobile menu ─────────────────────────────────────────────── +const mobileMenuBtn = document.getElementById('mobile-menu-btn'); +const mobileMenu = document.getElementById('mobile-menu'); +const closeMenuBtn = document.getElementById('close-menu-btn'); + +if (mobileMenuBtn) mobileMenuBtn.addEventListener('click', () => mobileMenu.classList.remove('translate-x-full')); +if (closeMenuBtn) closeMenuBtn.addEventListener('click', () => mobileMenu.classList.add('translate-x-full')); + +const mobileNavLinks = mobileMenu ? mobileMenu.querySelectorAll('a') : []; +mobileNavLinks.forEach(link => link.addEventListener('click', () => mobileMenu.classList.add('translate-x-full'))); diff --git a/.Backup/html/index.html b/.Backup/html/index.html index 817524f..613374f 100644 --- a/.Backup/html/index.html +++ b/.Backup/html/index.html @@ -7,62 +7,21 @@ - - - + + + +
+
@@ -71,26 +30,30 @@ H
- - HANMO - - - Control & Network - + HANMO + Control & Network
-
-
-
+
+
+ +
+ + +
@@ -121,131 +93,390 @@ Industrial Facility
-
-
- Precision Industrial Control -
-

+
Precision Industrial Control
+

Engineering Precision Industrial Control

-

+

Hanmo Control & Network Co., Ltd. provides elite-tier DCS and SCADA architectures for critical infrastructure and modern digital transformation.

- - Explore Expertise - - - Consultation - + Explore Expertise + Consultation
-
-
1,500+
-
Active Nodes
+
100+
+
Reference Projects
-
99.99%
-
System Uptime
+
0.01%
+
downtime
-
60+
-
Engineers
+
20+
+
Partners
-
15
-
Years Excellence
+
20+
+
Years Excellence
- + +
+
+
+

Advanced Control Systems

+

DCS Integration

+

Enterprise-grade Distributed Control System architecture designed for the most critical industrial applications.

+
+
+
DCS Control Room
+
+
+ + Honeywell Logo +
+

Reliable DCS solutions with Honeywell's Experion PKS, ensuring seamless integration and optimal performance

+
+
+
+

Redundant Architecture

Fault-tolerant systems with dual processing units ensuring 99.99% uptime

+
+
+
+

Real-time Communication

Sub-millisecond response times with synchronized control across multiple nodes

+
+
+
+

Security Certified

IEC 62443 compliance with military-grade encryption protocols

+
+
+
Request Technical Specs
+
+
+
+ + + +
+
+
+

Process Automation

+

Batch Process Control

+

Not only precision control, but also production planning,process data & historical lot management, you can get it by our Batch Manager software.

+
+
+
+
+
+
+

Batch Manager Software

Dynamic recipe engine with version control and audit trail capabilities

+
+
+
+

HC-900 Controller

Advanced batch control with integrated HART communication and real-time monitoring

+
+
+
+

Process Data Management

Comprehensive process data collection, storage, and analysis for batch operations

+
+
+
+

Quick Production Setup

Real-time batch tracking with predictive quality monitoring

+
+
+
+

Easy Historical Tracking

FDA 21 CFR Part 11 compliance and complete data integrity

+
+
+ +
+
Batch Process
+
+
+
+ + +
+
+
+

Data Infrastructure

+

Database Server Solutions

+

Mission-critical historian and data management infrastructure for continuous industrial operations.

+
+
+
+
+

High-Performance Historian

+

SQL Server-based architecture optimized for 1M+ data points per second with sub-second query response

+
    +
  • Time-series optimization
    • +
  • Automatic compression
    • +
  • Hot-cold storage
    • +
+
+
+
+

Disaster Recovery

+

Geo-redundant replication with RTO < 15 minutes and RPO < 5 minutes

+
    +
  • Multi-site failover
    • +
  • Continuous backup
    • +
  • Zero data loss
    • +
+
+
+
+

Security & Compliance

+

Role-based access control, encryption at rest/transit, and full audit logging

+
    +
  • ISO 27001 certified
    • +
  • CCPA/GDPR compliant
    • +
  • Immutable logs
    • +
+
+
+
Get Infrastructure Consultation
+
+
+ + +
+
+
+

Precision Measurement

+

Control Instruments

+

Smart field instruments engineered for accuracy and reliability in demanding industrial environments.

+
+
+
+
+

Flow Transmitters

Magnetic, Coriolis, and vortex flow meters with ±0.5% accuracy

+
Range: 0-1000 m³/h
4-20mA / Pulse output
IP67 rated
+ Get Quote → +
+
+
+
+

Pressure Transmitters

Differential and absolute pressure sensors for ultra-high sensitivity

+
Range: -1 to 1000 bar
±0.1% accuracy
ATEX certified
+ Get Quote → +
+
+
+
+

Temperature Sensors

RTD, thermocouple, and infrared temperature measurement

+
Range: -50 to +300°C
±0.3°C accuracy
Fast response time
+ Get Quote → +
+
+
+
+

Level Transmitters

Ultrasonic, radar, and capacitive level sensors

+
Range: 0-30 meters
±2mm repeatability
Dust-proof design
+ Get Quote → +
+
+
+
+

Analytical Sensors

pH, conductivity, oxygen, and dissolved gas analyzers

+
Multi-parameter capability
Automatic calibration
Real-time data logging
+ Get Quote → +
+
+
+
+

Control Valves

Smart positioners with HART communication

+
±0.5% repeatability
HART protocol
Self-tuning algorithm
+ Get Quote → +
+
+
+
+

Vibration Monitors

Accelerometers and velocity sensors for predictive maintenance

+
Frequency: 0-20 kHz
Wireless capability
FFT analysis ready
+ Get Quote → +
+
+
+
+

Smart Data Loggers

IoT-enabled data acquisition units with cloud connectivity

+
16-32 analog channels
4G/WiFi/Ethernet
Local data storage
+ Get Quote → +
+
+
+
+

Custom Integration Available

+

All instruments integrate seamlessly with our DCS and SCADA platforms.

+ Request Custom Configuration +
+
+
+ +
-

Our Capabilities

-

World-Class Automation

-

- Specialized engineering for complex physical operations through advanced data integration and distributed control systems. -

+

Referenced Plant Varieties

+

Versatile Automation References

+

From Deep Understanding of various industry references to Seamless Execution.

-
-
-
- DCS -
+
DCS
-
- -
-

DCS Integration

-

- Redundant control architectures for utility-scale industries including power and chemical plants. -

- - Technical Specs - +
+

DCS Integration

+ +
    + +
  • + + +
    • + +
  • + + +
    • + +
  • + + +
    • + +
  • + + +
    • + +
+ + + Learn More
-
-
- SCADA -
+
SCADA
-
- -
-

SCADA Design

-

- Real-time monitoring platforms with advanced HMI and secure remote access protocols. -

- - Case Studies - +
+

SCADA Design

+ +
    + +
  • + + +
    • + +
  • + + +
    • + +
  • + + +
    • + +
+ Case Studies
-
-
- Historian -
+
Historian
-
- -
-

Data Historians

-

- Mission-critical SQL infrastructure optimized for massive industrial time-series data storage. -

- - Data Security - +
+

Data Historians

+ +
    + +
  • + + +
    • + +
  • + + +
    • + +
  • + + +
    • +
  • + + +
    • +
+ Data Security
-
-
- Instruments -
+
Instruments
-
- -
-

Control Instruments

-

- Smart field sensors for flow, pressure, and temperature with high-accuracy calibration. -

- - Product Catalog - +
+

Control Instruments

+ +
    + +
  • + + +
    • + +
  • + + +
    • + +
  • + + +
    • +
  • + + +
    • +
  • + + +
    • +
  • + + +
    • +
+ Product Catalog
@@ -257,9 +488,119 @@
-
- About Hanmo -
+
About Hanmo
-
15+
-
20+
+
Years of Industrial Excellence
+
+
+
+

About Hanmo

+

Trusted Partner in Industrial Automation

+

Since our founding, Hanmo Control & Network Co., Ltd. has been at the forefront of industrial automation engineering.

+

Our team of 60+ certified engineers brings decades of combined experience in DCS, SCADA, and industrial networking.

+
+
+
ISO 9001
+
Certified
+
+
+
24 / 7
+
Support
+
+
+
+
+
+
+ + +
+
+
+

Get In Touch

+

Start Your Project

+

Contact our engineering team for a detailed consultation and project assessment.

+
+
+
+
+ + +
+ + + + +
+
+
+
+ + + + + + + + + + + + + + diff --git a/.Backup/html/status.json b/.Backup/html/status.json index fa1af98..d24186d 100644 --- a/.Backup/html/status.json +++ b/.Backup/html/status.json @@ -1 +1 @@ -{"cpu_temp": "41", "nvme_temp": "34", "uptime_days": 2, "last_update": "22:07:01"} \ No newline at end of file +{"cpu_temp": "39", "nvme_temp": "33", "uptime_days": 4, "last_update": "10:51:01"} \ No newline at end of file diff --git a/html/assets/css/style.css b/html/assets/css/style.css index 0f553b3..9a90a1e 100644 --- a/html/assets/css/style.css +++ b/html/assets/css/style.css @@ -38,16 +38,70 @@ body { filter: grayscale(0); } +/* ── 헤더 & 네비게이션 ───────────────────────────────────── */ +/* 기본 상태: 투명 배경 위 (흰색 텍스트) */ +.nav-link { + color: white; +} + +#brand-name { + color: white; +} + +/* 스크롤 시: 흰색 배경 (어두운 텍스트) */ +#main-header.scrolled { + background: rgba(255, 255, 255, 0.95); + backdrop-filter: blur(16px); + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); +} + +#main-header.scrolled .nav-link { + color: #1e293b; +} + +#main-header.scrolled #brand-name { + color: #1e293b; +} + /* ── 언어 전환 버튼 ───────────────────────────────────────── */ +/* 기본 상태: 투명 배경 위 (흰색) */ .lang-btn { background: transparent; - opacity: 0.5; - transition: all 0.2s; + color: white; + opacity: 0.85; + transition: all 0.3s; } + .lang-btn:hover { - opacity: 0.8; -} -.lang-btn.active-lang { - background: #2563eb; opacity: 1; } + +.lang-btn.active-lang { + background: rgba(37, 99, 235, 0.9); + opacity: 1; +} + +/* 스크롤 시: 흰색 배경 (어두운 텍스트) */ +#main-header.scrolled .lang-btn { + color: #1e293b; + opacity: 0.7; +} + +#main-header.scrolled .lang-btn:hover { + opacity: 1; +} + +#main-header.scrolled .lang-btn.active-lang { + background: #2563eb; + color: white; + opacity: 1; +} + +/* 언어 버튼 컨테이너 테두리 */ +#lang-container { + border-color: rgba(255, 255, 255, 0.3); +} + +#main-header.scrolled #lang-container { + border-color: rgba(0, 0, 0, 0.15); +} diff --git a/html/assets/images/bearing.png b/html/assets/images/bearing.png new file mode 100644 index 0000000..a4a5f31 Binary files /dev/null and b/html/assets/images/bearing.png differ diff --git a/html/assets/images/instrument.png b/html/assets/images/instrument.png new file mode 100644 index 0000000..1837d69 Binary files /dev/null and b/html/assets/images/instrument.png differ diff --git a/html/assets/images/reactor.png b/html/assets/images/reactor.png new file mode 100644 index 0000000..e49ed39 Binary files /dev/null and b/html/assets/images/reactor.png differ diff --git a/html/assets/js/i18n.js b/html/assets/js/i18n.js index 0ada303..e3ec0d7 100644 --- a/html/assets/js/i18n.js +++ b/html/assets/js/i18n.js @@ -9,7 +9,7 @@ const translations = { 'nav.batch' : 'Batch Process', 'nav.dbsvr' : 'Database Server', 'nav.products' : 'Instruments', - 'nav.services' : 'Services', + 'nav.services' : 'References', 'nav.about' : 'About', 'nav.contact' : 'Contact', 'nav.quote' : 'Request Quote', @@ -43,8 +43,8 @@ const translations = { 'batch.badge' : 'Process Automation', 'batch.title' : 'Batch Process Control', 'batch.desc' : 'Not only precision control, but also production planning, process data & historical lot management, you can get it by our Batch Manager software.', - 'batch.f1.title': 'Batch Manager System', - 'batch.f1.desc' : 'Process control & data, production scheduling, and productionlot management in a software platform for HC900', + 'batch.f1.title': 'Batch Manager Software', + 'batch.f1.desc' : 'Process control data and production data management per lot no. in a software platform', 'batch.f2.title': 'ControlEdge HC900', 'batch.f2.desc' : 'Over the PLC for continuous and batch process control, Hybrid Controller from Honeywell. it is perfect solution of batch plant', 'batch.f3.title': 'Process Data Management', @@ -92,28 +92,48 @@ const translations = { 'inst.custom.btn' : 'Request Custom Configuration', 'inst.quote' : 'Get Quote →', - // SERVICES - 'svc.badge' : 'Our Capabilities', - 'svc.title' : 'World-Class Automation', - 'svc.desc' : 'Specialized engineering for complex physical operations through advanced data integration and distributed control systems.', - 'svc.s1.title' : 'DCS Integration', - 'svc.s1.desc' : 'Redundant control architectures for utility-scale industries including power and chemical plants.', + // REFERENCES + 'svc.badge' : 'Referenced Plant Varieties', + 'svc.title' : 'Versatile Automation References', + 'svc.desc' : 'From Deep Understanding of various industry references to Seamless Execution.', + 'svc.s1.title' : 'DCS / SCADA', + 'svc.s1.desc' : 'Semiconductor Solvent Recovery Plant., 80% Hydrazin Plant, SNCR & SCR Envirionmental Plant, etc', + 'svc.s1.item1' : 'Semiconductor Solvent Recovery Plant', + 'svc.s1.item2' : '80% Hydrazin Plant', + 'svc.s1.item3' : 'SNCR & SCR in Power Plant', + 'svc.s1.item4' : 'Oil Tank Terminal', 'svc.s1.link' : 'Learn More', - 'svc.s2.title' : 'SCADA Design', + + 'svc.s2.title' : 'Batch Plant', 'svc.s2.desc' : 'Real-time monitoring platforms with advanced HMI and secure remote access protocols.', + 'svc.s2.item1' : 'Micro Capsule forming agent plant', + 'svc.s2.item2' : 'ADCA,HDCA Plant', + 'svc.s2.item3' : 'Vacuum Furnace Plant - Decorative Stainless Plate', 'svc.s2.link' : 'Case Studies', - 'svc.s3.title' : 'Data Historians', - 'svc.s3.desc' : 'Mission-critical SQL infrastructure optimized for massive industrial time-series data storage.', - 'svc.s3.link' : 'Data Security', - 'svc.s4.title' : 'Control Instruments', + + 'svc.s3.title' : 'Other Projects', + 'svc.s3.desc' : 'Various industrial automation projects.', + 'svc.s3.item1' : 'Waste to Energy Incineration Plant', + 'svc.s3.item2' : 'Copper Rod Continuous Casting Plant', + 'svc.s3.item3' : 'Bearing Continuous Heat Treatment Plant', + 'svc.s3.item4' : 'High Speed Cold Rolling Continuous Casting Plant', + 'svc.s3.link' : 'CASE STUDIES', + + 'svc.s4.title' : 'Instruments', 'svc.s4.desc' : 'Smart field sensors for flow, pressure, and temperature with high-accuracy calibration.', + 'svc.s4.item1' : 'Honeywell', + 'svc.s4.item2' : 'Azbil', + 'svc.s4.item3' : 'Endress Hauser', + 'svc.s4.item4' : 'Flownics', + 'svc.s4.item5' : 'Komoto - (Motoyama Korea)', + 'svc.s4.item6' : 'Autonics - (Konics)', 'svc.s4.link' : 'Product Catalog', // ABOUT 'about.badge' : 'About Hanmo', 'about.title' : 'Trusted Partner in Industrial Automation', 'about.p1' : 'Since our founding, Hanmo Control & Network Co., Ltd. has been at the forefront of industrial automation engineering. We specialize in designing, implementing, and maintaining mission-critical control systems for the world\'s most demanding industries.', - 'about.p2' : 'Our team of 60+ certified engineers brings decades of combined experience in DCS, SCADA, and industrial networking, ensuring your operations run with unmatched precision and reliability.', + 'about.p2' : 'Our certified engineers brings decades of combined experience in DCS, SCADA, instrumentation and industrial networking, ensuring your operations run with unmatched precision and reliability.', 'about.cert' : 'Certified', 'about.support' : 'Support', 'about.years' : 'Years of Industrial Excellence', @@ -144,7 +164,7 @@ const translations = { 'nav.batch' : '배치 프로세스', 'nav.dbsvr' : '데이터베이스 서버', 'nav.products' : '계측기기', - 'nav.services' : '서비스', + 'nav.services' : '실적 플랜트 분야', 'nav.about' : '회사소개', 'nav.contact' : '문의하기', 'nav.quote' : '견적 요청', @@ -161,13 +181,13 @@ const translations = { 'stat.years' : '년 업계 경력', // DCS - 'dcs.badge' : '고급 제어 시스템', + 'dcs.badge' : '공정 제어 시스템', 'dcs.title' : 'DCS 통합 솔루션', - 'dcs.desc' : '가장 중요한 공정 현장을 위한 엔터프라이즈급 분산 제어 시스템(DCS) 아키텍처를 설계합니다.', - 'dcs.f0.title' : 'Honeywell Experion PKS', - 'dcs.f0.desc' : 'Honeywell Experion PKS 플랫폼을 기반으로 한 안정적인 DCS 솔루션', + 'dcs.desc' : '중요한 공정 현장을 위한 엔터프라이즈급 분산 제어 시스템(DCS) 아키텍처를 설계합니다.', + 'dcs.f0.title' : 'Honeywell Experion', + 'dcs.f0.desc' : 'Honeywell Experion 플랫폼을 기반으로 한 안정적이고 다양한 DCS 솔루션을 제공합니다.', 'dcs.f1.title' : '이중화 아키텍처', - 'dcs.f1.desc' : '이중화 서버로 99.99% 가동률을 보장하는 내결함성 시스템', + 'dcs.f1.desc' : '이중화 서버 & 컨트롤러,통신으로 99.99% 가동률을 보장하는 내결함성 시스템', 'dcs.f2.title' : '실시간 통신', 'dcs.f2.desc' : '밀리초 미만의 응답 시간으로 다중 노드 간 동기화된 제어 실현', 'dcs.f3.title' : '보안 인증', @@ -175,15 +195,19 @@ const translations = { 'dcs.btn' : '기술 사양 요청', // BATCH - 'batch.badge' : '프로세스 자동화', + 'batch.badge' : '배치 프로세스 자동화', 'batch.title' : '배치 프로세스 제어', - 'batch.desc' : '제약, 화학 및 특수 제조 공정을 위한 정교한 배치 자동화 시스템을 구축합니다.', - 'batch.f1.title': '레시피 관리', - 'batch.f1.desc' : '버전 관리 및 감사 추적 기능을 갖춘 동적 레시피 엔진', - 'batch.f2.title': '성능 분석', - 'batch.f2.desc' : '예측 품질 모니터링을 통한 실시간 배치 추적', - 'batch.f3.title': 'GMP 준수', - 'batch.f3.desc' : 'FDA 21 CFR Part 11 준수 및 완전한 데이터 무결성 보장', + 'batch.desc' : '배치 프로세스 자동화는 생산 제품의 다양성을 위한 정밀제어 및 제품별 설정 데이터 생성 및 관리, 생산 로트 이력관리가 하나의 시스템에서 실현됩니다. 반응기, 산업로(배치,연속 혼재공정) 등의 배치 플랜트에 최적화된 제어 시스템과 소프트웨어 솔루션을 제공합니다.', + 'batch.f1.title': '배치 매니저 소프트웨어', + 'batch.f1.desc' : '제품별 설정값 패턴 ,레시피, 로트관리 등의 제어와 생산 데이터베이스가 하나의 시스템에서 제공됩니다', + 'batch.f2.title': 'ControlEdge HC900', + 'batch.f2.desc' : '설정값 패턴 프로그램, 레시피, 정밀 PID 제어, PLC를 넘어서는 하이브리드 컨트롤러로 배치 플랜트에 최적화된 솔루션', + 'batch.f3.title': 'MES,ERP 연동', + 'batch.f3.desc' : '자사 데이터베이스 서버를 통한, 손쉬운 MES, ERP 연동으로 생산 스케쥴 관리 지원 가능', + 'batch.f4.title': '신속한 운전 설정', + 'batch.f4.desc' : '단 한번의 다운로드로, 제품별 생산 환경 설정이 초단위로 완료됩니다', + 'batch.f5.title': '생산 로트 이력 관리', + 'batch.f5.desc' : '생산 로트 관리 및 로트별 차트 그래프를 제공하여 이력 데이터 분석에 탁월.', 'batch.btn' : '구축 상담 신청', // DBSVR @@ -223,31 +247,48 @@ const translations = { 'inst.custom.btn' : '맞춤 구성 요청', 'inst.quote' : '견적 요청 →', - // SERVICES - 'svc.badge' : '서비스 역량', - 'svc.title' : '세계 최고 수준의 자동화', - 'svc.desc' : '고급 데이터 통합 및 분산 제어 시스템을 통해 복잡한 공정 공정을 위한 특화된 엔지니어링을 제공합니다.', - 'svc.s1.title' : 'DCS 통합', - 'svc.s1.desc' : '발전소, 화학 플랜트 등 대규모 공정을 위한 이중화 제어 아키텍처', + // REFERENCES + 'svc.badge' : '실적 플랜트 분야', + 'svc.title' : '다양한 산업 분야의 자동화 실적', + 'svc.desc' : '공정에 대한 깊이있는 이해와 경험을 바탕으로 복잡한 공정을 위한 특화된 엔지니어링을 제공합니다.', + 'svc.s1.title' : 'DCS / SCADA', + 'svc.s1.desc' : '반도체용 솔벤트 회수 플랜트, 발전소, 화학 플랜트 등 대규모 공정을 위한 이중화 제어 아키텍처', + 'svc.s1.item1' : '반도체용 솔벤트 회수 플랜트', + 'svc.s1.item2' : '80% 하이드라진 플랜트', + 'svc.s1.item3' : '발전소 SNCR & SCR 플랜트', + 'svc.s1.item4' : '오일 탱크 터미널 플랜트', 'svc.s1.link' : '자세히 보기', - 'svc.s2.title' : 'SCADA 설계', - 'svc.s2.desc' : '고급 HMI 및 보안 원격 접속 프로토콜을 갖춘 실시간 모니터링 플랫폼', + 'svc.s2.title' : '배치 플랜트', + 'svc.s2.desc' : '실시간 모니터링 플랫폼과 고급 HMI, 안전한 원격 액세스 프로토콜을 갖춘 배치 플랜트 제어 시스템', + 'svc.s2.item1' : '마이크로 캡슐 발포제 플랜트', + 'svc.s2.item2' : 'ADCA,HDCA 플랜트', + 'svc.s2.item3' : '진공 열처리로 플랜트', 'svc.s2.link' : '사례 연구', - 'svc.s3.title' : '데이터 히스토리안', - 'svc.s3.desc' : '대규모 공정 시계열 데이터 저장에 최적화된 미션 크리티컬 SQL 인프라', + 'svc.s3.title' : '기타 프로젝트', + 'svc.s3.desc' : '기타 핵심 산업 자동화', + 'svc.s3.item1' : '쓰레기 소각장 플랜트', + 'svc.s3.item2' : '구리 환재 연속 주조로', + 'svc.s3.item3' : '베어링 연속 열처리로 플랜트', + 'svc.s3.item4' : '고속 냉간 연속 주조로 플랜트', 'svc.s3.link' : '데이터 보안', - 'svc.s4.title' : '제어 계측기기', - 'svc.s4.desc' : '고정밀 교정을 통한 유량, 압력, 온도 스마트 현장 센서', + 'svc.s4.title' : '제어 계측기기 협력사', + 'svc.s4.desc' : '고객 현장에 대한 깊은 이해를 바탕으로 최적 계측기 선정', + 'svc.s4.item1' : '한국하니웰(주)', + 'svc.s4.item2' : '한국아즈빌(주)', + 'svc.s4.item3' : '엔드레스하우저', + 'svc.s4.item4' : '플로우닉스(주)', + 'svc.s4.item5' : '(주)코모토', + 'svc.s4.item6' : '오토닉스(주)', 'svc.s4.link' : '제품 카탈로그', // ABOUT 'about.badge' : '회사 소개', 'about.title' : '공정 자동화의 신뢰할 수 있는 파트너', 'about.p1' : '(주)한모씨앤앤는 창립 이래 공정 자동화 엔지니어링의 최전선에서 활동하고 있습니다. 세계에서 가장 까다로운 공정 현장을 위한 미션 크리티컬 제어 시스템 설계, 구현 및 유지보수를 전문으로 합니다.', - 'about.p2' : '60여 명의 공인 엔지니어로 구성된 팀이 DCS, SCADA, 공정 네트워킹 분야에서 수십 년의 경험을 바탕으로 최고의 정밀도와 신뢰성을 보장합니다.', + 'about.p2' : 'DCS, SCADA, 계측기기, 공정 네트워킹 분야에서 수십 년의 경험을 바탕으로 최고의 정밀도와 신뢰성을 보장합니다.', 'about.cert' : '인증', 'about.support' : '지원', - 'about.years' : '년 공정 분야 우수성', + 'about.years' : '여년간의 공정 제어 전문성', // CONTACT 'contact.badge' : '문의하기', @@ -265,7 +306,7 @@ const translations = { 'contact.error.fail' : '❌ 전송에 실패했습니다. 잠시 후 다시 시도해 주세요.', // FOOTER - 'footer.copy' : '© 2024 (주)한모씨앤앤. All rights reserved.', + 'footer.copy' : '© (주)한모씨앤앤. All rights reserved.', } }; @@ -288,8 +329,10 @@ function applyTranslations() { el.textContent = t(key); } }); + // 업데이트 document.documentElement.lang = currentLang; + // 버튼 활성 상태 업데이트 document.querySelectorAll('.lang-btn').forEach(btn => { btn.classList.toggle('active-lang', btn.dataset.lang === currentLang); @@ -302,4 +345,5 @@ function switchLang(lang) { applyTranslations(); } +// DOMContentLoaded 시 번역 적용 document.addEventListener('DOMContentLoaded', applyTranslations); diff --git a/html/assets/js/script.js b/html/assets/js/script.js index c144d8d..b536ac9 100644 --- a/html/assets/js/script.js +++ b/html/assets/js/script.js @@ -1,89 +1,75 @@ // ============================================================ -// ★ EmailJS 설정 - 아래 3가지 값을 본인 계정으로 교체하세요 ★ -// ============================================================ -const EMAILJS_PUBLIC_KEY = 'HO6i369gX6X5HEXtJ'; -const EMAILJS_SERVICE_ID = 'service_4ur5lqd'; -const EMAILJS_TEMPLATE_ID = 'template_jp0v5qv'; +// 메인 스크립트 (전체 기능 포함) // ============================================================ -emailjs.init(EMAILJS_PUBLIC_KEY); +// DOMContentLoaded 이벤트 +document.addEventListener('DOMContentLoaded', () => { -// ── Contact Form ───────────────────────────────────────────── -document.getElementById('contact-submit').addEventListener('click', function () { - const name = document.getElementById('contact-name').value.trim(); - const email = document.getElementById('contact-email').value.trim(); - const company = document.getElementById('contact-company').value.trim(); - const message = document.getElementById('contact-message').value.trim(); - const btn = document.getElementById('contact-submit'); - - if (!name || !email || !message) { - showStatus('error', t('contact.error.required')); return; - } - if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) { - showStatus('error', t('contact.error.email')); return; - } - - btn.disabled = true; - btn.textContent = t('contact.sending'); - - const templateParams = { - name : name, - message : 'Email : ' + email + '\nCompany : ' + (company || 'N/A') + '\n\n' + message, - reply_to : email - }; - - emailjs.send(EMAILJS_SERVICE_ID, EMAILJS_TEMPLATE_ID, templateParams) - .then(function () { - showStatus('success', t('contact.success')); - document.getElementById('contact-name').value = ''; - document.getElementById('contact-email').value = ''; - document.getElementById('contact-company').value = ''; - document.getElementById('contact-message').value = ''; - }) - .catch(function (error) { - console.error('EmailJS error:', error); - showStatus('error', t('contact.error.fail')); - }) - .finally(function () { - btn.disabled = false; - btn.textContent = t('contact.btn'); + // ============================================================ + // 메뉴 토글 + // ============================================================ + const menuBtn = document.querySelector('.menu-btn'); + const navMenu = document.querySelector('.nav-menu'); + if (menuBtn && navMenu) { + menuBtn.addEventListener('click', () => { + navMenu.classList.toggle('open'); + menuBtn.classList.toggle('open'); }); -}); - -function showStatus(type, msg) { - const status = document.getElementById('contact-status'); - status.classList.remove('hidden', 'bg-green-500/20', 'text-green-400', 'bg-red-500/20', 'text-red-400'); - status.classList.add(type === 'success' ? 'bg-green-500/20' : 'bg-red-500/20', - type === 'success' ? 'text-green-400' : 'text-red-400'); - status.textContent = msg; -} - -// ── Header scroll ──────────────────────────────────────────── -const mainHeader = document.getElementById('main-header'); -const brandName = document.getElementById('brand-name'); -const navLinks = document.querySelectorAll('.nav-link'); - -window.addEventListener('scroll', () => { - if (window.scrollY > 50) { - mainHeader.classList.add('glass-effect', 'py-3'); - mainHeader.classList.remove('py-6'); - if (brandName) brandName.classList.replace('text-white', 'text-slate-900'); - navLinks.forEach(link => link.classList.replace('text-slate-100', 'text-slate-700')); - } else { - mainHeader.classList.remove('glass-effect', 'py-3'); - mainHeader.classList.add('py-6'); - if (brandName) brandName.classList.replace('text-slate-900', 'text-white'); - navLinks.forEach(link => link.classList.replace('text-slate-700', 'text-slate-100')); } + + // ============================================================ + // 스크롤 애니메이션 + // ============================================================ + const scrollElems = document.querySelectorAll('[data-scroll]'); + const observerOptions = { + root: null, + rootMargin: '0px', + threshold: 0.1 + }; + const scrollObserver = new IntersectionObserver((entries, observer) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('animate'); + observer.unobserve(entry.target); + } + }); + }, observerOptions); + + scrollElems.forEach(el => scrollObserver.observe(el)); + + // ============================================================ + // 상단 버튼/헤더 스크롤 효과 + // ============================================================ + const header = document.querySelector('header'); + const topBtn = document.querySelector('.back-to-top'); + window.addEventListener('scroll', () => { + if (window.scrollY > 50) { + header?.classList.add('scrolled'); + topBtn?.classList.add('visible'); + } else { + header?.classList.remove('scrolled'); + topBtn?.classList.remove('visible'); + } + }); + + topBtn?.addEventListener('click', () => window.scrollTo({ top: 0, behavior: 'smooth' })); + + // ============================================================ + // 기타 커스텀 이벤트/버튼 + // ============================================================ + // 예: 상담 신청 모달 열기 + document.querySelectorAll('.open-consult').forEach(btn => { + btn.addEventListener('click', () => { + const modal = document.querySelector('#consult-modal'); + modal?.classList.add('open'); + }); + }); + + // 예: 모달 닫기 + document.querySelectorAll('.modal .close-btn').forEach(btn => { + btn.addEventListener('click', () => { + const modal = btn.closest('.modal'); + modal?.classList.remove('open'); + }); + }); }); - -// ── Mobile menu ─────────────────────────────────────────────── -const mobileMenuBtn = document.getElementById('mobile-menu-btn'); -const mobileMenu = document.getElementById('mobile-menu'); -const closeMenuBtn = document.getElementById('close-menu-btn'); - -if (mobileMenuBtn) mobileMenuBtn.addEventListener('click', () => mobileMenu.classList.remove('translate-x-full')); -if (closeMenuBtn) closeMenuBtn.addEventListener('click', () => mobileMenu.classList.add('translate-x-full')); - -const mobileNavLinks = mobileMenu ? mobileMenu.querySelectorAll('a') : []; -mobileNavLinks.forEach(link => link.addEventListener('click', () => mobileMenu.classList.add('translate-x-full'))); diff --git a/html/index.html b/html/index.html index e96d648..6deedd9 100644 --- a/html/index.html +++ b/html/index.html @@ -36,21 +36,21 @@