RubyGems - togostanza - Versions diffs - 1.0.5 → 1.0.6 - Mend

togostanza 1.0.5 → 1.0.6

Files changed (7) hide show

checksums.yaml CHANGED Viewed

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 2be783949cf427be67ec3a47efe59ed5f91f5b94
-  data.tar.gz: 86cebe957aa1608b6baf2ae48d57e9ccf9aea223
+  metadata.gz: fc97dbc3b87d24a73ca0648a0e073e32e2bb2906
+  data.tar.gz: ba821a103ec7b2d44e7c089535eb7ac929a8c636
 SHA512:
-  metadata.gz: 6b5d7eea816c3f1ecd30ab1f21e0eaf66a52b85edf141a33c1e51d71fdc14e894a00cb1a2a3bf40c5555cd21b3c7628e6d22a378c63aa22f6bf175490b7aeff9
-  data.tar.gz: 5114732733d67d2166c9bdd49fb277f8acc83f23639393dfd07636141ab2375916438602df307a74e1a07b7ca1c22fc4de4ff0ea0c11f88c191db55a01a2639e
+  metadata.gz: 8cf4e437c60074dae984afd871a7e715ab1418ea25e78e28f047121352abcdb0b32713d683b26eef24c432af8358699075edebff85c18a9e8218391c90ca3bee
+  data.tar.gz: 743c1e1ebf7be8098faa23d1d020b415347406881e98268309a2ad7fc984a087f7784954d4d644a066c2b58a0de0b895195556e587737841c8ec43510af6e4dc

data/LICENSE.txt CHANGED Viewed

@@ -1,4 +1,4 @@
-Copyright (c) 2013 Keita Urashima
+Copyright (c) 2013 Database Center for Life Science (DBCLS)
 MIT License

data/assets/nanostanza.css CHANGED Viewed

