├── big-star.coffee
├── big-star.css
├── big-star.js
├── haikei-gunyagunya.js
├── haikei-gunyagunya2.js
├── index.html
├── nikki.css
├── nikki2-my.coffee
├── nikki2-my.css
├── nikki2-my.js
├── nikki2.coffee
├── nikki2.css
├── nikki2.js
├── presentation
    ├── README.md
    ├── presentation.css
    └── presentation.js
├── rokuyo.coffee
├── rokuyo.js
└── speech.js


/big-star.coffee:
--------------------------------------------------------------------------------
  1 | do ->
  2 | 
  3 |   user_icon = (name) ->
  4 |     "http://www.hatena.ne.jp/users/#{encodeURI(name.slice(0, 2))}/#{encodeURI(name)}/profile.gif"
  5 | 
  6 |   throttle = (fn, delay) ->
  7 |     timer = null
  8 |     ->
  9 |       return if timer
 10 |       context = this
 11 |       args = arguments
 12 |       timer = setTimeout ->
 13 |         timer = null
 14 |         fn.apply context, args
 15 |       , delay || 50
 16 | 
 17 |   replaceStar = ($star) ->
 18 |     return if $star.prop 'data-hatena-big-star-init'
 19 |     $star.prop 'data-hatena-big-star-init', true
 20 | 
 21 |     $container = $ '<span>'
 22 |     $container.addClass 'hatena-big-star-star-container'
 23 | 
 24 |     # mouseoverを再利用するために改造して使う……
 25 |     $user_image = $star.find 'img'
 26 |     $star_src = $user_image.attr('src')
 27 | 
 28 |     $user_image.addClass 'hatena-big-star-user'
 29 | 
 30 |     $user_image.attr
 31 |       src: user_icon $star[0].href.match(/hatena\.ne\.jp\/([^\/]+)\/?/)[1]
 32 | 
 33 |     $star_image = $('<img>')
 34 |     $star_image.addClass 'hatena-big-star-star'
 35 |     $star_image.attr
 36 |       src: $star_src
 37 | 
 38 |     $container
 39 |       .append($user_image)
 40 |       .append($star_image)
 41 | 
 42 |     $star.append $container
 43 | 
 44 |   replaceButton = ($container) ->
 45 |     return if $container.prop 'data-hatena-big-star-init'
 46 |     $container.prop 'data-hatena-big-star-init', true
 47 | 
 48 |   replaceCommentButton = ($button) ->
 49 |     return if $button.prop 'data-hatena-big-star-comment-init'
 50 |     $button.prop 'data-hatena-big-star-comment-init', true
 51 | 
 52 |   filter = throttle ->
 53 |     $('span.hatena-star-star-container a').each ->
 54 |       try
 55 |         replaceStar $(this)
 56 |       catch error
 57 |         console.log(error) if console
 58 | 
 59 |     $('.hatena-star-star-container').each ->
 60 |       replaceButton $(this)
 61 | 
 62 |     $('.hatena-star-comment-button').each ->
 63 |       replaceCommentButton $(this)
 64 | 
 65 |   filter()
 66 | 
 67 |   override = ->
 68 |     style =
 69 |       '-webkit-transform': 'scale(2.0)'
 70 |       '-webkit-transform-origin': '0% 0%'
 71 |       '-moz-transform': 'scale(2.0)'
 72 |       '-moz-transform-origin': '0% 0%'
 73 |       '-o-transform': 'scale(2.0)'
 74 |       '-o-transform-origin': '0% 0%'
 75 |       'background': 'white'
 76 | 
 77 |     for k, v of style
 78 |       Hatena.Star.Pallet.PALLET_STYLE += "#{k}: #{v}; "
 79 | 
 80 |     # pos.x, yを増やしてる
 81 |     Hatena.Star.AddButton.prototype.showColorPallet = (e) ->
 82 |       @clearSelectedColorTimer()
 83 |       @pallet = new Hatena.Star.Pallet() unless @pallet
 84 |       pos = Ten.Geometry.getElementPosition @img
 85 |       if Ten.Browser.isFirefox || Ten.Browser.isOpera
 86 |         pos.y += 40
 87 |         pos.x += 6
 88 |       else
 89 |         pos.x += 2
 90 |         pos.y += 36
 91 |       @pallet.showPallet(pos, @)
 92 | 
 93 |   bindEvents = ->
 94 |     $(document.body).bind 'DOMNodeInserted', ->
 95 |       filter()
 96 | 
 97 |     $(document.body).bind 'mouseup', ->
 98 |       filter()
 99 | 
100 |   bindEvents()
101 | 
102 |   override()


--------------------------------------------------------------------------------
/big-star.css:
--------------------------------------------------------------------------------
 1 | .hatena-star-star-container {
 2 |     font-size: 18px;
 3 | }
 4 | 
 5 | .hatena-star-comment-button {
 6 |     width: 44px;
 7 |     height: 30px;
 8 | }
 9 | 
10 | .hatena-star-add-button {
11 |     width: 32px;
12 |     height: 32px;
13 |     margin: 1px !important;
14 | }
15 | 
16 | .hatena-star-add-button-image {
17 |     background-image: url(http://cdn.www.st-hatena.com/images/one/touch/star_button_small2@2x.png);
18 | }
19 | 
20 | 
21 | .hatena-big-star-star-container {
22 |     display: inline-block;
23 |     position: relative;
24 |     width: 32px;
25 |     height: 32px;
26 |     margin: 1px;
27 |     vertical-align: middle;
28 |     border-radius: 2px;
29 |     overflow: hidden;
30 | }
31 | 
32 | .hatena-big-star-user {
33 |     width: 32px;
34 |     height: 32px;
35 |     position: absolute;
36 |     top: 0px;
37 |     left: 0px;
38 |     margin: 0px;
39 |     padding: 0px;
40 |     margin-bottom: 0px !important;
41 |     z-index: 100;
42 |     border-radius: 3px;
43 | }
44 | 
45 | .hatena-big-star-star {
46 |     position: absolute;
47 |     bottom: 0px;
48 |     left: 0px;
49 |     margin: 0px;
50 |     padding: 0px;
51 |     margin-bottom: 0px !important;
52 |     z-index: 110;
53 |     background: rgba(255, 255, 255, 0.6);
54 |     border-top-right-radius: 2px;
55 |     border-bottom-left-radius: 2px;
56 | }
57 | 


--------------------------------------------------------------------------------
/big-star.js:
--------------------------------------------------------------------------------
  1 | (function() {
  2 |   var bindEvents, filter, override, replaceButton, replaceCommentButton, replaceStar, throttle, user_icon;
  3 |   user_icon = function(name) {
  4 |     return "http://www.hatena.ne.jp/users/" + (encodeURI(name.slice(0, 2))) + "/" + (encodeURI(name)) + "/profile.gif";
  5 |   };
  6 |   throttle = function(fn, delay) {
  7 |     var timer;
  8 |     timer = null;
  9 |     return function() {
 10 |       var args, context;
 11 |       if (timer) {
 12 |         return;
 13 |       }
 14 |       context = this;
 15 |       args = arguments;
 16 |       return timer = setTimeout(function() {
 17 |         timer = null;
 18 |         return fn.apply(context, args);
 19 |       }, delay || 50);
 20 |     };
 21 |   };
 22 |   replaceStar = function($star) {
 23 |     var $container, $star_image, $star_src, $user_image;
 24 |     if ($star.prop('data-hatena-big-star-init')) {
 25 |       return;
 26 |     }
 27 |     $star.prop('data-hatena-big-star-init', true);
 28 |     $container = $('<span>');
 29 |     $container.addClass('hatena-big-star-star-container');
 30 |     $user_image = $star.find('img');
 31 |     $star_src = $user_image.attr('src');
 32 |     $user_image.addClass('hatena-big-star-user');
 33 |     $user_image.attr({
 34 |       src: user_icon($star[0].href.match(/hatena\.ne\.jp\/([^\/]+)\/?/)[1])
 35 |     });
 36 |     $star_image = $('<img>');
 37 |     $star_image.addClass('hatena-big-star-star');
 38 |     $star_image.attr({
 39 |       src: $star_src
 40 |     });
 41 |     $container.append($user_image).append($star_image);
 42 |     return $star.append($container);
 43 |   };
 44 |   replaceButton = function($container) {
 45 |     if ($container.prop('data-hatena-big-star-init')) {
 46 |       return;
 47 |     }
 48 |     return $container.prop('data-hatena-big-star-init', true);
 49 |   };
 50 |   replaceCommentButton = function($button) {
 51 |     if ($button.prop('data-hatena-big-star-comment-init')) {
 52 |       return;
 53 |     }
 54 |     return $button.prop('data-hatena-big-star-comment-init', true);
 55 |   };
 56 |   filter = throttle(function() {
 57 |     $('span.hatena-star-star-container a').each(function() {
 58 |       try {
 59 |         return replaceStar($(this));
 60 |       } catch (error) {
 61 |         if (console) {
 62 |           return console.log(error);
 63 |         }
 64 |       }
 65 |     });
 66 |     $('.hatena-star-star-container').each(function() {
 67 |       return replaceButton($(this));
 68 |     });
 69 |     return $('.hatena-star-comment-button').each(function() {
 70 |       return replaceCommentButton($(this));
 71 |     });
 72 |   });
 73 |   filter();
 74 |   override = function() {
 75 |     var k, style, v;
 76 |     style = {
 77 |       '-webkit-transform': 'scale(2.0)',
 78 |       '-webkit-transform-origin': '0% 0%',
 79 |       '-moz-transform': 'scale(2.0)',
 80 |       '-moz-transform-origin': '0% 0%',
 81 |       '-o-transform': 'scale(2.0)',
 82 |       '-o-transform-origin': '0% 0%',
 83 |       'background': 'white'
 84 |     };
 85 |     for (k in style) {
 86 |       v = style[k];
 87 |       Hatena.Star.Pallet.PALLET_STYLE += "" + k + ": " + v + "; ";
 88 |     }
 89 |     return Hatena.Star.AddButton.prototype.showColorPallet = function(e) {
 90 |       var pos;
 91 |       this.clearSelectedColorTimer();
 92 |       if (!this.pallet) {
 93 |         this.pallet = new Hatena.Star.Pallet();
 94 |       }
 95 |       pos = Ten.Geometry.getElementPosition(this.img);
 96 |       if (Ten.Browser.isFirefox || Ten.Browser.isOpera) {
 97 |         pos.y += 40;
 98 |         pos.x += 6;
 99 |       } else {
100 |         pos.x += 2;
101 |         pos.y += 36;
102 |       }
103 |       return this.pallet.showPallet(pos, this);
104 |     };
105 |   };
106 |   bindEvents = function() {
107 |     $(document.body).bind('DOMNodeInserted', function() {
108 |       return filter();
109 |     });
110 |     return $(document.body).bind('mouseup', function() {
111 |       return filter();
112 |     });
113 |   };
114 |   bindEvents();
115 |   return override();
116 | })();


--------------------------------------------------------------------------------
/haikei-gunyagunya.js:
--------------------------------------------------------------------------------
  1 | /*
  2 | 
  3 | * はてなブログの背景を記事内の画像にしてぐにゃぐにゃさせる
  4 | 
  5 | 背景がぐにゃぐにゃになります
  6 | 
  7 | ** 使い方
  8 | 
  9 | 以下をコピーして 詳細設定→head要素に貼り付け
 10 | 
 11 | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
 12 | <script src="http://hitode909.github.io/hatenablog-unofficial-modules/haikei-gunyagunya.js"></script>
 13 | 
 14 | perlin noiseの生成に https://github.com/josephg/noisejs を使っています
 15 | 
 16 | */
 17 | 
 18 | (function() {
 19 | 
 20 |  // https://github.com/josephg/noisejs public domain
 21 |   /*
 22 |  * A speed-improved perlin and simplex noise algorithms for 2D.
 23 |  *
 24 |  * Based on example code by Stefan Gustavson (stegu@itn.liu.se).
 25 |  * Optimisations by Peter Eastman (peastman@drizzle.stanford.edu).
 26 |  * Better rank ordering method by Stefan Gustavson in 2012.
 27 |  * Converted to Javascript by Joseph Gentle.
 28 |  *
 29 |  * Version 2012-03-09
 30 |  *
 31 |  * This code was placed in the public domain by its original author,
 32 |  * Stefan Gustavson. You may use it as you see fit, but
 33 |  * attribution is appreciated.
 34 |  *
 35 |  */
 36 | 
 37 | (function(global){
 38 |   var module = global.noise = {};
 39 | 
 40 |   function Grad(x, y, z) {
 41 |     this.x = x; this.y = y; this.z = z;
 42 |   }
 43 |   
 44 |   Grad.prototype.dot2 = function(x, y) {
 45 |     return this.x*x + this.y*y;
 46 |   };
 47 | 
 48 |   Grad.prototype.dot3 = function(x, y, z) {
 49 |     return this.x*x + this.y*y + this.z*z;
 50 |   };
 51 | 
 52 |   var grad3 = [new Grad(1,1,0),new Grad(-1,1,0),new Grad(1,-1,0),new Grad(-1,-1,0),
 53 |                new Grad(1,0,1),new Grad(-1,0,1),new Grad(1,0,-1),new Grad(-1,0,-1),
 54 |                new Grad(0,1,1),new Grad(0,-1,1),new Grad(0,1,-1),new Grad(0,-1,-1)];
 55 | 
 56 |   var p = [151,160,137,91,90,15,
 57 |   131,13,201,95,96,53,194,233,7,225,140,36,103,30,69,142,8,99,37,240,21,10,23,
 58 |   190, 6,148,247,120,234,75,0,26,197,62,94,252,219,203,117,35,11,32,57,177,33,
 59 |   88,237,149,56,87,174,20,125,136,171,168, 68,175,74,165,71,134,139,48,27,166,
 60 |   77,146,158,231,83,111,229,122,60,211,133,230,220,105,92,41,55,46,245,40,244,
 61 |   102,143,54, 65,25,63,161, 1,216,80,73,209,76,132,187,208, 89,18,169,200,196,
 62 |   135,130,116,188,159,86,164,100,109,198,173,186, 3,64,52,217,226,250,124,123,
 63 |   5,202,38,147,118,126,255,82,85,212,207,206,59,227,47,16,58,17,182,189,28,42,
 64 |   223,183,170,213,119,248,152, 2,44,154,163, 70,221,153,101,155,167, 43,172,9,
 65 |   129,22,39,253, 19,98,108,110,79,113,224,232,178,185, 112,104,218,246,97,228,
 66 |   251,34,242,193,238,210,144,12,191,179,162,241, 81,51,145,235,249,14,239,107,
 67 |   49,192,214, 31,181,199,106,157,184, 84,204,176,115,121,50,45,127, 4,150,254,
 68 |   138,236,205,93,222,114,67,29,24,72,243,141,128,195,78,66,215,61,156,180];
 69 |   // To remove the need for index wrapping, double the permutation table length
 70 |   var perm = new Array(512);
 71 |   var gradP = new Array(512);
 72 | 
 73 |   // This isn't a very good seeding function, but it works ok. It supports 2^16
 74 |   // different seed values. Write something better if you need more seeds.
 75 |   module.seed = function(seed) {
 76 |     if(seed > 0 && seed < 1) {
 77 |       // Scale the seed out
 78 |       seed *= 65536;
 79 |     }
 80 | 
 81 |     seed = Math.floor(seed);
 82 |     if(seed < 256) {
 83 |       seed |= seed << 8;
 84 |     }
 85 | 
 86 |     for(var i = 0; i < 256; i++) {
 87 |       var v;
 88 |       if (i & 1) {
 89 |         v = p[i] ^ (seed & 255);
 90 |       } else {
 91 |         v = p[i] ^ ((seed>>8) & 255);
 92 |       }
 93 | 
 94 |       perm[i] = perm[i + 256] = v;
 95 |       gradP[i] = gradP[i + 256] = grad3[v % 12];
 96 |     }
 97 |   };
 98 | 
 99 |   module.seed(0);
100 | 
101 |   /*
102 |   for(var i=0; i<256; i++) {
103 |     perm[i] = perm[i + 256] = p[i];
104 |     gradP[i] = gradP[i + 256] = grad3[perm[i] % 12];
105 |   }*/
106 | 
107 |   // Skewing and unskewing factors for 2, 3, and 4 dimensions
108 |   var F2 = 0.5*(Math.sqrt(3)-1);
109 |   var G2 = (3-Math.sqrt(3))/6;
110 | 
111 |   var F3 = 1/3;
112 |   var G3 = 1/6;
113 | 
114 |   // 2D simplex noise
115 |   module.simplex2 = function(xin, yin) {
116 |     var n0, n1, n2; // Noise contributions from the three corners
117 |     // Skew the input space to determine which simplex cell we're in
118 |     var s = (xin+yin)*F2; // Hairy factor for 2D
119 |     var i = Math.floor(xin+s);
120 |     var j = Math.floor(yin+s);
121 |     var t = (i+j)*G2;
122 |     var x0 = xin-i+t; // The x,y distances from the cell origin, unskewed.
123 |     var y0 = yin-j+t;
124 |     // For the 2D case, the simplex shape is an equilateral triangle.
125 |     // Determine which simplex we are in.
126 |     var i1, j1; // Offsets for second (middle) corner of simplex in (i,j) coords
127 |     if(x0>y0) { // lower triangle, XY order: (0,0)->(1,0)->(1,1)
128 |       i1=1; j1=0;
129 |     } else {    // upper triangle, YX order: (0,0)->(0,1)->(1,1)
130 |       i1=0; j1=1;
131 |     }
132 |     // A step of (1,0) in (i,j) means a step of (1-c,-c) in (x,y), and
133 |     // a step of (0,1) in (i,j) means a step of (-c,1-c) in (x,y), where
134 |     // c = (3-sqrt(3))/6
135 |     var x1 = x0 - i1 + G2; // Offsets for middle corner in (x,y) unskewed coords
136 |     var y1 = y0 - j1 + G2;
137 |     var x2 = x0 - 1 + 2 * G2; // Offsets for last corner in (x,y) unskewed coords
138 |     var y2 = y0 - 1 + 2 * G2;
139 |     // Work out the hashed gradient indices of the three simplex corners
140 |     i &= 255;
141 |     j &= 255;
142 |     var gi0 = gradP[i+perm[j]];
143 |     var gi1 = gradP[i+i1+perm[j+j1]];
144 |     var gi2 = gradP[i+1+perm[j+1]];
145 |     // Calculate the contribution from the three corners
146 |     var t0 = 0.5 - x0*x0-y0*y0;
147 |     if(t0<0) {
148 |       n0 = 0;
149 |     } else {
150 |       t0 *= t0;
151 |       n0 = t0 * t0 * gi0.dot2(x0, y0);  // (x,y) of grad3 used for 2D gradient
152 |     }
153 |     var t1 = 0.5 - x1*x1-y1*y1;
154 |     if(t1<0) {
155 |       n1 = 0;
156 |     } else {
157 |       t1 *= t1;
158 |       n1 = t1 * t1 * gi1.dot2(x1, y1);
159 |     }
160 |     var t2 = 0.5 - x2*x2-y2*y2;
161 |     if(t2<0) {
162 |       n2 = 0;
163 |     } else {
164 |       t2 *= t2;
165 |       n2 = t2 * t2 * gi2.dot2(x2, y2);
166 |     }
167 |     // Add contributions from each corner to get the final noise value.
168 |     // The result is scaled to return values in the interval [-1,1].
169 |     return 70 * (n0 + n1 + n2);
170 |   };
171 | 
172 |   // 3D simplex noise
173 |   module.simplex3 = function(xin, yin, zin) {
174 |     var n0, n1, n2, n3; // Noise contributions from the four corners
175 | 
176 |     // Skew the input space to determine which simplex cell we're in
177 |     var s = (xin+yin+zin)*F3; // Hairy factor for 2D
178 |     var i = Math.floor(xin+s);
179 |     var j = Math.floor(yin+s);
180 |     var k = Math.floor(zin+s);
181 | 
182 |     var t = (i+j+k)*G3;
183 |     var x0 = xin-i+t; // The x,y distances from the cell origin, unskewed.
184 |     var y0 = yin-j+t;
185 |     var z0 = zin-k+t;
186 | 
187 |     // For the 3D case, the simplex shape is a slightly irregular tetrahedron.
188 |     // Determine which simplex we are in.
189 |     var i1, j1, k1; // Offsets for second corner of simplex in (i,j,k) coords
190 |     var i2, j2, k2; // Offsets for third corner of simplex in (i,j,k) coords
191 |     if(x0 >= y0) {
192 |       if(y0 >= z0)      { i1=1; j1=0; k1=0; i2=1; j2=1; k2=0; }
193 |       else if(x0 >= z0) { i1=1; j1=0; k1=0; i2=1; j2=0; k2=1; }
194 |       else              { i1=0; j1=0; k1=1; i2=1; j2=0; k2=1; }
195 |     } else {
196 |       if(y0 < z0)      { i1=0; j1=0; k1=1; i2=0; j2=1; k2=1; }
197 |       else if(x0 < z0) { i1=0; j1=1; k1=0; i2=0; j2=1; k2=1; }
198 |       else             { i1=0; j1=1; k1=0; i2=1; j2=1; k2=0; }
199 |     }
200 |     // A step of (1,0,0) in (i,j,k) means a step of (1-c,-c,-c) in (x,y,z),
201 |     // a step of (0,1,0) in (i,j,k) means a step of (-c,1-c,-c) in (x,y,z), and
202 |     // a step of (0,0,1) in (i,j,k) means a step of (-c,-c,1-c) in (x,y,z), where
203 |     // c = 1/6.
204 |     var x1 = x0 - i1 + G3; // Offsets for second corner
205 |     var y1 = y0 - j1 + G3;
206 |     var z1 = z0 - k1 + G3;
207 | 
208 |     var x2 = x0 - i2 + 2 * G3; // Offsets for third corner
209 |     var y2 = y0 - j2 + 2 * G3;
210 |     var z2 = z0 - k2 + 2 * G3;
211 | 
212 |     var x3 = x0 - 1 + 3 * G3; // Offsets for fourth corner
213 |     var y3 = y0 - 1 + 3 * G3;
214 |     var z3 = z0 - 1 + 3 * G3;
215 | 
216 |     // Work out the hashed gradient indices of the four simplex corners
217 |     i &= 255;
218 |     j &= 255;
219 |     k &= 255;
220 |     var gi0 = gradP[i+   perm[j+   perm[k   ]]];
221 |     var gi1 = gradP[i+i1+perm[j+j1+perm[k+k1]]];
222 |     var gi2 = gradP[i+i2+perm[j+j2+perm[k+k2]]];
223 |     var gi3 = gradP[i+ 1+perm[j+ 1+perm[k+ 1]]];
224 | 
225 |     // Calculate the contribution from the four corners
226 |     var t0 = 0.5 - x0*x0-y0*y0-z0*z0;
227 |     if(t0<0) {
228 |       n0 = 0;
229 |     } else {
230 |       t0 *= t0;
231 |       n0 = t0 * t0 * gi0.dot3(x0, y0, z0);  // (x,y) of grad3 used for 2D gradient
232 |     }
233 |     var t1 = 0.5 - x1*x1-y1*y1-z1*z1;
234 |     if(t1<0) {
235 |       n1 = 0;
236 |     } else {
237 |       t1 *= t1;
238 |       n1 = t1 * t1 * gi1.dot3(x1, y1, z1);
239 |     }
240 |     var t2 = 0.5 - x2*x2-y2*y2-z2*z2;
241 |     if(t2<0) {
242 |       n2 = 0;
243 |     } else {
244 |       t2 *= t2;
245 |       n2 = t2 * t2 * gi2.dot3(x2, y2, z2);
246 |     }
247 |     var t3 = 0.5 - x3*x3-y3*y3-z3*z3;
248 |     if(t3<0) {
249 |       n3 = 0;
250 |     } else {
251 |       t3 *= t3;
252 |       n3 = t3 * t3 * gi3.dot3(x3, y3, z3);
253 |     }
254 |     // Add contributions from each corner to get the final noise value.
255 |     // The result is scaled to return values in the interval [-1,1].
256 |     return 32 * (n0 + n1 + n2 + n3);
257 | 
258 |   };
259 | 
260 |   // ##### Perlin noise stuff
261 | 
262 |   function fade(t) {
263 |     return t*t*t*(t*(t*6-15)+10);
264 |   }
265 | 
266 |   function lerp(a, b, t) {
267 |     return (1-t)*a + t*b;
268 |   }
269 | 
270 |   // 2D Perlin Noise
271 |   module.perlin2 = function(x, y) {
272 |     // Find unit grid cell containing point
273 |     var X = Math.floor(x), Y = Math.floor(y);
274 |     // Get relative xy coordinates of point within that cell
275 |     x = x - X; y = y - Y;
276 |     // Wrap the integer cells at 255 (smaller integer period can be introduced here)
277 |     X = X & 255; Y = Y & 255;
278 | 
279 |     // Calculate noise contributions from each of the four corners
280 |     var n00 = gradP[X+perm[Y]].dot2(x, y);
281 |     var n01 = gradP[X+perm[Y+1]].dot2(x, y-1);
282 |     var n10 = gradP[X+1+perm[Y]].dot2(x-1, y);
283 |     var n11 = gradP[X+1+perm[Y+1]].dot2(x-1, y-1);
284 | 
285 |     // Compute the fade curve value for x
286 |     var u = fade(x);
287 | 
288 |     // Interpolate the four results
289 |     return lerp(
290 |         lerp(n00, n10, u),
291 |         lerp(n01, n11, u),
292 |        fade(y));
293 |   };
294 | 
295 |   // 3D Perlin Noise
296 |   module.perlin3 = function(x, y, z) {
297 |     // Find unit grid cell containing point
298 |     var X = Math.floor(x), Y = Math.floor(y), Z = Math.floor(z);
299 |     // Get relative xyz coordinates of point within that cell
300 |     x = x - X; y = y - Y; z = z - Z;
301 |     // Wrap the integer cells at 255 (smaller integer period can be introduced here)
302 |     X = X & 255; Y = Y & 255; Z = Z & 255;
303 | 
304 |     // Calculate noise contributions from each of the eight corners
305 |     var n000 = gradP[X+  perm[Y+  perm[Z  ]]].dot3(x,   y,     z);
306 |     var n001 = gradP[X+  perm[Y+  perm[Z+1]]].dot3(x,   y,   z-1);
307 |     var n010 = gradP[X+  perm[Y+1+perm[Z  ]]].dot3(x,   y-1,   z);
308 |     var n011 = gradP[X+  perm[Y+1+perm[Z+1]]].dot3(x,   y-1, z-1);
309 |     var n100 = gradP[X+1+perm[Y+  perm[Z  ]]].dot3(x-1,   y,   z);
310 |     var n101 = gradP[X+1+perm[Y+  perm[Z+1]]].dot3(x-1,   y, z-1);
311 |     var n110 = gradP[X+1+perm[Y+1+perm[Z  ]]].dot3(x-1, y-1,   z);
312 |     var n111 = gradP[X+1+perm[Y+1+perm[Z+1]]].dot3(x-1, y-1, z-1);
313 | 
314 |     // Compute the fade curve value for x, y, z
315 |     var u = fade(x);
316 |     var v = fade(y);
317 |     var w = fade(z);
318 | 
319 |     // Interpolate
320 |     return lerp(
321 |         lerp(
322 |           lerp(n000, n100, u),
323 |           lerp(n001, n101, u), w),
324 |         lerp(
325 |           lerp(n010, n110, u),
326 |           lerp(n011, n111, u), w),
327 |        v);
328 |   };
329 | 
330 | })(this);
331 | 
332 |     $(function() {
333 |         var check = function() {
334 |             var src = $('.entry-content img:visible:first').attr('src');
335 |             if (!src) return false;
336 |             $('body').css('background', 'url(' + src + ')');
337 |             return true;
338 |         };
339 | 
340 |         if (!check()) {
341 |             var timer = setInterval(function() {
342 |                 if (check()) {
343 |                     clearInterval(timer);
344 |                 }
345 |             }, 1000);
346 |         }
347 | 
348 |         var $style = $('<style>');
349 | 
350 |         $style.html([
351 |             '#container-inner, .entry-list {',
352 |               'background: rgba(255, 255, 255, 0.9);',
353 |             '}',
354 |             'body {',
355 |               'transition: background-position 0.2s ease-in-out 0, background-size 0.2s ease-in-out 0;',
356 |             '}'
357 |         ].join("\n"));
358 |         $('body').append($style);
359 |     });
360 | 
361 |     noise.seed(Math.random());
362 | 
363 |     var count = 0.0;
364 | 
365 |     var role = function() {
366 |         $('body').css('background-position', '' + noise.perlin2(count, count*2) * 100 + 'px ' + noise.perlin2(count*2, count*3) * 100 + 'px');
367 |         $('body').css('background-size', '' + ((noise.perlin2(count/2.0, count) * 250) + 260) + 'px ' + ((noise.perlin2(count/3.0, count/2.0) * 250) + 260) + 'px');
368 |         count+= 0.05;
369 |     };
370 |     role();
371 |     setInterval(role, 100);
372 | 
373 | }).call(this);
374 | 


--------------------------------------------------------------------------------
/haikei-gunyagunya2.js:
--------------------------------------------------------------------------------
  1 | /*
  2 | 
  3 | * はてなブログの背景を記事内の画像にしてぐにゃぐにゃさせる(2)
  4 | 
  5 | 背景がぐにゃぐにゃになります
  6 | 
  7 | ** 使い方
  8 | 
  9 | 以下をコピーして 詳細設定→head要素に貼り付け
 10 | 
 11 | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
 12 | <script src="http://hitode909.github.io/hatenablog-unofficial-modules/haikei-gunyagunya2.js"></script>
 13 | 
 14 | perlin noiseの生成に https://github.com/josephg/noisejs を使っています
 15 | 
 16 | */
 17 | 
 18 | (function() {
 19 | 
 20 |  // https://github.com/josephg/noisejs public domain
 21 |   /*
 22 |  * A speed-improved perlin and simplex noise algorithms for 2D.
 23 |  *
 24 |  * Based on example code by Stefan Gustavson (stegu@itn.liu.se).
 25 |  * Optimisations by Peter Eastman (peastman@drizzle.stanford.edu).
 26 |  * Better rank ordering method by Stefan Gustavson in 2012.
 27 |  * Converted to Javascript by Joseph Gentle.
 28 |  *
 29 |  * Version 2012-03-09
 30 |  *
 31 |  * This code was placed in the public domain by its original author,
 32 |  * Stefan Gustavson. You may use it as you see fit, but
 33 |  * attribution is appreciated.
 34 |  *
 35 |  */
 36 | 
 37 | (function(global){
 38 |   var module = global.noise = {};
 39 | 
 40 |   function Grad(x, y, z) {
 41 |     this.x = x; this.y = y; this.z = z;
 42 |   }
 43 |   
 44 |   Grad.prototype.dot2 = function(x, y) {
 45 |     return this.x*x + this.y*y;
 46 |   };
 47 | 
 48 |   Grad.prototype.dot3 = function(x, y, z) {
 49 |     return this.x*x + this.y*y + this.z*z;
 50 |   };
 51 | 
 52 |   var grad3 = [new Grad(1,1,0),new Grad(-1,1,0),new Grad(1,-1,0),new Grad(-1,-1,0),
 53 |                new Grad(1,0,1),new Grad(-1,0,1),new Grad(1,0,-1),new Grad(-1,0,-1),
 54 |                new Grad(0,1,1),new Grad(0,-1,1),new Grad(0,1,-1),new Grad(0,-1,-1)];
 55 | 
 56 |   var p = [151,160,137,91,90,15,
 57 |   131,13,201,95,96,53,194,233,7,225,140,36,103,30,69,142,8,99,37,240,21,10,23,
 58 |   190, 6,148,247,120,234,75,0,26,197,62,94,252,219,203,117,35,11,32,57,177,33,
 59 |   88,237,149,56,87,174,20,125,136,171,168, 68,175,74,165,71,134,139,48,27,166,
 60 |   77,146,158,231,83,111,229,122,60,211,133,230,220,105,92,41,55,46,245,40,244,
 61 |   102,143,54, 65,25,63,161, 1,216,80,73,209,76,132,187,208, 89,18,169,200,196,
 62 |   135,130,116,188,159,86,164,100,109,198,173,186, 3,64,52,217,226,250,124,123,
 63 |   5,202,38,147,118,126,255,82,85,212,207,206,59,227,47,16,58,17,182,189,28,42,
 64 |   223,183,170,213,119,248,152, 2,44,154,163, 70,221,153,101,155,167, 43,172,9,
 65 |   129,22,39,253, 19,98,108,110,79,113,224,232,178,185, 112,104,218,246,97,228,
 66 |   251,34,242,193,238,210,144,12,191,179,162,241, 81,51,145,235,249,14,239,107,
 67 |   49,192,214, 31,181,199,106,157,184, 84,204,176,115,121,50,45,127, 4,150,254,
 68 |   138,236,205,93,222,114,67,29,24,72,243,141,128,195,78,66,215,61,156,180];
 69 |   // To remove the need for index wrapping, double the permutation table length
 70 |   var perm = new Array(512);
 71 |   var gradP = new Array(512);
 72 | 
 73 |   // This isn't a very good seeding function, but it works ok. It supports 2^16
 74 |   // different seed values. Write something better if you need more seeds.
 75 |   module.seed = function(seed) {
 76 |     if(seed > 0 && seed < 1) {
 77 |       // Scale the seed out
 78 |       seed *= 65536;
 79 |     }
 80 | 
 81 |     seed = Math.floor(seed);
 82 |     if(seed < 256) {
 83 |       seed |= seed << 8;
 84 |     }
 85 | 
 86 |     for(var i = 0; i < 256; i++) {
 87 |       var v;
 88 |       if (i & 1) {
 89 |         v = p[i] ^ (seed & 255);
 90 |       } else {
 91 |         v = p[i] ^ ((seed>>8) & 255);
 92 |       }
 93 | 
 94 |       perm[i] = perm[i + 256] = v;
 95 |       gradP[i] = gradP[i + 256] = grad3[v % 12];
 96 |     }
 97 |   };
 98 | 
 99 |   module.seed(0);
100 | 
101 |   /*
102 |   for(var i=0; i<256; i++) {
103 |     perm[i] = perm[i + 256] = p[i];
104 |     gradP[i] = gradP[i + 256] = grad3[perm[i] % 12];
105 |   }*/
106 | 
107 |   // Skewing and unskewing factors for 2, 3, and 4 dimensions
108 |   var F2 = 0.5*(Math.sqrt(3)-1);
109 |   var G2 = (3-Math.sqrt(3))/6;
110 | 
111 |   var F3 = 1/3;
112 |   var G3 = 1/6;
113 | 
114 |   // 2D simplex noise
115 |   module.simplex2 = function(xin, yin) {
116 |     var n0, n1, n2; // Noise contributions from the three corners
117 |     // Skew the input space to determine which simplex cell we're in
118 |     var s = (xin+yin)*F2; // Hairy factor for 2D
119 |     var i = Math.floor(xin+s);
120 |     var j = Math.floor(yin+s);
121 |     var t = (i+j)*G2;
122 |     var x0 = xin-i+t; // The x,y distances from the cell origin, unskewed.
123 |     var y0 = yin-j+t;
124 |     // For the 2D case, the simplex shape is an equilateral triangle.
125 |     // Determine which simplex we are in.
126 |     var i1, j1; // Offsets for second (middle) corner of simplex in (i,j) coords
127 |     if(x0>y0) { // lower triangle, XY order: (0,0)->(1,0)->(1,1)
128 |       i1=1; j1=0;
129 |     } else {    // upper triangle, YX order: (0,0)->(0,1)->(1,1)
130 |       i1=0; j1=1;
131 |     }
132 |     // A step of (1,0) in (i,j) means a step of (1-c,-c) in (x,y), and
133 |     // a step of (0,1) in (i,j) means a step of (-c,1-c) in (x,y), where
134 |     // c = (3-sqrt(3))/6
135 |     var x1 = x0 - i1 + G2; // Offsets for middle corner in (x,y) unskewed coords
136 |     var y1 = y0 - j1 + G2;
137 |     var x2 = x0 - 1 + 2 * G2; // Offsets for last corner in (x,y) unskewed coords
138 |     var y2 = y0 - 1 + 2 * G2;
139 |     // Work out the hashed gradient indices of the three simplex corners
140 |     i &= 255;
141 |     j &= 255;
142 |     var gi0 = gradP[i+perm[j]];
143 |     var gi1 = gradP[i+i1+perm[j+j1]];
144 |     var gi2 = gradP[i+1+perm[j+1]];
145 |     // Calculate the contribution from the three corners
146 |     var t0 = 0.5 - x0*x0-y0*y0;
147 |     if(t0<0) {
148 |       n0 = 0;
149 |     } else {
150 |       t0 *= t0;
151 |       n0 = t0 * t0 * gi0.dot2(x0, y0);  // (x,y) of grad3 used for 2D gradient
152 |     }
153 |     var t1 = 0.5 - x1*x1-y1*y1;
154 |     if(t1<0) {
155 |       n1 = 0;
156 |     } else {
157 |       t1 *= t1;
158 |       n1 = t1 * t1 * gi1.dot2(x1, y1);
159 |     }
160 |     var t2 = 0.5 - x2*x2-y2*y2;
161 |     if(t2<0) {
162 |       n2 = 0;
163 |     } else {
164 |       t2 *= t2;
165 |       n2 = t2 * t2 * gi2.dot2(x2, y2);
166 |     }
167 |     // Add contributions from each corner to get the final noise value.
168 |     // The result is scaled to return values in the interval [-1,1].
169 |     return 70 * (n0 + n1 + n2);
170 |   };
171 | 
172 |   // 3D simplex noise
173 |   module.simplex3 = function(xin, yin, zin) {
174 |     var n0, n1, n2, n3; // Noise contributions from the four corners
175 | 
176 |     // Skew the input space to determine which simplex cell we're in
177 |     var s = (xin+yin+zin)*F3; // Hairy factor for 2D
178 |     var i = Math.floor(xin+s);
179 |     var j = Math.floor(yin+s);
180 |     var k = Math.floor(zin+s);
181 | 
182 |     var t = (i+j+k)*G3;
183 |     var x0 = xin-i+t; // The x,y distances from the cell origin, unskewed.
184 |     var y0 = yin-j+t;
185 |     var z0 = zin-k+t;
186 | 
187 |     // For the 3D case, the simplex shape is a slightly irregular tetrahedron.
188 |     // Determine which simplex we are in.
189 |     var i1, j1, k1; // Offsets for second corner of simplex in (i,j,k) coords
190 |     var i2, j2, k2; // Offsets for third corner of simplex in (i,j,k) coords
191 |     if(x0 >= y0) {
192 |       if(y0 >= z0)      { i1=1; j1=0; k1=0; i2=1; j2=1; k2=0; }
193 |       else if(x0 >= z0) { i1=1; j1=0; k1=0; i2=1; j2=0; k2=1; }
194 |       else              { i1=0; j1=0; k1=1; i2=1; j2=0; k2=1; }
195 |     } else {
196 |       if(y0 < z0)      { i1=0; j1=0; k1=1; i2=0; j2=1; k2=1; }
197 |       else if(x0 < z0) { i1=0; j1=1; k1=0; i2=0; j2=1; k2=1; }
198 |       else             { i1=0; j1=1; k1=0; i2=1; j2=1; k2=0; }
199 |     }
200 |     // A step of (1,0,0) in (i,j,k) means a step of (1-c,-c,-c) in (x,y,z),
201 |     // a step of (0,1,0) in (i,j,k) means a step of (-c,1-c,-c) in (x,y,z), and
202 |     // a step of (0,0,1) in (i,j,k) means a step of (-c,-c,1-c) in (x,y,z), where
203 |     // c = 1/6.
204 |     var x1 = x0 - i1 + G3; // Offsets for second corner
205 |     var y1 = y0 - j1 + G3;
206 |     var z1 = z0 - k1 + G3;
207 | 
208 |     var x2 = x0 - i2 + 2 * G3; // Offsets for third corner
209 |     var y2 = y0 - j2 + 2 * G3;
210 |     var z2 = z0 - k2 + 2 * G3;
211 | 
212 |     var x3 = x0 - 1 + 3 * G3; // Offsets for fourth corner
213 |     var y3 = y0 - 1 + 3 * G3;
214 |     var z3 = z0 - 1 + 3 * G3;
215 | 
216 |     // Work out the hashed gradient indices of the four simplex corners
217 |     i &= 255;
218 |     j &= 255;
219 |     k &= 255;
220 |     var gi0 = gradP[i+   perm[j+   perm[k   ]]];
221 |     var gi1 = gradP[i+i1+perm[j+j1+perm[k+k1]]];
222 |     var gi2 = gradP[i+i2+perm[j+j2+perm[k+k2]]];
223 |     var gi3 = gradP[i+ 1+perm[j+ 1+perm[k+ 1]]];
224 | 
225 |     // Calculate the contribution from the four corners
226 |     var t0 = 0.5 - x0*x0-y0*y0-z0*z0;
227 |     if(t0<0) {
228 |       n0 = 0;
229 |     } else {
230 |       t0 *= t0;
231 |       n0 = t0 * t0 * gi0.dot3(x0, y0, z0);  // (x,y) of grad3 used for 2D gradient
232 |     }
233 |     var t1 = 0.5 - x1*x1-y1*y1-z1*z1;
234 |     if(t1<0) {
235 |       n1 = 0;
236 |     } else {
237 |       t1 *= t1;
238 |       n1 = t1 * t1 * gi1.dot3(x1, y1, z1);
239 |     }
240 |     var t2 = 0.5 - x2*x2-y2*y2-z2*z2;
241 |     if(t2<0) {
242 |       n2 = 0;
243 |     } else {
244 |       t2 *= t2;
245 |       n2 = t2 * t2 * gi2.dot3(x2, y2, z2);
246 |     }
247 |     var t3 = 0.5 - x3*x3-y3*y3-z3*z3;
248 |     if(t3<0) {
249 |       n3 = 0;
250 |     } else {
251 |       t3 *= t3;
252 |       n3 = t3 * t3 * gi3.dot3(x3, y3, z3);
253 |     }
254 |     // Add contributions from each corner to get the final noise value.
255 |     // The result is scaled to return values in the interval [-1,1].
256 |     return 32 * (n0 + n1 + n2 + n3);
257 | 
258 |   };
259 | 
260 |   // ##### Perlin noise stuff
261 | 
262 |   function fade(t) {
263 |     return t*t*t*(t*(t*6-15)+10);
264 |   }
265 | 
266 |   function lerp(a, b, t) {
267 |     return (1-t)*a + t*b;
268 |   }
269 | 
270 |   // 2D Perlin Noise
271 |   module.perlin2 = function(x, y) {
272 |     // Find unit grid cell containing point
273 |     var X = Math.floor(x), Y = Math.floor(y);
274 |     // Get relative xy coordinates of point within that cell
275 |     x = x - X; y = y - Y;
276 |     // Wrap the integer cells at 255 (smaller integer period can be introduced here)
277 |     X = X & 255; Y = Y & 255;
278 | 
279 |     // Calculate noise contributions from each of the four corners
280 |     var n00 = gradP[X+perm[Y]].dot2(x, y);
281 |     var n01 = gradP[X+perm[Y+1]].dot2(x, y-1);
282 |     var n10 = gradP[X+1+perm[Y]].dot2(x-1, y);
283 |     var n11 = gradP[X+1+perm[Y+1]].dot2(x-1, y-1);
284 | 
285 |     // Compute the fade curve value for x
286 |     var u = fade(x);
287 | 
288 |     // Interpolate the four results
289 |     return lerp(
290 |         lerp(n00, n10, u),
291 |         lerp(n01, n11, u),
292 |        fade(y));
293 |   };
294 | 
295 |   // 3D Perlin Noise
296 |   module.perlin3 = function(x, y, z) {
297 |     // Find unit grid cell containing point
298 |     var X = Math.floor(x), Y = Math.floor(y), Z = Math.floor(z);
299 |     // Get relative xyz coordinates of point within that cell
300 |     x = x - X; y = y - Y; z = z - Z;
301 |     // Wrap the integer cells at 255 (smaller integer period can be introduced here)
302 |     X = X & 255; Y = Y & 255; Z = Z & 255;
303 | 
304 |     // Calculate noise contributions from each of the eight corners
305 |     var n000 = gradP[X+  perm[Y+  perm[Z  ]]].dot3(x,   y,     z);
306 |     var n001 = gradP[X+  perm[Y+  perm[Z+1]]].dot3(x,   y,   z-1);
307 |     var n010 = gradP[X+  perm[Y+1+perm[Z  ]]].dot3(x,   y-1,   z);
308 |     var n011 = gradP[X+  perm[Y+1+perm[Z+1]]].dot3(x,   y-1, z-1);
309 |     var n100 = gradP[X+1+perm[Y+  perm[Z  ]]].dot3(x-1,   y,   z);
310 |     var n101 = gradP[X+1+perm[Y+  perm[Z+1]]].dot3(x-1,   y, z-1);
311 |     var n110 = gradP[X+1+perm[Y+1+perm[Z  ]]].dot3(x-1, y-1,   z);
312 |     var n111 = gradP[X+1+perm[Y+1+perm[Z+1]]].dot3(x-1, y-1, z-1);
313 | 
314 |     // Compute the fade curve value for x, y, z
315 |     var u = fade(x);
316 |     var v = fade(y);
317 |     var w = fade(z);
318 | 
319 |     // Interpolate
320 |     return lerp(
321 |         lerp(
322 |           lerp(n000, n100, u),
323 |           lerp(n001, n101, u), w),
324 |         lerp(
325 |           lerp(n010, n110, u),
326 |           lerp(n011, n111, u), w),
327 |        v);
328 |   };
329 | 
330 | })(this);
331 | 
332 |     $(function() {
333 |         var image_index = 0;
334 |         var check = function() {
335 |             var $imgs = $('.entry-content img:visible,.entry-content [data-entry-image]');
336 |             if (!$imgs.length) return;
337 |             var $img = $($imgs[image_index++ % $imgs.length]);
338 |             var src = $img.attr('data-entry-image') || $img.attr('src');
339 |             if (!src) return false;
340 |             $('html').find(':visible:first').css('background', 'url(' + src + ')');
341 |             return true;
342 |         };
343 | 
344 |         check();
345 |         setInterval(check, 1000);
346 | 
347 |         var $style = $('<style>');
348 | 
349 |         $style.html([
350 |             '#container-inner, .entry-list {',
351 |               'background: rgba(255, 255, 255, 0.9);',
352 |             '}',
353 |             'body {',
354 |               'transition: background-position 0.2s ease-in-out 0, background-size 0.2s ease-in-out 0;',
355 |             '}'
356 |         ].join("\n"));
357 |         $('body').append($style);
358 |     });
359 | 
360 |     noise.seed(Math.random());
361 | 
362 |     var count = 0.0;
363 | 
364 |     var role = function() {
365 |         $('body').css('background-position', '' + noise.perlin2(count, count*2) * 100 + 'px ' + noise.perlin2(count*2, count*3) * 100 + 'px');
366 |         $('body').css('background-size', '' + ((noise.perlin2(count/2.0, count) * 250) + 260) + 'px ' + ((noise.perlin2(count/3.0, count/2.0) * 250) + 260) + 'px');
367 |         count+= 0.05;
368 |     };
369 |     role();
370 |     setInterval(role, 100);
371 | 
372 | }).call(this);
373 | 


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 | <html>
2 |   <h1>おはようございます!!!</h1>
3 | </html>
4 | 


--------------------------------------------------------------------------------
/nikki.css:
--------------------------------------------------------------------------------
   1 | /* CSS Document */
   2 | @import url(http://fonts.googleapis.com/css?family=Maven+Pro:700);
   3 | 
   4 | /* @Main
   5 | ====================================== */
   6 | 
   7 | 
   8 | html{
   9 |   margin:0;
  10 |   padding:0;
  11 |   }
  12 | 
  13 | body{
  14 |   margin:0;
  15 |   padding:0;
  16 |    color:#000;
  17 |    background:#022b5c url('bg.jpg') repeat-x fixed top center;
  18 |    font-family: 'Maven Pro','Helvetica','Arial','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
  19 | }
  20 | 
  21 | a{
  22 | color:#0e4b84;
  23 | }
  24 | 
  25 | a:visited{
  26 |     color:#3c6b97;
  27 | }
  28 | 
  29 | a:hover{
  30 | color:#1673c9;
  31 | }
  32 | 
  33 | a,pre{
  34 |    word-break: break-all;
  35 |    overflow: hidden;
  36 | }
  37 | 
  38 | pre{
  39 |    padding:10px;
  40 |    background:#fafafa;
  41 |    white-space: pre-wrap;
  42 |    border-radius: 3px;
  43 |   -webkit-border-radius: 3px;   
  44 |   -moz-border-radius: 3px;
  45 |   -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,.20);
  46 |   -moz-box-shadow: inset 0 0 5px rgba(0,0,0,.20); 
  47 |   box-shadow: inset 0 0 5px rgba(0,0,0,.20);
  48 | }
  49 | 
  50 | 
  51 | /* @GLOBALHEADER
  52 | ====================================== */
  53 | #globalheader-container{
  54 |     background: rgba(255, 255, 255, 0.5);
  55 |     -webkit-box-shadow: 0 0 10px rgba(0,0,0,.40);
  56 |     -moz-box-shadow: 0 0 10px rgba(0,0,0,.40); 
  57 |     box-shadow: 0 0 10px rgba(0,0,0,.40);
  58 | }
  59 |   
  60 | /* @Container
  61 | ====================================== */
  62 | #container{
  63 |   width:800px;
  64 |   margin:0 auto;
  65 |   text-align:center;
  66 | }
  67 | 
  68 | #container-inner{
  69 |   text-align:left;
  70 | }
  71 | 
  72 | /* @Blog-Title
  73 | ====================================== */
  74 | #blog-title{
  75 |  padding:40px 0;
  76 | }
  77 | 
  78 | #title{
  79 |     margin:0;
  80 |     display:inline;
  81 |     font-size:35px;
  82 |     text-shadow:0 2px 2px rgba(0,0,0,.50);
  83 |     -moz-text-shadow:0 2px 2px rgba(0,0,0,.50);
  84 |     -webkit-text-shadow: 0 2px 2px rgba(0,0,0,.50);
  85 |     filter: dropshadow(color=#333333,offX=0,offY=2);
  86 | }
  87 | 
  88 | #title a{
  89 |   text-decoration:none;
  90 |   color:#fff;
  91 | }
  92 | 
  93 | #blog-description{
  94 |     display:inline;
  95 |     color:#fff;
  96 |     margin:0;
  97 |     padding-left:1em;
  98 |     font-size:13px;
  99 |     text-shadow:0 2px 2px rgba(0,0,0,.70);
 100 |     -moz-text-shadow:0 2px 2px rgba(0,0,0,.70);
 101 |     -webkit-text-shadow: 0 2px 2px rgba(0,0,0,.70);
 102 |     filter: dropshadow(color=#333333,offX=0,offY=2);
 103 | }
 104 | 
 105 | 
 106 | /* @Top-box and Navigation Module
 107 | ====================================== */
 108 | 
 109 | 
 110 | /* @Content-Box
 111 | ====================================== */
 112 | 
 113 | 
 114 | #content-inner{
 115 |  -webkit-box-shadow: 0 0 5px rgba(0,0,0,.30);
 116 |  -moz-box-shadow: 0 0 5px rgba(0,0,0,.30); 
 117 |  box-shadow: 0 0 5px rgba(0,0,0,.30);
 118 |     -moz-border-radius: 10px;
 119 |   -webkit-border-radius: 10px;
 120 |   -ms-border-radius: 10px;
 121 |   border-radius: 10px;
 122 |   background: rgba(255, 255, 255, 0.5);
 123 |   background: url('opacity5.png') repeat\9;
 124 | }
 125 | 
 126 | #main{
 127 |     background: rgba(255, 255, 255, 1);
 128 |     background: #fff\9;
 129 |     -moz-border-radius: 10px 0 0 10px;
 130 |     -webkit-border-radius: 10px 0 0 10px;
 131 |     -ms-border-radius: 10px 0 0 10px;
 132 |     border-radius: 10px 0 0 10px;
 133 |     padding:20px;
 134 |     float:left;
 135 |     width:510px;
 136 |    -webkit-box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 137 |    -moz-box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 138 |     box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 139 |     min-height: 800px;
 140 | }
 141 | 
 142 | * html #main{
 143 |     box-shadow: 0px 0px 0px 0px rgba(255,255,255,.00);
 144 | }
 145 | 
 146 | #box1{
 147 | float:right;
 148 | width:240px;
 149 | -moz-transition:all 1s ease;
 150 | -webkit-transition:all 1s ease;
 151 | }
 152 | 
 153 | #box2{
 154 | float:right;
 155 |   -moz-transition:all 1s ease;
 156 |   -webkit-transition:all 1s ease;
 157 | }
 158 | 
 159 | #box2:after{
 160 |   content:"";
 161 |   display:block;
 162 |   clear:both;
 163 | } 
 164 | 
 165 | #footer-box:after{
 166 |   content:"";
 167 |   display:block;
 168 |   clear:both;
 169 | } 
 170 | 
 171 | /* @Section,Article
 172 | ====================================== */
 173 | .entry-content {
 174 |     font-size: 13px;
 175 |     line-height: 1.8;
 176 |     margin:1em 0;
 177 |     font-family:'Helvetica','Arial','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
 178 | }
 179 | 
 180 | .entry{
 181 |   margin-bottom:50px;
 182 |   position:relative;
 183 | }
 184 | 
 185 | .date{
 186 |   display:block;
 187 |   width: 95px;
 188 |   background: rgba(0, 0, 0, 0.5);
 189 |   background: #666\9;
 190 |   color:#fff;
 191 |   padding: 5px 15px 5px 20px;
 192 |   position:relative;
 193 |   left:-20px;
 194 |      text-shadow:0 1px 2px #000;
 195 |   -moz-text-shadow:0 1px 2px #000;
 196 |   -webkit-text-shadow: 0 1px 2px #000;
 197 |     -moz-border-radius: 0 3px  3px 0;
 198 |   -webkit-border-radius:  0 3px  3px 0;
 199 |   -ms-border-radius:  0 3px  3px 0;
 200 |   border-radius:  0 3px  3px 0;
 201 | }
 202 | 
 203 | .entry-title{
 204 |   font-size:20px;
 205 |   padding:10px 0;
 206 |   margin:0;
 207 | }
 208 | 
 209 | .entry-title a{
 210 | text-decoration:none; 
 211 | }
 212 | 
 213 | .entry-footer-section{
 214 |   font-style:italic;
 215 |   color:#666;
 216 |   margin:0;
 217 | }
 218 | 
 219 | .entry-footer-time a{
 220 |     color:#666;
 221 | }
 222 | 
 223 | .entry-footer-time a:hover{
 224 |     color:#1673C9;
 225 | }
 226 | 
 227 | .pager{
 228 |   text-align:center;
 229 | }
 230 | 
 231 | .pager a{
 232 |     background: rgba(0, 0, 0, 0.5);
 233 |     color:#fff;
 234 |     padding: 5px 15px;
 235 |     margin:0px 2px;
 236 |     font-size:13px;
 237 |     -moz-border-radius: 3px;
 238 |     -webkit-border-radius:  3px;
 239 |     -ms-border-radius:  3px;
 240 |     border-radius:  3px;
 241 |     text-decoration:none;
 242 | }
 243 | 
 244 | .pager a:hover{
 245 |     color:#fff !important;
 246 |     background: rgba(0, 0, 0, 0.7);
 247 | }
 248 | 
 249 | /* @Article headline
 250 | ====================================== */
 251 | .entry-content h1{
 252 |   font-size:16px;
 253 |   margin:0.5em 0;
 254 | }
 255 | 
 256 | .entry-content h2{
 257 |   font-size:15px;
 258 |   margin:0.5em 0;  
 259 | }
 260 | 
 261 | .entry-content h3{
 262 | font-size:14px;
 263 |   margin:0.5em 0;
 264 | }
 265 | 
 266 | .entry-content p{
 267 |   margin:0.5em 0;  
 268 | }
 269 | 
 270 | /* @Entry TextStyle
 271 | ====================================== */
 272 | .entry-content img{
 273 |   max-width:500px;
 274 |   height:auto;
 275 | }
 276 | 
 277 | .entry blockquote{
 278 |     padding: 10px;
 279 |     margin: 1em 0;
 280 |     border:1px solid #ddd;
 281 |     border-radius: 3px;
 282 |     -webkit-border-radius: 3px;
 283 |     -moz-border-radius: 3px;
 284 | }
 285 | 
 286 | .entry blockquote p{
 287 |     margin-top:0;
 288 |     margin-bottom:0;
 289 | }
 290 | 
 291 | .entry-content table {
 292 |     border-collapse: collapse;
 293 |     border-spacing: 0;
 294 | }
 295 | 
 296 | .entry-content table th,
 297 | .entry-content table td{
 298 |     border:1px solid #ddd;
 299 |     padding:5px 10px;
 300 | }
 301 | 
 302 | .entry-content table th{
 303 |     background:#fafafa;
 304 | }
 305 | 
 306 | .entry-content h1,
 307 | .entry-content h2,
 308 | .entry-content h3,
 309 | .entry-content h4,
 310 | .entry-content h5,
 311 | .entry-content h6{
 312 |   margin: 1em 0 0.5em 0;
 313 | }
 314 | 
 315 | .entry-content h1,
 316 | .entry-content h2{
 317 |     font-size:130%;
 318 | }
 319 | 
 320 | .entry-content h3{
 321 |     font-size:120%;
 322 | }
 323 | 
 324 | .entry-content h4{
 325 |     font-size:110%;
 326 | }
 327 | 
 328 | .entry-content h5{
 329 |     font-size:100%;
 330 | }
 331 | 
 332 | .entry-content h6{
 333 |     font-size:100%;
 334 | }
 335 | 
 336 | .entry-content h1,
 337 | .entry-content h2,
 338 | .entry-content h3{
 339 |     border-bottom:1px dashed #999;
 340 | }
 341 | 
 342 | .entry-content ul{
 343 |   margin: 0 0 0 1.5em;
 344 |   padding: 0;
 345 | }
 346 | 
 347 | a.keyword{
 348 |     color:#000;
 349 |     text-decoration:none;
 350 |     border-bottom: 1px solid #DEDEDE;
 351 | }
 352 | 
 353 | pre.lang-aa{
 354 |     font-size:13px;
 355 |     line-height:14px;
 356 | }
 357 | 
 358 | 
 359 | /* @Edit HEADER-MENU
 360 | ====================================== */
 361 | .entry-header-menu a{
 362 |   font-size:13px;
 363 |   display:inline;
 364 | cursor: pointer;
 365 | border-radius: 3px;
 366 | -webkit-border-radius: 3px;
 367 | -moz-border-radius: 3px;
 368 |    color: #fff;
 369 |    padding:3px 10px;
 370 |    background:#5297de;
 371 |     text-decoration: none;
 372 |     background: -webkit-gradient(
 373 | 	linear,
 374 | 	left top,
 375 | 	left bottom,
 376 | 	from(#73b0ee),
 377 | 	to(#3675b4)
 378 |     );
 379 |     background: -moz-linear-gradient(
 380 | 	top,
 381 | 	#73b0ee 0%,
 382 | 	#3675b4 100%
 383 |     );
 384 |         background: -o-linear-gradient(
 385 | 	top,
 386 | 	#73b0ee 0%,
 387 | 	#3675b4 100%
 388 |     );
 389 |    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4));
 390 |   -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4))";
 391 |      zoom: 1;
 392 |   font-weight:bold;
 393 |   border:1px solid #447296;
 394 |   text-shadow:0 -1px 0px #164a5a;
 395 |   -moz-text-shadow:0 -1px 0px #164a5a;
 396 |   -webkit-text-shadow: 0 -1px 0px #164a5a;
 397 |   position:absolute;
 398 |   top:0px;
 399 |   left:120px;
 400 | }
 401 | 
 402 | .entry-header-menu a:hover{
 403 |     background:#2f81d5;
 404 |     background: -webkit-gradient(
 405 | 	linear,
 406 | 	left top,
 407 | 	left bottom,
 408 | 	from(#73b0ee),
 409 | 	to(#1f62a7)
 410 |     );
 411 |     background: -moz-linear-gradient(
 412 | 	top,
 413 | 	#73b0ee 0%,
 414 | 	#1f62a7 100%
 415 |     );
 416 |         background: -o-linear-gradient(
 417 | 	top,
 418 | 	#73b0ee 0%,
 419 | 	#1f62a7 100%
 420 |     );
 421 |     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7));
 422 |     -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7))";        
 423 |     zoom: 1;    
 424 |     border:1px solid #2066ad;
 425 |     text-shadow: 0 -1px 0px #164A5A;
 426 |     text-decoration:none;
 427 |     color:#fff !important;
 428 | }
 429 | 
 430 | 
 431 | /* @Comment
 432 | ====================================== */
 433 | .entry-footer{
 434 |   margin-top:30px;
 435 |   margin-bottom:80px;
 436 |   font-size:12px;
 437 | }
 438 | 
 439 | .entry-footer .social-buttons{
 440 |     margin: 10px 0;
 441 | }
 442 | 
 443 | 
 444 | .comment{
 445 |   padding:0;
 446 |   list-style:none;
 447 | }
 448 | 
 449 | .comment-user-name{
 450 |     display:block;
 451 |     color:#666;
 452 |     line-height: 40px;
 453 |     margin:0;
 454 | }
 455 | 
 456 | .comment-content{
 457 |   margin-bottom:0.5em;
 458 | }
 459 | 
 460 | .comment-content p{
 461 |     margin:0;
 462 |     word-wrap: break-word;
 463 | }
 464 | 
 465 | .comment-metadata{
 466 |   margin:0;
 467 | }
 468 | 
 469 | .comment li {
 470 |     margin-bottom: 2px;
 471 | }
 472 | 
 473 | .entry-comment:last-child{
 474 |   margin-bottom:30px;
 475 | }
 476 | 
 477 | .comment-metadata a{
 478 |     text-decoration:none;
 479 |     font-style: italic;
 480 |     color: #666;
 481 | }
 482 | 
 483 | .leave-comment-title{
 484 |   display:inline;
 485 | cursor: pointer;
 486 | border-radius: 3px;
 487 | -webkit-border-radius: 3px;
 488 | -moz-border-radius: 3px;
 489 |     background:#5297de;
 490 |    color: #fff;
 491 |    padding:6px 15px;
 492 |     text-decoration: none;
 493 |     background: -webkit-gradient(
 494 | 	linear,
 495 | 	left top,
 496 | 	left bottom,
 497 | 	from(#73b0ee),
 498 | 	to(#3675b4)
 499 |     );
 500 |     background: -moz-linear-gradient(
 501 | 	top,
 502 | 	#73b0ee 0%,
 503 | 	#3675b4 100%
 504 |     );
 505 |         background: -o-linear-gradient(
 506 | 	top,
 507 | 	#73b0ee 0%,
 508 | 	#3675b4 100%
 509 |     );
 510 |    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4));
 511 |   -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4))";
 512 |   font-weight:bold;
 513 |   border:1px solid #447296;
 514 |   text-shadow:0 -1px 0px #164a5a;
 515 |   -moz-text-shadow:0 -1px 0px #164a5a;
 516 |   -webkit-text-shadow: 0 -1px 0px #164a5a;
 517 | }
 518 | 
 519 | .leave-comment-title:hover{
 520 |     color: #fff;
 521 |     background:#2f81d5;
 522 |     background: -webkit-gradient(
 523 | 	linear,
 524 | 	left top,
 525 | 	left bottom,
 526 | 	from(#73b0ee),
 527 | 	to(#1f62a7)
 528 |     );
 529 |     background: -moz-linear-gradient(
 530 | 	top,
 531 | 	#73b0ee 0%,
 532 | 	#1f62a7 100%
 533 |     );
 534 |         background: -o-linear-gradient(
 535 | 	top,
 536 | 	#73b0ee 0%,
 537 | 	#1f62a7 100%
 538 |     );
 539 |     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7));
 540 |     -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7))";        
 541 |     zoom: 1;    
 542 |     border:1px solid #2066ad;
 543 |     text-shadow: 0 -1px 0px #164A5A;
 544 |      text-decoration:none;
 545 | }
 546 | 
 547 | .hatena-id-icon{
 548 |   position:relative;
 549 |   left:-5px;
 550 |   top:15px;
 551 |    padding: 13px 17px 12px 11px;
 552 |    background:transparent url('comment.png') no-repeat center;
 553 | }
 554 | 
 555 | .comment-user-name .hatena-id-icon{
 556 |     position: relative;
 557 |     left: -5px;
 558 | }
 559 | 
 560 | /* @Module
 561 | ====================================== */
 562 | .hatena-module{
 563 | width:200px;
 564 | margin:20px 20px 50px 20px;
 565 | font-size:13px;
 566 | }
 567 | 
 568 | .hatena-module-title{
 569 |     color:#fff;
 570 |     margin:0;
 571 |     font-size:20px;
 572 |     text-shadow:0 2px 2px rgba(0,0,0,.70);
 573 |     -moz-text-shadow:0 2px 2px rgba(0,0,0,.70);
 574 |     -webkit-text-shadow: 0 2px 2px rgba(0,0,0,.70);
 575 |     padding: 0 0 0.4em 0;
 576 |     border-bottom: 1px dashed #666;
 577 |     margin-bottom:0.5em;
 578 | }
 579 | 
 580 | .hatena-module ul{
 581 |   margin:0;
 582 |   padding:0;
 583 |   list-style:none;
 584 | }
 585 | 
 586 | .hatena-module li{
 587 |   padding-bottom:0.5em;
 588 | }
 589 | 
 590 | .hatena-module li.archive{
 591 |     border-top: 1px dashed #666;
 592 |     margin-top:0.5em;
 593 |     padding-top:0.5em;
 594 | }
 595 | 
 596 | /* @Module::Profile
 597 | ====================================== */
 598 | .hatena-module .profile-icon{
 599 |   display:block;
 600 |   margin-bottom:5px;
 601 | }
 602 | 
 603 | .hatena-module-body .id a{
 604 |   font-size:13px;
 605 |   text-decoration:none;
 606 |   font-weight:bold;
 607 | }
 608 | 
 609 | .hatena-module-body .profile-description{
 610 |    margin: 0 0 5px 0;
 611 | }
 612 | 
 613 | 
 614 | /* @Module::Search
 615 | ====================================== */
 616 | 
 617 | form.search-form{
 618 | margin-top:10px;  
 619 | }
 620 | 
 621 | form.search-form input {
 622 |   border:none;
 623 |   vertical-align:middle;
 624 | }
 625 | 
 626 | .search-form .search-module-input {
 627 |     width: 168px;  
 628 |     background: -webkit-gradient(
 629 |     linear, 
 630 |     left top, 
 631 |     left bottom, 
 632 |     from(#eee), 
 633 |     color-stop(0.5, #eee),
 634 |     to(#fff)
 635 |     );
 636 |     background: -moz-linear-gradient(
 637 |     top,
 638 |     #eee 0%,
 639 |     #eee 50%,
 640 |     #fff 100%
 641 |     );
 642 |     padding: 3px;  
 643 |     margin:0;
 644 |     font-size:12px;
 645 |     border-radius: 12px;   
 646 |     -webkit-border-radius: 12px;   
 647 |     -moz-border-radius: 12px;
 648 |     background: rgba(0, 0, 0, 0.2);
 649 |     box-shadow: 0px -1px 0px #454545;
 650 | }
 651 | 
 652 | .search-form .search-module-button {
 653 |    height:23px;
 654 |    width:23px;
 655 |    border: none;  
 656 |    text-indent: -999px;
 657 |    margin-left: -3px;
 658 |    *margin-left: -5px;
 659 |    cursor: pointer;   
 660 |   background:#565656 url('/images/theme/search_w.png') 50% 50% no-repeat;
 661 |          border-radius: 12px;   
 662 |   -webkit-border-radius: 12px;   
 663 |   -moz-border-radius: 12px;
 664 | }
 665 | 
 666 | 
 667 | 
 668 | /* @Footer-Area-Module
 669 | ====================================== */
 670 | #footer-box{
 671 | }
 672 | 
 673 | /* @Footer
 674 | ====================================== */
 675 | #footer{
 676 |   clear:both;
 677 |   text-align:center;
 678 |   margin:30px 0;
 679 | }
 680 | 
 681 | #footer a{
 682 |   color:#fff;
 683 |   font-weight:bold;
 684 |   text-decoration:none;
 685 |      text-shadow:0 2px 2px #000;
 686 |   -moz-text-shadow:0 2px 2px #000;
 687 |   -webkit-text-shadow: 0 2px 2px #000;
 688 |    font-style:normal;
 689 | }
 690 | 
 691 | 
 692 | 
 693 | /* @HATENA-EMBED(FOTOLIFE,TWITPIC)
 694 | ====================================== */
 695 | 
 696 | .hatena-embed.hatena-fotolife,
 697 | .hatena-embed.twitpic{
 698 |   padding:10px 10px 30px 10px;
 699 |   margin:1em 0;
 700 |   background: transparent;
 701 |   display: inline-block;
 702 |   border:1px solid #dfdfdf;
 703 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 704 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 705 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 706 |   background:#fff;
 707 |   text-align:center;
 708 | }
 709 | 
 710 | .hatena-embed.hatena-fotolife{
 711 |   background:#fff url('/images/theme/hatena-embed/embed-fotolife.png')no-repeat right bottom;
 712 | }
 713 | 
 714 | .hatena-embed.twitpic{
 715 |   padding:10px 10px 10px 10px;
 716 | }
 717 | 
 718 | .hatena-embed.hatena-fotolife .hatena-embed-image,
 719 | .hatena-embed.twitpic .hatena-embed-image{
 720 |   display:inline-block;
 721 |   max-width:488px;
 722 | }
 723 | 
 724 | .hatena-embed.hatena-fotolife .hatena-embed-body,
 725 | .hatena-embed.hatena-fotolife .hatena-embed-body a,
 726 | .hatena-embed.twitpic .hatena-embed-body,
 727 | .hatena-embed.twitpic .hatena-embed-body a{
 728 |   text-align:center;
 729 |   font-family: 'Homemade Apple', cursive;
 730 |   color:#454545;
 731 |   font-size:16px;
 732 |   margin-top:10px;
 733 | }
 734 | 
 735 | /* @HATENA-EMBED(COCO,4SQ)
 736 | ====================================== */
 737 | .hatena-embed.hatena-coco,
 738 | .hatena-embed.foursquare{
 739 |   margin:1em 0;
 740 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 741 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 742 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 743 |   }
 744 |   
 745 | .hatena-embed.hatena-coco{
 746 | border: 1px solid #e2d279;
 747 | padding: 20px 30px;
 748 | background:#faf9e6 url('/images/theme/hatena-embed/embed-coco.png')no-repeat right bottom;
 749 | }
 750 | 
 751 | .hatena-embed.hatena-coco .hatena-embed-image,
 752 | .hatena-embed.foursquare .hatena-embed-image{
 753 |   width:100px;
 754 |   height:100px;
 755 | }
 756 | 
 757 | .hatena-embed.foursquare{
 758 | border: 1px solid #C1D5DB;
 759 | padding: 20px 30px;
 760 | background:#E6EFF2 url('/images/theme/hatena-embed/embed-4sq.png')no-repeat right bottom;
 761 | }
 762 | 
 763 | 
 764 | 
 765 | /* @HATENA-EMBED(BOOKMARK)
 766 | ====================================== */
 767 | .hatena-embed.hatena-bookmark{
 768 |    padding:15px 15px 15px 70px;
 769 |   margin:1em 0;
 770 |   background: transparent;
 771 |   border:1px solid #dfdfdf;
 772 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 773 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 774 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 775 |   background:#fff url('/images/theme/hatena-embed/embed-bookmark.png')no-repeat 10px top;
 776 |   position:relative;
 777 | }
 778 | 
 779 | .hatena-embed.hatena-bookmark a{
 780 |   text-decoration:underline;
 781 | }
 782 | 
 783 | .hatena-embed.hatena-bookmark .hatena-embed-image{
 784 |   max-height:50px;
 785 | }
 786 | 
 787 | .hatena-embed.hatena-bookmark .hatena-embed-body{
 788 | }
 789 | 
 790 | /* @HATENA-EMBED(HAIKU)
 791 | ====================================== */
 792 | .hatena-embed.hatena-haiku{
 793 |    padding:15px 15px 15px 70px;
 794 |   margin:1em 0;
 795 |   background: transparent;
 796 |   border:1px solid #dfdfdf;
 797 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 798 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 799 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 800 |   background:#fff url('/images/theme/hatena-embed/embed-haiku.png')no-repeat 5px 5px;
 801 | }
 802 | 
 803 | /* @HATENA-EMBED(MONOLITH)
 804 | ====================================== */
 805 | .hatena-embed.hatena-monolith{
 806 |   width:478px;
 807 |    padding:15px;
 808 |   margin:1em 0;
 809 |   background: transparent;
 810 |   border:1px solid #dfdfdf;
 811 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 812 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 813 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 814 |   background:#fff url('/images/theme/hatena-embed/embed-monolith.png')no-repeat right bottom;
 815 | }
 816 | 
 817 | .hatena-embed.hatena-monolith .hatena-embed-image{
 818 |   display:block;
 819 |   float:left;
 820 |   max-width:98px;
 821 |   border:1px solid #dfdfdf;
 822 | }
 823 | 
 824 | .hatena-embed.hatena-monolith .hatena-embed-body{
 825 |   float:left;
 826 |   width:368px;
 827 |   margin-left:10px;
 828 | }
 829 | 
 830 | .hatena-embed.hatena-monolith:after{
 831 |     content: "";
 832 |     display: block;
 833 |     height: 0;
 834 |     visibility: hidden;
 835 |     clear: both;
 836 | }
 837 | 
 838 | /* @HATENA-EMBED(TWITTER)
 839 | ====================================== */
 840 | .hatena-embed.twitter{
 841 |    padding:10px 0;
 842 |   margin:1em 0;
 843 |   border-bottom: 1px dotted #757575;
 844 |   border-top: 1px dotted #757575;
 845 | }
 846 | 
 847 | 
 848 | /* @HATENA-EMBED(ATND)
 849 | ====================================== */
 850 | .hatena-embed.atnd{
 851 |    padding:10px 0;
 852 |   margin:1em 0;
 853 |   border-bottom: 1px dotted #757575;
 854 |   border-top: 1px dotted #757575;
 855 |   font-family:'PT Sans Caption', Helvetica, 'ヒラギノ角ゴ Pro W3','HiraKakuProN-W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
 856 | }
 857 | 
 858 | .hatena-embed-detail.atnd-detail{
 859 |   font-size: 20px;
 860 |   font-weight:bold;
 861 |   color:#262626;
 862 | }
 863 | 
 864 | .hatena-embed-detail.atnd-detail:hover{
 865 |   color:#EA1F00;
 866 |   text-decoration:none;
 867 | }
 868 | 
 869 | .hatena-embed.atnd .content-body{
 870 |   font-size:12px;
 871 |   color:#222;
 872 | }
 873 | 
 874 | 
 875 | 
 876 | /* @PREVIEW
 877 | ====================================== */
 878 | 
 879 | body.preview{
 880 |    color:#454545;
 881 |    background:#fff;
 882 |    padding:10px;
 883 | }
 884 | 
 885 | body.preview .hatena-embed{
 886 |   margin-right:30px;
 887 | }
 888 | 
 889 | 
 890 | 
 891 | /* @About
 892 | ====================================== */
 893 | .page-about #main,
 894 | .page-archive #main{
 895 |     -moz-border-radius: 10px;
 896 |     -webkit-border-radius: 10px;
 897 |     -ms-border-radius: 10px;
 898 |     border-radius: 10px;
 899 |     width:760px;
 900 |    -webkit-box-shadow: 0px 0px 5px  rgba(0,0,0,.30);
 901 |    -moz-box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 902 |     box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 903 |     min-height: 500px;
 904 |     float:none;
 905 | }
 906 | 
 907 | .page-about dt{
 908 |     font-size:16px;
 909 |     font-weight:bold;
 910 | }
 911 | 
 912 | .page-about dd{
 913 |     margin-left:0;
 914 |     margin-bottom:30px;
 915 | }
 916 | 
 917 | .page-about img.profile-icon{
 918 |     height:16px;
 919 |     width:16px;
 920 | }
 921 | 
 922 | 
 923 | /* @Archive
 924 | ====================================== */
 925 | .page-archive #main-inner{
 926 |     font-size:14px;
 927 | }
 928 | 
 929 | .page-archive #main-inner h1{
 930 |     font-size:18px;
 931 | }
 932 | 
 933 | .page-archive #main-inner .entry-title{
 934 |     font-size:14px;
 935 | }
 936 | 
 937 | .page-archive #main-inner li{
 938 |     margin:5px 0;
 939 | }
 940 | 
 941 | #google_afc_user {
 942 |     height:0px;
 943 |     overflow:hidden;
 944 | }
 945 | 
 946 | body {
 947 |     background: #ffffff;
 948 | }
 949 | 
 950 | #title {
 951 |     text-shadow: none;
 952 | }
 953 | 
 954 | #title a {
 955 |    color: #444;
 956 | }
 957 | 
 958 | #main{
 959 |     margin-top: 70px;
 960 |     background: #ffffff;
 961 |     color: #444;
 962 |     -moz-border-radius: 0px;
 963 |     -webkit-border-radius: 0px;
 964 |     -ms-border-radius: 0px;
 965 |     border-radius: 0px;
 966 |     padding:20px;
 967 |     float:left;
 968 |     width:510px;
 969 |    -webkit-box-shadow: none;
 970 |    -moz-box-shadow: none;
 971 |     box-shadow: none;
 972 |     min-height: 800px;
 973 | }
 974 | 
 975 | #box1 {
 976 |     display: none;
 977 | }
 978 | 
 979 | #box2 {
 980 |     position: absolute;
 981 | }
 982 | 
 983 | #content-inner{
 984 |  -webkit-box-shadow: none;
 985 |  -moz-box-shadow: none;
 986 |  box-shadow: none;
 987 |     -moz-border-radius: 0;
 988 |   -webkit-border-radius: 0;
 989 |   -ms-border-radius: 0;
 990 |   border-radius: 0;
 991 |   background: transparent;
 992 | }
 993 | 
 994 | .date {
 995 |     color: #444;
 996 |     background: #ffffff;
 997 |     text-shadow: none;
 998 | }
 999 | a.keyword {
1000 |     color: #444;
1001 |     text-decoration: none;
1002 |     border-bottom: 0px;
1003 | }
1004 | 
1005 | .hatena-module-title {
1006 |     color: #444;
1007 | }
1008 | 
1009 | .pager a {
1010 |   color: #ffffff;
1011 | }
1012 | 
1013 | #footer a {
1014 |   color: #ffffff;
1015 | }
1016 | 
1017 | .entry-footer-section{
1018 |   font-style: normal;
1019 | }
1020 | .entry-footer-section a {
1021 |     text-decoration: none;
1022 | }
1023 | 
1024 | #globalheader-container{
1025 |     color: #444;
1026 |     background: transparent;
1027 |     -webkit-box-shadow: none;
1028 |     -moz-box-shadow: none;
1029 |     box-shadow: none;
1030 | }
1031 | 
1032 | .hatena-module-links {
1033 |     display: none;
1034 | }
1035 | 
1036 | .hatena-module-search-box {
1037 |     display: none;
1038 | }
1039 | 
1040 | .comment-box {
1041 |     display: none;
1042 | }
1043 | 
1044 | .hatena-module-title {
1045 |     display: none;
1046 | }
1047 | 
1048 | h1.entry-title {
1049 |     display: none;
1050 | }
1051 | 
1052 | .id {
1053 |     display: none;
1054 | }
1055 | 
1056 | .hatena-module .profile-icon {
1057 |     display: none;
1058 | }
1059 | 
1060 | .entry-footer-section .author {
1061 |     display: none;
1062 | }
1063 | 
1064 | #footer {
1065 |     visibility: hidden;
1066 | }
1067 | 
1068 | #blog-title {
1069 |     margin-left: 20px;
1070 |     padding-bottom: 20px;
1071 | }
1072 | 
1073 | #container {
1074 |     width: 550px;
1075 | }
1076 | 
1077 | .hatena-star-comment-container {
1078 |     display: none;
1079 | }
1080 | 
1081 | #globalheader-container {
1082 |     display: none;
1083 | }
1084 | 
1085 | .social-buttons {
1086 |     display: none;
1087 | }
1088 | 
1089 | .pager .pager-next {
1090 |     position: absolute;
1091 |     right: 234px;
1092 | }
1093 | 
1094 | .pager .pager-next:before {
1095 |     content: '\25bc ';
1096 |     color: rgba(0, 0, 0, 0.5);
1097 |     font-size:80%;
1098 | }
1099 | 
1100 | .pager a {
1101 |     color: rgba(0,0,0,0);
1102 | }
1103 | 
1104 | .pager:hover a {
1105 |     color: rgba(0,0,0,0) !important;
1106 | }
1107 | 
1108 | .pager {
1109 |     position: relative;
1110 | }
1111 | 
1112 | .permalink.pager .pager-next {
1113 |     position: absolute;
1114 |     top: 0px;
1115 |     right: 234px;
1116 | }
1117 | 
1118 | .permalink.pager .pager-next:before {
1119 |     content: '\25b2 ';
1120 |     color: rgba(0, 0, 0, 0.5);
1121 |     font-size:80%;
1122 | }
1123 | 
1124 | .permalink.pager .pager-prev:before {
1125 |     content: '\25bc ';
1126 |     color: rgba(0, 0, 0, 0.5);
1127 |     font-size:80%;
1128 | }
1129 | 
1130 | .permalink.pager .pager-prev {
1131 |     position: absolute;
1132 |     top: 35px;
1133 |     right: 234px;
1134 | }
1135 | 
1136 | .page-index .date {
1137 |     visibility: hidden;
1138 | }
1139 | 
1140 | .page-index .date.first {
1141 |     visibility: visible;
1142 | }
1143 | 
1144 | #blog-description {
1145 |     display: none;
1146 | }
1147 | 
1148 | .profile-description {
1149 |     display: none;
1150 | }


