LDC Via Client

A static web application for accessing and managing LDC Via API instances. This client provides a user-friendly interface to browse databases, collections, and perform CRUD operations on documents.

Features

• API Configuration: Easy setup with API base URL and key
• Database Browsing: Navigate through databases and collections
• Document Management: Create, read, update, and delete documents
• User Details: View current user information and permissions
• Responsive Design: Works on desktop and mobile devices
• Local Storage: Saves API configuration for future sessions

Getting Started

Prerequisites

• A running LDC Via API instance
• Valid API key for authentication
• Modern web browser with JavaScript enabled

Installation

1. Clone or download this repository:

   git clone <repository-url>
   cd ldc-via-client

2. Serve the files using a local web server:

   Using Python:

   python -m http.server 8000

   Using Node.js:

   npx serve .

   Using PHP:

   php -S localhost:8000

3. Open your browser and navigate to http://localhost:8000

Configuration

1. Click "Setup Connection" or the Settings button
2. Enter your API base URL (e.g., https://api.example.com/2.0)
3. Enter your API key
4. Click "Test Connection" to verify the connection
5. Click "Save" to store the configuration

Usage

Navigating Data

• Databases: Click on a database card to view its collections
• Collections: Click on a collection card to view its documents
• Documents: Click the edit button to modify a document, or delete button to remove it

Creating Documents

1. Navigate to a collection
2. Click "Add Document"
3. Fill in the document ID and form type
4. Add field values using the form
5. Click "Add Field" to add custom fields
6. Click "Save" to create the document

Editing Documents

1. Click the edit button (pencil icon) on any document
2. Modify the field values as needed
3. Click "Save" to update the document

API Compatibility

This client is designed to work with LDC Via API v2.0 and supports the following endpoints:

• GET /databases - List databases
• GET /collections/{database} - List collections
• GET /collections/{database}/{collection} - List documents
• GET /document/{database}/{collection}/{id} - Get document
• PUT /document/{database}/{collection}/{id} - Create document
• POST /document/{database}/{collection}/{id} - Update document
• DELETE /document/{database}/{collection}/{id} - Delete document
• GET /userdetails - Get user details
• GET /metadata/{database}/{collection} - Get collection metadata

File Structure

ldc-via-client/
├── index.html          # Main HTML file
├── css/
│   └── styles.css      # Application styles
├── js/
│   ├── api-client.js   # API communication layer
│   ├── ui-components.js # UI components and utilities
│   └── app.js          # Main application controller
├── assets/             # Static assets (images, etc.)
└── README.md           # This file

Browser Support

This application requires a modern browser that supports:

• ES6+ JavaScript features (async/await, classes, arrow functions)
• Fetch API
• CSS Grid and Flexbox
• Local Storage

Supported browsers:

• Chrome 60+
• Firefox 55+
• Safari 11+
• Edge 79+

Security Considerations

• API keys are stored in browser local storage
• All API communication should use HTTPS
• The API server must have appropriate CORS headers configured
• Consider implementing additional authentication layers for production use

Development

Making Changes

1. Edit the HTML, CSS, or JavaScript files
2. Refresh the browser to see changes
3. Use browser developer tools for debugging

Adding New Features

• API Client: Add new methods to js/api-client.js
• UI Components: Add new UI functions to js/ui-components.js
• App Logic: Add new application logic to js/app.js
• Styling: Add new styles to css/styles.css

Troubleshooting

Connection Issues

• Verify the API base URL is correct and accessible
• Check that the API key is valid and has appropriate permissions
• Ensure the API server has CORS headers configured
• Check browser console for error messages

CORS Errors

If you encounter CORS errors, the API server needs to be configured with appropriate headers:

Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS
Access-Control-Allow-Headers: Content-Type, apikey

Local Storage Issues

• Clear browser data if configuration seems corrupted
• Check browser privacy settings that might block local storage
• Use private/incognito mode to test with clean storage

Contributing

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Test thoroughly
5. Submit a pull request

License

This project is licensed under the MIT License - see the LICENSE file for details.