Netpadd B (Alpha)

Disclaimer: Netpadd is provided as is and comes without any warranties, use at your own risk! This is an early release, alpha version.

Netpadd B is a free text editor in particularly useful for plain non-cluttered and fast code editing, but also useful for all other text editing needs. Netpadd B is created in the form of a free browser-based application running as a Google Chrome "Application Shortcut" (it also works in some other browsers like Firefox/ Prism). You can install it locally or on your server; the HTML/JS/CSS front-end communicates via Ajax with the PHP5 back-end. On your server, Netpadd lets you manage text files (and upload other types of files) without FTP. Netpadd B is the cousin of older Netpadd, which was a compiled desktop app. Not needed for Netpadd B are MySQL, Flash, or Java.

Hovering over the wrench icon will expand the toolbox.

Setup

First, download the whole thing (v0.751).

Setup steps on the Windows desktop:

1. Install WAMP (a Windows Apache/ MySQL/ PHP installation.

2. If you haven't already, install Chrome.

3. Drop the "netpadd" folder in your localhost directory and make sure it can be run at http://localhost/netpadd/ (also see footnote*)

4. In Netpadd's "tools" folder, connect your preferred text/ code file extensions using the .reg (regedit) routines. For instance, open associate-several-filetypes.reg with a text editor, adjust the part where it says "philipp" to point to your own installation of Chrome, save & run the file.

5. You should now be able to double-click your text files, and see them being opened automatically with Netpadd B (if not, please drop me an email). Note some parts of the program may need web access (like the syntax lookup feature, which uses Google).

Setup when using the program on your server:

1. Create a password-protected sub-directory on your server, drop the Netpadd files into it; careful, anyone with access to that directory can edit your server's file, upload programs, etc. -- it's similar to giving someone full access to your FTP via your FTP credentials. Note that Netpadd will check for the availability of an .htaccess file in its folder via the "usesCorrectAuthentication()" function in site.php5

2. If you haven't already, install Chrome (Firefox should also do, but is not as speedy at times; other browsers are untested)

3. Access that folder via https, e.g. https://example.com/administration-with-netpadd/ (also see footnote*) -- if you wish to not use https (not suggested for security reasons), edit the line "$mustUseSSL = true" in site.php5

*Ensure that index.php is a default file for a directory -- also see tools/.htaccess -- and that you're running PHP5.

Program features explained

To open Netpadd's menu, hit Ctrl + X or hover your mouse over the wrench icon in the top right. Other shortcuts will be listed in a tooltip when you hover over the toolbox items.

• New, Open, Save and Save As should be kind of self-explanatory. It's worth noting that Open will launch the file explorer which lets you do more than just opening a file: you can also click the icons in its top right to create a directory, or upload a new file into the currently shown folder.

  

• Revert: This will restore the last saved version of your file, i.e. make undone all changes you did since you last saved.

• Save backup, Load backup: This will save (and restore, respectively) a redundant copy of whichever text you're working on, without changing your current working copy's file name/ path/ saving status. This comes in handy if e.g. you briefly want to explore a new direction for your code but you are aware that you may need to roll-back your changes if that route turns out to be unsuccessful. Note that there will be only one shared backup file for all your Netpadd app windows, so you'll overwrite your last backup if you create a new backup. (The file is backed up into data/backup.netpadd, make sure you don't share that folder with anyone if your backups contain sensitive data.)

• Escape HTML: this will turn e.g. "<p>hello world</p>" into "<p>hello world</p>".

• Wrap with tag: This will put a custom opening and ending tag around your selection, e.g. if your selected text reads "foo" and you choose to wrap it with "blockquote", the result will be "<blockquote>foo</blockquote>".

• Syntax help: Just hit F1 immediately after a word you typed, and a special Google search for that word will be launched. "Special" because the search may be restricted to e.g. just php.net (among other query details) if you're editing a PHP file. The result will then be printed as a yellow alert at the bottom of the window. For instance, when editing a PHP file -- as PHP does not have a consolidated syntax when it comes to things like parameter order or function names -- you could type "strpos", hit F1. and the help will read something along the lines of "int strpos ( string $haystack , mixed $needle [, int $offset = 0 ] )" to assit you.
  For cases where your selection is a CSS color, F1 will open a color info box instead, converting RGB to Hex (and vice versa) and showing a color preview.

• Count letters: This will count how many letters (any letter, number etc.) your select string contains. For "foo", it would result in 3.

• Select part: Depending on where your text cursor is currently positioned, this will select some of the stuff surrounding it. For instance, if your cursor is the pipe in "<p>hello| world</p>", then "hello world" would be selected. This feature allows you to quickly mark and then replace or copy element contents, tags, tag attributes, or double or single quoted content.

• Translate: This will translate your selection into English (or if it's English, then into Chinese), using Google's nonperfect but highly usable automatic translation.

• Transform: This lets you apply a variety of text transformations to your selection -- UPPER CASE, Mixed Case, Mixed Case for Titles, lower case, and Flipped.

• Find, Replace: These should be self explanatory except for one thing: To replace or search for line breaks, enter "^r". Enter "^t" for tabs. Also, note that hitting F3 will continue your current search.

• Jump to row: Hit F2 and you will be asked which row (of your programming code I presume) you want to jump to.

• Delete lines: This allows you various methods to automatically convert certain text files, often useful for casually editing larger portions of HTML, CSV etc. data (for instance, you may want to remove all lines in a given copied HTML file which contain the tag "<blockquote>"...).

• Open browser, Open Google: This opens a new browser window, or a new window with Google.com loaded, respectively.

• Insert character: This opens a searchable Unicode table. This table shows a selection of, and not all, Unicode characters. Click on Find and enter something like "arrow" to find all characters which contain the word "arrow" in their name.

  

• Toggle Line Wrap: This switches between line breaks and lines flowing outside the right.

• About: Here you can find out more about the version of the program as well as the current URL your browser is using, in case you're working on an Application Shortcut or Prism app which doesn't contain an address bar.

Known issues I haven't found solutions for yet

• When turning line wrapping on, things like your document search results may not be scrolled into view correctly.

• Sometimes when opening a file on Windows using Netpadd, the file won't be immediately focused, but quietly sit in the task bar waiting for you to click on it. I haven't found a solution for this yet.

• In the "Open With" file context menu on Windows, the application will be named "Google Chrome" (with a Chrome icon) instead of "Netpadd B"

• Sometimes startup time is a bit long

• Cannot disable Ctrl + W (close app) shortcut on Chrome

• Cannot read clipboard content in Chrome, would be nice for pasting a URL with Ctrl + Q

Want to add features to Netpadd?

This section isn't a tutorial but simply a tip to get you started on your own: If you know JavaScript and want to add your own menu entry to the program, open the file "default.js". Search for the string "handleReplace" and follow the calls from there to get an idea of how the program works. If you have questions or cool additions, please email me.

Credits

Thanks to David Mulder for giving feedback about Netpadd B!

Some icons are Creative Commons licensed by FamFamFam and FatCow. The Doid font is based on Google Android's Droid font, with some readability optimizations made in regard to programming characters like semicolon, comma etc. (optimizations on my specific system at least, using a laptop with ClearType disabled). I originally wanted to use Fixedsys but Chrome doesn't recognize that system font at the moment, and the TrueType replacements didn't have the same effect. Thanks to everyone who gives feedback on the program. The synonyms come from Thesaurus.com. The translation and syntax lookup is handled via the Google APIs. Chinese characters to Pinyin conversion is done via Chinese-Tools.com. Gadgets come from a variety of sources via iGoogle.com.