How httpsmanhuynh/ptwkd works
KoolEyes is a static front-end eyewear e-commerce site. The principal workflow is customer browsing, selecting a product, adding it to the cart, checking out, and reaching order confirmation. Product data and JavaScript provide the main internal layer, with cart state persisted in browser localStorage. Account, recovery, order tracking, wishlist, lookbook, recommendations, virtual try-on, and informational pages form supporting branches. No backend, payment service, or implementation source was provided, so those relationships are not shown.
Components 24
Product Discovery
- Storefront
pages/homepage.html - Catalog
pages/shop.html - Catalog Rendering
assets/js/shop.js - Product Data
assets/data/product.js - Product Detail
pages/product-detail.html - Detail Logic
assets/js/product-detail.js
Shopping & Orders
- Shopping Cart
pages/cart.html - Cart Logic
assets/js/cart.js - Site Cart
assets/js/site-cart.js - Browser Storage
- Checkout
pages/checkout.html - Order Confirmation
pages/order_success.html
Customer Account
- Account Access
pages/login_register.html - Password Recovery
pages/forget_pw.html - Account Details
pages/account_detail.html - Order History
pages/order_history.html - Order Tracking
pages/tracking_order.html - Wishlist
pages/wishlist.html
Brand Experience
- Lookbook
pages/lookbook_cus.html - Virtual Try-On
pages/virtual-try-on.html - Recommendations
pages/recommend.html - About Brand
pages/about.html - Contact
pages/contact.html
Other components
- Customer
Connections 24
- Customer → Storefront: opens
- Customer → Catalog: browses
- Catalog → Catalog Rendering: renders
- Catalog Rendering → Product Data: reads
- Customer → Product Detail: selects
- Product Detail → Detail Logic: uses
- Detail Logic → Product Data: reads
- Customer → Shopping Cart: adds items
- Shopping Cart → Cart Logic: invokes
- Cart Logic → Browser Storage: persists
- Site Cart → Browser Storage: reads
- Shopping Cart → Checkout: proceeds
- Checkout → Order Confirmation: confirms
- Customer → Account Access: authenticates
- Customer → Password Recovery: recovers password
- Account Access → Account Details: opens
- Account Details → Order History: views orders
- Order History → Order Tracking: tracks order
- Customer → Wishlist: manages wishlist
- Customer → Lookbook: views lookbook
- Customer → Virtual Try-On: tries virtually
- Customer → Recommendations: gets recommendations
- Customer → About Brand: learns about brand
- Customer → Contact: contacts brand