@@ -2,7 +2,7 @@
 body {
   background-color: #fff;
-  font-family: "Helvetica Neue","Arial",san-serif;
+  font-family: "Arial",san-serif;
   height: 160px;
   font-size: 12px;
   line-height: 140%;
@@ -20,18 +20,96 @@ h1 {
   position: absolute;
   width: 100%;
   margin: 0;
-  padding: 0 10px 6px;
-  bottom: 0;
+  padding: 0 4px 6px;
+  top: 6px;
   left: 0;
   box-sizing: border-box;
-  font-size: 14px;
+  font-size: 12px;
   line-height: 14px;
-  font-weight: normal;
-  color: #45b8cc;
+  font-weight: bold;
+  /*color: #45b8cc;*/
+  color: #000;
   text-align: center;
   text-shadow: -1px -1px 0px #fff, -1px 0px 0px #fff, -1px 1px 0px #fff, 0px -1px 0px #fff, 0px 1px 0px #fff, 1px -1px 0px #fff, 1px 0px 0px #fff, 1px 1px 0px #fff;
   z-index: 1;
 }
+#main-view {
+  position: relative;
+  width: 100%;
+  height: 160px;
+}
+/* color scheme
+ -------------------------- */
+.gene { color: #8db93c; }
+.nc-rna { color: #45b8cc; }
+.t-rna { color: #ed6592; }
+.r-rna { color: #e59033; }
+/* misc.
+ -------------------------- */
+ .hidden {
+  display: none;
+ }
+ .n-slash-a {
+  color: #bfbeba;
+  letter-spacing: .25em;
+ }
+/* svg
+ -------------------------- */
+.font-size-large {
+  font-size: 36px;
+}
+.font-size-middle {
+  font-size: 20px;
+}
+.font-size-small {
+  font-size: 12px;
+}
+.fill-base-color,
+.unit {
+  fill: #249eb3;
+}
+.fill-black {
+  fill: #333030;
+}
+.fill-gray {
+  fill: #bfbeba;
+}
+.fill-light-gray {
+  fill: #e5e5e4;
+}
+.stroke-base-color {
+  stroke: #249eb3;
+}
+.stroke-black {
+  stroke: #333030;
+}
+.stroke-gray {
+  stroke: #bfbeba;
+}
+.stroke-light-gray {
+  stroke: #e5e5e4;
+}
+.bold {
+  font-weight: bold;
+}
+.text-anchor-start {
+  text-anchor: start;
+}
+.text-anchor-middle {
+  text-anchor: middle;
+}
+.text-anchor-end {
+  text-anchor: end;
+}
+.dash {
+  stroke-dasharray: 2 2;
+}
 /* extension
@@ -56,7 +134,7 @@ h1 {
   opacity: 1;
 }
 #extension p {
-  margin: 0 10px;
+  margin: 0 10px;
 }
 #extension a {
   color: #fff;
@@ -78,7 +156,7 @@ h1 {
  -------------------------- */
 .single-text-view {
   margin: 0;
-  line-height: 150px;
+  line-height: 164px;
   text-align: center;
   font-weight: bold;
   font-size: 16px;
@@ -95,6 +173,7 @@ h1 {
   font-size: 50%;
   font-weight: normal;
   margin-right: -5px;
+  color: #249eb3;
 }
 p.text-size-small {
   font-size: 32px;
@@ -110,18 +189,80 @@ p.text-size-large {
   padding: 0 12px;
   line-height: 16px;
   font-weight: bold;
-  position: relative;
+  position: absolute;
+  bottom: 6px;
 }
 /* image
  -------------------------- */
-img.single-image {
-  width: 300%;
+img.single-image-view {
+  width: 100%;
   height: auto;
   position: absolute;
   top: 50%;
   -webkit-transform: translateY(-50%);
+  -moz-transform: translateY(-50%);
+  transform: translateY(-50%);
+}
+/* growth temperature
+ -------------------------- */
+.thermophile {
+  fill: #ff8b00;
+}
+.mesophile {
+  fill: #e7ed4d;
+}
+.psychrophile {
+  fill: #66c0ed;
+}
+/* figure
+ -------------------------- */
+figure {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  margin: 0;
+}
+figure.habitat img {
+  width: 90px;
+  height: 90px;
+  margin-top: 35px;
+}
+figure figcaption {
+  font-size: 12px;
+  font-weight: bold;
+  color: #249eb3;
+  position: absolute;
+  bottom: 6px;
+  width: 100%;
+}
+/* key value table
+ -------------------------- */
+.key-value-table {
+  width: 100%;
+  line-height: 27px;
+  vertical-align: bottom;
+}
+.key-value-table th {
+  text-align: left;
+  padding-left: 16px;
+  font-size: 12px;
+}
+.key-value-table td {
+  text-align: right;
+  padding-right: 16px;
+  font-size: 20px;
+  font-weight: bold;
 }

data/assets/nanostanza.js CHANGED Viewed

@@ -1,8 +1,20 @@
 $(function(){
-	$w = $(window);
-	$html = $("html");
-	$body = $("body");
+	var $w = $(window),
+		$html = $("html"),
+		$body = $("body"),
+		screenWidth = $body.width(),
+		screenHeight = $body.height(),
+		MIDDLE_FONT_SIZE = 20,
+		TICK_FONT_SIZE = 8,
+		BASE_WIDTH = 12,
+		BASE_COLOR = "#249eb3",
+		GRAYISH_BASE_COLOR = "#d5e0dc",
+		BLACK_COLOR = "#333030",
+		GRAY_COLOR = "#bfbeba",
+		LIGHT_GRAY_COLOR = "#e5e5e4",
+		PH_COLORS = [ "#bf1e2e", "#f13e37", "#fcb040", "#8cc63e", "#24a9e2", "#283890", "#93268f" ],
+		SVG_START = "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='svg-root' width = '" + screenWidth + "' height='" + screenHeight + "'>";
 	{ // font size
 		$(".text-size-adjust").each(function(){
@@ -10,7 +22,7 @@ $(function(){
 			$this.wrapInner("<span style='white-space: nowrap;'>");
 			var $inner = $("span", $this);
 			var w1 = $inner.width();
-			var w2 = $body.width() - 40;
+			var w2 = screenWidth - 40;
 			//window.console.log(w1+" / "+w2);
 			if (w1 > w2) {
 				var fontSize = parseInt($this.css("font-size"));
@@ -21,13 +33,6 @@ $(function(){
 			}
 		})
 	}
-	{
-		$(".multiline-text-view").each(function(){
-			var $this = $(this);
-			var height = $this.height();
-			$this.css("top", (($body.height() - 16 - height) * .5) + "px");
-		});
-	}
 	{ // extension
 		try {
 			if (NANO_STANZA && NANO_STANZA.EXTENSION && NANO_STANZA.EXTENSION.length) {
@@ -44,11 +49,166 @@ $(function(){
 				var exHeight = $extension.height();
 				var padding = (exHeight - height) * .5;
 				$extension.css("padding-top", padding + "px");
-				window.console.log("height: "+height);
 			}
 		} catch(e) {
 			//window.console.log(e);
 		}
 	}
+	{ // growth temperature
+		if ($body.has(".growth-temperature").length > 0) {
+			var html = SVG_START;
+			html += "\
+			<line x1='0' y1='68.5' x2='" + screenWidth + "' y2='68.5' class='stroke-light-gray dash' />\
+			<line x1='0' y1='114.5' x2='" + screenWidth + "' y2='114.5' class='stroke-light-gray dash' />\
+			<text x='24' y='72' class='font-size-small fill-black text-anchor-middle' >45°</text>\
+			<text x='24' y='118' class='font-size-small fill-black text-anchor-middle' >20°</text>\
+			<circle cx='43' cy='31' r='6' class='thermophile' />\
+			<rect x='37' y='31' width='12' height='38' class='thermophile' />\
+			<rect x='37' y='69' width='12' height='46' class='mesophile' />\
+			<rect x='37' y='115' width='12' height='25' class='psychrophile' />\
+			<circle cx='43' cy='138' r='14' class='psychrophile' />\
+			<text x='" + (screenWidth - 25) + "' y='56' class='font-size-middle fill-black bold text-anchor-end' >" + $(".datum[data-temperature='thermophile']").text() + "</text>\
+			<text x='" + (screenWidth - 25) + "' y='99' class='font-size-middle fill-black bold text-anchor-end' >" + $(".datum[data-temperature='mesophile']").text() + "</text>\
+			<text x='" + (screenWidth - 25) + "' y='142' class='font-size-middle fill-black bold text-anchor-end' >" + $(".datum[data-temperature='psychrophile']").text() + "</text>";
+			// close
+			html += "</svg>";
+			$("#main-view").append(html);
+		}
+	}
+	{ // pie chart
+		if ($body.has(".pie-chart").length > 0) {
+			var data = [],
+				html = SVG_START,
+				sum = 0, currentRadian = -Math.PI * .5,
+				centerX = screenWidth * .5,
+				centerY = screenHeight * .5 + 7,
+				$chart = $(".pie-chart"),
+				RADIUS = 50;
+			$(".datum").each(function(){
+				var $datum = $(this);
+				data.push({
+					value: parseFloat($datum.text()),
+					name: $datum.data("name")
+				});
+				sum += data[data.length - 1].value;
+			});
+			// chart
+			html += "<g fill='none' stroke-width='" + BASE_WIDTH + "'>"
+			for (var i = 0; i < data.length; i++) {
+				var ratio = data[i].value / sum,
+					radian = Math.PI * 2 * ratio,
+					color = BASE_COLOR,
+					largeArcFlag = ratio > .5;
+				// color
+				if ($chart.hasClass("gc-content")) {
+					if (data[i].name == "at") color = GRAYISH_BASE_COLOR;
+				}
+				// arc
+				html += "<path d='M " + (Math.cos(currentRadian) * RADIUS + centerX) + "," + (Math.sin(currentRadian) * RADIUS + centerY) + " A " + RADIUS + "," + RADIUS + " 0 " + (largeArcFlag ? 1 : 0) + ",1 " + (Math.cos(currentRadian + radian) * RADIUS + centerX) + "," + (Math.sin(currentRadian + radian) * RADIUS + centerY) + "' stroke='" + color + "' />";
+				currentRadian += radian;
+			}
+			html += "</g>";
+			// text
+			html += "<text x='" + centerX + "' y='" + (centerY + 13) + "' dx='5' class='fill-black text-anchor-middle' ><tspan class='font-size-large bold'>" + $(".datum[data-name='gc']").text() + "</tspan><tspan class='unit'>" + $chart.data("unit") + "</tspan></text>";
+			// close
+			html += "</svg>";
+			$("#main-view").append(html);
+		}
+	}
+	{ // bar chart
+		if ($body.has(".bar-chart").length > 0) {
+			var data = [],
+				html = SVG_START,
+				maxValue = 0, maxValueString = "", sum = 0,
+				colWidth, barWidth, marginLeft, strokeColor,
+				$chart = $(".bar-chart"),
+				xGraduationsPar = parseFloat($chart.data("xGraduationsPar"));
+				BASE_Y = 114,
+				MARGIN_X = 16,
+				MAX_HEIGHT = 88,
+				BAR_MIN_SPACE = 1,
+				FONT_SIZE_SMALL = 12,
+				TICKS = {
+					"0": [],
+					"1": [.5, 1],
+					"2": [1, 2],
+					"3": [1, 2, 3],
+					"4": [2, 4],
+					"5": [2, 4],
+					"6": [3, 6],
+					"7": [3, 6],
+					"8": [4, 8],
+					"9": [4, 8]
+				};
+			$(".datum").each(function(){
+				var $datum = $(this),
+					value = parseFloat($datum.text());
+				data.push({
+					value: value,
+					x: $datum.data("x")
+				});
+				sum += data[data.length - 1].value;
+				maxValue = maxValue < value ? value : maxValue;
+			});
+			maxValueString = Math.ceil(maxValue) + "";
+			marginLeft = TICK_FONT_SIZE * maxValueString.length + TICK_FONT_SIZE;
+			// background: x
+			html += "<line x1='0' y1='" + (BASE_Y + .5) + "' x2='" + screenWidth + "' y2='" + (BASE_Y + .5) + "' class='stroke-gray' />";
+			colWidth = (screenWidth - MARGIN_X * 2 - marginLeft) / data.length;
+			barWidth = (colWidth - BAR_MIN_SPACE) < BASE_WIDTH ? colWidth - BAR_MIN_SPACE : BASE_WIDTH;
+			for (var i = 0; i <= data.length; i++) {
+				var x = (MARGIN_X + marginLeft + colWidth * i), xGraduation;
+				if (i < data.length) {
+					xGraduation = data[i].x;
+				} else {
+					xGraduation = data[i - 1].x + (data[i - 1].x - data[i - 2].x);
+				}
+				if ((i % xGraduationsPar) == 0) {
+					html += "\
+					<line x1='" + x + "' y1='0' x2='" + x + "' y2='" + screenHeight + "' class='stroke-light-gray dash' />\
+					<text x='" + x + "' y='" + (BASE_Y + 14) + "' class='font-size-small fill-black text-anchor-middle' >" + xGraduation + "</text>";
+				}
+			}
+			// background: y
+			var ticks = TICKS[maxValueString.charAt(0)];
+			for (var i = 0; i < ticks.length; i++) {
+				var tick = ticks[i];
+				var y = BASE_Y - MAX_HEIGHT * (tick / parseInt(maxValueString.charAt(0)));
+				var tick2 = Math.pow(10, maxValueString.length) * tick * .1;
+				html += "\
+				<line x1='0' y1='" + y + "' x2='" + screenWidth + "' y2='" + y + "' class='stroke-gray dash' />\
+				<text x='" + (MARGIN_X + marginLeft - TICK_FONT_SIZE + 4) + "' y='" + (y + FONT_SIZE_SMALL * .5 - 2) + "' class='font-size-small fill-black text-anchor-end' >" + tick2 + "</text>";
+			}
+			// data
+			strokeColor = BASE_COLOR;
+			for (var i = 0; i < data.length; i++) {
+				switch ($chart.data("xAxisUnit")) {
+					case "pH":
+					strokeColor = PH_COLORS[i];
+					break;
+				}
+				var x = (MARGIN_X + marginLeft + colWidth * i) + colWidth * .5;
+				var barHeight = maxValue == 0 ? 0 : MAX_HEIGHT * (data[i].value / maxValue);
+				html += "\
+				<line x1='" + x + "' y1='" + BASE_Y + "' x2='" + x + "' y2='" + (BASE_Y - barHeight) + "' stroke='" + strokeColor + "' stroke-width='" + barWidth + "' />";
+			}
+			// sum
+			html += "<text x='" + (screenWidth * .5) + "' y='" + (BASE_Y + 36) + "' class='font-size-middle fill-black bold text-anchor-middle' >" + sum + "</text>"
+			// close
+			html += "</svg>";
+			$("#main-view").append(html);
+		}
+	}
+	{ // vertical-centering
+		if ($body.has(".vertical-centering").length > 0) {
+			$(".vertical-centering").each(function(){
+				$this = $(this);
+				$this.css({
+					position: "relative",
+					top: (screenHeight - $this.outerHeight()) * .5 + 8
+				})
+			})
+		}
+	}
 });

data/assets/no_data.svg ADDED Viewed

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 15.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="レイヤー_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
+	 y="0px" width="160px" height="160px" viewBox="0 0 160 160" enable-background="new 0 0 160 160" xml:space="preserve">
+<text transform="matrix(1 0 0 1 19.1445 92)" fill="#BFBEBA" font-family="'HelveticaNeue-Bold'" font-size="32">No data</text>
+</svg>

data/lib/togostanza/version.rb CHANGED Viewed

@@ -1,3 +1,3 @@
 module TogoStanza
-  VERSION = '1.0.5'
+  VERSION = '1.0.6'
 end

metadata CHANGED Viewed

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: togostanza
 version: !ruby/object:Gem::Version
-  version: 1.0.5
+  version: 1.0.6
 platform: ruby
 authors:
 - Keita Urashima
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2014-03-05 00:00:00.000000000 Z
+date: 2014-08-20 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: activesupport
@@ -253,6 +253,7 @@ files:
 - assets/csssprite.png
 - assets/nanostanza.css
 - assets/nanostanza.js
+- assets/no_data.svg
 - assets/stanza.css
 - assets/stanza.js
 - bin/togostanza
@@ -323,7 +324,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubyforge_project:
-rubygems_version: 2.2.0
+rubygems_version: 2.2.2
 signing_key:
 specification_version: 4
 summary: Development tools of TogoStanza
@@ -346,3 +347,4 @@ test_files:
 - spec/lib/togostanza/stanza/base_spec.rb
 - spec/lib/togostanza/stanza/grouping_spec.rb
 - spec/spec_helper.rb
+has_rdoc: