There Is No Going Back

Listing 2 defines the currently displayed photo's image tag in line 11 with the id attribute of image. This makes it easy for the renderer process to find it later and replace it with a new photo, if the user commands this via keyboard input.

Figure 4 shows the finished application. In it, you can delete an image by pressing D, move to the next one with L, or go back to the previous one with H if you change your mind. However, there is no undelete – that would not make sense in Unix philosophy.

Figure 4: The iNuke app on Ubuntu.

The application is shut down either by the user closing the window or – as usual under Gnome – by pressing Ctrl+W. These events are intercepted by the event handlers will-quit or window-all-closed. They release the key bindings and call the application's quit() method, which releases all occupied resources.

The renderer process in Listing 3 uses the blueimp image library. This presupposes that the user previously installs it using

npm install blueimp-load-image --save

from the npmjs.com Node.js repository. The npm package manager notices the new addition in the local package.json file's dependency list, ensuring that curious adopters only have to clone the project and call npm install to retrieve and install all the modules on which the project depends.

The photo files, which were read using readdir() from the images directory (line  40) when the program started, are stored by the program in the global images array variable. The images_idx variable (line 6) remembers the index of the currently displayed image within the array.

Fielding Signals

The scroll() function from line 19 expects the direction (1 for forward, -1 for back) in which the user wants to shift through the collection as a parameter. It then sets the global variables to the new photo to be displayed and ensures that no one moves outside the boundaries of the array in the body of the function.

Lines 51 and 52 in the renderer process receive the signals triggered by the main process from Listing 1. The handlers trigger when the user presses the corresponding key. Line 53 reacts to the keypress D in the main process and jumps to the deleteImage() function from line 29 when activated. The Node.js unlink() method from the fs class mercilessly removes the file from the disk and displays the next photo.

Loading Photos

Loading a photo from disk and displaying it in the browser window is the task of the displayImage() function from line  8. It uses the loadImage() function exported by the blueimp library from the NpmJS repository to load the photo. The scale() method then scales it to a maximum width of 600 pixels. The renderer then searches the browser's HTML for an image tag with the id attribute image and replaces the image found there with the new image (line 15). Before this, Listing 3 also sets the new image's id attribute to image so that the refresh process will find the tag next time.