wnw_show 1.0.0 → 1.1.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,5 +1,5 @@
1
1
  module WnwShow
2
2
  module Rails
3
- VERSION = "1.0.0"
3
+ VERSION = "1.1.0"
4
4
  end
5
5
  end
@@ -23,45 +23,61 @@ if (!wnw.list) wnw.list = {};
23
23
  (function(){
24
24
  var assetPath = function(name) {
25
25
  // for wnw rails environment
26
- return "<%= asset_path('wnw_show/list/" + name + "') %>";
26
+ //return "<%= asset_path('wnw_show/list/" + name + "') %>";
27
27
  // for local test
28
- //return "/wnw_show/vendor/assets/images/wnw_show/list/" + name;
28
+ return "/wnw_show/vendor/assets/images/wnw_show/list/" + name;
29
29
  };
30
30
 
31
31
  // -------------------------------------
32
32
  // 定数
33
33
  // -------------------------------------
34
-
34
+ var IMAGE_RATIO = 0.6; //画像の拡大サイズ
35
35
  var LEFT_MARGIN = 50; //左のマージン
36
36
  var TOP_MARGIN = 200; //上のマージン
37
- var Y_SPAN = 300; //写真の縦の間隔
37
+ var Y_SPAN = 250; //写真の縦の間隔
38
38
  var ROW_NO = 4; //写真の列数
39
- var SQEW_SPAN = 50; //写真の配置のゆがみ
39
+ var SQEW_SPAN = 30; //写真の配置のゆがみ
40
40
  var ROTATE_DEGREE = 2; //画像の傾き角度の最大値
41
41
  var PHOTO_DEL_Y = 500;//画像が消えるときに移動するY方向
42
42
  var PHOTO_DEL_X_SPAN = 100;//画像が消えるときに移動するX方向の幅
43
+
43
44
  var PIN_TOP = -10; //ピンが写真のトップからx方向にどれだけずれているか
44
45
  var PIN_DEL_Y = -200;//ピンが消えるときに移動するY方向
45
46
  var PIN_DEL_X_SPAN = -100;//ピンが消えるときに移動するX方向の幅
47
+ var PIN_WIDTH = 20; //ピンの横幅
48
+ var PIN_IMAGE_PREFIX = "/images/pin-";//ピン画像の接頭辞
49
+ var PIN_IMAGE_SURFIX = ".png"; //ピン画像の接尾辞
50
+
46
51
  var ADD_IMAGE_RANGE_X = 1000;//画像が追加されるときのX座標の範囲
47
52
  var ADD_IMAGE_RANGE_Y = 0;//画像が追加されるときのY座標の範囲
48
53
  var ZOOM_TIME = 300;//画像が拡大する時の時間[ms]
49
- var PIN_IMAGE_PREFIX = "/images/pin-";//ピン画像の接頭辞
50
- var PIN_IMAGE_SURFIX = ".png"; //ピン画像の接尾辞
51
54
  var SOUND_FILE = "/sounds/SoundUnit.swf";//ピンが抜ける音
52
55
  var SOUND_CODEBASE = "/sounds/swflash.cab";//音の再生
53
56
  var SEITON_BTN_IMAGE = assetPath('seiton.png');//整頓ボタン画像
54
- var DELETE_BTN_IMAGE = assetPath('delete.png');//削除ボタン画像
57
+ var SEITON_LEFT = 1000;//整頓ボタン画像
58
+ var SEITON_TOP = 20;//整頓ボタン画像
59
+ // var DELETE_BTN_IMAGE = assetPath('delete.png');//削除ボタン画像
55
60
  var BACKGROUND_IMAGE = assetPath('bord.jpg');//背景画像
56
61
  var LOADING_IMAGE = assetPath('loading.gif');//ロード中画像
57
62
  var DRAG_DISTANCE = 10 ;//これ以上座標を動かすとドラックとみなす
58
- var Z_INDEX_LOGO = 0;
59
- var Z_INDEX_MESSAGE = 0;
63
+ var MOJI_Z_INDEX = 0;
60
64
  var Z_INDEX_BUTTON = 1000;
61
65
  var Z_INDEX_ZOOM = 1001;
62
66
  var Z_INDEX_NEXT_PREV = 1002;
63
67
  var NEXT_BUTTON_ID = "nextButton";
64
68
  var PREV_BUTTON_ID = "prevButton";
69
+ // ロゴ
70
+ var LOGO_WIDTH = 140;
71
+ //var LOGO_HEIGHT = 150;
72
+ var LOGO_LEFT = 50;
73
+ var LOGO_TOP = 30;
74
+ var LOGO_Z_INDEX = 0;
75
+ // 文字
76
+ var MOJI_TOP = 35;
77
+ var MOJI_LEFT = 200;
78
+ var MOJI_SIZE = 40;
79
+ var MOJI_WIDTH= 1000;
80
+
65
81
  // -------------------------------------
66
82
  // 変数
67
83
  // -------------------------------------
@@ -135,11 +151,13 @@ if (!wnw.list) wnw.list = {};
135
151
  .attr("pinId","img"+no)
136
152
  .attr("no",no)
137
153
  .attr("msg_id",url)
154
+ .hide()
138
155
  .css({"display":"block",
139
156
  "position" : "absolute",
140
157
  "top":top,
141
158
  "left":left,
142
159
  "z-index":zIndex,
160
+ "opacity":0,
143
161
  "-webkit-transform": "rotate(" + rand2(ROTATE_DEGREE) + "deg)",
144
162
  "-moz-transform": "rotate(" + rand2(ROTATE_DEGREE) + "deg)"})
145
163
  .click(function(){
@@ -178,6 +196,11 @@ if (!wnw.list) wnw.list = {};
178
196
  }
179
197
  })
180
198
  .load(function(){
199
+ $(this).width($(this).naturalWidth() * IMAGE_RATIO);
200
+ $(this).height($(this).naturalHeight() * IMAGE_RATIO);
201
+ $(this).attr("orgWidth",$(this).naturalWidth() * IMAGE_RATIO);
202
+ $(this).attr("orgHeight",$(this).naturalHeight() * IMAGE_RATIO);
203
+ $(this).css({"opacity":1});
181
204
  //pin
182
205
  var pin=$("<img />")
183
206
  .attr("id","pin"+no)
@@ -190,6 +213,7 @@ if (!wnw.list) wnw.list = {};
190
213
  .css({"position" : "absolute",
191
214
  "top": top + PIN_TOP,
192
215
  "left": left + img.width()/2,
216
+ "width" : PIN_WIDTH,
193
217
  "z-index":zIndex})
194
218
  .click(function(){
195
219
  // start sound
@@ -258,16 +282,16 @@ if (!wnw.list) wnw.list = {};
258
282
  / 2 ;
259
283
  var zLeft = $("body").scrollLeft();
260
284
  }
261
- _img.attr("beforeLeft",_img.offset().left)
262
- .attr("beforeTop",_img.offset().top)
263
- .attr("beforeZIndex",_img.css("z-index"));
285
+ _img.attr("orgLeft",_img.offset().left)
286
+ .attr("orgTop",_img.offset().top)
287
+ .attr("orgZIndex",_img.css("z-index"));
264
288
  _img.css({"z-index": Z_INDEX_ZOOM});
265
289
  _img.animate({"display":"block",
266
290
  "position" : "absolute",
267
291
  "top": zTop,
268
292
  "left": zLeft,
269
- "height" : _img.naturalHeight() * ratio,
270
- "width" : _img.naturalWidth() * ratio
293
+ "height" : _img.attr("orgHeight") * ratio,
294
+ "width" : _img.attr("orgWidth") * ratio
271
295
  },ZOOM_TIME);
272
296
  }
273
297
  };
@@ -281,11 +305,11 @@ if (!wnw.list) wnw.list = {};
281
305
  gZoomImgId = -1;
282
306
  var _img=$("#" + id);
283
307
  _img.animate({
284
- "height" : _img.naturalHeight(),
285
- "width" : _img.naturalWidth(),
286
- "left" : _img.attr("beforeLeft"),
287
- "top" : _img.attr("beforeTop"),
288
- "z-index" : _img.attr("beforeZIndex")
308
+ "height" : _img.attr("orgHeight"),
309
+ "width" : _img.attr("orgWidth"),
310
+ "left" : _img.attr("orgLeft"),
311
+ "top" : _img.attr("orgTop"),
312
+ "z-index" : _img.attr("orgZIndex")
289
313
  },ZOOM_TIME);
290
314
  }
291
315
  }
