統計
| ブランチ: | リビジョン:

pictcode / app / webroot / js / pictcode / block_selector.js @ 001918d1

履歴 | 表示 | アノテート | ダウンロード (2.671 KB)

1 9af585b9 admin
define(['block_data', 'modal_manager', 'image_manager'], function(blockData, modalManager, imageManager){
2
3
  var afterSelectAction;  
4
  var categoryContainer = document.createElement('div');
5
6
  function initialize(aSAction){
7
    afterSelectAction = aSAction;
8
    //Category
9
10
    var iconWidth = "128";
11
    var iconHeight = "56";
12
    var categories = blockData.categories;
13
    _.each( categories, function(category){ 
14
      var image = imageManager.images[category.iconImageKey];
15
      image.width = iconWidth;
16
      image.height = iconHeight;
17
      var button = document.createElement('button');
18
      button.id = category.name;
19
      button.className = 'block_category_button';
20
      button.style.margin = "5px";
21
      button.appendChild(image);
22
      categoryContainer.appendChild(button);
23
      // categoryContainer.innerHTML += "  ";
24
    });
25
  }
26
27
  $(document).on("click","#add_block", function(event) {
28
    //Modalの設定
29
    var modalWidth = document.documentElement.clientHeight * 0.75;
30
    $("#modal_coding_block").css({width:modalWidth*1.2, height:modalWidth, top:-modalWidth});
31
    $("#modal_coding_block_container")[0].appendChild(categoryContainer);
32
    modalManager.showDownModal($("#modal_coding_block"), didClose);
33
  });
34
35
  $(document).on("click",".block_category_button", function(event) {
36
    var id = event.currentTarget.id;
37
    var bodyContainter = document.createElement('div');
38
    var sizeRatio = 54;
39
    var categorizedBlocks = blockData.getCategorizedBlocks(id);
40
    _.each( categorizedBlocks, function(block){
41
      var image = imageManager.images[block.imageKey];
42
      image.width = block.size.width * sizeRatio;
43
      image.height = block.size.height * sizeRatio;
44
      var button = document.createElement('button');
45
      button.id = block.name;
46
      button.className = 'block_button';
47
      button.appendChild(image);
48
      bodyContainter.appendChild(button);
49
    });
50
51
    $("#modal_coding_block_container").html("");
52
    $("#modal_coding_block_container")[0].appendChild(bodyContainter);
53
    modalManager.addBackButton($("#modal_coding_block"), backToTop);
54
  });
55
56
  $(document).on("click",".block_button", function(event) {
57
    var id = event.currentTarget.id;
58
    afterSelectAction(id);
59
    modalManager.closeUpModal($("#modal_coding_block"));
60
    $("#modal_coding_block_container").html("");
61
  });
62
63
  //Modalのバックボタンをタップ時
64
  function backToTop(){
65
    modalManager.removeBackButton();
66
    $("#modal_coding_block_container").html("");
67
    $("#modal_coding_block_container")[0].appendChild(categoryContainer);
68
  }
69
70
  //モーダルを閉じた後
71
  function didClose(){
72
    $("#modal_coding_block_container").html("");
73
  }
74
75
  return {
76
    initialize:initialize,
77
  };
78
});