Started a basic Electron app project; adding simple LDAP binding functionality

This commit is contained in:
Gregory Ballantine 2022-05-21 17:01:08 -04:00
parent 1dff60594f
commit 88c00043b7
12 changed files with 2181 additions and 48 deletions

46
.gitignore vendored
View File

@ -1,45 +1 @@
# ---> Java node_modules
# Compiled class file
*.class
# Log file
*.log
# BlueJ files
*.ctxt
# Mobile Tools for Java (J2ME)
.mtj.tmp/
# Package Files #
*.jar
*.war
*.nar
*.ear
*.zip
*.tar.gz
*.rar
# virtual machine crash logs, see http://www.java.com/en/download/help/error_hotspot.xml
hs_err_pid*
replay_pid*
# ---> Maven
target/
pom.xml.tag
pom.xml.releaseBackup
pom.xml.versionsBackup
pom.xml.next
release.properties
dependency-reduced-pom.xml
buildNumber.properties
.mvn/timing.properties
# https://github.com/takari/maven-wrapper#usage-without-binary-jar
.mvn/wrapper/maven-wrapper.jar
# Eclipse m2e generated files
# Eclipse Core
.project
# JDT-specific (Eclipse Java Development Tools)
.classpath

View File

@ -1,4 +1,4 @@
Copyright (c) <year> <owner> Copyright (c) 2022 Bit Goblin
Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met: Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:

View File

@ -1,3 +1,41 @@
# archon # electron-quick-start
Metaunix LDAP user and group manager **Clone and run for a quick way to see Electron in action.**
This is a minimal Electron application based on the [Quick Start Guide](https://electronjs.org/docs/latest/tutorial/quick-start) within the Electron documentation.
A basic Electron application needs just these files:
- `package.json` - Points to the app's main file and lists its details and dependencies.
- `main.js` - Starts the app and creates a browser window to render HTML. This is the app's **main process**.
- `index.html` - A web page to render. This is the app's **renderer process**.
You can learn more about each of these components within the [Quick Start Guide](https://electronjs.org/docs/latest/tutorial/quick-start).
## To Use
To clone and run this repository you'll need [Git](https://git-scm.com) and [Node.js](https://nodejs.org/en/download/) (which comes with [npm](http://npmjs.com)) installed on your computer. From your command line:
```bash
# Clone this repository
git clone https://github.com/electron/electron-quick-start
# Go into the repository
cd electron-quick-start
# Install dependencies
npm install
# Run the app
npm start
```
Note: If you're using Linux Bash for Windows, [see this guide](https://www.howtogeek.com/261575/how-to-run-graphical-linux-desktop-applications-from-windows-10s-bash-shell/) or use `node` from the command prompt.
## Resources for Learning Electron
- [electronjs.org/docs](https://electronjs.org/docs) - all of Electron's documentation
- [electronjs.org/community#boilerplates](https://electronjs.org/community#boilerplates) - sample starter apps created by the community
- [electron/electron-quick-start](https://github.com/electron/electron-quick-start) - a very basic starter Electron app
- [hokein/electron-sample-apps](https://github.com/hokein/electron-sample-apps) - small demo apps for the various Electron APIs
## License
[CC0 1.0 (Public Domain)](LICENSE.md)

3
js/index.js Normal file
View File

@ -0,0 +1,3 @@
window.onload = function(){
document.getElementById('ldapHost').textContent = localStorage.getItem('ldap_hostname');
};

33
js/login.js Normal file
View File

@ -0,0 +1,33 @@
const ldap = require('ldapjs');
window.onload = function(){
document.getElementById('loginForm').addEventListener('submit', loginForm);
};
// do stuff when login form is submitted
function loginForm(event) {
event.preventDefault();
var bindHost = document.forms.loginForm.ldap_host.value;
var bindDn = document.forms.loginForm.bind_dn.value;
var bindPw = document.forms.loginForm.bind_pw.value;
const client = ldap.createClient({
url: 'ldap://' + bindHost + '/'
});
client.bind(bindDn, bindPw, (err) => {
if (err) {
document.querySelector("h1").textContent = 'error';
} else {
document.querySelector("h1").textContent = 'Logged in!';
localStorage.setItem('ldap_hostname', document.forms.loginForm.ldap_host.value);
localStorage.setItem('ldap_bind_dn', document.forms.loginForm.bind_dn.value);
localStorage.setItem('ldap_bind_pw', document.forms.loginForm.bind_pw.value);
window.location.href = 'index.html';
}
});
}

45
main.js Normal file
View File

@ -0,0 +1,45 @@
// Modules to control application life and create native browser window
const {app, BrowserWindow} = require('electron');
const path = require('path');
function createWindow () {
// Create the browser window.
const mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
preload: path.join(__dirname, 'preload.js')
}
});
// and load the index.html of the app.
mainWindow.loadFile('views/login.html');
// Open the DevTools.
// mainWindow.webContents.openDevTools()
}
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.whenReady().then(() => {
createWindow();
app.on('activate', function () {
// On macOS it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (BrowserWindow.getAllWindows().length === 0) createWindow()
});
});
// Quit when all windows are closed, except on macOS. There, it's common
// for applications and their menu bar to stay active until the user quits
// explicitly with Cmd + Q.
app.on('window-all-closed', function () {
if (process.platform !== 'darwin') app.quit();
});
// In this file you can include the rest of your app's specific main process
// code. You can also put them in separate files and require them here.

1959
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

25
package.json Normal file
View File

@ -0,0 +1,25 @@
{
"name": "electron-quick-start",
"version": "1.0.0",
"description": "A minimal Electron application",
"main": "main.js",
"scripts": {
"start": "electron ."
},
"repository": "https://github.com/electron/electron-quick-start",
"keywords": [
"Electron",
"quick",
"start",
"tutorial",
"demo"
],
"author": "GitHub",
"license": "CC0-1.0",
"devDependencies": {
"electron": "^18.2.4"
},
"dependencies": {
"ldapjs": "^2.3.2"
}
}

12
preload.js Normal file
View File

@ -0,0 +1,12 @@
// All of the Node.js APIs are available in the preload process.
// It has the same sandbox as a Chrome extension.
window.addEventListener('DOMContentLoaded', () => {
const replaceText = (selector, text) => {
const element = document.getElementById(selector)
if (element) element.innerText = text
}
for (const type of ['chrome', 'node', 'electron']) {
replaceText(`${type}-version`, process.versions[type])
}
})

5
styles/archon.css Normal file
View File

@ -0,0 +1,5 @@
/* styles.css */
body{
background: pink;
}

20
views/index.html Normal file
View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'">
<link href="../styles/archon.css" rel="stylesheet">
<title>Hello World!</title>
<script src="../js/index.js"></script>
</head>
<body>
<h1>Users Page</h1>
<p id="ldapHost"></p>
We are using Node.js <span id="node-version"></span>,
Chromium <span id="chrome-version"></span>,
and Electron <span id="electron-version"></span>.
</body>
</html>

37
views/login.html Normal file
View File

@ -0,0 +1,37 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'">
<link href="../styles/archon.css" rel="stylesheet">
<title>Hello World!</title>
<script src="../js/login.js"></script>
</head>
<body>
<h1>Login</h1>
<form id="loginForm">
<label>
LDAP Host:
<input type="text" name="ldap_host" placeholder="Enter LDAP host...">
</label>
<label>
Bind DN:
<input type="text" name="bind_dn" placeholder="Enter bind DN...">
</label>
<label>
Bind Password:
<input type="text" name="bind_pw" placeholder="Enter bind DN...">
</label>
<input type="submit" name="bind_submit" value="Login">
</form>
We are using Node.js <span id="node-version"></span>,
Chromium <span id="chrome-version"></span>,
and Electron <span id="electron-version"></span>.
</body>
</html>