--------------------------------------------------------------------------------
/nikki2-my.coffee:
--------------------------------------------------------------------------------
  1 | later = (func) ->
  2 |   setTimeout func, 0
  3 | 
  4 | executeByQueue = do ->
  5 |   queue = []
  6 |   timer = null
  7 |   (func) ->
  8 |     if timer
  9 |       queue.push func
 10 |       return
 11 |     else
 12 |       timer = setInterval ->
 13 |         if queue.length > 0
 14 |           queue.shift()()
 15 |         else
 16 |           clearInterval(timer)
 17 |           timer = null
 18 |       , 1000
 19 | 
 20 |       func()
 21 | 
 22 | keyWithPrefix = (key) ->
 23 |   "blog-viewer-#{key}"
 24 | 
 25 | extractPath = (url) ->
 26 |   url.replace "#{location.protocol}//#{location.host}", ""
 27 | 
 28 | roundEpoch = (epoch) ->
 29 |   date = new Date(epoch * 1000)
 30 |   Math.floor(new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() / 1000)
 31 | 
 32 | throttle = (fn, delay) ->
 33 |   timer = null
 34 |   ->
 35 |     return if timer
 36 |     context = this
 37 |     args = arguments
 38 |     timer = setTimeout ->
 39 |       timer = null
 40 |       fn.apply context, args
 41 |     ,delay || 100
 42 | 
 43 | debounce = `function (func, threshold, execAsap) {
 44 |     var timeout;
 45 |     return function debounced () {
 46 |         var obj = this, args = arguments;
 47 |         function delayed () {
 48 |             if (!execAsap)
 49 |                 func.apply(obj, args);
 50 |             timeout = null;
 51 |         };
 52 |         if (timeout)
 53 |             clearTimeout(timeout);
 54 |         else if (execAsap)
 55 |             func.apply(obj, args);
 56 |         timeout = setTimeout(delayed, threshold || 100);
 57 |     };
 58 | }`
 59 | 
 60 | # 画面のより下の途中に入るとおかしくなるのでは
 61 | checkScroll = (job) ->
 62 | 
 63 |   entry = $('#main-inner article:last')
 64 | 
 65 |   unless entry.length > 0
 66 |     job()
 67 |     return
 68 | 
 69 |   top_before = entry.position().top
 70 |   job()
 71 |   top_after = entry.position().top
 72 |   # console.log "scroll #{top_after - top_before}"
 73 |   window.scrollBy(0, top_after - top_before)
 74 | 
 75 | updateStars = debounce ->
 76 |   Hatena.Locale.updateTimestamps(document.body)
 77 |   $(document.body).find('span.hatena-star-comment-container, span.hatena-star-star-container').remove()
 78 |   Hatena.Star.EntryLoader.loadNewEntries(document.body)
 79 | ,1000
 80 | 
 81 | scrollToEntry = debounce (entry) ->
 82 |   return unless entry
 83 |   top = $(entry).position().top - $('#blog-title-inner').height() - 20
 84 |   if Math.abs($(window).scrollTop() - top) < $(window).height() * 0.4
 85 |     window.scrollTo(0, top)
 86 |   else
 87 |     $('html,body').animate({ scrollTop: top }, 300)
 88 | 
 89 | autoloader = throttle ->
 90 |   if $(window).scrollTop() <= 0
 91 |     entry = $('#main-inner article:first')
 92 |     return unless entry.length
 93 |     created = new Date(entry.find('time').attr('datetime'))
 94 |     showEntries(created.getTime() / 1000)
 95 |     window.scrollTo(0, 1)
 96 | 
 97 |   if $(window).scrollTop() + $(window).height() >= $(document).height()
 98 |     entry = $('#main-inner article:last')
 99 |     return unless entry.length
100 |     created = new Date(entry.find('time').attr('datetime'))
101 |     showEntries(created.getTime() / 1000 + 3600*24*3)
102 | ,500
103 | 
104 | entryFromTime = (time) ->
105 |   date = new Date(time)
106 | 
107 |   found = null
108 |   found_created = 0
109 |   $('#main-inner article').each ->
110 |     entry = $(this)
111 |     entry_created = new Date(entry.find('time').attr('datetime'))
112 |     if Math.abs(entry_created - date) < Math.abs(found_created - date)
113 |       found = entry
114 |       found_created = entry_created
115 | 
116 |   found
117 | 
118 | entryFromScrollTop = ->
119 |   top = $(document).scrollTop()
120 |   window_height = $(window).height()
121 |   found = null
122 |   distance = $(document).height()
123 |   $('#main-inner article').each ->
124 |     entry = $(this)
125 |     entry_top = entry.position().top
126 |     entry_height = entry.height()
127 |     if Math.abs(top - entry_top) < distance
128 |       found = entry
129 |       distance = Math.abs(top - entry_top)
130 | 
131 |   found
132 | 
133 | 
134 | formatDate = (date) ->
135 |   return "" if isNaN(date.getFullYear())
136 |   "#{date.getFullYear()}-#{date.getMonth()+1}-#{date.getDate()}"
137 | 
138 | # todo: image load fail
139 | waitForLoadImages = (element, callback) ->
140 |   images = $(element).find('img')
141 |   if images.length == 0
142 |     callback(element)
143 |     return
144 | 
145 |   count = 0
146 |   images.each ->
147 |     image = $(this)
148 |     image.load ->
149 |       # console.log("image loaded #{image[0].width} x #{image[0].height}")
150 |       count++
151 |       if count == images.length
152 |         callback(element)
153 | 
154 | scrollByLocation = ->
155 |   pathname = location.pathname
156 | 
157 |   # if pathname == "/"
158 |   #   scrollToEntry($('article:first'))
159 |   #   return
160 | 
161 |   link = $(".entry-footer-time a[href=\"#{pathname}\"]")
162 |   return unless link.length
163 | 
164 |   scrollToEntry(link.parents('article'))
165 | 
166 | appendEntry = (entry) ->
167 |   entry = $(entry)
168 |   uuid = entry.attr('data-uuid')
169 |   entry_created = new Date(entry.find('time').attr('datetime'))
170 | 
171 |   # 何日前っていうの消すので日付をパーマリンクにする
172 |   entry.find('header .date a').attr
173 |     href: entry.find('.entry-footer-time a').attr('href')
174 | 
175 |   # 四角は出さない
176 |   title = entry.find('h1.entry-title')
177 |   if title.text() == '■'
178 |     title.css
179 |       display: 'none'
180 | 
181 |   entry_old = null
182 |   entry_old_created = null
183 |   entry_recent = null
184 |   entry_recent_created = null
185 | 
186 |   $('#main-inner article').each ->
187 |     tmp_entry = $(this)
188 |     tmp_created = new Date(tmp_entry.find('time').attr('datetime'))
189 | 
190 |     if tmp_created <= entry_created && (!entry_old || entry_old_created < tmp_created)
191 |       entry_old = tmp_entry
192 |       entry_old_created = tmp_created
193 | 
194 | 
195 |     if tmp_created >= entry_created && (!entry_recent || entry_recent_created > tmp_created)
196 |       entry_recent = tmp_entry
197 |       entry_recent_created = tmp_created
198 | 
199 |   if entry_old && entry_old.attr('data-uuid') == uuid
200 |     entry.remove()
201 |     return
202 |   if entry_recent && entry_recent.attr('data-uuid') == uuid
203 |     entry.remove()
204 |     return
205 | 
206 |   later ->
207 |     updateStars()
208 | 
209 |   checkScroll ->
210 | 
211 |     if entry_old
212 |       entry_old.after(entry)
213 |       return
214 | 
215 |     if entry_recent
216 |       entry_recent.before(entry)
217 |       return
218 | 
219 |     $('#main-inner').prepend(entry)
220 | 
221 | fetchedHash = {}
222 | showEntries = (epoch) ->
223 |   return unless epoch
224 |   return if epoch < 0
225 |   return if isNaN(epoch)        #???
226 |   deferred = $.Deferred()
227 |   epoch = roundEpoch(epoch)
228 |   url = "/?page=#{epoch}"
229 | 
230 |   if fetchedHash[url]
231 |     later ->
232 |       deferred.resolve()
233 |     return deferred.promise()
234 | 
235 |   fetchedHash[url] = true
236 | 
237 |   executeByQueue ->
238 |     $.ajax
239 |       url: url
240 |       dataType: 'html'
241 |     .success (page) ->
242 |       fragment = document.createDocumentFragment()
243 |       $(page).find('article').each ->
244 |         entry = $(this)
245 |         uuid = entry.attr('data-uuid')
246 | 
247 |         return if $("article[data-uuid=\"#{uuid}\"]").length > 0
248 | 
249 |         return if entry.is('.no-entry')
250 | 
251 |         if entry.find('img').length > 0
252 |           $('#loading-entry').append(entry)
253 |           waitForLoadImages this, (entry) ->
254 |             appendEntry(entry)
255 |         else
256 |           appendEntry(entry)
257 | 
258 |       deferred.resolve()
259 | 
260 |   deferred.promise()
261 | 
262 | fetchYear = (year, res) ->
263 | 
264 |   res ||=
265 |     entries: []
266 |     completed: false
267 | 
268 |   deferred = $.Deferred()
269 | 
270 |   $.ajax
271 |     url: '/archive'
272 |     data:
273 |       year: year
274 |     dataType: 'html'
275 |   .success (page) ->
276 |     date = null
277 |     $(page).find('h1, a.entry-title').each ->
278 |       elem = this
279 |       try
280 |         if elem.tagName.toLowerCase() == 'h1'
281 |           [_, year, month, day] = $(elem).text().match /(\d{4})-(\d{2})-(\d{2})/
282 |           date =
283 |             year: +year
284 |             month: +month
285 |             day: +day
286 |         else if elem.tagName.toLowerCase() == 'a'
287 |           res.entries.unshift
288 |             url: elem.href
289 |             title: $(elem).text()
290 |             date: date
291 | 
292 |     res.completed = $(page).find('a.entry-title').length == 0
293 | 
294 |     deferred.resolve(res)
295 | 
296 |   deferred.promise()
297 | 
298 | collectCalendar = ->
299 |   deferred = $.Deferred()
300 | 
301 |   year = new Date().getFullYear()
302 | 
303 |   fetchYear(year).then (calendar)->
304 |     if calendar.completed
305 |       deferred.resolve(calendar)
306 |       return
307 | 
308 |     year--
309 |     fetchYear(year, calendar).then arguments.callee
310 | 
311 |   deferred.promise()
312 | 
313 | main = ->
314 |   if Hatena && Hatena.Star
315 |     Hatena.Star.SiteConfig =
316 |       entryNodes:
317 |         'div.entry-inner':
318 |           uri: 'a.bookmark'
319 |           title: 'h1.entry-title'
320 |           container: 'p.entry-footer-section'
321 | 
322 |   $('<div>').attr
323 |     id: 'loading-entry'
324 |   .css
325 |     display: 'none'
326 |   .appendTo($('body'))
327 | 
328 | 
329 |   articles = []
330 |   $('article').each ->
331 |     entry = this
332 |     articles.push($(entry).clone())
333 |     $(entry).remove()
334 | 
335 |   $.each articles, ->
336 |     appendEntry(this)
337 | 
338 |   # setTimeout ->
339 |   #   scrollByLocation()
340 |   # ,100
341 | 
342 |   module_dummy = $('<div>').addClass('hatena-module').addClass('hatena-module-profile')
343 | 
344 |   $('.hatena-follow-button-box').appendTo(module_dummy)
345 |   module_dummy.appendTo($('#blog-title-inner'))
346 | 
347 | 
348 |   $('body').delegate '#blog-title a, header.entry-header a, .entry-footer-time a, h1.entry-title a', 'click', (event) ->
349 |     return true unless history && history.pushState
350 |     path = extractPath(this.href)
351 |     history.pushState(path, path, path)
352 |     scrollByLocation()
353 |     false
354 | 
355 |   $(window).bind 'popstate', (event) ->
356 |     scrollByLocation()
357 | 
358 |   setTimeout ->
359 |     updateStars()
360 |   ,1000
361 | 
362 |   $(window).bind 'scroll', ->
363 |     autoloader()
364 | 
365 | 
366 | 
367 | 
368 | main()
369 | window.scrollBy(0,1)
370 | $('.pager').remove()
371 | 


--------------------------------------------------------------------------------
/nikki2-my.css:
--------------------------------------------------------------------------------
   1 | /* CSS Document */
   2 | @import url(http://fonts.googleapis.com/css?family=Maven+Pro:700);
   3 | 
   4 | /* @Main
   5 | ====================================== */
   6 | 
   7 | 
   8 | html{
   9 |   margin:0;
  10 |   padding:0;
  11 |   }
  12 | 
  13 | body{
  14 |   margin:0;
  15 |   padding:0;
  16 |    color:#000;
  17 |    background:#022b5c url('bg.jpg') repeat-x fixed top center;
  18 |    font-family: 'Maven Pro','Helvetica','Arial','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
  19 | }
  20 | 
  21 | a{
  22 | color:#0e4b84;
  23 | }
  24 | 
  25 | a:visited{
  26 |     color:#3c6b97;
  27 | }
  28 | 
  29 | a:hover{
  30 | color:#1673c9;
  31 | }
  32 | 
  33 | a,pre{
  34 |    word-break: break-all;
  35 |    overflow: hidden;
  36 | }
  37 | 
  38 | pre{
  39 |    padding:10px;
  40 |    background:#fafafa;
  41 |    white-space: pre-wrap;
  42 |    border-radius: 3px;
  43 |   -webkit-border-radius: 3px;   
  44 |   -moz-border-radius: 3px;
  45 |   -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,.20);
  46 |   -moz-box-shadow: inset 0 0 5px rgba(0,0,0,.20); 
  47 |   box-shadow: inset 0 0 5px rgba(0,0,0,.20);
  48 | }
  49 | 
  50 | 
  51 | /* @GLOBALHEADER
  52 | ====================================== */
  53 | #globalheader-container{
  54 |     background: rgba(255, 255, 255, 0.5);
  55 |     -webkit-box-shadow: 0 0 10px rgba(0,0,0,.40);
  56 |     -moz-box-shadow: 0 0 10px rgba(0,0,0,.40); 
  57 |     box-shadow: 0 0 10px rgba(0,0,0,.40);
  58 | }
  59 |   
  60 | /* @Container
  61 | ====================================== */
  62 | #container{
  63 |   width:800px;
  64 |   margin:0 auto;
  65 |   text-align:center;
  66 | }
  67 | 
  68 | #container-inner{
  69 |   text-align:left;
  70 | }
  71 | 
  72 | /* @Blog-Title
  73 | ====================================== */
  74 | 
  75 | #title{
  76 |     margin:0;
  77 |     display:inline;
  78 |     font-size:35px;
  79 |     text-shadow:0 2px 2px rgba(0,0,0,.50);
  80 |     -moz-text-shadow:0 2px 2px rgba(0,0,0,.50);
  81 |     -webkit-text-shadow: 0 2px 2px rgba(0,0,0,.50);
  82 |     filter: dropshadow(color=#333333,offX=0,offY=2);
  83 | }
  84 | 
  85 | #title a{
  86 |   text-decoration:none;
  87 |   color:#fff;
  88 | }
  89 | 
  90 | #blog-description{
  91 |     display:inline;
  92 |     color:#fff;
  93 |     margin:0;
  94 |     padding-left:1em;
  95 |     font-size:13px;
  96 |     text-shadow:0 2px 2px rgba(0,0,0,.70);
  97 |     -moz-text-shadow:0 2px 2px rgba(0,0,0,.70);
  98 |     -webkit-text-shadow: 0 2px 2px rgba(0,0,0,.70);
  99 |     filter: dropshadow(color=#333333,offX=0,offY=2);
 100 | }
 101 | 
 102 | 
 103 | /* @Top-box and Navigation Module
 104 | ====================================== */
 105 | 
 106 | 
 107 | /* @Content-Box
 108 | ====================================== */
 109 | 
 110 | 
 111 | #content-inner{
 112 |  -webkit-box-shadow: 0 0 5px rgba(0,0,0,.30);
 113 |  -moz-box-shadow: 0 0 5px rgba(0,0,0,.30); 
 114 |  box-shadow: 0 0 5px rgba(0,0,0,.30);
 115 |     -moz-border-radius: 10px;
 116 |   -webkit-border-radius: 10px;
 117 |   -ms-border-radius: 10px;
 118 |   border-radius: 10px;
 119 |   background: rgba(255, 255, 255, 0.5);
 120 |   background: url('opacity5.png') repeat\9;
 121 | }
 122 | 
 123 | #main{
 124 |     background: rgba(255, 255, 255, 1);
 125 |     background: #fff\9;
 126 |     -moz-border-radius: 10px 0 0 10px;
 127 |     -webkit-border-radius: 10px 0 0 10px;
 128 |     -ms-border-radius: 10px 0 0 10px;
 129 |     border-radius: 10px 0 0 10px;
 130 |     padding:20px;
 131 |     float:left;
 132 |     width:510px;
 133 |    -webkit-box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 134 |    -moz-box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 135 |     box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 136 |     min-height: 800px;
 137 | }
 138 | 
 139 | * html #main{
 140 |     box-shadow: 0px 0px 0px 0px rgba(255,255,255,.00);
 141 | }
 142 | 
 143 | #box1{
 144 | float:right;
 145 | width:240px;
 146 | -moz-transition:all 1s ease;
 147 | -webkit-transition:all 1s ease;
 148 | }
 149 | 
 150 | #box2{
 151 | float:right;
 152 |   -moz-transition:all 1s ease;
 153 |   -webkit-transition:all 1s ease;
 154 | }
 155 | 
 156 | #box2:after{
 157 |   content:"";
 158 |   display:block;
 159 |   clear:both;
 160 | } 
 161 | 
 162 | #footer-box:after{
 163 |   content:"";
 164 |   display:block;
 165 |   clear:both;
 166 | } 
 167 | 
 168 | /* @Section,Article
 169 | ====================================== */
 170 | .entry-content {
 171 |     font-size: 13px;
 172 |     line-height: 1.8;
 173 |     margin:1em 0;
 174 |     font-family:'Helvetica','Arial','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
 175 | }
 176 | 
 177 | .entry{
 178 |   margin-bottom:50px;
 179 |   position:relative;
 180 | }
 181 | 
 182 | .date{
 183 |   display:block;
 184 |   width: 95px;
 185 |   background: rgba(0, 0, 0, 0.5);
 186 |   background: #666\9;
 187 |   color:#fff;
 188 |   padding: 5px 15px 5px 20px;
 189 |   position:relative;
 190 |   left:-20px;
 191 |      text-shadow:0 1px 2px #000;
 192 |   -moz-text-shadow:0 1px 2px #000;
 193 |   -webkit-text-shadow: 0 1px 2px #000;
 194 |     -moz-border-radius: 0 3px  3px 0;
 195 |   -webkit-border-radius:  0 3px  3px 0;
 196 |   -ms-border-radius:  0 3px  3px 0;
 197 |   border-radius:  0 3px  3px 0;
 198 | }
 199 | 
 200 | .entry-title{
 201 |   font-weight: normal;
 202 |   font-size:18px;
 203 |   padding:10px 0;
 204 |   margin:0;
 205 | }
 206 | 
 207 | .entry-title a{
 208 |   color: #444;
 209 |   text-decoration:none; 
 210 | }
 211 | 
 212 | .entry-footer-section{
 213 |   font-style:italic;
 214 |   color:#666;
 215 |   margin:0;
 216 | }
 217 | 
 218 | .entry-footer-time {
 219 |     display: none;
 220 | }
 221 | 
 222 | .entry-footer-time a{
 223 |     color:#666;
 224 | }
 225 | 
 226 | .entry-footer-time a:hover{
 227 |     color:#1673C9;
 228 | }
 229 | 
 230 | .pager{
 231 |   text-align:center;
 232 | }
 233 | 
 234 | .pager a{
 235 |     background: rgba(0, 0, 0, 0.5);
 236 |     color:#fff;
 237 |     padding: 5px 15px;
 238 |     margin:0px 2px;
 239 |     font-size:13px;
 240 |     -moz-border-radius: 3px;
 241 |     -webkit-border-radius:  3px;
 242 |     -ms-border-radius:  3px;
 243 |     border-radius:  3px;
 244 |     text-decoration:none;
 245 | }
 246 | 
 247 | .pager a:hover{
 248 |     color:#fff !important;
 249 |     background: rgba(0, 0, 0, 0.7);
 250 | }
 251 | 
 252 | /* @Article headline
 253 | ====================================== */
 254 | .entry-content h1{
 255 |   font-size:16px;
 256 |   margin:0.5em 0;
 257 | }
 258 | 
 259 | .entry-content h2{
 260 |   font-size:15px;
 261 |   margin:0.5em 0;  
 262 | }
 263 | 
 264 | .entry-content h3{
 265 | font-size:14px;
 266 |   margin:0.5em 0;
 267 | }
 268 | 
 269 | .entry-content p{
 270 |   margin:0.5em 0;  
 271 | }
 272 | 
 273 | /* @Entry TextStyle
 274 | ====================================== */
 275 | .entry-content img{
 276 |   max-width:500px;
 277 |   height:auto;
 278 | }
 279 | 
 280 | .entry blockquote{
 281 |     padding: 10px;
 282 |     margin: 1em 0;
 283 |     border:1px solid #ddd;
 284 |     border-radius: 3px;
 285 |     -webkit-border-radius: 3px;
 286 |     -moz-border-radius: 3px;
 287 | }
 288 | 
 289 | .entry blockquote p{
 290 |     margin-top:0;
 291 |     margin-bottom:0;
 292 | }
 293 | 
 294 | .entry-content table {
 295 |     border-collapse: collapse;
 296 |     border-spacing: 0;
 297 | }
 298 | 
 299 | .entry-content table th,
 300 | .entry-content table td{
 301 |     border:1px solid #ddd;
 302 |     padding:5px 10px;
 303 | }
 304 | 
 305 | .entry-content table th{
 306 |     background:#fafafa;
 307 | }
 308 | 
 309 | .entry-content h1,
 310 | .entry-content h2,
 311 | .entry-content h3,
 312 | .entry-content h4,
 313 | .entry-content h5,
 314 | .entry-content h6{
 315 |   margin: 1em 0 0.5em 0;
 316 | }
 317 | 
 318 | .entry-content h1,
 319 | .entry-content h2{
 320 |     font-size:130%;
 321 | }
 322 | 
 323 | .entry-content h3{
 324 |     font-size:120%;
 325 | }
 326 | 
 327 | .entry-content h4{
 328 |     font-size:110%;
 329 | }
 330 | 
 331 | .entry-content h5{
 332 |     font-size:100%;
 333 | }
 334 | 
 335 | .entry-content h6{
 336 |     font-size:100%;
 337 | }
 338 | 
 339 | .entry-content h1,
 340 | .entry-content h2,
 341 | .entry-content h3{
 342 |     border-bottom:1px dashed #999;
 343 | }
 344 | 
 345 | .entry-content ul{
 346 |   margin: 0 0 0 1.5em;
 347 |   padding: 0;
 348 | }
 349 | 
 350 | a.keyword{
 351 |     color:#000;
 352 |     text-decoration:none;
 353 |     border-bottom: 1px solid #DEDEDE;
 354 | }
 355 | 
 356 | pre.lang-aa{
 357 |     font-size:13px;
 358 |     line-height:14px;
 359 | }
 360 | 
 361 | 
 362 | /* @Edit HEADER-MENU
 363 | ====================================== */
 364 | .entry-header-menu a{
 365 |   font-size:13px;
 366 |   display:inline;
 367 | cursor: pointer;
 368 | border-radius: 3px;
 369 | -webkit-border-radius: 3px;
 370 | -moz-border-radius: 3px;
 371 |    color: #fff;
 372 |    padding:3px 10px;
 373 |    background:#5297de;
 374 |     text-decoration: none;
 375 |     background: -webkit-gradient(
 376 | 	linear,
 377 | 	left top,
 378 | 	left bottom,
 379 | 	from(#73b0ee),
 380 | 	to(#3675b4)
 381 |     );
 382 |     background: -moz-linear-gradient(
 383 | 	top,
 384 | 	#73b0ee 0%,
 385 | 	#3675b4 100%
 386 |     );
 387 |         background: -o-linear-gradient(
 388 | 	top,
 389 | 	#73b0ee 0%,
 390 | 	#3675b4 100%
 391 |     );
 392 |    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4));
 393 |   -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4))";
 394 |      zoom: 1;
 395 |   font-weight:bold;
 396 |   border:1px solid #447296;
 397 |   text-shadow:0 -1px 0px #164a5a;
 398 |   -moz-text-shadow:0 -1px 0px #164a5a;
 399 |   -webkit-text-shadow: 0 -1px 0px #164a5a;
 400 |   position:absolute;
 401 |   top:0px;
 402 |   left:120px;
 403 | }
 404 | 
 405 | .entry-header-menu a:hover{
 406 |     background:#2f81d5;
 407 |     background: -webkit-gradient(
 408 | 	linear,
 409 | 	left top,
 410 | 	left bottom,
 411 | 	from(#73b0ee),
 412 | 	to(#1f62a7)
 413 |     );
 414 |     background: -moz-linear-gradient(
 415 | 	top,
 416 | 	#73b0ee 0%,
 417 | 	#1f62a7 100%
 418 |     );
 419 |         background: -o-linear-gradient(
 420 | 	top,
 421 | 	#73b0ee 0%,
 422 | 	#1f62a7 100%
 423 |     );
 424 |     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7));
 425 |     -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7))";        
 426 |     zoom: 1;    
 427 |     border:1px solid #2066ad;
 428 |     text-shadow: 0 -1px 0px #164A5A;
 429 |     text-decoration:none;
 430 |     color:#fff !important;
 431 | }
 432 | 
 433 | 
 434 | /* @Comment
 435 | ====================================== */
 436 | .entry-footer{
 437 |   margin-top:30px;
 438 |   margin-bottom:80px;
 439 |   font-size:12px;
 440 | }
 441 | 
 442 | .entry-footer .social-buttons{
 443 |     margin: 10px 0;
 444 | }
 445 | 
 446 | 
 447 | .comment{
 448 |   padding:0;
 449 |   list-style:none;
 450 | }
 451 | 
 452 | .comment-user-name{
 453 |     display:block;
 454 |     color:#666;
 455 |     line-height: 40px;
 456 |     margin:0;
 457 | }
 458 | 
 459 | .comment-content{
 460 |   margin-bottom:0.5em;
 461 | }
 462 | 
 463 | .comment-content p{
 464 |     margin:0;
 465 |     word-wrap: break-word;
 466 | }
 467 | 
 468 | .comment-metadata{
 469 |   margin:0;
 470 | }
 471 | 
 472 | .comment li {
 473 |     margin-bottom: 2px;
 474 | }
 475 | 
 476 | .entry-comment:last-child{
 477 |   margin-bottom:30px;
 478 | }
 479 | 
 480 | .comment-metadata a{
 481 |     text-decoration:none;
 482 |     font-style: italic;
 483 |     color: #666;
 484 | }
 485 | 
 486 | .leave-comment-title{
 487 |   display:inline;
 488 | cursor: pointer;
 489 | border-radius: 3px;
 490 | -webkit-border-radius: 3px;
 491 | -moz-border-radius: 3px;
 492 |     background:#5297de;
 493 |    color: #fff;
 494 |    padding:6px 15px;
 495 |     text-decoration: none;
 496 |     background: -webkit-gradient(
 497 | 	linear,
 498 | 	left top,
 499 | 	left bottom,
 500 | 	from(#73b0ee),
 501 | 	to(#3675b4)
 502 |     );
 503 |     background: -moz-linear-gradient(
 504 | 	top,
 505 | 	#73b0ee 0%,
 506 | 	#3675b4 100%
 507 |     );
 508 |         background: -o-linear-gradient(
 509 | 	top,
 510 | 	#73b0ee 0%,
 511 | 	#3675b4 100%
 512 |     );
 513 |    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4));
 514 |   -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4))";
 515 |   font-weight:bold;
 516 |   border:1px solid #447296;
 517 |   text-shadow:0 -1px 0px #164a5a;
 518 |   -moz-text-shadow:0 -1px 0px #164a5a;
 519 |   -webkit-text-shadow: 0 -1px 0px #164a5a;
 520 | }
 521 | 
 522 | .leave-comment-title:hover{
 523 |     color: #fff;
 524 |     background:#2f81d5;
 525 |     background: -webkit-gradient(
 526 | 	linear,
 527 | 	left top,
 528 | 	left bottom,
 529 | 	from(#73b0ee),
 530 | 	to(#1f62a7)
 531 |     );
 532 |     background: -moz-linear-gradient(
 533 | 	top,
 534 | 	#73b0ee 0%,
 535 | 	#1f62a7 100%
 536 |     );
 537 |         background: -o-linear-gradient(
 538 | 	top,
 539 | 	#73b0ee 0%,
 540 | 	#1f62a7 100%
 541 |     );
 542 |     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7));
 543 |     -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7))";        
 544 |     zoom: 1;    
 545 |     border:1px solid #2066ad;
 546 |     text-shadow: 0 -1px 0px #164A5A;
 547 |      text-decoration:none;
 548 | }
 549 | 
 550 | .hatena-id-icon{
 551 |   position:relative;
 552 |   left:-5px;
 553 |   top:15px;
 554 |    padding: 13px 17px 12px 11px;
 555 |    background:transparent url('comment.png') no-repeat center;
 556 | }
 557 | 
 558 | .comment-user-name .hatena-id-icon{
 559 |     position: relative;
 560 |     left: -5px;
 561 | }
 562 | 
 563 | /* @Module
 564 | ====================================== */
 565 | /* .hatena-module{ */
 566 | /* width:200px; */
 567 | /* margin:20px 20px 50px 20px; */
 568 | /* font-size:13px; */
 569 | /* } */
 570 | 
 571 | .hatena-module-title{
 572 |     color:#fff;
 573 |     margin:0;
 574 |     font-size:20px;
 575 |     text-shadow:0 2px 2px rgba(0,0,0,.70);
 576 |     -moz-text-shadow:0 2px 2px rgba(0,0,0,.70);
 577 |     -webkit-text-shadow: 0 2px 2px rgba(0,0,0,.70);
 578 |     padding: 0 0 0.4em 0;
 579 |     border-bottom: 1px dashed #666;
 580 |     margin-bottom:0.5em;
 581 | }
 582 | 
 583 | .hatena-module ul{
 584 |   margin:0;
 585 |   padding:0;
 586 |   list-style:none;
 587 | }
 588 | 
 589 | .hatena-module li{
 590 |   padding-bottom:0.5em;
 591 | }
 592 | 
 593 | .hatena-module li.archive{
 594 |     border-top: 1px dashed #666;
 595 |     margin-top:0.5em;
 596 |     padding-top:0.5em;
 597 | }
 598 | 
 599 | /* @Module::Profile
 600 | ====================================== */
 601 | .hatena-module .profile-icon{
 602 |   display:block;
 603 |   margin-bottom:5px;
 604 | }
 605 | 
 606 | .hatena-module-body .id a{
 607 |   font-size:13px;
 608 |   text-decoration:none;
 609 |   font-weight:bold;
 610 | }
 611 | 
 612 | .hatena-module-body .profile-description{
 613 |    margin: 0 0 5px 0;
 614 | }
 615 | 
 616 | 
 617 | /* @Module::Search
 618 | ====================================== */
 619 | 
 620 | form.search-form{
 621 | margin-top:10px;  
 622 | }
 623 | 
 624 | form.search-form input {
 625 |   border:none;
 626 |   vertical-align:middle;
 627 | }
 628 | 
 629 | .search-form .search-module-input {
 630 |     width: 168px;  
 631 |     background: -webkit-gradient(
 632 |     linear, 
 633 |     left top, 
 634 |     left bottom, 
 635 |     from(#eee), 
 636 |     color-stop(0.5, #eee),
 637 |     to(#fff)
 638 |     );
 639 |     background: -moz-linear-gradient(
 640 |     top,
 641 |     #eee 0%,
 642 |     #eee 50%,
 643 |     #fff 100%
 644 |     );
 645 |     padding: 3px;  
 646 |     margin:0;
 647 |     font-size:12px;
 648 |     border-radius: 12px;   
 649 |     -webkit-border-radius: 12px;   
 650 |     -moz-border-radius: 12px;
 651 |     background: rgba(0, 0, 0, 0.2);
 652 |     box-shadow: 0px -1px 0px #454545;
 653 | }
 654 | 
 655 | .search-form .search-module-button {
 656 |    height:23px;
 657 |    width:23px;
 658 |    border: none;  
 659 |    text-indent: -999px;
 660 |    margin-left: -3px;
 661 |    *margin-left: -5px;
 662 |    cursor: pointer;   
 663 |   background:#565656 url('/images/theme/search_w.png') 50% 50% no-repeat;
 664 |          border-radius: 12px;   
 665 |   -webkit-border-radius: 12px;   
 666 |   -moz-border-radius: 12px;
 667 | }
 668 | 
 669 | 
 670 | 
 671 | /* @Footer-Area-Module
 672 | ====================================== */
 673 | #footer-box{
 674 | }
 675 | 
 676 | /* @Footer
 677 | ====================================== */
 678 | #footer{
 679 |   clear:both;
 680 |   text-align:center;
 681 |   margin:30px 0;
 682 | }
 683 | 
 684 | #footer a{
 685 |   color:#fff;
 686 |   font-weight:bold;
 687 |   text-decoration:none;
 688 |      text-shadow:0 2px 2px #000;
 689 |   -moz-text-shadow:0 2px 2px #000;
 690 |   -webkit-text-shadow: 0 2px 2px #000;
 691 |    font-style:normal;
 692 | }
 693 | 
 694 | 
 695 | 
 696 | /* @HATENA-EMBED(FOTOLIFE,TWITPIC)
 697 | ====================================== */
 698 | 
 699 | .hatena-embed.hatena-fotolife,
 700 | .hatena-embed.twitpic{
 701 |   padding:10px 10px 30px 10px;
 702 |   margin:1em 0;
 703 |   background: transparent;
 704 |   display: inline-block;
 705 |   border:1px solid #dfdfdf;
 706 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 707 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 708 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 709 |   background:#fff;
 710 |   text-align:center;
 711 | }
 712 | 
 713 | .hatena-embed.hatena-fotolife{
 714 |   background:#fff url('/images/theme/hatena-embed/embed-fotolife.png')no-repeat right bottom;
 715 | }
 716 | 
 717 | .hatena-embed.twitpic{
 718 |   padding:10px 10px 10px 10px;
 719 | }
 720 | 
 721 | .hatena-embed.hatena-fotolife .hatena-embed-image,
 722 | .hatena-embed.twitpic .hatena-embed-image{
 723 |   display:inline-block;
 724 |   max-width:488px;
 725 | }
 726 | 
 727 | .hatena-embed.hatena-fotolife .hatena-embed-body,
 728 | .hatena-embed.hatena-fotolife .hatena-embed-body a,
 729 | .hatena-embed.twitpic .hatena-embed-body,
 730 | .hatena-embed.twitpic .hatena-embed-body a{
 731 |   text-align:center;
 732 |   font-family: 'Homemade Apple', cursive;
 733 |   color:#454545;
 734 |   font-size:16px;
 735 |   margin-top:10px;
 736 | }
 737 | 
 738 | /* @HATENA-EMBED(COCO,4SQ)
 739 | ====================================== */
 740 | .hatena-embed.hatena-coco,
 741 | .hatena-embed.foursquare{
 742 |   margin:1em 0;
 743 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 744 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 745 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 746 |   }
 747 |   
 748 | .hatena-embed.hatena-coco{
 749 | border: 1px solid #e2d279;
 750 | padding: 20px 30px;
 751 | background:#faf9e6 url('/images/theme/hatena-embed/embed-coco.png')no-repeat right bottom;
 752 | }
 753 | 
 754 | .hatena-embed.hatena-coco .hatena-embed-image,
 755 | .hatena-embed.foursquare .hatena-embed-image{
 756 |   width:100px;
 757 |   height:100px;
 758 | }
 759 | 
 760 | .hatena-embed.foursquare{
 761 | border: 1px solid #C1D5DB;
 762 | padding: 20px 30px;
 763 | background:#E6EFF2 url('/images/theme/hatena-embed/embed-4sq.png')no-repeat right bottom;
 764 | }
 765 | 
 766 | 
 767 | 
 768 | /* @HATENA-EMBED(BOOKMARK)
 769 | ====================================== */
 770 | .hatena-embed.hatena-bookmark{
 771 |    padding:15px 15px 15px 70px;
 772 |   margin:1em 0;
 773 |   background: transparent;
 774 |   border:1px solid #dfdfdf;
 775 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 776 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 777 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 778 |   background:#fff url('/images/theme/hatena-embed/embed-bookmark.png')no-repeat 10px top;
 779 |   position:relative;
 780 | }
 781 | 
 782 | .hatena-embed.hatena-bookmark a{
 783 |   text-decoration:underline;
 784 | }
 785 | 
 786 | .hatena-embed.hatena-bookmark .hatena-embed-image{
 787 |   max-height:50px;
 788 | }
 789 | 
 790 | .hatena-embed.hatena-bookmark .hatena-embed-body{
 791 | }
 792 | 
 793 | /* @HATENA-EMBED(HAIKU)
 794 | ====================================== */
 795 | .hatena-embed.hatena-haiku{
 796 |    padding:15px 15px 15px 70px;
 797 |   margin:1em 0;
 798 |   background: transparent;
 799 |   border:1px solid #dfdfdf;
 800 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 801 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 802 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 803 |   background:#fff url('/images/theme/hatena-embed/embed-haiku.png')no-repeat 5px 5px;
 804 | }
 805 | 
 806 | /* @HATENA-EMBED(MONOLITH)
 807 | ====================================== */
 808 | .hatena-embed.hatena-monolith{
 809 |   width:478px;
 810 |    padding:15px;
 811 |   margin:1em 0;
 812 |   background: transparent;
 813 |   border:1px solid #dfdfdf;
 814 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 815 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 816 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 817 |   background:#fff url('/images/theme/hatena-embed/embed-monolith.png')no-repeat right bottom;
 818 | }
 819 | 
 820 | .hatena-embed.hatena-monolith .hatena-embed-image{
 821 |   display:block;
 822 |   float:left;
 823 |   max-width:98px;
 824 |   border:1px solid #dfdfdf;
 825 | }
 826 | 
 827 | .hatena-embed.hatena-monolith .hatena-embed-body{
 828 |   float:left;
 829 |   width:368px;
 830 |   margin-left:10px;
 831 | }
 832 | 
 833 | .hatena-embed.hatena-monolith:after{
 834 |     content: "";
 835 |     display: block;
 836 |     height: 0;
 837 |     visibility: hidden;
 838 |     clear: both;
 839 | }
 840 | 
 841 | /* @HATENA-EMBED(TWITTER)
 842 | ====================================== */
 843 | .hatena-embed.twitter{
 844 |    padding:10px 0;
 845 |   margin:1em 0;
 846 |   border-bottom: 1px dotted #757575;
 847 |   border-top: 1px dotted #757575;
 848 | }
 849 | 
 850 | 
 851 | /* @HATENA-EMBED(ATND)
 852 | ====================================== */
 853 | .hatena-embed.atnd{
 854 |    padding:10px 0;
 855 |   margin:1em 0;
 856 |   border-bottom: 1px dotted #757575;
 857 |   border-top: 1px dotted #757575;
 858 |   font-family:'PT Sans Caption', Helvetica, 'ヒラギノ角ゴ Pro W3','HiraKakuProN-W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
 859 | }
 860 | 
 861 | .hatena-embed-detail.atnd-detail{
 862 |   font-size: 20px;
 863 |   font-weight:bold;
 864 |   color:#262626;
 865 | }
 866 | 
 867 | .hatena-embed-detail.atnd-detail:hover{
 868 |   color:#EA1F00;
 869 |   text-decoration:none;
 870 | }
 871 | 
 872 | .hatena-embed.atnd .content-body{
 873 |   font-size:12px;
 874 |   color:#222;
 875 | }
 876 | 
 877 | 
 878 | 
 879 | /* @PREVIEW
 880 | ====================================== */
 881 | 
 882 | body.preview{
 883 |    color:#454545;
 884 |    background:#fff;
 885 |    padding:10px;
 886 | }
 887 | 
 888 | body.preview .hatena-embed{
 889 |   margin-right:30px;
 890 | }
 891 | 
 892 | 
 893 | 
 894 | /* @About
 895 | ====================================== */
 896 | .page-about #main,
 897 | .page-archive #main{
 898 |     -moz-border-radius: 10px;
 899 |     -webkit-border-radius: 10px;
 900 |     -ms-border-radius: 10px;
 901 |     border-radius: 10px;
 902 |     width:760px;
 903 |    -webkit-box-shadow: 0px 0px 5px  rgba(0,0,0,.30);
 904 |    -moz-box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 905 |     box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 906 |     min-height: 500px;
 907 |     float:none;
 908 | }
 909 | 
 910 | .page-about dt{
 911 |     font-size:16px;
 912 |     font-weight:bold;
 913 | }
 914 | 
 915 | .page-about dd{
 916 |     margin-left:0;
 917 |     margin-bottom:30px;
 918 | }
 919 | 
 920 | .page-about img.profile-icon{
 921 |     height:16px;
 922 |     width:16px;
 923 | }
 924 | 
 925 | 
 926 | /* @Archive
 927 | ====================================== */
 928 | .page-archive #main-inner{
 929 |     font-size:14px;
 930 | }
 931 | 
 932 | .page-archive #main-inner h1{
 933 |     font-size:18px;
 934 | }
 935 | 
 936 | .page-archive #main-inner .entry-title{
 937 |     font-size:14px;
 938 | }
 939 | 
 940 | .page-archive #main-inner li{
 941 |     margin:5px 0;
 942 | }
 943 | 
 944 | #google_afc_user {
 945 |     height:0px;
 946 |     overflow:hidden;
 947 | }
 948 | 
 949 | body {
 950 |     background: #ffffff;
 951 | }
 952 | 
 953 | #title {
 954 |     text-shadow: none;
 955 | }
 956 | 
 957 | #title a {
 958 |    color: #444;
 959 | }
 960 | 
 961 | #main{
 962 |     margin-top: 70px;
 963 |     background: #ffffff;
 964 |     color: #444;
 965 |     -moz-border-radius: 0px;
 966 |     -webkit-border-radius: 0px;
 967 |     -ms-border-radius: 0px;
 968 |     border-radius: 0px;
 969 |     padding:20px;
 970 |     float:left;
 971 |     width:510px;
 972 |    -webkit-box-shadow: none;
 973 |    -moz-box-shadow: none;
 974 |     box-shadow: none;
 975 |     min-height: 800px;
 976 | }
 977 | 
 978 | #box1 {
 979 |     display: none;
 980 | }
 981 | 
 982 | #box2 {
 983 |     position: none;
 984 |     display: none;
 985 | }
 986 | 
 987 | #content-inner{
 988 |  -webkit-box-shadow: none;
 989 |  -moz-box-shadow: none;
 990 |  box-shadow: none;
 991 |     -moz-border-radius: 0;
 992 |   -webkit-border-radius: 0;
 993 |   -ms-border-radius: 0;
 994 |   border-radius: 0;
 995 |   background: transparent;
 996 | }
 997 | 
 998 | .date {
 999 |     color: #444;
1000 |     background: #ffffff;
1001 |     text-shadow: none;
1002 |     cursor: pointer;
1003 | }
1004 | a.keyword {
1005 |     color: #444;
1006 |     text-decoration: none;
1007 |     border-bottom: 0px;
1008 | }
1009 | 
1010 | .hatena-module-title {
1011 |     color: #444;
1012 | }
1013 | 
1014 | .pager a {
1015 |   color: #ffffff;
1016 | }
1017 | 
1018 | #footer a {
1019 |   color: #ffffff;
1020 | }
1021 | 
1022 | .entry-footer-section{
1023 |   font-style: normal;
1024 | }
1025 | .entry-footer-section a {
1026 |     text-decoration: none;
1027 | }
1028 | 
1029 | #globalheader-container{
1030 |     color: #444;
1031 |     background: transparent;
1032 |     -webkit-box-shadow: none;
1033 |     -moz-box-shadow: none;
1034 |     box-shadow: none;
1035 | }
1036 | 
1037 | .hatena-module-links {
1038 |     display: none;
1039 | }
1040 | 
1041 | .hatena-module-search-box {
1042 |     display: none;
1043 | }
1044 | 
1045 | .comment-box {
1046 |     display: none;
1047 | }
1048 | 
1049 | .hatena-module-title {
1050 |     display: none;
1051 | }
1052 | 
1053 | .id {
1054 |     display: none;
1055 | }
1056 | 
1057 | .hatena-module .profile-icon {
1058 |     display: none;
1059 | }
1060 | 
1061 | .entry-footer-section .author {
1062 |     display: none;
1063 | }
1064 | 
1065 | .date a {
1066 |     text-decoration: none;
1067 |     color: #444;
1068 | }
1069 | 
1070 | #footer {
1071 |     visibility: hidden;
1072 | }
1073 | 
1074 | #container {
1075 |     width: 550px;
1076 | }
1077 | 
1078 | .hatena-star-comment-container {
1079 |     display: none;
1080 | }
1081 | 
1082 | #globalheader-container {
1083 |     display: none;
1084 | }
1085 | 
1086 | .social-buttons {
1087 |     display: none;
1088 | }
1089 | 
1090 | .pager {
1091 |     display: none;
1092 | }
1093 | 
1094 | #blog-description {
1095 |     display: none;
1096 | }
1097 | 
1098 | .profile-description {
1099 |     display: none;
1100 | }
1101 | 
1102 | .entry.no-entry {
1103 |     display: none;
1104 | }
1105 | 
1106 | /* ----- calendar ----- */
1107 | 
1108 | #calendar-container {
1109 |     position: fixed;
1110 |     bottom: 0px;
1111 |     width: 550px;
1112 |     height: 50px;
1113 |     background: white;
1114 | }
1115 | 
1116 | #calendar-container #calendar {
1117 |     cursor: pointer;
1118 |     width: 100%;
1119 |     height: 16px;
1120 |     padding: 0;
1121 |     position: absolute;
1122 |     left: 0px;
1123 |     top: 10px;
1124 |     background: #fafafa;
1125 |     border: 1px solid #dadada;
1126 | }
1127 | 
1128 | #calendar-container #scroll-bar {
1129 |     position: absolute;
1130 |     top: 3px;
1131 |     left: 0px;
1132 |     width: 10px;
1133 |     height: 10px;
1134 |     opacity: 0.8;
1135 |     background:#666;
1136 | 
1137 |     -webkit-transition-property: left;
1138 |     -webkit-transition-duration: 0.1s;
1139 |     -webkit-transition-timing-function: linear;
1140 | }
1141 | 
1142 | #calendar-container .calendar-bar {
1143 |     position: absolute;
1144 |     width: 1px;
1145 |     height: 100%;
1146 |     background: #444;
1147 |     top: 0px;
1148 |     opacity: 0.7;
1149 | }
1150 | 
1151 | #calendar-container .calenda-bar.loading {
1152 |     background: #999;
1153 | }
1154 | 
1155 | #calendar-container #tip {
1156 |     color: #444;
1157 |     font-size: 14px;
1158 |     margin-top: 30px;
1159 | }
1160 | 
1161 | 
1162 | /* ----- header, blog-title */
1163 | #blog-title-inner {
1164 |     width:550px;
1165 |     height:60px;
1166 |     background:white;
1167 |     position:fixed;
1168 |     z-index:1000;
1169 |     top: 0px;
1170 | }
1171 | 
1172 | #blog-title-inner h1#title {
1173 |     position: absolute;
1174 |     left: 0px;
1175 |     bottom: 0px;
1176 | }
1177 | 
1178 | .hatena-module .hatena-follow-button-box {
1179 |     position: absolute;
1180 |     right: 0px;
1181 |     bottom: 0px;
1182 |     padding-bottom:0px;
1183 |     margin-bottom: 0px;
1184 | }
1185 | 
1186 | .categories {
1187 |     display: none;
1188 | }
1189 | 
1190 | .hatena-counter {
1191 |     display: none;
1192 | }


--------------------------------------------------------------------------------
/nikki2-my.js:
--------------------------------------------------------------------------------
  1 | var appendEntry, autoloader, checkScroll, collectCalendar, debounce, entryFromScrollTop, entryFromTime, executeByQueue, extractPath, fetchYear, fetchedHash, formatDate, keyWithPrefix, later, main, roundEpoch, scrollByLocation, scrollToEntry, showEntries, throttle, updateStars, waitForLoadImages;
  2 | later = function(func) {
  3 |   return setTimeout(func, 0);
  4 | };
  5 | executeByQueue = (function() {
  6 |   var queue, timer;
  7 |   queue = [];
  8 |   timer = null;
  9 |   return function(func) {
 10 |     if (timer) {
 11 |       queue.push(func);
 12 |     } else {
 13 |       timer = setInterval(function() {
 14 |         if (queue.length > 0) {
 15 |           return queue.shift()();
 16 |         } else {
 17 |           clearInterval(timer);
 18 |           return timer = null;
 19 |         }
 20 |       }, 1000);
 21 |       return func();
 22 |     }
 23 |   };
 24 | })();
 25 | keyWithPrefix = function(key) {
 26 |   return "blog-viewer-" + key;
 27 | };
 28 | extractPath = function(url) {
 29 |   return url.replace("" + location.protocol + "//" + location.host, "");
 30 | };
 31 | roundEpoch = function(epoch) {
 32 |   var date;
 33 |   date = new Date(epoch * 1000);
 34 |   return Math.floor(new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() / 1000);
 35 | };
 36 | throttle = function(fn, delay) {
 37 |   var timer;
 38 |   timer = null;
 39 |   return function() {
 40 |     var args, context;
 41 |     if (timer) {
 42 |       return;
 43 |     }
 44 |     context = this;
 45 |     args = arguments;
 46 |     return timer = setTimeout(function() {
 47 |       timer = null;
 48 |       return fn.apply(context, args);
 49 |     }, delay || 100);
 50 |   };
 51 | };
 52 | debounce = function (func, threshold, execAsap) {
 53 |     var timeout;
 54 |     return function debounced () {
 55 |         var obj = this, args = arguments;
 56 |         function delayed () {
 57 |             if (!execAsap)
 58 |                 func.apply(obj, args);
 59 |             timeout = null;
 60 |         };
 61 |         if (timeout)
 62 |             clearTimeout(timeout);
 63 |         else if (execAsap)
 64 |             func.apply(obj, args);
 65 |         timeout = setTimeout(delayed, threshold || 100);
 66 |     };
 67 | };
 68 | checkScroll = function(job) {
 69 |   var entry, top_after, top_before;
 70 |   entry = $('#main-inner article:last');
 71 |   if (!(entry.length > 0)) {
 72 |     job();
 73 |     return;
 74 |   }
 75 |   top_before = entry.position().top;
 76 |   job();
 77 |   top_after = entry.position().top;
 78 |   return window.scrollBy(0, top_after - top_before);
 79 | };
 80 | updateStars = debounce(function() {
 81 |   Hatena.Locale.updateTimestamps(document.body);
 82 |   $(document.body).find('span.hatena-star-comment-container, span.hatena-star-star-container').remove();
 83 |   return Hatena.Star.EntryLoader.loadNewEntries(document.body);
 84 | }, 1000);
 85 | scrollToEntry = debounce(function(entry) {
 86 |   var top;
 87 |   if (!entry) {
 88 |     return;
 89 |   }
 90 |   top = $(entry).position().top - $('#blog-title-inner').height() - 20;
 91 |   if (Math.abs($(window).scrollTop() - top) < $(window).height() * 0.4) {
 92 |     return window.scrollTo(0, top);
 93 |   } else {
 94 |     return $('html,body').animate({
 95 |       scrollTop: top
 96 |     }, 300);
 97 |   }
 98 | });
 99 | autoloader = throttle(function() {
100 |   var created, entry;
101 |   if ($(window).scrollTop() <= 0) {
102 |     entry = $('#main-inner article:first');
103 |     if (!entry.length) {
104 |       return;
105 |     }
106 |     created = new Date(entry.find('time').attr('datetime'));
107 |     showEntries(created.getTime() / 1000);
108 |     window.scrollTo(0, 1);
109 |   }
110 |   if ($(window).scrollTop() + $(window).height() >= $(document).height()) {
111 |     entry = $('#main-inner article:last');
112 |     if (!entry.length) {
113 |       return;
114 |     }
115 |     created = new Date(entry.find('time').attr('datetime'));
116 |     return showEntries(created.getTime() / 1000 + 3600 * 24 * 3);
117 |   }
118 | }, 500);
119 | entryFromTime = function(time) {
120 |   var date, found, found_created;
121 |   date = new Date(time);
122 |   found = null;
123 |   found_created = 0;
124 |   $('#main-inner article').each(function() {
125 |     var entry, entry_created;
126 |     entry = $(this);
127 |     entry_created = new Date(entry.find('time').attr('datetime'));
128 |     if (Math.abs(entry_created - date) < Math.abs(found_created - date)) {
129 |       found = entry;
130 |       return found_created = entry_created;
131 |     }
132 |   });
133 |   return found;
134 | };
135 | entryFromScrollTop = function() {
136 |   var distance, found, top, window_height;
137 |   top = $(document).scrollTop();
138 |   window_height = $(window).height();
139 |   found = null;
140 |   distance = $(document).height();
141 |   $('#main-inner article').each(function() {
142 |     var entry, entry_height, entry_top;
143 |     entry = $(this);
144 |     entry_top = entry.position().top;
145 |     entry_height = entry.height();
146 |     if (Math.abs(top - entry_top) < distance) {
147 |       found = entry;
148 |       return distance = Math.abs(top - entry_top);
149 |     }
150 |   });
151 |   return found;
152 | };
153 | formatDate = function(date) {
154 |   if (isNaN(date.getFullYear())) {
155 |     return "";
156 |   }
157 |   return "" + (date.getFullYear()) + "-" + (date.getMonth() + 1) + "-" + (date.getDate());
158 | };
159 | waitForLoadImages = function(element, callback) {
160 |   var count, images;
161 |   images = $(element).find('img');
162 |   if (images.length === 0) {
163 |     callback(element);
164 |     return;
165 |   }
166 |   count = 0;
167 |   return images.each(function() {
168 |     var image;
169 |     image = $(this);
170 |     return image.load(function() {
171 |       count++;
172 |       if (count === images.length) {
173 |         return callback(element);
174 |       }
175 |     });
176 |   });
177 | };
178 | scrollByLocation = function() {
179 |   var link, pathname;
180 |   pathname = location.pathname;
181 |   link = $(".entry-footer-time a[href=\"" + pathname + "\"]");
182 |   if (!link.length) {
183 |     return;
184 |   }
185 |   return scrollToEntry(link.parents('article'));
186 | };
187 | appendEntry = function(entry) {
188 |   var entry_created, entry_old, entry_old_created, entry_recent, entry_recent_created, title, uuid;
189 |   entry = $(entry);
190 |   uuid = entry.attr('data-uuid');
191 |   entry_created = new Date(entry.find('time').attr('datetime'));
192 |   entry.find('header .date a').attr({
193 |     href: entry.find('.entry-footer-time a').attr('href')
194 |   });
195 |   title = entry.find('h1.entry-title');
196 |   if (title.text() === '■') {
197 |     title.css({
198 |       display: 'none'
199 |     });
200 |   }
201 |   entry_old = null;
202 |   entry_old_created = null;
203 |   entry_recent = null;
204 |   entry_recent_created = null;
205 |   $('#main-inner article').each(function() {
206 |     var tmp_created, tmp_entry;
207 |     tmp_entry = $(this);
208 |     tmp_created = new Date(tmp_entry.find('time').attr('datetime'));
209 |     if (tmp_created <= entry_created && (!entry_old || entry_old_created < tmp_created)) {
210 |       entry_old = tmp_entry;
211 |       entry_old_created = tmp_created;
212 |     }
213 |     if (tmp_created >= entry_created && (!entry_recent || entry_recent_created > tmp_created)) {
214 |       entry_recent = tmp_entry;
215 |       return entry_recent_created = tmp_created;
216 |     }
217 |   });
218 |   if (entry_old && entry_old.attr('data-uuid') === uuid) {
219 |     entry.remove();
220 |     return;
221 |   }
222 |   if (entry_recent && entry_recent.attr('data-uuid') === uuid) {
223 |     entry.remove();
224 |     return;
225 |   }
226 |   later(function() {
227 |     return updateStars();
228 |   });
229 |   return checkScroll(function() {
230 |     if (entry_old) {
231 |       entry_old.after(entry);
232 |       return;
233 |     }
234 |     if (entry_recent) {
235 |       entry_recent.before(entry);
236 |       return;
237 |     }
238 |     return $('#main-inner').prepend(entry);
239 |   });
240 | };
241 | fetchedHash = {};
242 | showEntries = function(epoch) {
243 |   var deferred, url;
244 |   if (!epoch) {
245 |     return;
246 |   }
247 |   if (epoch < 0) {
248 |     return;
249 |   }
250 |   if (isNaN(epoch)) {
251 |     return;
252 |   }
253 |   deferred = $.Deferred();
254 |   epoch = roundEpoch(epoch);
255 |   url = "/?page=" + epoch;
256 |   if (fetchedHash[url]) {
257 |     later(function() {
258 |       return deferred.resolve();
259 |     });
260 |     return deferred.promise();
261 |   }
262 |   fetchedHash[url] = true;
263 |   executeByQueue(function() {
264 |     return $.ajax({
265 |       url: url,
266 |       dataType: 'html'
267 |     }).success(function(page) {
268 |       var fragment;
269 |       fragment = document.createDocumentFragment();
270 |       $(page).find('article').each(function() {
271 |         var entry, uuid;
272 |         entry = $(this);
273 |         uuid = entry.attr('data-uuid');
274 |         if ($("article[data-uuid=\"" + uuid + "\"]").length > 0) {
275 |           return;
276 |         }
277 |         if (entry.is('.no-entry')) {
278 |           return;
279 |         }
280 |         if (entry.find('img').length > 0) {
281 |           $('#loading-entry').append(entry);
282 |           return waitForLoadImages(this, function(entry) {
283 |             return appendEntry(entry);
284 |           });
285 |         } else {
286 |           return appendEntry(entry);
287 |         }
288 |       });
289 |       return deferred.resolve();
290 |     });
291 |   });
292 |   return deferred.promise();
293 | };
294 | fetchYear = function(year, res) {
295 |   var deferred;
296 |   res || (res = {
297 |     entries: [],
298 |     completed: false
299 |   });
300 |   deferred = $.Deferred();
301 |   $.ajax({
302 |     url: '/archive',
303 |     data: {
304 |       year: year
305 |     },
306 |     dataType: 'html'
307 |   }).success(function(page) {
308 |     var date;
309 |     date = null;
310 |     $(page).find('h1, a.entry-title').each(function() {
311 |       var day, elem, month, _, _ref;
312 |       elem = this;
313 |       try {
314 |         if (elem.tagName.toLowerCase() === 'h1') {
315 |           _ref = $(elem).text().match(/(\d{4})-(\d{2})-(\d{2})/), _ = _ref[0], year = _ref[1], month = _ref[2], day = _ref[3];
316 |           return date = {
317 |             year: +year,
318 |             month: +month,
319 |             day: +day
320 |           };
321 |         } else if (elem.tagName.toLowerCase() === 'a') {
322 |           return res.entries.unshift({
323 |             url: elem.href,
324 |             title: $(elem).text(),
325 |             date: date
326 |           });
327 |         }
328 |       } catch (_e) {}
329 |     });
330 |     res.completed = $(page).find('a.entry-title').length === 0;
331 |     return deferred.resolve(res);
332 |   });
333 |   return deferred.promise();
334 | };
335 | collectCalendar = function() {
336 |   var deferred, year;
337 |   deferred = $.Deferred();
338 |   year = new Date().getFullYear();
339 |   fetchYear(year).then(function(calendar) {
340 |     if (calendar.completed) {
341 |       deferred.resolve(calendar);
342 |       return;
343 |     }
344 |     year--;
345 |     return fetchYear(year, calendar).then(arguments.callee);
346 |   });
347 |   return deferred.promise();
348 | };
349 | main = function() {
350 |   var articles, module_dummy;
351 |   if (Hatena && Hatena.Star) {
352 |     Hatena.Star.SiteConfig = {
353 |       entryNodes: {
354 |         'div.entry-inner': {
355 |           uri: 'a.bookmark',
356 |           title: 'h1.entry-title',
357 |           container: 'p.entry-footer-section'
358 |         }
359 |       }
360 |     };
361 |   }
362 |   $('<div>').attr({
363 |     id: 'loading-entry'
364 |   }).css({
365 |     display: 'none'
366 |   }).appendTo($('body'));
367 |   articles = [];
368 |   $('article').each(function() {
369 |     var entry;
370 |     entry = this;
371 |     articles.push($(entry).clone());
372 |     return $(entry).remove();
373 |   });
374 |   $.each(articles, function() {
375 |     return appendEntry(this);
376 |   });
377 |   module_dummy = $('<div>').addClass('hatena-module').addClass('hatena-module-profile');
378 |   $('.hatena-follow-button-box').appendTo(module_dummy);
379 |   module_dummy.appendTo($('#blog-title-inner'));
380 |   $('body').delegate('#blog-title a, header.entry-header a, .entry-footer-time a, h1.entry-title a', 'click', function(event) {
381 |     var path;
382 |     if (!(history && history.pushState)) {
383 |       return true;
384 |     }
385 |     path = extractPath(this.href);
386 |     history.pushState(path, path, path);
387 |     scrollByLocation();
388 |     return false;
389 |   });
390 |   $(window).bind('popstate', function(event) {
391 |     return scrollByLocation();
392 |   });
393 |   setTimeout(function() {
394 |     return updateStars();
395 |   }, 1000);
396 |   return $(window).bind('scroll', function() {
397 |     return autoloader();
398 |   });
399 | };
400 | main();
401 | window.scrollBy(0, 1);
402 | $('.pager').remove();


--------------------------------------------------------------------------------
/nikki2.coffee:
--------------------------------------------------------------------------------
  1 | later = (func) ->
  2 |   setTimeout func, 0
  3 | 
  4 | executeByQueue = do ->
  5 |   queue = []
  6 |   timer = null
  7 |   (func) ->
  8 |     if timer
  9 |       queue.push func
 10 |       return
 11 |     else
 12 |       timer = setInterval ->
 13 |         if queue.length > 0
 14 |           queue.shift()()
 15 |         else
 16 |           clearInterval(timer)
 17 |           timer = null
 18 |       , 1000
 19 | 
 20 |       func()
 21 | 
 22 | keyWithPrefix = (key) ->
 23 |   "blog-viewer-#{key}"
 24 | 
 25 | extractPath = (url) ->
 26 |   url.replace "#{location.protocol}//#{location.host}", ""
 27 | 
 28 | roundEpoch = (epoch) ->
 29 |   date = new Date(epoch * 1000)
 30 |   Math.floor(new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() / 1000)
 31 | 
 32 | appendBar = (x, css) ->
 33 |   bar = $('<div>')
 34 |   .attr
 35 |     class: 'calendar-bar'
 36 |   .css
 37 |     left: x
 38 | 
 39 |   bar.css(css) if css
 40 | 
 41 |   bar.appendTo('#calendar')
 42 | 
 43 |   bar
 44 | 
 45 | appendBarAtTime = (created, css) ->
 46 |   date_from = new Date(2011, 11-1, 7)
 47 |   date_now = new Date()
 48 | 
 49 |   appendBar("#{(created - date_from) / (date_now - date_from) * 100}%", css)
 50 | 
 51 | selectEntryByUUID = (uuid) ->
 52 |   $(".calendar-bar.selected").removeClass("selected")
 53 |   $(".calendar-bar[data-uuid=\"#{uuid}\"]").addClass('selected')
 54 |   return unless $(".calendar-bar.selected").length
 55 |   left = $(".calendar-bar.selected").position().left - $("#scroll-bar").width() / 2
 56 |   left = 3 if left < 3
 57 |   left = 550 - 13 if left > 550-13
 58 |   $("#scroll-bar").css
 59 |     left: left
 60 | 
 61 | throttle = (fn, delay) ->
 62 |   timer = null
 63 |   ->
 64 |     return if timer
 65 |     context = this
 66 |     args = arguments
 67 |     timer = setTimeout ->
 68 |       timer = null
 69 |       fn.apply context, args
 70 |     ,delay || 100
 71 | 
 72 | debounce = `function (func, threshold, execAsap) {
 73 |     var timeout;
 74 |     return function debounced () {
 75 |         var obj = this, args = arguments;
 76 |         function delayed () {
 77 |             if (!execAsap)
 78 |                 func.apply(obj, args);
 79 |             timeout = null;
 80 |         };
 81 |         if (timeout)
 82 |             clearTimeout(timeout);
 83 |         else if (execAsap)
 84 |             func.apply(obj, args);
 85 |         timeout = setTimeout(delayed, threshold || 100);
 86 |     };
 87 | }`
 88 | 
 89 | # 画面のより下の途中に入るとおかしくなるのでは
 90 | checkScroll = debounce ->
 91 |   entry = $('#main-inner article:last')
 92 |   return unless entry.length
 93 |   top_before = entry.position().top
 94 |   later ->
 95 |     top_after = entry.position().top
 96 |     window.scrollBy(0, top_after - top_before)
 97 | , 100, true
 98 | 
 99 | updateStars = debounce ->
100 |   Hatena.Locale.updateTimestamps(document.body)
101 |   $(document.body).find('span.hatena-star-comment-container, span.hatena-star-star-container').remove()
102 |   Hatena.Star.EntryLoader.loadNewEntries(document.body)
103 | ,1000
104 | 
105 | scrollToEntry = debounce (entry) ->
106 |   return unless entry
107 |   top = $(entry).position().top - $('#blog-title-inner').height() - 20
108 |   if Math.abs($(window).scrollTop() - top) < $(window).height() * 0.4
109 |     window.scrollTo(0, top)
110 |   else
111 |     $('html,body').animate({ scrollTop: top }, 300)
112 | 
113 | updateScrollBar = ->
114 |   entry = entryFromScrollTop()
115 |   return unless entry
116 |   selectEntryByUUID(entry.attr('data-uuid'))
117 |   created = new Date(entry.find('time').attr('datetime'))
118 |   setTip(formatDate(created))
119 |   autoloader()
120 | 
121 | autoloader = throttle ->
122 |   if $(window).scrollTop() <= 0
123 |     entry = $('#main-inner article:first')
124 |     return unless entry.length
125 |     created = new Date(entry.find('time').attr('datetime'))
126 |     showEntries(created.getTime() / 1000)
127 | 
128 |   if $(window).scrollTop() + $(window).height() >= $(document).height()
129 |     entry = $('#main-inner article:last')
130 |     return unless entry.length
131 |     created = new Date(entry.find('time').attr('datetime'))
132 |     showEntries(created.getTime() / 1000 + 3600*24*3)
133 | ,500
134 | 
135 | _tipTimer = null
136 | setTip = (text) ->
137 |   tip = $('#calendar-container #tip')
138 |   return if tip.text() == text
139 | 
140 |   tip
141 |   .text(text)
142 |   .stop()
143 |   .css
144 |     opacity: 1
145 | 
146 |   clearTimeout(_tipTimer) if _tipTimer
147 | 
148 |   _tipTimer = setTimeout ->
149 |     tip.animate
150 |       opacity: 0
151 |     , 1500
152 |   ,10000
153 | 
154 | entryFromTime = (time) ->
155 |   date = new Date(time)
156 | 
157 |   found = null
158 |   found_created = 0
159 |   $('#main-inner article').each ->
160 |     entry = $(this)
161 |     entry_created = new Date(entry.find('time').attr('datetime'))
162 |     if Math.abs(entry_created - date) < Math.abs(found_created - date)
163 |       found = entry
164 |       found_created = entry_created
165 | 
166 |   found
167 | 
168 | entryFromScrollTop = ->
169 |   top = $(document).scrollTop()
170 |   window_height = $(window).height()
171 |   found = null
172 |   distance = $(document).height()
173 |   $('#main-inner article').each ->
174 |     entry = $(this)
175 |     entry_top = entry.position().top
176 |     entry_height = entry.height()
177 |     if Math.abs(top - entry_top) < distance
178 |       found = entry
179 |       distance = Math.abs(top - entry_top)
180 | 
181 |   found
182 | 
183 | 
184 | formatDate = (date) ->
185 |   return "" if isNaN(date.getFullYear())
186 |   "#{date.getFullYear()}-#{date.getMonth()+1}-#{date.getDate()}"
187 | 
188 | # todo: image load fail
189 | waitForLoadImages = (element, callback) ->
190 |   images = $(element).find('img')
191 |   if images.length == 0
192 |     callback(element)
193 |     return
194 | 
195 |   count = 0
196 |   images.each ->
197 |     image = $(this)
198 |     image.load ->
199 |       count++
200 |       if count == images.length
201 |         callback(element)
202 | 
203 | scrollByLocation = ->
204 |   pathname = location.pathname
205 | 
206 |   if pathname == "/"
207 |     scrollToEntry($('article:last'))
208 |     return
209 | 
210 |   link = $(".entry-footer-time a[href=\"#{pathname}\"]")
211 |   return unless link.length
212 | 
213 |   scrollToEntry(link.parents('article'))
214 | 
215 | appendEntry = (entry) ->
216 |   entry = $(entry)
217 |   uuid = entry.attr('data-uuid')
218 |   entry_created = new Date(entry.find('time').attr('datetime'))
219 | 
220 |   entry_old = null
221 |   entry_old_created = null
222 |   entry_recent = null
223 |   entry_recent_created = null
224 | 
225 |   $('#main-inner article').each ->
226 |     tmp_entry = $(this)
227 |     tmp_created = new Date(tmp_entry.find('time').attr('datetime'))
228 | 
229 |     if tmp_created <= entry_created && (!entry_old || entry_old_created < tmp_created)
230 |       entry_old = tmp_entry
231 |       entry_old_created = tmp_created
232 | 
233 | 
234 |     if tmp_created >= entry_created && (!entry_recent || entry_recent_created > tmp_created)
235 |       entry_recent = tmp_entry
236 |       entry_recent_created = tmp_created
237 | 
238 |   if entry_old && entry_old.attr('data-uuid') == uuid
239 |     entry.remove()
240 |     return
241 |   if entry_recent && entry_recent.attr('data-uuid') == uuid
242 |     entry.remove()
243 |     return
244 | 
245 |   bar = appendBarAtTime(entry_created)
246 |   bar.attr
247 |     'data-uuid': uuid
248 |   later ->
249 |     updateStars()
250 | 
251 |   checkScroll()
252 |   later ->
253 |     updateScrollBar()
254 | 
255 | 
256 |   if entry_old
257 |     entry_old.after(entry)
258 |     return
259 | 
260 |   if entry_recent
261 |     entry_recent.before(entry)
262 |     return
263 | 
264 |   $('#main-inner').prepend(entry)
265 | 
266 | fetchedHash = {}
267 | showEntries = (epoch) ->
268 |   return unless epoch
269 |   return if epoch < 0
270 |   return if isNaN(epoch)        #???
271 |   deferred = $.Deferred()
272 |   epoch = roundEpoch(epoch)
273 |   url = "/?page=#{epoch}"
274 | 
275 |   if fetchedHash[url]
276 |     later ->
277 |       deferred.resolve()
278 |     return deferred.promise()
279 | 
280 |   fetchedHash[url] = true
281 | 
282 |   executeByQueue ->
283 |     $.ajax
284 |       url: url
285 |       dataType: 'html'
286 |     .success (page) ->
287 |       fragment = document.createDocumentFragment()
288 |       $(page).find('article').each ->
289 |         entry = $(this)
290 |         uuid = entry.attr('data-uuid')
291 | 
292 |         return if $("article[data-uuid=\"#{uuid}\"]").length > 0
293 | 
294 |         return if entry.is('.no-entry')
295 | 
296 |         if entry.find('img').length > 0
297 |           $('#loading-entry').append(entry)
298 |           waitForLoadImages this, (entry) ->
299 |             appendEntry(entry)
300 |         else
301 |           appendEntry(entry)
302 | 
303 |       deferred.resolve()
304 | 
305 |   deferred.promise()
306 | 
307 | fetchYear = (year, res) ->
308 | 
309 |   res ||=
310 |     entries: []
311 |     completed: false
312 | 
313 |   deferred = $.Deferred()
314 | 
315 |   $.ajax
316 |     url: '/archive'
317 |     data:
318 |       year: year
319 |     dataType: 'html'
320 |   .success (page) ->
321 |     date = null
322 |     $(page).find('h1, a.entry-title').each ->
323 |       elem = this
324 |       try
325 |         if elem.tagName.toLowerCase() == 'h1'
326 |           [_, year, month, day] = $(elem).text().match /(\d{4})-(\d{2})-(\d{2})/
327 |           date =
328 |             year: +year
329 |             month: +month
330 |             day: +day
331 |         else if elem.tagName.toLowerCase() == 'a'
332 |           res.entries.unshift
333 |             url: elem.href
334 |             title: $(elem).text()
335 |             date: date
336 | 
337 |     res.completed = $(page).find('a.entry-title').length == 0
338 | 
339 |     deferred.resolve(res)
340 | 
341 |   deferred.promise()
342 | 
343 | collectCalendar = ->
344 |   deferred = $.Deferred()
345 | 
346 |   year = new Date().getFullYear()
347 | 
348 |   fetchYear(year).then (calendar)->
349 |     if calendar.completed
350 |       deferred.resolve(calendar)
351 |       return
352 | 
353 |     year--
354 |     fetchYear(year, calendar).then arguments.callee
355 | 
356 |   deferred.promise()
357 | 
358 | main = ->
359 |   if Hatena && Hatena.Star
360 |     Hatena.Star.SiteConfig =
361 |       entryNodes:
362 |         'div.entry-inner':
363 |           uri: 'a.bookmark'
364 |           title: 'h1.entry-title'
365 |           container: 'p.entry-footer-section'
366 | 
367 |   $('<div>').attr
368 |     id: 'loading-entry'
369 |   .css
370 |     display: 'none'
371 |   .appendTo($('body'))
372 | 
373 |   container = $('<div>')
374 |   .attr
375 |     id: 'calendar-container'
376 | 
377 |   calendar = $('<div>')
378 |   .attr
379 |     id: 'calendar'
380 | 
381 |   container.append(calendar)
382 | 
383 |   tip = $('<div>')
384 |   .attr
385 |     id: 'tip'
386 |   container.append(tip)
387 | 
388 |   $('#container').append(container)
389 | 
390 |   calendar.click (event) ->
391 |     width = container.width()
392 |     x = event.clientX - container.position().left
393 |     date_from = new Date(2011, 11-1, 7)
394 |     date_now = new Date()
395 |     time_selected = date_from.getTime() + (date_now.getTime() - date_from.getTime()) * (x / width) #
396 | 
397 |     entry = entryFromTime(time_selected)
398 |     path = extractPath(entry.find('.entry-footer-time a').attr('href'))
399 |     history.pushState(path, path, path)
400 |     scrollToEntry(entry)
401 | 
402 |   calendar.mousemove throttle (event) ->
403 |     width = container.width()
404 |     x = event.clientX - container.position().left
405 |     date_from = new Date(2011, 11-1, 7)
406 |     date_now = new Date()
407 |     time_selected = date_from.getTime() + (date_now.getTime() - date_from.getTime()) * (x / width) #
408 |     time_selected_3days_up = date_from.getTime() + (date_now.getTime() - date_from.getTime()) * (x / width) + 3600*24*1000*3 #
409 |     date_selected = new Date(time_selected)
410 |     date_selected_3days_up = new Date(time_selected_3days_up)
411 |     setTip(formatDate(date_selected))
412 | 
413 |     showEntries(Math.floor(date_selected_3days_up.getTime() / 1000))
414 | 
415 |   scrollBar = $('<div>')
416 |   .attr
417 |     id: 'scroll-bar'
418 | 
419 |   calendar.append(scrollBar)
420 | 
421 |   $(window).bind 'scroll', throttle (event) ->
422 |     updateScrollBar()
423 | 
424 |   articles = []
425 |   $('article').each ->
426 |     entry = this
427 |     articles.push($(entry).clone())
428 |     $(entry).remove()
429 | 
430 |   $.each articles, ->
431 |     appendEntry(this)
432 | 
433 |   setTimeout ->
434 |     scrollByLocation()
435 |   ,100
436 | 
437 |   module_dummy = $('<div>').addClass('hatena-module').addClass('hatena-module-profile')
438 | 
439 |   $('.hatena-follow-button-box').appendTo(module_dummy)
440 |   module_dummy.appendTo($('#blog-title-inner'))
441 | 
442 |   $('body').delegate '.entry-footer-time a', 'click', (event) ->
443 |     return true unless history && history.pushState
444 |     path = extractPath(this.href)
445 |     history.pushState(path, path, path)
446 |     later ->
447 |       scrollByLocation()
448 |     false
449 | 
450 |   $('body').delegate 'article .date', 'click', (event) ->
451 |     $(this).parents('article').find('.entry-footer-time a').click()
452 |     false
453 | 
454 |   $('body').delegate '#blog-title a', 'click', (event) ->
455 |     return true unless history && history.pushState
456 |     path = extractPath(this.href)
457 |     history.pushState(path, path, path)
458 |     later ->
459 |       scrollByLocation()
460 |     false
461 | 
462 |   $(window).bind 'popstate', (event) ->
463 |     scrollByLocation()
464 | 
465 |   setTimeout ->
466 |     updateStars()
467 |   ,1000
468 | 
469 | 
470 | main()
471 | window.scrollBy(0,1)
472 | $('.pager').remove()
473 | 


--------------------------------------------------------------------------------
/nikki2.css:
--------------------------------------------------------------------------------
   1 | /* CSS Document */
   2 | @import url(http://fonts.googleapis.com/css?family=Maven+Pro:700);
   3 | 
   4 | /* @Main
   5 | ====================================== */
   6 | 
   7 | 
   8 | html{
   9 |   margin:0;
  10 |   padding:0;
  11 |   }
  12 | 
  13 | body{
  14 |   margin:0;
  15 |   padding:0;
  16 |    color:#000;
  17 |    background:#022b5c url('bg.jpg') repeat-x fixed top center;
  18 |    font-family: 'Maven Pro','Helvetica','Arial','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
  19 | }
  20 | 
  21 | a{
  22 | color:#0e4b84;
  23 | }
  24 | 
  25 | a:visited{
  26 |     color:#3c6b97;
  27 | }
  28 | 
  29 | a:hover{
  30 | color:#1673c9;
  31 | }
  32 | 
  33 | a,pre{
  34 |    word-break: break-all;
  35 |    overflow: hidden;
  36 | }
  37 | 
  38 | pre{
  39 |    padding:10px;
  40 |    background:#fafafa;
  41 |    white-space: pre-wrap;
  42 |    border-radius: 3px;
  43 |   -webkit-border-radius: 3px;   
  44 |   -moz-border-radius: 3px;
  45 |   -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,.20);
  46 |   -moz-box-shadow: inset 0 0 5px rgba(0,0,0,.20); 
  47 |   box-shadow: inset 0 0 5px rgba(0,0,0,.20);
  48 | }
  49 | 
  50 | 
  51 | /* @GLOBALHEADER
  52 | ====================================== */
  53 | #globalheader-container{
  54 |     background: rgba(255, 255, 255, 0.5);
  55 |     -webkit-box-shadow: 0 0 10px rgba(0,0,0,.40);
  56 |     -moz-box-shadow: 0 0 10px rgba(0,0,0,.40); 
  57 |     box-shadow: 0 0 10px rgba(0,0,0,.40);
  58 | }
  59 |   
  60 | /* @Container
  61 | ====================================== */
  62 | #container{
  63 |   width:800px;
  64 |   margin:0 auto;
  65 |   text-align:center;
  66 | }
  67 | 
  68 | #container-inner{
  69 |   text-align:left;
  70 | }
  71 | 
  72 | /* @Blog-Title
  73 | ====================================== */
  74 | 
  75 | #title{
  76 |     margin:0;
  77 |     display:inline;
  78 |     font-size:35px;
  79 |     text-shadow:0 2px 2px rgba(0,0,0,.50);
  80 |     -moz-text-shadow:0 2px 2px rgba(0,0,0,.50);
  81 |     -webkit-text-shadow: 0 2px 2px rgba(0,0,0,.50);
  82 |     filter: dropshadow(color=#333333,offX=0,offY=2);
  83 | }
  84 | 
  85 | #title a{
  86 |   text-decoration:none;
  87 |   color:#fff;
  88 | }
  89 | 
  90 | #blog-description{
  91 |     display:inline;
  92 |     color:#fff;
  93 |     margin:0;
  94 |     padding-left:1em;
  95 |     font-size:13px;
  96 |     text-shadow:0 2px 2px rgba(0,0,0,.70);
  97 |     -moz-text-shadow:0 2px 2px rgba(0,0,0,.70);
  98 |     -webkit-text-shadow: 0 2px 2px rgba(0,0,0,.70);
  99 |     filter: dropshadow(color=#333333,offX=0,offY=2);
 100 | }
 101 | 
 102 | 
 103 | /* @Top-box and Navigation Module
 104 | ====================================== */
 105 | 
 106 | 
 107 | /* @Content-Box
 108 | ====================================== */
 109 | 
 110 | 
 111 | #content-inner{
 112 |  -webkit-box-shadow: 0 0 5px rgba(0,0,0,.30);
 113 |  -moz-box-shadow: 0 0 5px rgba(0,0,0,.30); 
 114 |  box-shadow: 0 0 5px rgba(0,0,0,.30);
 115 |     -moz-border-radius: 10px;
 116 |   -webkit-border-radius: 10px;
 117 |   -ms-border-radius: 10px;
 118 |   border-radius: 10px;
 119 |   background: rgba(255, 255, 255, 0.5);
 120 |   background: url('opacity5.png') repeat\9;
 121 | }
 122 | 
 123 | #main{
 124 |     background: rgba(255, 255, 255, 1);
 125 |     background: #fff\9;
 126 |     -moz-border-radius: 10px 0 0 10px;
 127 |     -webkit-border-radius: 10px 0 0 10px;
 128 |     -ms-border-radius: 10px 0 0 10px;
 129 |     border-radius: 10px 0 0 10px;
 130 |     padding:20px;
 131 |     float:left;
 132 |     width:510px;
 133 |    -webkit-box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 134 |    -moz-box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 135 |     box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 136 |     min-height: 800px;
 137 | }
 138 | 
 139 | * html #main{
 140 |     box-shadow: 0px 0px 0px 0px rgba(255,255,255,.00);
 141 | }
 142 | 
 143 | #box1{
 144 | float:right;
 145 | width:240px;
 146 | -moz-transition:all 1s ease;
 147 | -webkit-transition:all 1s ease;
 148 | }
 149 | 
 150 | #box2{
 151 | float:right;
 152 |   -moz-transition:all 1s ease;
 153 |   -webkit-transition:all 1s ease;
 154 | }
 155 | 
 156 | #box2:after{
 157 |   content:"";
 158 |   display:block;
 159 |   clear:both;
 160 | } 
 161 | 
 162 | #footer-box:after{
 163 |   content:"";
 164 |   display:block;
 165 |   clear:both;
 166 | } 
 167 | 
 168 | /* @Section,Article
 169 | ====================================== */
 170 | .entry-content {
 171 |     font-size: 13px;
 172 |     line-height: 1.8;
 173 |     margin:1em 0;
 174 |     font-family:'Helvetica','Arial','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
 175 | }
 176 | 
 177 | .entry{
 178 |   margin-bottom:50px;
 179 |   position:relative;
 180 | }
 181 | 
 182 | .date{
 183 |   display:block;
 184 |   width: 95px;
 185 |   background: rgba(0, 0, 0, 0.5);
 186 |   background: #666\9;
 187 |   color:#fff;
 188 |   padding: 5px 15px 5px 20px;
 189 |   position:relative;
 190 |   left:-20px;
 191 |      text-shadow:0 1px 2px #000;
 192 |   -moz-text-shadow:0 1px 2px #000;
 193 |   -webkit-text-shadow: 0 1px 2px #000;
 194 |     -moz-border-radius: 0 3px  3px 0;
 195 |   -webkit-border-radius:  0 3px  3px 0;
 196 |   -ms-border-radius:  0 3px  3px 0;
 197 |   border-radius:  0 3px  3px 0;
 198 | }
 199 | 
 200 | .entry-title{
 201 |   font-size:20px;
 202 |   padding:10px 0;
 203 |   margin:0;
 204 | }
 205 | 
 206 | .entry-title a{
 207 | text-decoration:none; 
 208 | }
 209 | 
 210 | .entry-footer-section{
 211 |   font-style:italic;
 212 |   color:#666;
 213 |   margin:0;
 214 | }
 215 | 
 216 | .entry-footer-time a{
 217 |     color:#666;
 218 | }
 219 | 
 220 | .entry-footer-time a:hover{
 221 |     color:#1673C9;
 222 | }
 223 | 
 224 | .pager{
 225 |   text-align:center;
 226 | }
 227 | 
 228 | .pager a{
 229 |     background: rgba(0, 0, 0, 0.5);
 230 |     color:#fff;
 231 |     padding: 5px 15px;
 232 |     margin:0px 2px;
 233 |     font-size:13px;
 234 |     -moz-border-radius: 3px;
 235 |     -webkit-border-radius:  3px;
 236 |     -ms-border-radius:  3px;
 237 |     border-radius:  3px;
 238 |     text-decoration:none;
 239 | }
 240 | 
 241 | .pager a:hover{
 242 |     color:#fff !important;
 243 |     background: rgba(0, 0, 0, 0.7);
 244 | }
 245 | 
 246 | /* @Article headline
 247 | ====================================== */
 248 | .entry-content h1{
 249 |   font-size:16px;
 250 |   margin:0.5em 0;
 251 | }
 252 | 
 253 | .entry-content h2{
 254 |   font-size:15px;
 255 |   margin:0.5em 0;  
 256 | }
 257 | 
 258 | .entry-content h3{
 259 | font-size:14px;
 260 |   margin:0.5em 0;
 261 | }
 262 | 
 263 | .entry-content p{
 264 |   margin:0.5em 0;  
 265 | }
 266 | 
 267 | /* @Entry TextStyle
 268 | ====================================== */
 269 | .entry-content img{
 270 |   max-width:500px;
 271 |   height:auto;
 272 | }
 273 | 
 274 | .entry blockquote{
 275 |     padding: 10px;
 276 |     margin: 1em 0;
 277 |     border:1px solid #ddd;
 278 |     border-radius: 3px;
 279 |     -webkit-border-radius: 3px;
 280 |     -moz-border-radius: 3px;
 281 | }
 282 | 
 283 | .entry blockquote p{
 284 |     margin-top:0;
 285 |     margin-bottom:0;
 286 | }
 287 | 
 288 | .entry-content table {
 289 |     border-collapse: collapse;
 290 |     border-spacing: 0;
 291 | }
 292 | 
 293 | .entry-content table th,
 294 | .entry-content table td{
 295 |     border:1px solid #ddd;
 296 |     padding:5px 10px;
 297 | }
 298 | 
 299 | .entry-content table th{
 300 |     background:#fafafa;
 301 | }
 302 | 
 303 | .entry-content h1,
 304 | .entry-content h2,
 305 | .entry-content h3,
 306 | .entry-content h4,
 307 | .entry-content h5,
 308 | .entry-content h6{
 309 |   margin: 1em 0 0.5em 0;
 310 | }
 311 | 
 312 | .entry-content h1,
 313 | .entry-content h2{
 314 |     font-size:130%;
 315 | }
 316 | 
 317 | .entry-content h3{
 318 |     font-size:120%;
 319 | }
 320 | 
 321 | .entry-content h4{
 322 |     font-size:110%;
 323 | }
 324 | 
 325 | .entry-content h5{
 326 |     font-size:100%;
 327 | }
 328 | 
 329 | .entry-content h6{
 330 |     font-size:100%;
 331 | }
 332 | 
 333 | .entry-content h1,
 334 | .entry-content h2,
 335 | .entry-content h3{
 336 |     border-bottom:1px dashed #999;
 337 | }
 338 | 
 339 | .entry-content ul{
 340 |   margin: 0 0 0 1.5em;
 341 |   padding: 0;
 342 | }
 343 | 
 344 | a.keyword{
 345 |     color:#000;
 346 |     text-decoration:none;
 347 |     border-bottom: 1px solid #DEDEDE;
 348 | }
 349 | 
 350 | pre.lang-aa{
 351 |     font-size:13px;
 352 |     line-height:14px;
 353 | }
 354 | 
 355 | 
 356 | /* @Edit HEADER-MENU
 357 | ====================================== */
 358 | .entry-header-menu a{
 359 |   font-size:13px;
 360 |   display:inline;
 361 | cursor: pointer;
 362 | border-radius: 3px;
 363 | -webkit-border-radius: 3px;
 364 | -moz-border-radius: 3px;
 365 |    color: #fff;
 366 |    padding:3px 10px;
 367 |    background:#5297de;
 368 |     text-decoration: none;
 369 |     background: -webkit-gradient(
 370 | 	linear,
 371 | 	left top,
 372 | 	left bottom,
 373 | 	from(#73b0ee),
 374 | 	to(#3675b4)
 375 |     );
 376 |     background: -moz-linear-gradient(
 377 | 	top,
 378 | 	#73b0ee 0%,
 379 | 	#3675b4 100%
 380 |     );
 381 |         background: -o-linear-gradient(
 382 | 	top,
 383 | 	#73b0ee 0%,
 384 | 	#3675b4 100%
 385 |     );
 386 |    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4));
 387 |   -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4))";
 388 |      zoom: 1;
 389 |   font-weight:bold;
 390 |   border:1px solid #447296;
 391 |   text-shadow:0 -1px 0px #164a5a;
 392 |   -moz-text-shadow:0 -1px 0px #164a5a;
 393 |   -webkit-text-shadow: 0 -1px 0px #164a5a;
 394 |   position:absolute;
 395 |   top:0px;
 396 |   left:120px;
 397 | }
 398 | 
 399 | .entry-header-menu a:hover{
 400 |     background:#2f81d5;
 401 |     background: -webkit-gradient(
 402 | 	linear,
 403 | 	left top,
 404 | 	left bottom,
 405 | 	from(#73b0ee),
 406 | 	to(#1f62a7)
 407 |     );
 408 |     background: -moz-linear-gradient(
 409 | 	top,
 410 | 	#73b0ee 0%,
 411 | 	#1f62a7 100%
 412 |     );
 413 |         background: -o-linear-gradient(
 414 | 	top,
 415 | 	#73b0ee 0%,
 416 | 	#1f62a7 100%
 417 |     );
 418 |     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7));
 419 |     -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7))";        
 420 |     zoom: 1;    
 421 |     border:1px solid #2066ad;
 422 |     text-shadow: 0 -1px 0px #164A5A;
 423 |     text-decoration:none;
 424 |     color:#fff !important;
 425 | }
 426 | 
 427 | 
 428 | /* @Comment
 429 | ====================================== */
 430 | .entry-footer{
 431 |   margin-top:30px;
 432 |   margin-bottom:80px;
 433 |   font-size:12px;
 434 | }
 435 | 
 436 | .entry-footer .social-buttons{
 437 |     margin: 10px 0;
 438 | }
 439 | 
 440 | 
 441 | .comment{
 442 |   padding:0;
 443 |   list-style:none;
 444 | }
 445 | 
 446 | .comment-user-name{
 447 |     display:block;
 448 |     color:#666;
 449 |     line-height: 40px;
 450 |     margin:0;
 451 | }
 452 | 
 453 | .comment-content{
 454 |   margin-bottom:0.5em;
 455 | }
 456 | 
 457 | .comment-content p{
 458 |     margin:0;
 459 |     word-wrap: break-word;
 460 | }
 461 | 
 462 | .comment-metadata{
 463 |   margin:0;
 464 | }
 465 | 
 466 | .comment li {
 467 |     margin-bottom: 2px;
 468 | }
 469 | 
 470 | .entry-comment:last-child{
 471 |   margin-bottom:30px;
 472 | }
 473 | 
 474 | .comment-metadata a{
 475 |     text-decoration:none;
 476 |     font-style: italic;
 477 |     color: #666;
 478 | }
 479 | 
 480 | .leave-comment-title{
 481 |   display:inline;
 482 | cursor: pointer;
 483 | border-radius: 3px;
 484 | -webkit-border-radius: 3px;
 485 | -moz-border-radius: 3px;
 486 |     background:#5297de;
 487 |    color: #fff;
 488 |    padding:6px 15px;
 489 |     text-decoration: none;
 490 |     background: -webkit-gradient(
 491 | 	linear,
 492 | 	left top,
 493 | 	left bottom,
 494 | 	from(#73b0ee),
 495 | 	to(#3675b4)
 496 |     );
 497 |     background: -moz-linear-gradient(
 498 | 	top,
 499 | 	#73b0ee 0%,
 500 | 	#3675b4 100%
 501 |     );
 502 |         background: -o-linear-gradient(
 503 | 	top,
 504 | 	#73b0ee 0%,
 505 | 	#3675b4 100%
 506 |     );
 507 |    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4));
 508 |   -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#3675b4))";
 509 |   font-weight:bold;
 510 |   border:1px solid #447296;
 511 |   text-shadow:0 -1px 0px #164a5a;
 512 |   -moz-text-shadow:0 -1px 0px #164a5a;
 513 |   -webkit-text-shadow: 0 -1px 0px #164a5a;
 514 | }
 515 | 
 516 | .leave-comment-title:hover{
 517 |     color: #fff;
 518 |     background:#2f81d5;
 519 |     background: -webkit-gradient(
 520 | 	linear,
 521 | 	left top,
 522 | 	left bottom,
 523 | 	from(#73b0ee),
 524 | 	to(#1f62a7)
 525 |     );
 526 |     background: -moz-linear-gradient(
 527 | 	top,
 528 | 	#73b0ee 0%,
 529 | 	#1f62a7 100%
 530 |     );
 531 |         background: -o-linear-gradient(
 532 | 	top,
 533 | 	#73b0ee 0%,
 534 | 	#1f62a7 100%
 535 |     );
 536 |     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7));
 537 |     -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#73b0ee, endcolorstr=#1f62a7))";        
 538 |     zoom: 1;    
 539 |     border:1px solid #2066ad;
 540 |     text-shadow: 0 -1px 0px #164A5A;
 541 |      text-decoration:none;
 542 | }
 543 | 
 544 | .hatena-id-icon{
 545 |   position:relative;
 546 |   left:-5px;
 547 |   top:15px;
 548 |    padding: 13px 17px 12px 11px;
 549 |    background:transparent url('comment.png') no-repeat center;
 550 | }
 551 | 
 552 | .comment-user-name .hatena-id-icon{
 553 |     position: relative;
 554 |     left: -5px;
 555 | }
 556 | 
 557 | /* @Module
 558 | ====================================== */
 559 | /* .hatena-module{ */
 560 | /* width:200px; */
 561 | /* margin:20px 20px 50px 20px; */
 562 | /* font-size:13px; */
 563 | /* } */
 564 | 
 565 | .hatena-module-title{
 566 |     color:#fff;
 567 |     margin:0;
 568 |     font-size:20px;
 569 |     text-shadow:0 2px 2px rgba(0,0,0,.70);
 570 |     -moz-text-shadow:0 2px 2px rgba(0,0,0,.70);
 571 |     -webkit-text-shadow: 0 2px 2px rgba(0,0,0,.70);
 572 |     padding: 0 0 0.4em 0;
 573 |     border-bottom: 1px dashed #666;
 574 |     margin-bottom:0.5em;
 575 | }
 576 | 
 577 | .hatena-module ul{
 578 |   margin:0;
 579 |   padding:0;
 580 |   list-style:none;
 581 | }
 582 | 
 583 | .hatena-module li{
 584 |   padding-bottom:0.5em;
 585 | }
 586 | 
 587 | .hatena-module li.archive{
 588 |     border-top: 1px dashed #666;
 589 |     margin-top:0.5em;
 590 |     padding-top:0.5em;
 591 | }
 592 | 
 593 | /* @Module::Profile
 594 | ====================================== */
 595 | .hatena-module .profile-icon{
 596 |   display:block;
 597 |   margin-bottom:5px;
 598 | }
 599 | 
 600 | .hatena-module-body .id a{
 601 |   font-size:13px;
 602 |   text-decoration:none;
 603 |   font-weight:bold;
 604 | }
 605 | 
 606 | .hatena-module-body .profile-description{
 607 |    margin: 0 0 5px 0;
 608 | }
 609 | 
 610 | 
 611 | /* @Module::Search
 612 | ====================================== */
 613 | 
 614 | form.search-form{
 615 | margin-top:10px;  
 616 | }
 617 | 
 618 | form.search-form input {
 619 |   border:none;
 620 |   vertical-align:middle;
 621 | }
 622 | 
 623 | .search-form .search-module-input {
 624 |     width: 168px;  
 625 |     background: -webkit-gradient(
 626 |     linear, 
 627 |     left top, 
 628 |     left bottom, 
 629 |     from(#eee), 
 630 |     color-stop(0.5, #eee),
 631 |     to(#fff)
 632 |     );
 633 |     background: -moz-linear-gradient(
 634 |     top,
 635 |     #eee 0%,
 636 |     #eee 50%,
 637 |     #fff 100%
 638 |     );
 639 |     padding: 3px;  
 640 |     margin:0;
 641 |     font-size:12px;
 642 |     border-radius: 12px;   
 643 |     -webkit-border-radius: 12px;   
 644 |     -moz-border-radius: 12px;
 645 |     background: rgba(0, 0, 0, 0.2);
 646 |     box-shadow: 0px -1px 0px #454545;
 647 | }
 648 | 
 649 | .search-form .search-module-button {
 650 |    height:23px;
 651 |    width:23px;
 652 |    border: none;  
 653 |    text-indent: -999px;
 654 |    margin-left: -3px;
 655 |    *margin-left: -5px;
 656 |    cursor: pointer;   
 657 |   background:#565656 url('/images/theme/search_w.png') 50% 50% no-repeat;
 658 |          border-radius: 12px;   
 659 |   -webkit-border-radius: 12px;   
 660 |   -moz-border-radius: 12px;
 661 | }
 662 | 
 663 | 
 664 | 
 665 | /* @Footer-Area-Module
 666 | ====================================== */
 667 | #footer-box{
 668 | }
 669 | 
 670 | /* @Footer
 671 | ====================================== */
 672 | #footer{
 673 |   clear:both;
 674 |   text-align:center;
 675 |   margin:30px 0;
 676 | }
 677 | 
 678 | #footer a{
 679 |   color:#fff;
 680 |   font-weight:bold;
 681 |   text-decoration:none;
 682 |      text-shadow:0 2px 2px #000;
 683 |   -moz-text-shadow:0 2px 2px #000;
 684 |   -webkit-text-shadow: 0 2px 2px #000;
 685 |    font-style:normal;
 686 | }
 687 | 
 688 | 
 689 | 
 690 | /* @HATENA-EMBED(FOTOLIFE,TWITPIC)
 691 | ====================================== */
 692 | 
 693 | .hatena-embed.hatena-fotolife,
 694 | .hatena-embed.twitpic{
 695 |   padding:10px 10px 30px 10px;
 696 |   margin:1em 0;
 697 |   background: transparent;
 698 |   display: inline-block;
 699 |   border:1px solid #dfdfdf;
 700 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 701 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 702 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 703 |   background:#fff;
 704 |   text-align:center;
 705 | }
 706 | 
 707 | .hatena-embed.hatena-fotolife{
 708 |   background:#fff url('/images/theme/hatena-embed/embed-fotolife.png')no-repeat right bottom;
 709 | }
 710 | 
 711 | .hatena-embed.twitpic{
 712 |   padding:10px 10px 10px 10px;
 713 | }
 714 | 
 715 | .hatena-embed.hatena-fotolife .hatena-embed-image,
 716 | .hatena-embed.twitpic .hatena-embed-image{
 717 |   display:inline-block;
 718 |   max-width:488px;
 719 | }
 720 | 
 721 | .hatena-embed.hatena-fotolife .hatena-embed-body,
 722 | .hatena-embed.hatena-fotolife .hatena-embed-body a,
 723 | .hatena-embed.twitpic .hatena-embed-body,
 724 | .hatena-embed.twitpic .hatena-embed-body a{
 725 |   text-align:center;
 726 |   font-family: 'Homemade Apple', cursive;
 727 |   color:#454545;
 728 |   font-size:16px;
 729 |   margin-top:10px;
 730 | }
 731 | 
 732 | /* @HATENA-EMBED(COCO,4SQ)
 733 | ====================================== */
 734 | .hatena-embed.hatena-coco,
 735 | .hatena-embed.foursquare{
 736 |   margin:1em 0;
 737 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 738 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 739 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 740 |   }
 741 |   
 742 | .hatena-embed.hatena-coco{
 743 | border: 1px solid #e2d279;
 744 | padding: 20px 30px;
 745 | background:#faf9e6 url('/images/theme/hatena-embed/embed-coco.png')no-repeat right bottom;
 746 | }
 747 | 
 748 | .hatena-embed.hatena-coco .hatena-embed-image,
 749 | .hatena-embed.foursquare .hatena-embed-image{
 750 |   width:100px;
 751 |   height:100px;
 752 | }
 753 | 
 754 | .hatena-embed.foursquare{
 755 | border: 1px solid #C1D5DB;
 756 | padding: 20px 30px;
 757 | background:#E6EFF2 url('/images/theme/hatena-embed/embed-4sq.png')no-repeat right bottom;
 758 | }
 759 | 
 760 | 
 761 | 
 762 | /* @HATENA-EMBED(BOOKMARK)
 763 | ====================================== */
 764 | .hatena-embed.hatena-bookmark{
 765 |    padding:15px 15px 15px 70px;
 766 |   margin:1em 0;
 767 |   background: transparent;
 768 |   border:1px solid #dfdfdf;
 769 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 770 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 771 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 772 |   background:#fff url('/images/theme/hatena-embed/embed-bookmark.png')no-repeat 10px top;
 773 |   position:relative;
 774 | }
 775 | 
 776 | .hatena-embed.hatena-bookmark a{
 777 |   text-decoration:underline;
 778 | }
 779 | 
 780 | .hatena-embed.hatena-bookmark .hatena-embed-image{
 781 |   max-height:50px;
 782 | }
 783 | 
 784 | .hatena-embed.hatena-bookmark .hatena-embed-body{
 785 | }
 786 | 
 787 | /* @HATENA-EMBED(HAIKU)
 788 | ====================================== */
 789 | .hatena-embed.hatena-haiku{
 790 |    padding:15px 15px 15px 70px;
 791 |   margin:1em 0;
 792 |   background: transparent;
 793 |   border:1px solid #dfdfdf;
 794 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 795 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 796 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 797 |   background:#fff url('/images/theme/hatena-embed/embed-haiku.png')no-repeat 5px 5px;
 798 | }
 799 | 
 800 | /* @HATENA-EMBED(MONOLITH)
 801 | ====================================== */
 802 | .hatena-embed.hatena-monolith{
 803 |   width:478px;
 804 |    padding:15px;
 805 |   margin:1em 0;
 806 |   background: transparent;
 807 |   border:1px solid #dfdfdf;
 808 |   -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 809 |   -moz-box-shadow: 0 1px 5px rgba(0,0,0,.16);
 810 |   box-shadow: 0 1px 5px rgba(0,0,0,.16);
 811 |   background:#fff url('/images/theme/hatena-embed/embed-monolith.png')no-repeat right bottom;
 812 | }
 813 | 
 814 | .hatena-embed.hatena-monolith .hatena-embed-image{
 815 |   display:block;
 816 |   float:left;
 817 |   max-width:98px;
 818 |   border:1px solid #dfdfdf;
 819 | }
 820 | 
 821 | .hatena-embed.hatena-monolith .hatena-embed-body{
 822 |   float:left;
 823 |   width:368px;
 824 |   margin-left:10px;
 825 | }
 826 | 
 827 | .hatena-embed.hatena-monolith:after{
 828 |     content: "";
 829 |     display: block;
 830 |     height: 0;
 831 |     visibility: hidden;
 832 |     clear: both;
 833 | }
 834 | 
 835 | /* @HATENA-EMBED(TWITTER)
 836 | ====================================== */
 837 | .hatena-embed.twitter{
 838 |    padding:10px 0;
 839 |   margin:1em 0;
 840 |   border-bottom: 1px dotted #757575;
 841 |   border-top: 1px dotted #757575;
 842 | }
 843 | 
 844 | 
 845 | /* @HATENA-EMBED(ATND)
 846 | ====================================== */
 847 | .hatena-embed.atnd{
 848 |    padding:10px 0;
 849 |   margin:1em 0;
 850 |   border-bottom: 1px dotted #757575;
 851 |   border-top: 1px dotted #757575;
 852 |   font-family:'PT Sans Caption', Helvetica, 'ヒラギノ角ゴ Pro W3','HiraKakuProN-W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
 853 | }
 854 | 
 855 | .hatena-embed-detail.atnd-detail{
 856 |   font-size: 20px;
 857 |   font-weight:bold;
 858 |   color:#262626;
 859 | }
 860 | 
 861 | .hatena-embed-detail.atnd-detail:hover{
 862 |   color:#EA1F00;
 863 |   text-decoration:none;
 864 | }
 865 | 
 866 | .hatena-embed.atnd .content-body{
 867 |   font-size:12px;
 868 |   color:#222;
 869 | }
 870 | 
 871 | 
 872 | 
 873 | /* @PREVIEW
 874 | ====================================== */
 875 | 
 876 | body.preview{
 877 |    color:#454545;
 878 |    background:#fff;
 879 |    padding:10px;
 880 | }
 881 | 
 882 | body.preview .hatena-embed{
 883 |   margin-right:30px;
 884 | }
 885 | 
 886 | 
 887 | 
 888 | /* @About
 889 | ====================================== */
 890 | .page-about #main,
 891 | .page-archive #main{
 892 |     -moz-border-radius: 10px;
 893 |     -webkit-border-radius: 10px;
 894 |     -ms-border-radius: 10px;
 895 |     border-radius: 10px;
 896 |     width:760px;
 897 |    -webkit-box-shadow: 0px 0px 5px  rgba(0,0,0,.30);
 898 |    -moz-box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 899 |     box-shadow: 5px 0px 10px -10px rgba(0,0,0,.70);
 900 |     min-height: 500px;
 901 |     float:none;
 902 | }
 903 | 
 904 | .page-about dt{
 905 |     font-size:16px;
 906 |     font-weight:bold;
 907 | }
 908 | 
 909 | .page-about dd{
 910 |     margin-left:0;
 911 |     margin-bottom:30px;
 912 | }
 913 | 
 914 | .page-about img.profile-icon{
 915 |     height:16px;
 916 |     width:16px;
 917 | }
 918 | 
 919 | 
 920 | /* @Archive
 921 | ====================================== */
 922 | .page-archive #main-inner{
 923 |     font-size:14px;
 924 | }
 925 | 
 926 | .page-archive #main-inner h1{
 927 |     font-size:18px;
 928 | }
 929 | 
 930 | .page-archive #main-inner .entry-title{
 931 |     font-size:14px;
 932 | }
 933 | 
 934 | .page-archive #main-inner li{
 935 |     margin:5px 0;
 936 | }
 937 | 
 938 | #google_afc_user {
 939 |     height:0px;
 940 |     overflow:hidden;
 941 | }
 942 | 
 943 | body {
 944 |     background: #ffffff;
 945 | }
 946 | 
 947 | #title {
 948 |     text-shadow: none;
 949 | }
 950 | 
 951 | #title a {
 952 |    color: #444;
 953 | }
 954 | 
 955 | #main{
 956 |     margin-top: 70px;
 957 |     background: #ffffff;
 958 |     color: #444;
 959 |     -moz-border-radius: 0px;
 960 |     -webkit-border-radius: 0px;
 961 |     -ms-border-radius: 0px;
 962 |     border-radius: 0px;
 963 |     padding:20px;
 964 |     float:left;
 965 |     width:510px;
 966 |    -webkit-box-shadow: none;
 967 |    -moz-box-shadow: none;
 968 |     box-shadow: none;
 969 |     min-height: 800px;
 970 | }
 971 | 
 972 | #box1 {
 973 |     display: none;
 974 | }
 975 | 
 976 | #box2 {
 977 |     position: none;
 978 |     display: none;
 979 | }
 980 | 
 981 | #content-inner{
 982 |  -webkit-box-shadow: none;
 983 |  -moz-box-shadow: none;
 984 |  box-shadow: none;
 985 |     -moz-border-radius: 0;
 986 |   -webkit-border-radius: 0;
 987 |   -ms-border-radius: 0;
 988 |   border-radius: 0;
 989 |   background: transparent;
 990 | }
 991 | 
 992 | .date {
 993 |     color: #444;
 994 |     background: #ffffff;
 995 |     text-shadow: none;
 996 |     cursor: pointer;
 997 | }
 998 | a.keyword {
 999 |     color: #444;
1000 |     text-decoration: none;
1001 |     border-bottom: 0px;
1002 | }
1003 | 
1004 | .hatena-module-title {
1005 |     color: #444;
1006 | }
1007 | 
1008 | .pager a {
1009 |   color: #ffffff;
1010 | }
1011 | 
1012 | #footer a {
1013 |   color: #ffffff;
1014 | }
1015 | 
1016 | .entry-footer-section{
1017 |   font-style: normal;
1018 | }
1019 | .entry-footer-section a {
1020 |     text-decoration: none;
1021 | }
1022 | 
1023 | #globalheader-container{
1024 |     color: #444;
1025 |     background: transparent;
1026 |     -webkit-box-shadow: none;
1027 |     -moz-box-shadow: none;
1028 |     box-shadow: none;
1029 | }
1030 | 
1031 | .hatena-module-links {
1032 |     display: none;
1033 | }
1034 | 
1035 | .hatena-module-search-box {
1036 |     display: none;
1037 | }
1038 | 
1039 | .comment-box {
1040 |     display: none;
1041 | }
1042 | 
1043 | .hatena-module-title {
1044 |     display: none;
1045 | }
1046 | 
1047 | h1.entry-title {
1048 |     display: none;
1049 | }
1050 | 
1051 | .id {
1052 |     display: none;
1053 | }
1054 | 
1055 | .hatena-module .profile-icon {
1056 |     display: none;
1057 | }
1058 | 
1059 | .entry-footer-section .author {
1060 |     display: none;
1061 | }
1062 | 
1063 | #footer {
1064 |     visibility: hidden;
1065 | }
1066 | 
1067 | #container {
1068 |     width: 550px;
1069 | }
1070 | 
1071 | .hatena-star-comment-container {
1072 |     display: none;
1073 | }
1074 | 
1075 | #globalheader-container {
1076 |     display: none;
1077 | }
1078 | 
1079 | .social-buttons {
1080 |     display: none;
1081 | }
1082 | 
1083 | .pager {
1084 |     display: none;
1085 | }
1086 | 
1087 | #blog-description {
1088 |     display: none;
1089 | }
1090 | 
1091 | .profile-description {
1092 |     display: none;
1093 | }
1094 | 
1095 | .entry.no-entry {
1096 |     display: none;
1097 | }
1098 | 
1099 | /* ----- calendar ----- */
1100 | 
1101 | #calendar-container {
1102 |     position: fixed;
1103 |     bottom: 0px;
1104 |     width: 550px;
1105 |     height: 50px;
1106 |     background: white;
1107 | }
1108 | 
1109 | #calendar-container #calendar {
1110 |     cursor: pointer;
1111 |     width: 100%;
1112 |     height: 16px;
1113 |     padding: 0;
1114 |     position: absolute;
1115 |     left: 0px;
1116 |     top: 10px;
1117 |     background: #fafafa;
1118 |     border: 1px solid #dadada;
1119 | }
1120 | 
1121 | #calendar-container #scroll-bar {
1122 |     position: absolute;
1123 |     top: 3px;
1124 |     left: 0px;
1125 |     width: 10px;
1126 |     height: 10px;
1127 |     opacity: 0.8;
1128 |     background:#666;
1129 | 
1130 |     -webkit-transition-property: left;
1131 |     -webkit-transition-duration: 0.1s;
1132 |     -webkit-transition-timing-function: linear;
1133 | }
1134 | 
1135 | #calendar-container .calendar-bar {
1136 |     position: absolute;
1137 |     width: 1px;
1138 |     height: 100%;
1139 |     background: #444;
1140 |     top: 0px;
1141 |     opacity: 0.7;
1142 | }
1143 | 
1144 | #calendar-container .calenda-bar.loading {
1145 |     background: #999;
1146 | }
1147 | 
1148 | #calendar-container #tip {
1149 |     color: #444;
1150 |     font-size: 14px;
1151 |     margin-top: 30px;
1152 | }
1153 | 
1154 | 
1155 | /* ----- header, blog-title */
1156 | #blog-title-inner {
1157 |     width:550px;
1158 |     height:60px;
1159 |     background:white;
1160 |     position:fixed;
1161 |     z-index:1000;
1162 |     top: 0px;
1163 | }
1164 | 
1165 | #blog-title-inner h1#title {
1166 |     position: absolute;
1167 |     left: 0px;
1168 |     bottom: 0px;
1169 | }
1170 | 
1171 | .hatena-module .hatena-follow-button-box {
1172 |     position: absolute;
1173 |     right: 0px;
1174 |     bottom: 0px;
1175 |     padding-bottom:0px;
1176 |     margin-bottom: 0px;
1177 | }
1178 | 
1179 | .categories {
1180 |     display: none;
1181 | }
1182 | 
1183 | .hatena-counter {
1184 |     display: none;
1185 | }


