Spaces:
Running
Running
| <html lang="vi"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Locations Map</title> | |
| <link rel="stylesheet" href="css/maps.css"> | |
| <link rel="shortcut icon" href="css/favicon.ico" type="image/x-icon"> | |
| <link rel="icon" href="css/favicon.ico" type="image/x-icon"> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <h1>Locations Map</h1> | |
| <div id="gallery" class="gallery"> | |
| <div class="loading">Đang tải vị trí...</div> | |
| </div> | |
| <div class="coordinates"></div> | |
| <div class="toolbar"> | |
| <select id="editor"> | |
| <option value="view">-- View --</option> | |
| <option value="create">Create Point</option> | |
| <option value="move">Move Point</option> | |
| </select> | |
| <select id="Cities"> | |
| <option value="all">-- Cities --</option> | |
| <option value="-1">-- Tạo Mới --</option> | |
| </select> | |
| <select id="Districts"> | |
| <option value="all">-- Districts --</option> | |
| <option value="-2">-- Tạo Mới --</option> | |
| </select> | |
| <select id="Streets"> | |
| <option value="all">-- Streets --</option> | |
| <option value="-3">-- Tạo Mới --</option> | |
| </select> | |
| <button id="saveAll" class="save-btn">Save</button> | |
| </div> | |
| <div id="modal" class="modal"></div> | |
| </div> | |
| <!-- Street Panel --> | |
| <button id="streetPanelToggle" class="street-panel-toggle" title="Nearby Streets">☰</button> | |
| <div id="streetPanel" class="street-panel"> | |
| <div class="street-panel-header"> | |
| <span class="street-panel-title">Nearby Streets</span> | |
| <span id="streetPanelRadius" class="street-panel-radius">r=2km</span> | |
| </div> | |
| <div id="streetPanelList" class="street-panel-list"> | |
| <div class="street-panel-empty">Scroll map to load...</div> | |
| </div> | |
| </div> | |
| <!-- Search --> | |
| <button id="searchBtn" class="search-btn" title="Search">🔍</button> | |
| <div id="searchModal" class="search-modal" style="display:none;"> | |
| <div class="search-modal-content"> | |
| <div class="search-modal-title">Search Points</div> | |
| <div class="search-row"> | |
| <input type="number" id="sLat1" class="search-input" value="10.783574" step="any"> | |
| <input type="number" id="sLon1" class="search-input" value="106.653222" step="any"> | |
| </div> | |
| <div class="search-row"> | |
| <input type="number" id="sLat2" class="search-input" value="10.802353" step="any"> | |
| <input type="number" id="sLon2" class="search-input" value="106.652561" step="any"> | |
| </div> | |
| <button id="searchSubmit" class="search-submit">Search</button> | |
| <div id="searchResult" class="search-result"></div> | |
| </div> | |
| </div> | |
| <!-- Settings --> | |
| <button id="settingsBtn" class="settings-btn" title="Settings">⚙</button> | |
| <div id="settingsPanel" class="settings-panel"> | |
| <div class="settings-title">Settings</div> | |
| <label class="settings-label"> | |
| Items | |
| <input type="number" id="sItems" value="23" min="1"> | |
| </label> | |
| <label class="settings-label"> | |
| Size (px) | |
| <input type="number" id="sSize" value="800" min="1"> | |
| </label> | |
| <label class="settings-label settings-label--row"> | |
| <input type="checkbox" id="sIsBorder" checked> | |
| Tile Border | |
| </label> | |
| <label class="settings-label settings-label--row"> | |
| <input type="checkbox" id="sIsStreetPath"> | |
| Street Path | |
| </label> | |
| <label class="settings-label settings-label--row"> | |
| <input type="checkbox" id="sIsPoi"> | |
| POI | |
| </label> | |
| <label class="settings-label"> | |
| Opacity | |
| <input type="range" id="sOpacity" value="100" min="0" max="100" step="1" style="width:100%;"> | |
| </label> | |
| <button id="settingsSave" class="settings-save">Save</button> | |
| </div> | |
| <script src="js/auth.js"></script> | |
| <script src="js/api.js"></script> | |
| <script src="js/maps/map-coordinate.js"></script> | |
| <script src="js/maps/navigation.js"></script> | |
| <script src="js/maps/settings.js"></script> | |
| <script src="js/maps/pointr.js"></script> | |
| <script src="js/maps/poi.js"></script> | |
| <script src="js/maps/search.js"></script> | |
| <script src="js/maps.js"></script> | |
| </body> | |
| </html> | |