Merge branch 'test/remember-things'

main.js

@@ -1,60 +1,57 @@
-// Modules to control application life and create native browser window
 const { app, BrowserWindow } = require('electron')
-const debug = require('electron-debug');
-debug();
+require('electron-debug')();
 
-// Keep a global reference of the window object, if you don't, the window will
-// be closed automatically when the JavaScript object is garbage collected.
+/**@type {BrowserWindow} */
 let mainWindow
 
-let components = []
+/**@type {Set<BrowserWindow>} */
+let notes = new Set()
 
-function createWindow() {
+
+function initialize() {
  // Create the browser window.
  mainWindow = new BrowserWindow({
- width: 1,
- height: 1,
- y: -1,
- x: -1,
+ //x: -1, y: -1, width: 1, height: 1,
  transparent: true,
  frame: false,
+ x: 100, y: 100, height: 100, width: 100,
  webPreferences: {
  nodeIntegration: false
  }
  })
  mainWindow.setIgnoreMouseEvents(true)
 
 
- for (let i of [1]) {
- let component = new BrowserWindow({
- x: 30,
- y: 30,
+ for (let i of [1, 2]) {
+ let note = new BrowserWindow({
+ x: 30 + i * 100,
+ y: 30 + i * 100,
  width: 300,
  height: 300 + 32,
- transparent: true,
+ transparent: false,
  frame: false,
- backgroundColor: '#000',
- parent: mainWindow
+ backgroundColor: '#f0f',
+ parent: mainWindow,
+ webPreferences: {
+ nodeIntegration: true
+ }
  })
- component.loadFile('note.html')
- components.push(component)
- }
-
+ note.noteid = i
+ note.loadFile('note.html')
 
+ note.on('closed', () => {
+ notes.delete(note)
+ if (!notes.size) mainWindow.close()
+ })
+ notes.add(note)
+ }
 
- // Emitted when the window is closed.
  mainWindow.on('closed', function () {
- // Dereference the window object, usually you would store windows
- // in an array if your app supports multi windows, this is the time
- // when you should delete the corresponding element.
  mainWindow = null
  })
 }
+app.on('ready', initialize)
 
-// 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.on('ready', createWindow)
 
 // Quit when all windows are closed.
 app.on('window-all-closed', function () {
@@ -71,7 +68,4 @@ app.on('activate', function () {
  if (mainWindow === null) {
  createWindow()
  }
-})
-
-// 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.
+})

note.html

@@ -5,12 +5,11 @@
  <style>
  * {
  box-sizing: border-box;
- border: 0;
+ border: none;
  padding: 0;
+ margin: 0;
  }
 
-
-
  html, body {
  width: 100%;
  height: 100%;
@@ -19,8 +18,8 @@
  }
 
  body {
- /*box-shadow: 0 0 10px #719ECE;
- border: 1px solid gray;*/
+ /*box-shadow: 0 0 10px #719ECE;*/
+ /*border: 1px solid gray;*/
  display: grid;
  overflow: hidden;
  grid-template-rows: 32px minmax(0,1fr)
@@ -32,10 +31,10 @@
  display: grid;
  background-color: #50ffc4;
  grid-template-columns: minmax(0,1fr) auto;
- -webkit-user-drag: none;
  }
 
- header * {
+ header, header * {
+ -webkit-user-select: none;
  -webkit-user-drag: none;
  }
 
@@ -70,8 +69,8 @@
  }
 
  button:focus::after {
- content:'';
- display:block;
+ content: '';
+ display: block;
  position: absolute;
  left: 0;
  right: 0;
@@ -105,14 +104,36 @@
  <header>
  <div id="window-handle"></div>
  <div id="window-toolbar">
- <button onclick="alert('exit')">
+ <button onclick="close_window()">
  <img src="exit-icon.png" style="width:100%;height:100%; object-fit:contain" />
  </button>
  </div>
  </header>
  <section id="content">
- <textarea></textarea>
+ <textarea onchange="save()"></textarea>
  </section>
-</body>
 
+ <script>
+ const { remote } = require('electron')
+ const id = remote.getCurrentWindow().noteid
+ /**@type{HTMLTextAreaElement} */
+ const textContentElement = document.querySelector('#content textarea')
+
+ load()
+ console.log(`note ${id} opened`)
+
+ function load() {
+ textContentElement.value = localStorage[id] || ''
+ }
+
+ function save() {
+ localStorage[id] = textContentElement.value
+ console.log(`note ${id} saved`)
+ }
+ function close_window() {
+ remote.getCurrentWindow().close()
+ }
+
+ </script>
+</body>
 </html>