@@ -304,8 +328,8 @@ if (!wnw.list) wnw.list = {};
304
328
  leftside = gImgList[no - 1];
305
329
  var orgleft = leftside.offset().left + leftside.width();
306
330
  }
307
- orgtop += rand1(SQEW_SPAN);
308
- orgleft += rand1(SQEW_SPAN);
331
+ orgtop += rand1(SQEW_SPAN) - SQEW_SPAN/2;
332
+ orgleft += rand1(SQEW_SPAN) - SQEW_SPAN/2;
309
333
  //実際に表示するのはランダムな位置
310
334
  gZIndexMax += 1;
311
335
  viewImage(url, rand1(ADD_IMAGE_RANGE_Y),rand1(ADD_IMAGE_RANGE_X),gZIndexMax,orgtop,orgleft,function(){});
@@ -366,11 +390,11 @@ if (!wnw.list) wnw.list = {};
366
390
  .attr("src",logoUrl)
367
391
  .css({
368
392
  "position" : "absolute",
369
- "top":0,
370
- "left":LEFT_MARGIN,
371
- "width":200,
372
- "height":200,
373
- "z-index":Z_INDEX_LOGO
393
+ "top":LOGO_TOP,
394
+ "left":LOGO_LEFT,
395
+ "width":LOGO_WIDTH,
396
+ //"height":LOGO_HEIGHT,
397
+ "z-index":LOGO_Z_INDEX
374
398
  }));
375
399
 
376
400
  //文字
@@ -380,14 +404,13 @@ if (!wnw.list) wnw.list = {};
380
404
  .css({
381
405
  "color":"#FFFFFF",
382
406
  "text-shadow": "0px 0px 10px gray",
383
- "top":35,
384
- "left":250,
385
- "font-size":40,
386
- // "font-weight": "bold",
387
- "width":1000,
407
+ "top":MOJI_TOP,
408
+ "left":MOJI_LEFT,
409
+ "font-size":MOJI_SIZE,
410
+ "width":MOJI_WIDTH,
388
411
  "opacity": 1,
389
412
  "position":"absolute",
390
- "z-index":Z_INDEX_MESSAGE,
413
+ "z-index":MOJI_Z_INDEX,
391
414
  "font-family": "wnw_list_font",
392
415
  "padding":10
393
416
  }));
@@ -416,8 +439,8 @@ if (!wnw.list) wnw.list = {};
416
439
  leftside = gImgList[no - 1];
417
440
  var left = leftside.offset().left + leftside.width();
418
441
  }
419
- top += rand1(SQEW_SPAN);
420
- left += rand1(SQEW_SPAN);
442
+ top += rand1(SQEW_SPAN) - SQEW_SPAN/1.5;
443
+ left += rand1(SQEW_SPAN) - SQEW_SPAN/1.5;
421
444
  var zIndex = rand1(gZIndexMax);
422
445
  viewImage(url,top,left,zIndex,top,left,viewNextImage);
423
446
  }else{
@@ -467,28 +490,28 @@ if (!wnw.list) wnw.list = {};
467
490
  );
468
491
 
469
492
  //削除ボタン箱
470
- $("#bord").append(
471
- $("<img/>")
472
- .attr("id","gomi")
473
- .attr("src", DELETE_BTN_IMAGE)
474
- .css({"position":"absolute" ,
475
- "top":10 ,
476
- "left":1000 ,
477
- "z-index" :Z_INDEX_BUTTON})
478
- .click(function(){alert("削除したい写真をここにドロップしてください");})
479
- .droppable({
480
- drop: function(e,ui) {
481
- if (confirm("メッセージを削除しますか?")){
482
- var img = $("#" + ui.draggable.attr("id"));
483
- // call delete api
484
- var url = img.attr('msg_id');
485
- $.ajax({type: "delete",url: url});
486
- img.css({"display":"none"});
487
-
488
- }
489
- },
490
- tolerance: "pointer"
491
- }));
493
+ // $("#bord").append(
494
+ // $("<img/>")
495
+ // .attr("id","gomi")
496
+ // .attr("src", DELETE_BTN_IMAGE)
497
+ // .css({"position":"absolute" ,
498
+ // "top":10 ,
499
+ // "left":1000 ,
500
+ // "z-index" :Z_INDEX_BUTTON})
501
+ // .click(function(){alert("削除したい写真をここにドロップしてください");})
502
+ // .droppable({
503
+ // drop: function(e,ui) {
504
+ // if (confirm("メッセージを削除しますか?")){
505
+ // var img = $("#" + ui.draggable.attr("id"));
506
+ // // call delete api
507
+ // var url = img.attr('msg_id');
508
+ // $.ajax({type: "delete",url: url});
509
+ // img.css({"display":"none"});
510
+
511
+ // }
512
+ // },
513
+ // tolerance: "pointer"
514
+ // }));
492
515
 
