Link Launcher

A simple, static web application designed to serve as a launchpad for check-in kiosks, optimized for 1920x1080 displays. It provides a clean, grid-based interface with large icons and labels.

Features

• Simple file structure with separate HTML, CSS, and JavaScript
• No server or build tools required
• Responsive grid layout optimized for 1920x1080 displays
• 250x250 pixel icons with labels
• Clean, modern interface with dark theme
• Smooth hover animations
• Always-visible digital clock in the lower-right corner
• Internet connection status indicator in the lower-left corner
• Tag-based filtering system for different station types
• Secure password protection with salted hashing (optional)
• Session management with auto-logout

Screenshots

Below are sample screenshots of Link Launcher in action:

Main Launcher View

Login Screen

Usage

Clock & Internet Status

• The bottom-right of the screen always shows a digital clock for quick reference.
• The bottom-left of the screen displays the current internet connection status ("Connected" or "Disconnected").
• These elements are always visible, even on the login screen, to provide users with real-time time and connectivity feedback.

1. Simply open index.html in any modern web browser
2. Password Authentication: Secure login with a hashed password and salt. Password is currently set to checkin. You can enable or disable password protection using the auth.enabled setting in index.html. If password protection is disabled, you can skip this step.
3. Click on any icon to navigate to the corresponding check-in page
4. Use URL parameters to filter stations by tags (e.g., index.html?tags=kids,self)
5. Click the logout button in the top-right corner to end your session

Project Structure

• index.html - Main HTML file with app configuration
• styles.css - All styling rules and variables
• icons/ - Directory containing SVG icons

Authentication

The launcher includes a secure authentication system that uses SHA-256 hashing with a salt. Configure it in the HTML file:

const auth = {
    enabled: true,    // Set to false to disable password protection
    hash: '0f7549b56c49e3c4b6a3004a07221aac086e5d1eba0b8eb0129f83b9209acb7a', // SHA-256 of 'checkin' + salt
    salt: 'universitydrive',
    sessionDuration: 8 * 60 * 60 * 1000,    // 8 hours in milliseconds
};

To generate a new password hash:

1. Open your browser's developer console
2. Paste and run this code (replace 'your_password' with your desired password):

async function generateHash(password) {
    const salt = 'universitydrive'; // Must match the salt in auth config
    const encoder = new TextEncoder();
    const data = encoder.encode(password + salt);
    const hashBuffer = await crypto.subtle.digest('SHA-256', data);
    const hashArray = Array.from(new Uint8Array(hashBuffer));
    return hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
}
generateHash('your_password').then(console.log);

3. Copy the generated hash into the auth.hash field

Authentication Features

• Enable/disable password protection
• Secure password storage using SHA-256 hashing
• Added salt for extra security
• Session persistence (stays logged in for 8 hours by default)
• Automatic logout when session expires
• Manual logout option
• Clean login overlay with error handling

Customization

Edit the apps array in the <script> section of index.html to modify the launcher icons and their destinations. Each app entry should have:

• name: Display name
• icon: Path to icon image in the icons directory
• url: Destination URL
• tags: Array of tags for filtering (e.g., ['granger', 'kids', 'self'])

Tag System

The launcher uses a tag-based filtering system to show specific station types. Tags are added to each app in the configuration array and can be filtered using URL parameters.

Available Tags

• Location: granger, elkhart
• Type: kids, students, generic
• Mode: self, attended

Filtering Examples

• Kids Self Check-in: index.html?tags=kids,self
• Attended Stations: index.html?tags=attended
• Elkhart Kids: index.html?tags=elkhart,kids

TODO

• Generic icons
• password protect entire launcher
• password protect specific apps or tags
• rename project

Originally developed by Justin Moore, Granger Community Church.