jquery.knobby.js is a jQuery-plugin for creating turning knobs Witz javascript. Die Knöpfe sind für Eingaben mit Maus und Tastatur aber auch für Touch-Devices geeignet.



Calling $("input[name='...']").knobby(); converts a HTML form input into a round knob, which allows value adjustment by rotation movements of the mouse or with your finger on touch devices.


Some HTML attributes are supported:
min, max, step and turn. The attributes min and max define the boundaries – the value of max should be larger than the min value for the button to work properly.

step allows you to adjust the smallest possible step size. For example, with step="10" values always will change in steps of tenths on the other hand step=".5" will allow you to step in values of halfs. The default is “1” so in order to have decimal places it is required to set a step-size.

With the turn attribute you can define the number of total rotations. The default setting is one turn (turn=1). With a value of turn=".5" the button only allows for half a turn whereas with a value of turn="10" the knob rotates ten full circles.

With these two settings a wide variety of desired precisions are possible:
for smaller valuis with litte precision a lower turn value is possible – for a broader scale with high precision requirements a higher turn value is probably more suitable.

The size of appearance can be adjusted with the size attribute.
It’s using EM values internaly. So by saying size=5 the knob appears five times the size of a normal row of text.

An option for logarithmic scaling of values is currently in planning (so higher values lead to higher step sizes) – it should also be improved in the future to allow for multiple touches at different knobs.

You can see the demo to see the plugin in use. The complete source code is available at Github (under MIT license).

Base64-Noise-Generator is a small web tool to create base-64 CSS background noise images as PNG.



Colors and intensity as well as the dimensions of the image are freely configurable. By default 8-bit color depth is enabled – you can change it to 24-bit image, but it is not recommended to do so:
the 8-bit flavour is less than half the size most of the times. And also there is no way to blend from one color into another with more than 255 steps (in 24-bit colors). So the quality of the images is the same.

The randomness is not quite perfect. Ideas for improvements are very welcome. But I think you can already get useful results if you adjust the values and generate certain times until you get a nice look.

Update: The full source code of the tool is available on Github.

Tagged with: , ,

Transpozr is a small web application for transposing chords of a song easily (altogether with the lyrics).



Just paste the chords in the input area on the left. The plus and minus buttons in the middle are for setting the half-tone steps you want the chords to be transposed to. The result will appear immediately on the right side.

Das JavaScript-Programm, befindet sich in einer frühen Version. Aber leistet zumindest mir schon jetzt gute Dienste.

Derzeit geht das Tool beim Transponieren eher riguros vor und unterscheidet nicht zwischen verschiedenen Tonarten (zB.: ein C# und ein Db werden genau gleich behandelt und eventuelle Unterschiede gehen beim Transponieren verloren). Eventuell wird es in Zukunft eine Version geben, die die aktuelle Tonart erkennen kann und entsprechend richtig transponiert.

In dieser Version wird außerdem nur englische Notation unterstützt, das heißt ein deutsches H entspricht einem englischen B und ein deutsches B entspricht dem englischen Bb.

Tagged with: , , ,