Skip to content
Snippets Groups Projects
Commit 8a9e02ac authored by Stephen Mayhew's avatar Stephen Mayhew
Browse files

Added spinner icon, cleaned up javascript

parent edc54eb3
No related branches found
No related tags found
No related merge requests found
.correct {
fill: #33a02c;
background: #33a02c;
stroke: #23701e;
border: 1px solid #23701e;
}
.wrong {
fill: #e31a1c;
background: #e31a1c;
stroke: #9e1213;
border: #9e1213 1px solid;
}
\ No newline at end of file
.correct {
fill: #2c33a0;
background: #2c33a0;
stroke: #272D90;
border: 1px solid #272D90;
}
.wrong {
fill: #e31a1c;
background: #e31a1c;
stroke: #9e1213;
border: #9e1213 1px solid;
}
\ No newline at end of file
body{
padding-top: 100px;
}
svg { svg {
width: 7300px; /*width: 7300px;*/
height: 1000px; /*height: 1000px;*/
font: 10px sans-serif; font: 10px sans-serif;
shape-rendering: crispEdges; shape-rendering: crispEdges;
} }
...@@ -22,6 +26,18 @@ svg { ...@@ -22,6 +26,18 @@ svg {
} }
/* overrides bootstrap! */
.dropdown-menu > li > p {
display: block;
padding: 3px 20px;
clear: both;
font-weight: normal;
line-height: 1.42857143;
color: #333;
white-space: nowrap;
margin: 0;
}
.legend { .legend {
padding: 8px; padding: 8px;
border: 1px solid #ccc; border: 1px solid #ccc;
...@@ -35,12 +51,48 @@ svg { ...@@ -35,12 +51,48 @@ svg {
} }
.selected {
background: #dcdcdc;
}
p.color:hover {
background: #f5f5f5;
cursor: pointer;
}
.box { .box {
width: 1em; width: 1em;
height: 1em; height: 1em;
margin-right: 10px; margin-right: 10px;
display: inline; display: inline-block;
float: left; }
.correct1 {
fill: #33a02c;
background: #33a02c;
stroke: #23701e;
border: 1px solid #23701e;
}
.wrong1 {
fill: #e31a1c;
background: #e31a1c;
stroke: #9e1213;
border: #9e1213 1px solid;
}
.correct2 {
fill: #2c33a0;
background: #2c33a0;
stroke: #272D90;
border: 1px solid #272D90;
}
.wrong2 {
fill: #e31a1c;
background: #e31a1c;
stroke: #9e1213;
border: #9e1213 1px solid;
} }
.correct3 { .correct3 {
...@@ -81,4 +133,11 @@ svg { ...@@ -81,4 +133,11 @@ svg {
.btnclose { .btnclose {
margin-right: -10px; margin-right: -10px;
}
#spinnerdiv {
/*display: none;*/
position: fixed;
top: 50%;
left: 50%;
} }
\ No newline at end of file
...@@ -9,19 +9,14 @@ ...@@ -9,19 +9,14 @@
<script src="js/jquery-ui.js"></script> <script src="js/jquery-ui.js"></script>
<script src="js/bootstrap.min.js"></script> <script src="js/bootstrap.min.js"></script>
<script src="js/messi.js"></script> <script src="js/messi.js"></script>
<script type="text/javascript" src="js/vis_common.js"></script>
<script type="text/javascript" src="vis.js"></script>
<link rel="stylesheet" href="css/jquery-ui.css" /> <link rel="stylesheet" href="css/jquery-ui.css" />
<link rel="stylesheet" href="css/bootstrap.css" /> <link rel="stylesheet" href="css/bootstrap.css" />
<link rel="stylesheet" href="css/messi.min.css" /> <link rel="stylesheet" href="css/messi.min.css" />
<link rel="stylesheet" href="css/font-awesome.min.css"> <link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/style.css"/> <link rel="stylesheet" href="css/style.css"/>
<link id="colorscheme" rel="stylesheet" href="css/scheme1.css"/>
<script>
</script>
</head> </head>
...@@ -30,7 +25,6 @@ ...@@ -30,7 +25,6 @@
<div class="navbar navbar-default navbar-fixed-top"> <div class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid"> <div class="container-fluid">
<div class="navbar-header"> <div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
data-target="#bs-example-navbar-collapse-1"> data-target="#bs-example-navbar-collapse-1">
...@@ -66,21 +60,20 @@ ...@@ -66,21 +60,20 @@
</button> </button>
<!--<button type="button" class="btn btn-default" id="downbutton"><i class="fa fa-bar-chart"></i> To Histogram</button>--> <!--<button type="button" class="btn btn-default" id="downbutton"><i class="fa fa-bar-chart"></i> To Histogram</button>-->
</form> </form>
<ul class="nav navbar-nav navbar-right"> <ul class="nav navbar-nav navbar-right">
<li class="dropdown"> <li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i
class="fa fa-bars fa-lg" style="vertical-align: middle;"></i></a> class="fa fa-bars fa-lg" style="vertical-align: middle;"></i></a>
<ul class="dropdown-menu" role="menu"> <ul class="dropdown-menu" role="menu">
<li><a>Color schemes (Correct/Incorrect):</a></li> <li><p><b>Color schemes</b></p></li>
<li><a id="scheme1" class="color" href="#"><span class="box correct"></span><span <li><p class="color">Color by system</p></li>
class="box wrong1"></span>&nbsp;</a></li> <li><p class="color selected">Correct: <span class="box correct1"></span> Incorrect: <span class="box wrong1"></span></p></li>
<li><a id="scheme2" class="color" href="#"><span class="box correct"></span><span <li><p class="color">Correct: <span class="box correct2"></span> Incorrect: <span class="box wrong2"></span></p></li>
class="box wrong2"></span>&nbsp;</a></li> <li><p class="color">Correct: <span class="box correct3"></span> Incorrect: <span class="box wrong3"></span></p></li>
<li><a id="scheme3" class="color" href="#"><span class="box correct3"></span><span
class="box wrong3"></span>&nbsp;</a></li>
<li class="divider"></li> <li class="divider"></li>
<li><a href="#"><span id="simple"><i class="fa fa-info-circle"></i> What is this?</span></a> <li><a href="#"><span id="simple"><i class="fa fa-info-circle"></i> What is this?</span></a></li>
</li>
</ul> </ul>
</li> </li>
</ul> </ul>
...@@ -121,7 +114,9 @@ ...@@ -121,7 +114,9 @@
<!-- </div> --> <!-- </div> -->
<script type="text/javascript" src="vis.js"></script> <div id="spinnerdiv"><i id="spinner" class="fa fa-spinner fa-5x"></i></div>
</body> </body>
</html> </html>
// OLD NOT USED!!
// <!-- var parseDate = d3.time.format("%Y-%m").parse, --> // <!-- var parseDate = d3.time.format("%Y-%m").parse, -->
// <!-- formatYear = d3.format("02d"), --> // <!-- formatYear = d3.format("02d"), -->
......
/**
* Created by stephen on 3/20/15.
*/
function startSpinner() {
//$("#spinnerdiv").fadeIn();
$("#spinner").addClass("fa-spin");
}
function stopSpinner() {
//$("#spinnerdiv").fadeOut();
$("#spinner").removeClass("fa-spin");
}
function getSelectedClass(){
// should only be one selected at a time...
var kids = $(".selected").children();
if(kids.length == 0){
var correct_class= "";
var wrong_class = "";
}else{
var correct_class = kids[0].className.split(" ")[1];
var wrong_class = kids[1].className.split(" ")[1];
}
return [correct_class, wrong_class];
};
// used later
function yesorno(dy){
if (dy === "0" || +dy == 0){
return 0;
}else{
return 1;
}
}
function numOnes(dict){
var sum= 0;
for (var key in dict){
if (key == "slot") {
continue
}
// sum += parseInt(dict[key]);
sum += yesorno(dict[key]);
}
return sum;
}
// This sorts by the number of answers
function comp(a,b){
var num_a = numOnes(a),
num_b = numOnes(b);
if (num_a < num_b){
return 1;
}
if (num_a > num_b){
return -1;
}
return 0;
}
// This sorts by the number of answers, then by number correct
function comp2(a,b){
var num_a = numOnes(a),
num_b = numOnes(b);
if (num_a < num_b){
return 1;
}
if (num_a > num_b){
return -1;
}
return compByCorrect(a,b);
}
function numCorrect(dict){
var sum = 0;
for (var key in dict){
if (key == "slot"){continue}
var firstChar = dict[key].charAt(0);
if (firstChar == "C"){
sum += 1;
}
}
return sum;
}
function compByCorrect(a,b){
var num_a = numCorrect(a),
num_b = numCorrect(b);
if (num_a < num_b){
return 1;
}
if (num_a > num_b){
return -1;
}
return comp(a, b);
}
function getSlot(dict){
for (var key in dict){
if (key == "slot"){
return dict[key];
}
}
return null;
}
// This compares by SF_ENG_062...
function compByQuery(a,b){
var query_a = getSlot(a).split(":").slice(0,1),
query_b = getSlot(b).split(":").slice(0,1);
if (query_a < query_b){
return 1;
}
if (query_a > query_b){
return -1;
}
return comp(a,b);
}
// This compares by org:founder...
function compBySlot(a,b){
var slot_a = getSlot(a).split(":").slice(1).join(":") ,
slot_b = getSlot(b).split(":").slice(1).join(":");
if (slot_a < slot_b){
return 1;
}
if (slot_a > slot_b){
return -1;
}
return comp(a,b);
}
function range(start, stop, step){
if (typeof stop=='undefined'){
// one param defined
stop = start;
start = 0;
}
if (typeof step=='undefined'){
step = 1;
}
if ((step>0 && start>=stop) || (step<0 && start<=stop)){
return [];
}
var result = [];
for (var i=start; step>0 ? i<stop : i>stop; i+=step){
result.push(i);
}
return result;
}
function setClaim(d){
d3.select("#info #claim").text(d.x);
d3.select("#info #answer").text(d.ans);
}
function clear(){
d3.select("#info #system").text("");
d3.select("#info #claim").text("");
d3.select("#info #answer").text("");
}
// return true if the two strings have the same slot
function slotEqual(s1,s2){
var slot1 = s1.split(":").slice(1).join(":") ,
slot2 = s2.split(":").slice(1).join(":");
return slot1 === slot2;
}
// return true if the two strings have the same query
function queryEqual(s1, s2){
var slot1 = s1.split(":")[0],
slot2 = s2.split(":")[0];
return slot1 === slot2;
}
This diff is collapsed.
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment