the-glorious-startpage/index.html
2020-06-13 18:33:33 +08:00

308 lines
12 KiB
HTML

<!DOCTYPE html>
<html>
<meta charset='utf-8'>
<head>
<meta charset='utf-8' />
<meta name='viewport' content='width=device-width, viewport-fit=cover, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no'>
<meta name='robots' content='noindex'>
<link rel='stylesheet' href='css/style.css' class='style'>
<!-- Favicons -->
<link rel='shortcut icon' href='assets/favicon/favicon.ico'>
<link rel='icon' sizes='16x16 32x32 64x64' href='assets/favicon/favicon.ico'>
<link rel='icon' type='image/png' sizes='196x196' href='assets/favicon/favicon-192.png'>
<link rel='icon' type='image/png' sizes='160x160' href='assets/favicon/favicon-160.png'>
<link rel='icon' type='image/png' sizes='96x96' href='assets/favicon/favicon-96.png'>
<link rel='icon' type='image/png' sizes='64x64' href='assets/favicon/favicon-64.png'>
<link rel='icon' type='image/png' sizes='32x32' href='assets/favicon/favicon-32.png'>
<link rel='icon' type='image/png' sizes='16x16' href='assets/favicon/favicon-16.png'>
<link rel='apple-touch-icon' href='assets/favicon/favicon-57.png'>
<link rel='apple-touch-icon' sizes='114x114' href='assets/favicon/favicon-114.png'>
<link rel='apple-touch-icon' sizes='72x72' href='assets/favicon/favicon-72.png'>
<link rel='apple-touch-icon' sizes='144x144' href='assets/favicon/favicon-144.png'>
<link rel='apple-touch-icon' sizes='60x60' href='assets/favicon/favicon-60.png'>
<link rel='apple-touch-icon' sizes='120x120' href='assets/favicon/favicon-120.png'>
<link rel='apple-touch-icon' sizes='76x76' href='assets/favicon/favicon-76.png'>
<link rel='apple-touch-icon' sizes='152x152' href='assets/favicon/favicon-152.png'>
<link rel='apple-touch-icon' sizes='180x180' href='assets/favicon/favicon-180.png'>
<meta name='msapplication-TileColor' content='#FFFFFF'>
<meta name='msapplication-TileImage' content='assets/favicon/favicon-144.png'>
<meta name='msapplication-config' content='assets/favicon/browserconfig.xml'>
<title>Home</title>
</head>
<body>
<!-- The place where we set the DUMMY background/image -->
<div id='dummyBodyBackground'></div>
<div class='bar' id='topPanel'>
<div id='clock'></div>
</div>
<div class='dockContainer'>
<div class='bar' id='dock'>
<!-- Below is the structure of a DIV of a function button that will be generated in js/dock-buttons.js -->
<!--
<div id='buttonbuttonLaunch' class='dockButton'>
<div id='buttonImageLaunch' class='dockButtonImage'></div>
</div>
-->
<!-- Below is the structure of a DIV of a website button that will be generated in js/dock-buttons.js -->
<!--
<a class='dockLink' href='https://example.com/' tabindex='-1'>
<div id='buttonReddit' class='dockButton'>
<div id='buttonImage0' class='dockButtonImage'></div>
</div>
</a>
-->
</div>
</div>
<div id='centeredBoxOverlay'></div>
<div class='centeredBar' id='centeredBox'>
<div id='profileImageContainer'>
<div id='profileImage'></div>
</div>
<div id='searchBoxContainer'>
<input type='text' id='searchBox' autocomplete='off' autofocus='off' placeholder=' Search with HiddenWiki'/>
<div id='suggestionsContainer'>
<ul id='suggestions'>
<!-- Below is the structure of an LI that will be generated in js/auto-suggestion.js -->
<!--
<li id='phrase'>
<button type='button' class='phraseButton'>Suggestion1</button>
</li>
-->
</ul>
</div>
</div>
</div>
<div class='dashboard' id='rightDashboard'>
<div class='rightDashboardBody'>
<div id='greeterMessage'></div>
<div id='dateMessage'></div>
<!-- Weather Settings -->
<form class='weatherSettings'>
<div id='weatherSettingsPadding'>
<div class='header' id='weatherSettingsHeader'>
<div class='headerIcon' id='weatherSettingsHeaderIcon'></div>
<label for='apiKeySet' class='headerLabel' id='weatherSettingsHeaderLabel'>Weather Settings</label>
</div>
<div id='weatherSettingsContainer'>
<div class='weatherSettingsGroups' id='weatherSettingsAPIKey'>
<label for='apiKeySet' class='weatherSettingsLabels'>API Key</label>
<input type='text' class='weatherSettingsInputs' id='apiKeySet' autocomplete='off' placeholder='API KEY'/>
</div>
<div class='weatherSettingsGroups' id='weatherSettingsUnitsSelect'>
<label for='weatherSelectUnits' class='weatherSettingsLabels'>Locator Mode</label>
<select class='weatherSettingsInputs' id='weatherSelectLocator'>
<option value='city'>City</option>
<option value='geolocation'>Geolocation</option>
</select>
</div>
<div class='weatherSettingsGroups' id='weatherSettingsCityID'>
<label for='cityIDSet' class='weatherSettingsLabels'>City ID</label>
<input type='text' class='weatherSettingsInputs' id='cityIDSet' autocomplete='off' placeholder='City ID'/>
</div>
<div class='weatherSettingsGroups' id='weatherSettingsUnitsSelect'>
<label for='weatherSelectUnits' class='weatherSettingsLabels'>Units</label>
<select class='weatherSettingsInputs' id='weatherSelectUnits'>
<option value='metric'>Metric</option>
<option value='imperial'>Imperial</option>
</select>
</div>
<div class='weatherSettingsGroups' id='weatherSettingsButtons'>
<button type='button' class='weatherSettingsInputs' id='weatherSettingsReset'>Clear Credentials</button>
<button type='button' class='weatherSettingsInputs' id='weatherSettingsApply'>Apply</button>
</div>
</div>
</div>
</form>
<!-- Select search engine -->
<form class='searchEngine'>
<div id='searchEnginePadding'>
<div class='header' id='searchEngineHeader'>
<div class='headerIcon' id='searchEngineHeaderIcon'></div>
<label for='searchEngineSelect' class='headerLabel' id='searchEngineHeaderLabel'>Search Engine</label>
</div>
<div id='searchEngineContainer'>
<select id='searchEngineSelect'>
<!-- Below is the structure of an option that will be generated in js/search-engine-settings.js -->
<!--
<option value='example'>Example</option>
-->
</select>
<button type='button' id='searchEngineAsDefault'>Set as Default</button>
</div>
</div>
</form>
<!-- Theme engine -->
<form class='themeEngine'>
<div id='themeEnginePadding'>
<div class='header' id='themeEngineHeader'>
<div class='headerIcon' id='themeEngineHeaderIcon'></div>
<label for='backgroundSet' class='headerLabel' id='themeEngineHeaderLabel'>Theme Engine</label>
</div>
<div id='themeEngineContainer'>
<div class='themeEngineGroups' id='themeEngineBackground'>
<label for='backgroundSet' class='themeEngineLabels'>Background Color and Opacity</label>
<div class='backgroundColorSetter'>
<input type='text' maxlength='7' class='themeEngineInputs' id='backgroundSet' autocomplete='off' placeholder='000000'/>
<input type='text' maxlength='2' class='themeEngineInputs' id='backgroundOpacitySet' autocomplete='off' placeholder='FF'/>
</div>
</div>
<div class='themeEngineGroups' id='themeEngineForeground'>
<label for='foregroundSet' class='themeEngineLabels'>Foreground Color and Opacity</label>
<div class='foregroundColorSetter'>
<input type='text' maxlength='7' class='themeEngineInputs' id='foregroundSet' autocomplete='off' placeholder='000000'/>
<input type='text' maxlength='2' class='themeEngineInputs' id='foregroundOpacitySet' autocomplete='off' placeholder='FF'/>
</div>
</div>
<div class='themeEngineGroups' id='themeEngineBlurStrength'>
<label for='blurSet' class='themeEngineLabels'>Blur Strength in Pixels</label>
<div class='blurSetter'>
<input type='text' class='themeEngineInputs' id='blurSet' autocomplete='off' placeholder='10'/>
</div>
</div>
<div class='themeEngineGroups' id='themeEngineAnimSpeed'>
<label for='animSpeedSet' class='themeEngineLabels'>Animation Speed</label>
<div class='animSpeedSetter'>
<input type='text' class='themeEngineInputs' id='animSpeedSet' autocomplete='off' placeholder='300ms'/>
</div>
</div>
<button type='button' id='themeEngineReset'>Reset</button>
<button type='button' id='themeEngineAsDefault'>Apply</button>
</div>
</div>
</form>
</div>
</div>
<div class='dashboardOverlay' id='dashboardOverlay'></div>
<!-- Weather screen -->
<div id='weatherScreen'>
<div id='weatherScreenContainer'>
<div id='weatherTodayIcon'></div>
<div id='weatherTodayLocation'>
Earth, Milky Way
</div>
<div id='weatherTodayDescription'>
dust & clouds, -1000°C
</div>
<div id='weatherHourDataTodayContainer'>
<div class='weatherDataHour' id='weatherTodaySunrise'>
<div class='hourDataIcon' id='sunriseHourDataIcon'></div>
<div class='hourDataLabel' id='sunriseTodayHour'>00:00</div>
</div>
<div class='weatherDataHour' id='weatherTodaySunset'>
<div class='hourDataIcon' id='sunsetHourDataIcon'></div>
<div class='hourDataLabel' id='sunsetTodayHour'>00:00</div>
</div>
<div class='weatherDataHour' id='weatherTodayUpdate'>
<div class='hourDataIcon' id='updateHourDataIcon'></div>
<div class='hourDataLabel' id='updateTodayHour'>00:00</div>
</div>
</div>
<div class='weatherForecast' id='forecastContainer'>
<!-- Below is the structure of a DIV that will be generated in js/weather-screen.js -->
<!--
<div class='weatherForecastDay'>
<div class='weatherForecastDayDate'>
<div class='weatherForecastDayDateName'></div>
<div class='weatherForecastDayDateHour'></div>
</div>
<div class='weatherForecastDayIconContainer'>
<div class='weatherForecastDayIcon'></div>
</div>
<div class='weatherForecastDayDetails'>
<div class='weatherForecastDayDetailsTemperature'></div>
<div class='weatherForecastDayDetailsDescription'></div>
</div>
</div>
-->
</div>
</div>
</div>
<!-- Web menu panel -->
<div id='webMenu'>
<div id='webMenuContainer'>
<div id='webMenuSearchBoxContainer'>
<input type='text' id='webMenuSearchBox' autocomplete='off' placeholder=' Type to search'>
</div>
<div id='webMenuListContainer'>
<ul id='webMenuList'>
<!-- Below is the structure of an LI that will be generated in js/web-menu.js -->
<!--
<li>
<a href='https://example.com'>
<div class='webItem'>
<div class='webItemContainer'>
<div class='webItemBody'>
<div class='webItemIconContainer'>
<div class='webItemIcon'></div>
</div>
<div class='webItemName'></div>
</div>
</div>
</div>
</a>
</li>
-->
</ul>
</div>
</div>
</div>
<script src='js/config.js'></script>
<script src='js/background-set.js'></script>
<script src='js/clock.js'></script>
<script src='js/dock-buttons.js'></script>
<script src='js/profile-image.js'></script>
<script src='js/search-engine-settings.js'></script>
<script src='js/search-query-send.js'></script>
<script src='js/show-search-box.js'></script>
<script src='js/centered-box.js'></script>
<script src='js/greeter-date-message.js'></script>
<script src='js/theme-engine.js'></script>
<script src='js/dashboard.js'></script>
<script src='js/web-menu.js'></script>
<script src='js/weather-screen.js'></script>
<script src='js/weather-settings.js'></script>
<script src='js/auto-suggestion.js'></script>
<script src='js/keybindings.js'></script>
<script src='js/mobile-swipe-event.js'></script>
<script src='js/mobile-swipe-callback.js'></script>
<script src='js/script.js'></script>
</body>
</html>