Tuesday, October 23, 2012

TypeR gets copy and paste

Two new features of TypeR 1.1 i want to discuss right now are copy and paste. Everyone knows what that is, right? You have some toolbar buttons, and also keyboard shortcuts. If you have something selected, it copies the selection, or pastes over it. Well, TypeR isn't that advanced - yet. I'd like it to be in the future, but i'm not thinking too much about that yet.

Copy

Copy only has a button right now. I wanted to implement a keyboard shortcut (the classic ctrl+c), but the platform i'm using to support copy doesn't seem to be able to work with a keyboard shortcut. I contacted the developer, but he hasn't gotten back to me yet. I'm using the zClip jQuery extension.

Anyways, as you can see if you look at the alpha, the button says "copy all". You're thinking, what, i can't copy only what i selected? I'm afraid not. Don't worry, this button is still extremely useful! In 1.0, people had to carefully select all the text, which is in itself prone to errors, and then copy. In 0.1.0, people couldn't even press the keyboard shortcut, due to a bug fixed in 0.1.1! They had to right-click and copy from there. Sometimes the cursor would tag along with the copied text, which is obviously annoying. (Instead of using an actual cursor, i use a pipe ( | ) that was programmed to flash.
Now, it's just one click of a button!

Paste

Now, interestingly enough, paste is the opposite of copy - it only has a keyboard shortcut. There's a button, but it only works in IE. In other browsers, it gives you a message: Sorry, but your browser doesn't allow this button due to security. Please press ctrl+v instead. Here, it will paste at the location of the cursor. If something is selected, it won't over-write it, though. Selecting isn't really supported except for native browser implements.

Warning: technical description in this paragraph. When the paste button is clicked, it sniffs for the window.clipboardData object. Why not just check if it's IE? A) Not all versions of IE might support it; B) Other browsers might eventually support it. If it's not supported, it gives the alert. If it is, it calls the same function that the shortcut does. I'll expound on this after i tell how the shortcut works.
When ctrl+v is pressed, a paste event is automatically sent to the browser. I didn't take advantage of this, and simply check whether ctrl+v is pressed when a key event is sent. Whatever. A non-visible, but not hidden, <input type="text" /> is focused now, before the event finishes running. How is it invisible but not hidden? By setting the width to 1px, so it doesn't take up space, and opacity to 0, so that you can't even see the 1px. After 20 milliseconds, which should be long enough for it to be pasted, the input loses focus, which fires the onchange event. Now this is where it gets parsed. The function called now reads the contents of the input. For each item, it adds it as a character (without saving the revision). When done, it updates (saving the revision). Then, so that new pastes aren't appended to the previous ones, it clears the input.
In IE, pressing the button fills the input with the contents of the clipboard. This calls onchange, and i already explained what happens then.

Summary

So, i'm posting this to let you know more about what's coming pretty soon. But, i'd also like some coding help with these. If anyone knows how to fire zClip for an element through code, or if anyone knows ways for other browsers to access the clipboard, please comment, or email it to me. Thanks, everyone!

Undo/redo philosophy

Last week i said i would make this post "soon", but then it slipped my mind. So, here it is.

I'm adding undo/redo to TypeR 1.1. That much is confirmed. What i want your feedback on is this: how often should i add to the revision list? I came up with a few options:
  • Every single modification is saved. This means every time you add or delete a letter, add, remove, or change a vowel, just everything. Most programs don't do that. However, it's the easiest to program, so that's what it is right now.
  • Saved every second. Every second, it saves the current revision. For obvious reasons, it would filter out revisions that are the same as the previous. If you made a small change, such as adding a letter, then deleted it before the second was over, it wouldn't be saved. This could be good or bad. But, if you pasted something, then accidentally undid (so now it's not saved), then you copied something else, it could be bad.
  • Every major change is saved. Every time there's a big change (such as 5 letters different, a paste, or clear), it gets saved. I don't really like this, because it means small changes aren't ever recorded.
  • All 3 combined! This is my favorite idea, so right now i'm planning on doing it like this. Let me explain how it works. It keeps a temporary list of every modification for each second. However, if there is a major change, saves how it was before the major change, the major change, then restarts the second. If the before and after are the same, but there are changes in the middle, it picks the largest change to save.
What do you think?
I'm waiting for a bit of feedback on this before reprogramming it.

Tuesday, October 16, 2012

Alpha testers wanted for TypeR 1.1.

Although it's only been a little more than a month since the release of TypeR 1.0, development is hard at work on the next version, 1.1.
This is how how it looks right now, at 6PM +2UTC, October 16.

From the release notes:
  • Added clear text button
    • ESC key is a shortcut for this
      • This worked in 1.0 as well
  • Added a copy all button
  • Redo and undo
  • Prompt before leaving the page
  • Reduced filesize by changing HTML onclick attributes to jQuery
 So what does this mean? I'll go over each new feature:

Clear text

This seems simple enough to understand. Whatever you had written disappears. I have a keyboard shortcut to do this as well: escape. This keyboard shortcut works even in 1.0, but at the time i was still considering how best to have a button. In the end i decided to put the buttons on the right of the header, as you can see.

Copy all

This button copies what you've written to your clipboard. I wanted to have a keyboard shortcut, ctrl+c (the traditional shortcut for copying), but couldn't do to technical difficulties. In Firefox, and perhaps other browsers, you cannot use browser keyboard shortcuts until after clicking somewhere, but in Chrome you can. I'm still looking for a fix.
Technical information: This uses the zClip jQuery plugin.

Undo/redo

I'm sure you've heard of these before; it's a must in every good program, such as TypeR. They also support the classic shortcuts, ctrl+z and ctrl+y. The undo button is disabled if there are no previous edits, and redo if there are no undone edits. I'm not sure exactly how i should save revisions. Should i save every single change? Group some changes together? I'll blog more about this soon, and then we can discuss it in the comments.

Prompt before leaving the page

I'm sure this has happened to everybody: You're working on something, when somehow your mouse floats over and clicks close, or else you press the wrong keyboard shortcut. Oh no! All your unsaved work just got closed without saving! Except that rarely happens in good programs, because of a dialog that appears before it closes: Are you sure you want to close without saving? Close Save Cancel. This has now come to TypeR as well! In every browser it will warn you before leaving the page (HTML event unbeforeunload), whether by closing, refreshing, or going to a different URL, and in some it will even give you a personal message: Are you sure you want to leave TypeR? You will permanently lose your text. Since TypeR isn't a program with save features, being unnecessary, it has this. I'm considering not showing if you copied out less than 10 seconds ago. What do you think?

Reduced filesize by changing HTML onclick attributes to jQuery

Technical information: In 1.0, i started using jQuery for a bunch of things. One thing i did not use it for was when a virtual key was clicked. Instead i used HTML onclick, which got very repetitive. By switching all the ordinary keys to a single jQuery method, i reduced the HTML file by 1172 bytes (1.14 KB). That's pretty nice!


After all this, i'm sure you're eager to start playing with these new features. Well, you can! I'm opening it for alpha testing now. You can find it here: http://www.typeint.com/typer/index.php?version=1.1

Please give me your feedback, whether by on a comment on this blog, or by emailing me.

Thanks!

Friday, October 5, 2012

A new product for web developers - critical.js

critical.js is a JavaScript library containing methods added to the default objects which i deemed important, and difficult to create quality projects without. Most of these methods i coded myself, but a couple i borrowed from elsewhere on the net. These are marked with an asterisk (*) linking to the original source. Some i use myself, such as String.reverse, others, such as Array.map, not so much. Whether i use them or not, i hope you find them useful.

Right now, it's in beta stage. Which means... i'd like beta testers! Simply use it in a script, and make sure that it all works. :)

You can include it in the following manner: <script type="text/javascript" src="http://typeint.com/products/critical-min.js"></script>

For a documentation, please visit the non-minified version of the library.

Wednesday, October 3, 2012

Looking for a translator

I would really appreciate it if someone would take a few minutes of their time to translate the keyboard for me. In 1.1, i want to have a localized keyboard, so the key labels can be viewed in Hebrew or English.
I'd like the following translated:
  • space
  • ctrl+alt
  • shift
  • caps lock
  • tab
  • enter
  • backspace
  • remove nikud
  • page up
  • page down
  • home
  • end
  • delete
To whoever donates their effort, thank you so much!

You can either email me (webmaster@typeint.com) or comment on this post.

Fixed some bugs - 1.0.1

I found some bugs in TypeR 1.0. Today i decided to take a few minutes and fix them. The bold bullets are the original release notes, and the notes after that are explanations.
  • Fixed a bug stopping vowels being added to א,ה,ח,ע
    •  This bug came about because i was originally trying to stop a chataf-nikud being added to any but those letters. However, i got sidetracked, and "fixed" the code so that it wouldn't break -- but wouldn't do what i wanted either.
  • Fixed a bug that stopped keyboard styles from being switched
    • I think this was because at the last minute, i changed some HTML, but not the JavaScript references to it.
  • Cleaned up some code
    •  This was code all the way from 0.1, before the website was made! I had the TypeR interface set to shrink if there wasn't enough screen space. This became obsolete once the site format was set, so i just left it in a comment. Comments cost bytes though, so i removed it.
Well, that's it for now.
Just so you know, i'm planning 1.1 already. I'll probably make another post about the features i want in it soon. :)