--------------------------------------------------------------------------------
/nikki2.js:
--------------------------------------------------------------------------------
  1 | var appendBar, appendBarAtTime, appendEntry, autoloader, checkScroll, collectCalendar, debounce, entryFromScrollTop, entryFromTime, executeByQueue, extractPath, fetchYear, fetchedHash, formatDate, keyWithPrefix, later, main, roundEpoch, scrollByLocation, scrollToEntry, selectEntryByUUID, setTip, showEntries, throttle, updateScrollBar, updateStars, waitForLoadImages, _tipTimer;
  2 | later = function(func) {
  3 |   return setTimeout(func, 0);
  4 | };
  5 | executeByQueue = (function() {
  6 |   var queue, timer;
  7 |   queue = [];
  8 |   timer = null;
  9 |   return function(func) {
 10 |     if (timer) {
 11 |       queue.push(func);
 12 |     } else {
 13 |       timer = setInterval(function() {
 14 |         if (queue.length > 0) {
 15 |           return queue.shift()();
 16 |         } else {
 17 |           clearInterval(timer);
 18 |           return timer = null;
 19 |         }
 20 |       }, 1000);
 21 |       return func();
 22 |     }
 23 |   };
 24 | })();
 25 | keyWithPrefix = function(key) {
 26 |   return "blog-viewer-" + key;
 27 | };
 28 | extractPath = function(url) {
 29 |   return url.replace("" + location.protocol + "//" + location.host, "");
 30 | };
 31 | roundEpoch = function(epoch) {
 32 |   var date;
 33 |   date = new Date(epoch * 1000);
 34 |   return Math.floor(new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() / 1000);
 35 | };
 36 | appendBar = function(x, css) {
 37 |   var bar;
 38 |   bar = $('<div>').attr({
 39 |     "class": 'calendar-bar'
 40 |   }).css({
 41 |     left: x
 42 |   });
 43 |   if (css) {
 44 |     bar.css(css);
 45 |   }
 46 |   bar.appendTo('#calendar');
 47 |   return bar;
 48 | };
 49 | appendBarAtTime = function(created, css) {
 50 |   var date_from, date_now;
 51 |   date_from = new Date(2011, 11 - 1, 7);
 52 |   date_now = new Date();
 53 |   return appendBar("" + ((created - date_from) / (date_now - date_from) * 100) + "%", css);
 54 | };
 55 | selectEntryByUUID = function(uuid) {
 56 |   var left;
 57 |   $(".calendar-bar.selected").removeClass("selected");
 58 |   $(".calendar-bar[data-uuid=\"" + uuid + "\"]").addClass('selected');
 59 |   if (!$(".calendar-bar.selected").length) {
 60 |     return;
 61 |   }
 62 |   left = $(".calendar-bar.selected").position().left - $("#scroll-bar").width() / 2;
 63 |   if (left < 3) {
 64 |     left = 3;
 65 |   }
 66 |   if (left > 550 - 13) {
 67 |     left = 550 - 13;
 68 |   }
 69 |   return $("#scroll-bar").css({
 70 |     left: left
 71 |   });
 72 | };
 73 | throttle = function(fn, delay) {
 74 |   var timer;
 75 |   timer = null;
 76 |   return function() {
 77 |     var args, context;
 78 |     if (timer) {
 79 |       return;
 80 |     }
 81 |     context = this;
 82 |     args = arguments;
 83 |     return timer = setTimeout(function() {
 84 |       timer = null;
 85 |       return fn.apply(context, args);
 86 |     }, delay || 100);
 87 |   };
 88 | };
 89 | debounce = function (func, threshold, execAsap) {
 90 |     var timeout;
 91 |     return function debounced () {
 92 |         var obj = this, args = arguments;
 93 |         function delayed () {
 94 |             if (!execAsap)
 95 |                 func.apply(obj, args);
 96 |             timeout = null;
 97 |         };
 98 |         if (timeout)
 99 |             clearTimeout(timeout);
100 |         else if (execAsap)
101 |             func.apply(obj, args);
102 |         timeout = setTimeout(delayed, threshold || 100);
103 |     };
104 | };
105 | checkScroll = debounce(function() {
106 |   var entry, top_before;
107 |   entry = $('#main-inner article:last');
108 |   if (!entry.length) {
109 |     return;
110 |   }
111 |   top_before = entry.position().top;
112 |   return later(function() {
113 |     var top_after;
114 |     top_after = entry.position().top;
115 |     return window.scrollBy(0, top_after - top_before);
116 |   });
117 | }, 100, true);
118 | updateStars = debounce(function() {
119 |   Hatena.Locale.updateTimestamps(document.body);
120 |   $(document.body).find('span.hatena-star-comment-container, span.hatena-star-star-container').remove();
121 |   return Hatena.Star.EntryLoader.loadNewEntries(document.body);
122 | }, 1000);
123 | scrollToEntry = debounce(function(entry) {
124 |   var top;
125 |   if (!entry) {
126 |     return;
127 |   }
128 |   top = $(entry).position().top - $('#blog-title-inner').height() - 20;
129 |   if (Math.abs($(window).scrollTop() - top) < $(window).height() * 0.4) {
130 |     return window.scrollTo(0, top);
131 |   } else {
132 |     return $('html,body').animate({
133 |       scrollTop: top
134 |     }, 300);
135 |   }
136 | });
137 | updateScrollBar = function() {
138 |   var created, entry;
139 |   entry = entryFromScrollTop();
140 |   if (!entry) {
141 |     return;
142 |   }
143 |   selectEntryByUUID(entry.attr('data-uuid'));
144 |   created = new Date(entry.find('time').attr('datetime'));
145 |   setTip(formatDate(created));
146 |   return autoloader();
147 | };
148 | autoloader = throttle(function() {
149 |   var created, entry;
150 |   if ($(window).scrollTop() <= 0) {
151 |     entry = $('#main-inner article:first');
152 |     if (!entry.length) {
153 |       return;
154 |     }
155 |     created = new Date(entry.find('time').attr('datetime'));
156 |     showEntries(created.getTime() / 1000);
157 |   }
158 |   if ($(window).scrollTop() + $(window).height() >= $(document).height()) {
159 |     entry = $('#main-inner article:last');
160 |     if (!entry.length) {
161 |       return;
162 |     }
163 |     created = new Date(entry.find('time').attr('datetime'));
164 |     return showEntries(created.getTime() / 1000 + 3600 * 24 * 3);
165 |   }
166 | }, 500);
167 | _tipTimer = null;
168 | setTip = function(text) {
169 |   var tip;
170 |   tip = $('#calendar-container #tip');
171 |   if (tip.text() === text) {
172 |     return;
173 |   }
174 |   tip.text(text).stop().css({
175 |     opacity: 1
176 |   });
177 |   if (_tipTimer) {
178 |     clearTimeout(_tipTimer);
179 |   }
180 |   return _tipTimer = setTimeout(function() {
181 |     return tip.animate({
182 |       opacity: 0
183 |     }, 1500);
184 |   }, 10000);
185 | };
186 | entryFromTime = function(time) {
187 |   var date, found, found_created;
188 |   date = new Date(time);
189 |   found = null;
190 |   found_created = 0;
191 |   $('#main-inner article').each(function() {
192 |     var entry, entry_created;
193 |     entry = $(this);
194 |     entry_created = new Date(entry.find('time').attr('datetime'));
195 |     if (Math.abs(entry_created - date) < Math.abs(found_created - date)) {
196 |       found = entry;
197 |       return found_created = entry_created;
198 |     }
199 |   });
200 |   return found;
201 | };
202 | entryFromScrollTop = function() {
203 |   var distance, found, top, window_height;
204 |   top = $(document).scrollTop();
205 |   window_height = $(window).height();
206 |   found = null;
207 |   distance = $(document).height();
208 |   $('#main-inner article').each(function() {
209 |     var entry, entry_height, entry_top;
210 |     entry = $(this);
211 |     entry_top = entry.position().top;
212 |     entry_height = entry.height();
213 |     if (Math.abs(top - entry_top) < distance) {
214 |       found = entry;
215 |       return distance = Math.abs(top - entry_top);
216 |     }
217 |   });
218 |   return found;
219 | };
220 | formatDate = function(date) {
221 |   if (isNaN(date.getFullYear())) {
222 |     return "";
223 |   }
224 |   return "" + (date.getFullYear()) + "-" + (date.getMonth() + 1) + "-" + (date.getDate());
225 | };
226 | waitForLoadImages = function(element, callback) {
227 |   var count, images;
228 |   images = $(element).find('img');
229 |   if (images.length === 0) {
230 |     callback(element);
231 |     return;
232 |   }
233 |   count = 0;
234 |   return images.each(function() {
235 |     var image;
236 |     image = $(this);
237 |     return image.load(function() {
238 |       count++;
239 |       if (count === images.length) {
240 |         return callback(element);
241 |       }
242 |     });
243 |   });
244 | };
245 | scrollByLocation = function() {
246 |   var link, pathname;
247 |   pathname = location.pathname;
248 |   if (pathname === "/") {
249 |     scrollToEntry($('article:last'));
250 |     return;
251 |   }
252 |   link = $(".entry-footer-time a[href=\"" + pathname + "\"]");
253 |   if (!link.length) {
254 |     return;
255 |   }
256 |   return scrollToEntry(link.parents('article'));
257 | };
258 | appendEntry = function(entry) {
259 |   var bar, entry_created, entry_old, entry_old_created, entry_recent, entry_recent_created, uuid;
260 |   entry = $(entry);
261 |   uuid = entry.attr('data-uuid');
262 |   entry_created = new Date(entry.find('time').attr('datetime'));
263 |   entry_old = null;
264 |   entry_old_created = null;
265 |   entry_recent = null;
266 |   entry_recent_created = null;
267 |   $('#main-inner article').each(function() {
268 |     var tmp_created, tmp_entry;
269 |     tmp_entry = $(this);
270 |     tmp_created = new Date(tmp_entry.find('time').attr('datetime'));
271 |     if (tmp_created <= entry_created && (!entry_old || entry_old_created < tmp_created)) {
272 |       entry_old = tmp_entry;
273 |       entry_old_created = tmp_created;
274 |     }
275 |     if (tmp_created >= entry_created && (!entry_recent || entry_recent_created > tmp_created)) {
276 |       entry_recent = tmp_entry;
277 |       return entry_recent_created = tmp_created;
278 |     }
279 |   });
280 |   if (entry_old && entry_old.attr('data-uuid') === uuid) {
281 |     entry.remove();
282 |     return;
283 |   }
284 |   if (entry_recent && entry_recent.attr('data-uuid') === uuid) {
285 |     entry.remove();
286 |     return;
287 |   }
288 |   bar = appendBarAtTime(entry_created);
289 |   bar.attr({
290 |     'data-uuid': uuid
291 |   });
292 |   later(function() {
293 |     return updateStars();
294 |   });
295 |   checkScroll();
296 |   later(function() {
297 |     return updateScrollBar();
298 |   });
299 |   if (entry_old) {
300 |     entry_old.after(entry);
301 |     return;
302 |   }
303 |   if (entry_recent) {
304 |     entry_recent.before(entry);
305 |     return;
306 |   }
307 |   return $('#main-inner').prepend(entry);
308 | };
309 | fetchedHash = {};
310 | showEntries = function(epoch) {
311 |   var deferred, url;
312 |   if (!epoch) {
313 |     return;
314 |   }
315 |   if (epoch < 0) {
316 |     return;
317 |   }
318 |   if (isNaN(epoch)) {
319 |     return;
320 |   }
321 |   deferred = $.Deferred();
322 |   epoch = roundEpoch(epoch);
323 |   url = "/?page=" + epoch;
324 |   if (fetchedHash[url]) {
325 |     later(function() {
326 |       return deferred.resolve();
327 |     });
328 |     return deferred.promise();
329 |   }
330 |   fetchedHash[url] = true;
331 |   executeByQueue(function() {
332 |     return $.ajax({
333 |       url: url,
334 |       dataType: 'html'
335 |     }).success(function(page) {
336 |       var fragment;
337 |       fragment = document.createDocumentFragment();
338 |       $(page).find('article').each(function() {
339 |         var entry, uuid;
340 |         entry = $(this);
341 |         uuid = entry.attr('data-uuid');
342 |         if ($("article[data-uuid=\"" + uuid + "\"]").length > 0) {
343 |           return;
344 |         }
345 |         if (entry.is('.no-entry')) {
346 |           return;
347 |         }
348 |         if (entry.find('img').length > 0) {
349 |           $('#loading-entry').append(entry);
350 |           return waitForLoadImages(this, function(entry) {
351 |             return appendEntry(entry);
352 |           });
353 |         } else {
354 |           return appendEntry(entry);
355 |         }
356 |       });
357 |       return deferred.resolve();
358 |     });
359 |   });
360 |   return deferred.promise();
361 | };
362 | fetchYear = function(year, res) {
363 |   var deferred;
364 |   res || (res = {
365 |     entries: [],
366 |     completed: false
367 |   });
368 |   deferred = $.Deferred();
369 |   $.ajax({
370 |     url: '/archive',
371 |     data: {
372 |       year: year
373 |     },
374 |     dataType: 'html'
375 |   }).success(function(page) {
376 |     var date;
377 |     date = null;
378 |     $(page).find('h1, a.entry-title').each(function() {
379 |       var day, elem, month, _, _ref;
380 |       elem = this;
381 |       try {
382 |         if (elem.tagName.toLowerCase() === 'h1') {
383 |           _ref = $(elem).text().match(/(\d{4})-(\d{2})-(\d{2})/), _ = _ref[0], year = _ref[1], month = _ref[2], day = _ref[3];
384 |           return date = {
385 |             year: +year,
386 |             month: +month,
387 |             day: +day
388 |           };
389 |         } else if (elem.tagName.toLowerCase() === 'a') {
390 |           return res.entries.unshift({
391 |             url: elem.href,
392 |             title: $(elem).text(),
393 |             date: date
394 |           });
395 |         }
396 |       } catch (_e) {}
397 |     });
398 |     res.completed = $(page).find('a.entry-title').length === 0;
399 |     return deferred.resolve(res);
400 |   });
401 |   return deferred.promise();
402 | };
403 | collectCalendar = function() {
404 |   var deferred, year;
405 |   deferred = $.Deferred();
406 |   year = new Date().getFullYear();
407 |   fetchYear(year).then(function(calendar) {
408 |     if (calendar.completed) {
409 |       deferred.resolve(calendar);
410 |       return;
411 |     }
412 |     year--;
413 |     return fetchYear(year, calendar).then(arguments.callee);
414 |   });
415 |   return deferred.promise();
416 | };
417 | main = function() {
418 |   var articles, calendar, container, module_dummy, scrollBar, tip;
419 |   if (Hatena && Hatena.Star) {
420 |     Hatena.Star.SiteConfig = {
421 |       entryNodes: {
422 |         'div.entry-inner': {
423 |           uri: 'a.bookmark',
424 |           title: 'h1.entry-title',
425 |           container: 'p.entry-footer-section'
426 |         }
427 |       }
428 |     };
429 |   }
430 |   $('<div>').attr({
431 |     id: 'loading-entry'
432 |   }).css({
433 |     display: 'none'
434 |   }).appendTo($('body'));
435 |   container = $('<div>').attr({
436 |     id: 'calendar-container'
437 |   });
438 |   calendar = $('<div>').attr({
439 |     id: 'calendar'
440 |   });
441 |   container.append(calendar);
442 |   tip = $('<div>').attr({
443 |     id: 'tip'
444 |   });
445 |   container.append(tip);
446 |   $('#container').append(container);
447 |   calendar.click(function(event) {
448 |     var date_from, date_now, entry, path, time_selected, width, x;
449 |     width = container.width();
450 |     x = event.clientX - container.position().left;
451 |     date_from = new Date(2011, 11 - 1, 7);
452 |     date_now = new Date();
453 |     time_selected = date_from.getTime() + (date_now.getTime() - date_from.getTime()) * (x / width);
454 |     entry = entryFromTime(time_selected);
455 |     path = extractPath(entry.find('.entry-footer-time a').attr('href'));
456 |     history.pushState(path, path, path);
457 |     return scrollToEntry(entry);
458 |   });
459 |   calendar.mousemove(throttle(function(event) {
460 |     var date_from, date_now, date_selected, date_selected_3days_up, time_selected, time_selected_3days_up, width, x;
461 |     width = container.width();
462 |     x = event.clientX - container.position().left;
463 |     date_from = new Date(2011, 11 - 1, 7);
464 |     date_now = new Date();
465 |     time_selected = date_from.getTime() + (date_now.getTime() - date_from.getTime()) * (x / width);
466 |     time_selected_3days_up = date_from.getTime() + (date_now.getTime() - date_from.getTime()) * (x / width) + 3600 * 24 * 1000 * 3;
467 |     date_selected = new Date(time_selected);
468 |     date_selected_3days_up = new Date(time_selected_3days_up);
469 |     setTip(formatDate(date_selected));
470 |     return showEntries(Math.floor(date_selected_3days_up.getTime() / 1000));
471 |   }));
472 |   scrollBar = $('<div>').attr({
473 |     id: 'scroll-bar'
474 |   });
475 |   calendar.append(scrollBar);
476 |   $(window).bind('scroll', throttle(function(event) {
477 |     return updateScrollBar();
478 |   }));
479 |   articles = [];
480 |   $('article').each(function() {
481 |     var entry;
482 |     entry = this;
483 |     articles.push($(entry).clone());
484 |     return $(entry).remove();
485 |   });
486 |   $.each(articles, function() {
487 |     return appendEntry(this);
488 |   });
489 |   setTimeout(function() {
490 |     return scrollByLocation();
491 |   }, 100);
492 |   module_dummy = $('<div>').addClass('hatena-module').addClass('hatena-module-profile');
493 |   $('.hatena-follow-button-box').appendTo(module_dummy);
494 |   module_dummy.appendTo($('#blog-title-inner'));
495 |   $('body').delegate('.entry-footer-time a', 'click', function(event) {
496 |     var path;
497 |     if (!(history && history.pushState)) {
498 |       return true;
499 |     }
500 |     path = extractPath(this.href);
501 |     history.pushState(path, path, path);
502 |     later(function() {
503 |       return scrollByLocation();
504 |     });
505 |     return false;
506 |   });
507 |   $('body').delegate('article .date', 'click', function(event) {
508 |     $(this).parents('article').find('.entry-footer-time a').click();
509 |     return false;
510 |   });
511 |   $('body').delegate('#blog-title a', 'click', function(event) {
512 |     var path;
513 |     if (!(history && history.pushState)) {
514 |       return true;
515 |     }
516 |     path = extractPath(this.href);
517 |     history.pushState(path, path, path);
518 |     later(function() {
519 |       return scrollByLocation();
520 |     });
521 |     return false;
522 |   });
523 |   $(window).bind('popstate', function(event) {
524 |     return scrollByLocation();
525 |   });
526 |   return setTimeout(function() {
527 |     return updateStars();
528 |   }, 1000);
529 | };
530 | main();
531 | window.scrollBy(0, 1);
532 | $('.pager').remove();


--------------------------------------------------------------------------------
/presentation/README.md:
--------------------------------------------------------------------------------
 1 | # presentation.js
 2 | 
 3 | - @onishi さん作のJSをもとにしています
 4 | - evergreenをインストールして使うとよい
 5 | - 以下をはてな記法の記事にコピペ
 6 | - `* 見出し` ごとにスライドが作られる
 7 | 
 8 | ```html
 9 | <pre class="presentation-controller" style="float: right"><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script><script type="text/javascript" src="https://hitode909.github.io/hatenablog-unofficial-modules/presentation/presentation.js"></script>プレゼンモード<br><a href="#presentation">再生</a><br>← / →で移動<br>fでフルスクリーン<br>escでおわる</pre>
10 | ```
11 | 


--------------------------------------------------------------------------------
/presentation/presentation.css:
--------------------------------------------------------------------------------
 1 | @charset "UTF-8";
 2 | 
 3 | #presentation-container {
 4 |     background: white;
 5 |     position: absolute;
 6 |     left: 0;
 7 |     top: 0;
 8 |     width: 100%;
 9 |     height: 100%;
10 |     overflow-y: scroll;
11 | }
12 | #presentation-container .entry-content {
13 |     font-family: "Hiragino Sans","ヒラギノ角ゴシック";
14 |     font-weight: 900;
15 |     color: black;
16 |     font-size: calc((100% + 0.7vw) * 2);
17 |     padding: 0.5em;
18 |     padding-bottom: 4em;
19 | }
20 | 
21 | #presentation-container .entry-content h1,h2,h3 {
22 |     text-align: center;
23 | }
24 | 
25 | #presentation-container .entry-content h1,h2,h3,h4,h5,h6 {
26 |     font-weight: 900;
27 | }
28 | 
29 | #presentation-container .entry-content ul,ol {
30 |     margin-left: 1em;
31 | }
32 | 
33 | #presentation-container .entry-content blockquote,pre {
34 |     font-size: 80%;
35 | }
36 | 
37 | #presentation-container .entry-content img.hatena-fotolife,iframe.embed-card, iframe.instagram-iframe {
38 |     display: block;
39 |     margin: 1em auto;
40 | }
41 | 
42 | #presentation-container .entry-content pre {
43 |     white-space: pre-wrap;
44 |     word-wrap: break-word;
45 |     overflow: auto;
46 | }
47 | 
48 | .presentation-title, .presentation-pager {
49 |     font-size:18px;
50 | }
51 | 
52 | .presentation-pager {
53 |     float: right;
54 | }
55 | 


--------------------------------------------------------------------------------
/presentation/presentation.js:
--------------------------------------------------------------------------------
  1 | if (typeof Hatena === 'undefined') {
  2 |     var Hatena = {};
  3 | }
  4 | 
  5 | if (typeof Hatena.Blog === 'undefined') {
  6 |     Hatena.Blog = {};
  7 | }
  8 | 
  9 | Hatena.Blog.Presentation = {
 10 |     slides:[],
 11 |     currentIndex:0,
 12 |     init: function () {
 13 |         $('.entry-date').append('<a href="#presentation">プレゼンテーション</a>');
 14 |     },
 15 |     supported: function () {
 16 |         return ! ('ontouchstart' in window);
 17 |     },
 18 |     start: function () {
 19 |         if (this.started) return;
 20 |         this.started = true;
 21 | 
 22 |         // h3レベルの見出しを見つけてスライドにする(markdownモードだとh1とか使えるからうまくいかなそう)
 23 |         $('article div.section > h3').parent().each(function () {
 24 |             Hatena.Blog.Presentation.slides.push($(this));
 25 |         });
 26 | 
 27 |         var self = this;
 28 |         $(window).keyup(function (e) {
 29 |             if (e.keyCode === 27) {
 30 |                 // esc
 31 |                 self.exit();
 32 |             }
 33 |             else if (e.keyCode === 74) {
 34 |                 // j
 35 |                 Hatena.Blog.Presentation.next();
 36 |             }
 37 |             else if (e.keyCode === 39) {
 38 |                 // right arrow
 39 |                 Hatena.Blog.Presentation.next();
 40 |             }
 41 |             else if (e.keyCode === 75) {
 42 |                 // k
 43 |                 Hatena.Blog.Presentation.prev();
 44 |             }
 45 |             else if (e.keyCode === 37) {
 46 |                 // left arrow
 47 |                 Hatena.Blog.Presentation.prev();
 48 |             }
 49 |             else if (e.keyCode === 70) {
 50 |                 // lf
 51 |                 Hatena.Blog.Presentation.fullScreen();
 52 |             }
 53 |         });
 54 | 
 55 |         $(function () {
 56 |             setInterval(function () {
 57 |                 var date = new Date();
 58 |                 $("#presentation-time").text(date.toLocaleTimeString());
 59 |             }, 1000);
 60 |         });
 61 | 
 62 |         // 初期スタイル
 63 |         $('body').children().each(function() {
 64 |             $(this).css('display','none');
 65 |         });
 66 | 
 67 |         $('a').each(function() {
 68 |             $(this).attr('target', '_blank');
 69 |         });
 70 | 
 71 |         var $container = $('<div id="presentation-container"></div>');
 72 |         $container.append('<link rel="stylesheet" type="text/css" href="https://hitode909.github.io/hatenablog-unofficial-modules/presentation/presentation.css"/>');
 73 |         $container.append('<div class="presentation-pager"><span id="presentation-time"></span> - <span class="current-page">0</span>/<span class="max-page">0</span><progress max="100" value="0" class="presentation-progress"></div>');
 74 |         $container.append('<div class="presentation-title">' + document.title + '</div>');
 75 |         $container.append('<div class="presentation-content entry-content"></div>');
 76 |         $container.append($('.presentation-custom'));
 77 | 
 78 |         $(document.body).prepend($container);
 79 | 
 80 |         this.showSlide();
 81 |     },
 82 |     fullScreen: function () {
 83 |         var $container = $('#presentation-container');
 84 |         var container = $container[0];
 85 | 
 86 |         var f = container.requestFullscreen || container.webkitRequestFullScreen || container.mozRequestFullScreen || container.msRequestFullscreen;
 87 |         if (!f) return;
 88 |         f.apply(container);
 89 |     },
 90 |     next: function () {
 91 |         if (this.currentIndex < this.slides.length)  {
 92 |             this.currentIndex++;
 93 |             this.showSlide();
 94 |         }
 95 |     },
 96 |     prev: function () {
 97 |         if (this.currentIndex > 0) {
 98 |             this.currentIndex--;
 99 |             this.showSlide();
100 |         }
101 |     },
102 |     selectSlide: function (number) {
103 |         this.currentIndex = +number;
104 |         this.showSlide();
105 |     },
106 |     showSlide: function () {
107 |         var slide = this.slides[this.currentIndex];
108 |         slide.css('display', 'block');
109 |         $('.presentation-content').empty().append(slide);
110 |         $('.current-page').text(this.currentIndex + 1);
111 |         $('.max-page').text(this.slides.length);
112 |         if (this.slides.length > 0) {
113 |             $('.presentation-progress').val(Math.floor(((this.currentIndex + 1) / this.slides.length)*100));
114 |         }
115 |         $('body').scrollTop(0);
116 |         $('#presentation-container').scrollTop(0);
117 |         location.hash = 'presentation-' + this.currentIndex;
118 |     },
119 |     exit: function() {
120 |         location.hash = '';
121 |         location.reload();
122 |     },
123 |     notifyHash: function(hash) {
124 |         if (this.hash === hash) return;
125 |         this.hash = hash;
126 | 
127 |         if (hash.match(/^#presentation/)) {
128 |             this.start();
129 |         }
130 |         var slideNumber = hash.match(/^#presentation-(.+)$/);
131 |         if (!slideNumber) return;
132 |         this.selectSlide(slideNumber[1]);
133 |     },
134 |     dummy:'dummy'
135 | };
136 | 
137 | $(document).ready(function () {
138 |     if (!Hatena.Blog.Presentation.supported()) {
139 |         $('.presentation-controller').remove();
140 |         return;
141 |     }
142 |     Hatena.Blog.Presentation.init();
143 |     Hatena.Blog.Presentation.notifyHash(location.hash);
144 | });
145 | 
146 | window.onhashchange = function () {
147 |     if (!Hatena.Blog.Presentation.supported()) return;
148 |     Hatena.Blog.Presentation.notifyHash(location.hash);
149 | };
150 | 


--------------------------------------------------------------------------------
/rokuyo.coffee:
--------------------------------------------------------------------------------
 1 | ###
 2 | 
 3 | * はてなブログの記事の日付に六曜を表示する
 4 | 
 5 | ** 使い方
 6 | 
 7 | 以下をコピーして デザイン編集 → カスタマイズ → フッタHTML に貼り付け
 8 | 
 9 | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
10 | <script src="http://hitode909.github.io/hatenablog-unofficial-modules/rokuyo.js"></script>
11 | 
12 | 旧暦を取得するWeb APIを利用しています．
13 | - http://api.sekido.info/qreki?output=usage
14 | 
15 | 日付が途中で改行して崩れる場合はいかのようなCSSを指定すれば直るかもしれない
16 | 
17 | .date {
18 |   display: inline-block;
19 |   width: auto;
20 | }
21 | 
22 | ###
23 | 
24 | $ ->
25 |   handle_article = ($article) ->
26 |     return if $article.prop 'rokuyou-loaded'
27 |     $article.prop 'rokuyou-loaded', true
28 | 
29 |     year  = + $article.find('.date-year').text()
30 |     month = +$article.find('.date-month').text()
31 |     day   = +$article.find('.date-day').text()
32 | 
33 |     load = $.ajax
34 |       url: 'http://api.sekido.info/qreki'
35 |       dataType: 'jsonp'
36 |       data:
37 |         year:   year
38 |         month:  month
39 |         day:    day
40 |         output: 'jsonp'
41 | 
42 |     load.done (res) ->
43 |       rokuyou = res.rokuyou_text
44 | 
45 |       $rokuyou = $ '<span>'
46 |       $rokuyou.addClass 'rokuyou'
47 |       $rokuyou.addClass "rokuyou-#{ rokuyou }"
48 |       $rokuyou.text rokuyou
49 |       $article.find('.date a').append $rokuyou
50 | 
51 |   main = ->
52 |     ($ 'article').each ->
53 |       handle_article ($ this)
54 | 
55 |   do main
56 |   setInterval ->
57 |     do main
58 |   , 1000
59 | 


--------------------------------------------------------------------------------
/rokuyo.js:
--------------------------------------------------------------------------------
 1 | // Generated by CoffeeScript 1.6.3
 2 | /*
 3 | 
 4 | * はてなブログの記事の日付に六曜を表示する
 5 | 
 6 | ** 使い方
 7 | 
 8 | 以下をコピーして デザイン編集 → カスタマイズ → フッタHTML に貼り付け
 9 | 
10 | <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
11 | <script src="http://hitode909.github.io/hatenablog-unofficial-modules/rokuyo.js"></script>
12 | 
13 | 旧暦を取得するWeb APIを利用しています．
14 | - http://api.sekido.info/qreki?output=usage
15 | 
16 | 日付が途中で改行して崩れる場合はいかのようなCSSを指定すれば直るかもしれない
17 | 
18 | .date {
19 |   display: inline-block;
20 |   width: auto;
21 | }
22 | */
23 | 
24 | 
25 | (function() {
26 |   $(function() {
27 |     var handle_article, main;
28 |     handle_article = function($article) {
29 |       var day, load, month, year;
30 |       if ($article.prop('rokuyou-loaded')) {
31 |         return;
32 |       }
33 |       $article.prop('rokuyou-loaded', true);
34 |       year = +$article.find('.date-year').text();
35 |       month = +$article.find('.date-month').text();
36 |       day = +$article.find('.date-day').text();
37 |       load = $.ajax({
38 |         url: 'http://api.sekido.info/qreki',
39 |         dataType: 'jsonp',
40 |         data: {
41 |           year: year,
42 |           month: month,
43 |           day: day,
44 |           output: 'jsonp'
45 |         }
46 |       });
47 |       return load.done(function(res) {
48 |         var $rokuyou, rokuyou;
49 |         rokuyou = res.rokuyou_text;
50 |         $rokuyou = $('<span>');
51 |         $rokuyou.addClass('rokuyou');
52 |         $rokuyou.addClass("rokuyou-" + rokuyou);
53 |         $rokuyou.text(rokuyou);
54 |         return $article.find('.date a').append($rokuyou);
55 |       });
56 |     };
57 |     main = function() {
58 |       return ($('article')).each(function() {
59 |         return handle_article($(this));
60 |       });
61 |     };
62 |     main();
63 |     return setInterval(function() {
64 |       return main();
65 |     }, 1000);
66 |   });
67 | 
68 | }).call(this);
69 | 


--------------------------------------------------------------------------------
/speech.js:
--------------------------------------------------------------------------------
 1 | /*
 2 | 
 3 | * はてなブログに「音読する」ボタンを追加する
 4 | 
 5 | ** 使い方
 6 | 
 7 | - 以下をコピーして デザイン編集 → カスタマイズ → フッタHTML に貼り付け
 8 | 
 9 | <script async defer src="https://hitode909.github.io/hatenablog-unofficial-modules/speech.js"></script>
10 | 
11 | ** 注意
12 | - Web Speech API非対応のブラウザでは音読できません
13 | 
14 | */
15 | 
16 | function speak (e) {
17 |   speechSynthesis.cancel();
18 | 
19 |   // Chromeで初回実行時にspeechSynthesis.pause()できない問題を解消するため、空文字で一度speechSynthesis.speak()しておく
20 |   var empty_utter = new SpeechSynthesisUtterance('');
21 |   speechSynthesis.speak(empty_utter);
22 | 
23 |   var utter = new SpeechSynthesisUtterance(this.body);
24 |   speechSynthesis.speak(utter);
25 |   e.currentTarget.textContent = '停止する';
26 |   e.currentTarget.removeEventListener('click', this);
27 |   e.currentTarget.addEventListener('click', pause);
28 | }
29 | 
30 | function pause (e) {
31 |   speechSynthesis.pause();
32 |   e.currentTarget.textContent = '再開する';
33 |   e.currentTarget.removeEventListener('click', pause);
34 |   e.currentTarget.addEventListener('click', resume);
35 | }
36 | 
37 | function resume (e) {
38 |   speechSynthesis.resume();
39 |   e.currentTarget.textContent = '停止する';
40 |   e.currentTarget.removeEventListener('click', resume);
41 |   e.currentTarget.addEventListener('click', pause);
42 | }
43 | 
44 | (function () {
45 |   if (!window.speechSynthesis) return;
46 |   document.querySelectorAll('article.entry').forEach(function (article) {
47 |     var button = document.createElement('button');
48 |     button.type = 'button';
49 |     button.className = 'btn';
50 |     button.textContent = '音読する';
51 |     button.style = 'float: right';
52 |     article.querySelector('header').appendChild(button);
53 |     var body = article.querySelector('.entry-content').textContent;
54 |     button.addEventListener('click', { handleEvent: speak, body: body });
55 |   });
56 | })();
57 | 


--------------------------------------------------------------------------------