Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

TKSwitch and TKToggle combined in TKIncrement #11

Open
wants to merge 2 commits into from

1 participant

@gduverger

Hello,

My name is Georges. First of all, let me tell you how much you inspire my work as a software engineer. Magic Ink is probably the best paper about information software I have ever read.

I discover Tangle a few weeks ago and I am currently using it to redesign a side project of mine called Fitmeal (http://fitmeal.com/).

Regardless, I had the need to click through a list of options instead of just toggle between 0 and 1. I did not find a way to do so with the current TangleKit. I added TKIncrement—could not find a more explicit name for it—to a fork of your project.

I was just wondering if you would have any feedback. This pull request is also just an excuse to say hi and thanks. :)

Cheers,
Georges

P.S. I also added the 'height' format to display feet and inches properly. I should have made that a different commit.

Georges Duve... added some commits
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Dec 8, 2012
  1. Add TKIncrement and height format

    Georges Duverger authored
  2. Add TKIncrement style

    Georges Duverger authored
This page is out of date. Refresh to see the latest.
Showing with 29 additions and 2 deletions.
  1. +2 −1  TangleKit/TangleKit.css
  2. +27 −1 TangleKit/TangleKit.js
View
3  TangleKit/TangleKit.css
@@ -19,7 +19,8 @@
/* TKToggle */
-.TKToggle {
+.TKToggle,
+.TKIncrement {
color: #46f;
border-bottom: 1px dashed #46f;
cursor: pointer;
View
28 TangleKit/TangleKit.js
@@ -85,6 +85,29 @@ Tangle.classes.TKToggle = {
//----------------------------------------------------------
//
+// TKIncrement
+//
+// Click to increment value (modulo the number of options).
+
+Tangle.classes.TKIncrement = {
+
+ initialize: function (element, options, tangle, variable) {
+ element.addEvent("click", function (event) {
+ var value = tangle.getValue(variable);
+ tangle.setValue(variable, ++value % element.getChildren().length);
+ });
+ },
+
+ update: function (element, value) {
+ element.getChildren().each( function (child, index) {
+ child.style.display = (index != value) ? "none" : "inline";
+ });
+ }
+};
+
+
+//----------------------------------------------------------
+//
// TKNumberField
//
// An input box where a number can be typed in.
@@ -288,8 +311,11 @@ Tangle.formats.percent = function (value) {
return "" + (100 * value).round(0) + "%";
};
+Tangle.formats.height = function (value) {
+ return Math.floor(value/12) + "′" + value%12 + "″";
+};
+
-
//----------------------------------------------------------
})();
Something went wrong with that request. Please try again.