493
516
  //整頓ボタン
494
517
  $("#bord").append(
@@ -496,8 +519,8 @@ if (!wnw.list) wnw.list = {};
496
519
  .attr("src", SEITON_BTN_IMAGE)
497
520
  .css({
498
521
  "position":"absolute" ,
499
- "top":10 ,
500
- "left":800 ,
522
+ "top":SEITON_TOP ,
523
+ "left":SEITON_LEFT ,
501
524
  "z-index" :Z_INDEX_BUTTON })
502
525
  .click(reset));
503
526
 
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: wnw_show
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.0.0
4
+ version: 1.1.0
5
5
  prerelease:
6
6
  platform: ruby
7
7
  authors:
@@ -27,6 +27,24 @@ files:
27
27
  - lib/wnw_show/rails.rb
28
28
  - lib/wnw_show/rails/engine.rb
29
29
  - lib/wnw_show/rails/version.rb
30
+ - sample/image/1.png
31
+ - sample/image/10.png
32
+ - sample/image/2.png
33
+ - sample/image/3.png
34
+ - sample/image/4.png
35
+ - sample/image/5.png
36
+ - sample/image/6.png
37
+ - sample/image/7.png
38
+ - sample/image/8.png
39
+ - sample/image/9.png
40
+ - sample/image/list_logo.png
41
+ - sample/image/logo.png
42
+ - sample/image/show_logo.png
43
+ - sample/image/show_top.jpg
44
+ - sample/image/top.gif
45
+ - sample/js/jquery-ui-1.8.18.custom.min.js
46
+ - sample/list.html
47
+ - sample/show.html
30
48
  - vendor/assets/audios/wnw_show/show/SoundUnit.swf
31
49
  - vendor/assets/audios/wnw_show/show/pin0.swf
32
50
  - vendor/assets/audios/wnw_show/show/swflash.cab
@@ -71,24 +89,6 @@ files:
71
89
  - vendor/assets/javascripts/wnw_show/list.js.erb
72
90
  - vendor/assets/javascripts/wnw_show/show.js.erb
73
91
  - vendor/assets/javascripts/wnw_show/swipe.js
74
- - vendor/assets/sample/image/1.png
75
- - vendor/assets/sample/image/10.png
76
- - vendor/assets/sample/image/2.png
77
- - vendor/assets/sample/image/3.png
78
- - vendor/assets/sample/image/4.png
79
- - vendor/assets/sample/image/5.png
80
- - vendor/assets/sample/image/6.png
81
- - vendor/assets/sample/image/7.png
82
- - vendor/assets/sample/image/8.png
83
- - vendor/assets/sample/image/9.png
84
- - vendor/assets/sample/image/list_logo.png
85
- - vendor/assets/sample/image/logo.png
86
- - vendor/assets/sample/image/show_logo.png
87
- - vendor/assets/sample/image/show_top.jpg
88
- - vendor/assets/sample/image/top.gif
89
- - vendor/assets/sample/js/jquery-ui-1.8.18.custom.min.js
90
- - vendor/assets/sample/list.html
91
- - vendor/assets/sample/show.html
92
92
  - vendor/assets/stylesheets/wnw_show/index.css
93
93
  - vendor/assets/stylesheets/wnw_show/swipe.css.erb
94
94
  - wnw_show.gemspec
@@ -112,7 +112,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
112
112
  version: '0'
113
113
  requirements: []
114
114
  rubyforge_project:
115
- rubygems_version: 1.8.10
115
+ rubygems_version: 1.8.23
116
116
  signing_key:
117
117
  specification_version: 3
118
118
  summary: gem summary