Permalink
Browse files

Add radio buttons for mode selection.

  • Loading branch information...
1 parent 62a935a commit 09abeb422e35de2cecc09e28722740956facd95a @arcusfelis committed Dec 21, 2012
Showing with 75 additions and 12 deletions.
  1. +46 −1 priv/css_src/relatio.css
  2. +14 −6 priv/html/index.html
  3. +0 −1 priv/js_lib/jquery.jscrollpane.js
  4. +2 −2 priv/js_src/relatio.js
  5. +13 −2 priv/js_src/relatio.world.js
View
@@ -426,6 +426,10 @@ body.world li {
list-style-type: none;
}
+.checkbox {
+ cursor: hand;
+}
+
.checkbox:before {
font-size: 16pt;
position: relative;
@@ -447,7 +451,7 @@ body.shift-pressed .checkbox.will-be-selected {
color: white;
}
-a:focus {
+a:focus, li:focus {
outline-style: none;
background: DarkSlateGray;
}
@@ -476,3 +480,44 @@ a:hover {
width: 5px;
height: 5px;
}
+
+
+.radio input[type=radio] {
+ display: none;
+}
+
+.radio {
+ color: #CCC;
+}
+
+.radio:hover {
+ color: #FFF;
+}
+
+.radio.selected:before {
+ font-size: 16pt;
+ position: relative;
+ content: "\25c9";
+}
+
+.radio:before {
+ font-size: 16pt;
+ position: relative;
+ content: "\25ef";
+}
+
+ul.radio-group {
+ list-style-type: none;
+ margin-left: 0;
+}
+
+input[type=button] {
+ margin: 5px;
+ background: #000;
+ color: #CCC;
+ border: 1px solid #CCC;
+}
+
+input[type=button]:hover {
+ border: 1px solid #FFF;
+}
View
@@ -160,12 +160,20 @@
<a tabindex="0" class="header-opened">Detalize:</a>
</div>
<div class="content-block">
- <fieldset>
- <legend>Nodes:</legend>
- <a>&#x25c9; Visible now</a>
- <a>&#x25ef; Selected</a>
- </fieldset>
- <input type="button" value="Go" />
+ <fieldset>
+ <legend>Nodes:</legend>
+ <ul class="radio-group">
+ <li class="radio selected" tabindex="0">
+ <input type="radio" name="mode" value="selected" checked="checked" />
+ Selected
+ </li>
+ <li class="radio" tabindex="0">
+ <input type="radio" name="mode" value="visible" />
+ Visible now
+ </li>
+ </ul>
+ </fieldset>
+ <input type="button" tabindex="0" value="Go" />
</div>
</div>
</div>
@@ -1389,7 +1389,6 @@
if (jspApi) {
jspApi.reinitialise(settings);
} else {
- $("script",elem).filter('[type="text/javascript"],not([type])').remove();
jspApi = new JScrollPane(elem, settings);
elem.data('jsp', jspApi);
}
View
@@ -724,15 +724,15 @@ $.fn.activateAutoResizeMonitor = function() {
};
$.fn.updateScrolling = function() {
- console.log("upd");
var area = this;
if (area.jspUpdateTimeout)
clearTimeout(area.timeout);
var updateScrollingNow = function(area) {
var jsp = area.data("jsp");
var pane = $(".jspPane", area);
- jsp.reinitialise();
+ if (jsp)
+ jsp.reinitialise();
};
var f = function() {
@@ -687,7 +687,7 @@ relatio.initWorld = function() {
}
break;
}
- if ($("input:focus").length)
+ if ($("input[type=text]:focus").length)
return true;
@@ -793,7 +793,7 @@ relatio.initWorld = function() {
repeatCount = repeatCount || 1;
var cur = $(":focus"),
- set = $(".pane a:visible"),
+ set = $(".pane:visible [tabindex]:visible"),
pos = 0,
len = set.length;
@@ -1093,6 +1093,7 @@ relatio.initWorld = function() {
return false;
});
+ // Handler for a group selector.
$(".group-checkbox").on("mouseover mouseout", function(e) {
var cur = $(this);
var blk = cur.parents(".sub-block:first");
@@ -1109,6 +1110,16 @@ relatio.initWorld = function() {
return false;
});
+ $(".radio").on("click", function(e) {
+ var $this = $(this),
+ g = $this.parents(".radio-group");
+ // Deselect other in the group
+ $(".radio", g).not(this).removeClass("selected");
+ $this.addClass("selected");
+ $("input[type=radio]").attr("checked", "checked");
+ return false;
+ });
+
$(document).on("keydown.relatio keyup.relatio", function(e) {
if (e.keyCode == keyCodes.SHIFT) {

0 comments on commit 09abeb4

Please sign in to comment.