A modular JavaScript utility library designed for scalable, efficient web development.
npm install @lcsng/tools
`
> ✅ When using via CDN, all exports are available under the lcsTools global object.
---
$3
`bash
npm install lcs_tools
`
Then in your code:
`js
// ESModule
import { getCurrentLocation } from 'lcs_tools';
// CommonJS
const { getCurrentLocation } = require('lcs_tools');
`
---
🚀 Usage Examples
$3
Fetch the current browser location with graceful fallback:
`js
lcsTools.getCurrentLocation()
.then((locationText) => {
console.log('Your location:', locationText);
})
.catch((err) => {
console.warn('Location error:', err);
});
`
Returns a promise that resolves to:
`plaintext
12 Yemi Car Wash Off Freedom Way, Itedo, Lekki Phase I, Lagos State, Nigeria
`
---
🔢 OTP Input Validation
Purpose:
Manages OTP (One-Time Password) inputs with seamless auto-focus and input aggregation.
Features:
- Supports digit-only input
- Automatically jumps to the next field on valid input
- Moves to the previous input field on backspace
- Aggregates all inputs into a hidden field for submission
Expected HTML Structure:
`html
`
Notes:
- The final OTP string is automatically inserted into the hidden input field.
---
🔐 Password Visibility Toggle
Purpose:
Allows toggling of password fields between text and password, improving user experience during login or sign-up.
Features:
- Click to show/hide password
- Dynamically changes the toggle button text (Show / Hide)
Expected HTML Structure:
`html
`
Notes:
- The button label updates automatically.
- Works on dynamically added elements too.
---
📍 Geolocation + Reverse Geocoding
Purpose:
Fetches the user's current location, converts it to a human-readable address using OpenStreetMap’s Nominatim API, and inserts it into a specified field.
Key Features:
- Fully custom modal alert for user interaction
- Geolocation permission awareness
- Reverse geocoding to address string
- Compatible with both input fields and contentEditable elements
- Input fallback on failure
Expected HTML Structure:
`html
`
Usage Flow:
1. User clicks the button with class lcsGetCurrentLocation.
2. A custom modal appears asking for permission (if required).
3. On approval, the location is fetched and resolved to a readable address.
4. The address is inserted into the targeted input or editable field.
Permissions Handling:
- Detects if permission is already granted, denied, or needs to be asked.
- Displays custom prompts accordingly.
APIs Used:
- navigator.geolocation for coordinates
- OpenStreetMap's Nominatim Reverse Geocoding API for address resolution
Failure Scenarios:
- Geolocation unsupported
- Permission denied or dismissed
- No internet connection
- Input field target not found
Fallback:
If the address can't be fetched, the input is reset to its previous value.
---
💡 Best Practices
- Make sure each tool is wrapped in appropriate HTML structure.
- These tools rely on event delegation, so dynamic elements are supported out of the box.
- Use minimal styling overrides to ensure visual consistency if customizing the modals.
---
🧩 Integration Example
`html
`
$3
Will support file upload with:
- progress tracking
- size/format validations
- server endpoint options
Stay tuned.
---
📁 Project Structure
`
lcs_tools/
├── dist/ # Bundled, obfuscated output
│ └── lt.min.js
├── src/ # Source modules
│ ├── index.js # Main export entry
│ ├── location.js # Location utility
│ ├── password.js # Password toggle
│ └── ...more coming
├── webpack.config.js # Build + Obfuscation
├── jsdoc.json # Auto documentation
├── package.json
└── README.md
`
---
🧑💻 Contributing
Want to add a utility or improve one?
`bash
git clone https://github.com/lcsnigeria/lcs_tools.git
cd lcs_tools
npm install
npm run build
`
All source files live in /src. Just export any new functions or classes from index.js to include them in the final build.
> ✅ Contributions should be modular and documented using JSDoc comments.
---
📄 Documentation
Auto-generated from source using JSDoc. Build with:
`bash
npm run build
`
This will generate the HTML docs in a docs/ folder (optionally host via GitHub Pages later).
---
📈 Versioning
Versioned using standard-version:
`bash
npm run release
``