/loggerhead/trunk

To get this branch, use:
bzr branch http://gegoxaren.bato24.eu/bzr/loggerhead/trunk

« back to all changes in this revision

Viewing changes to loggerhead/static/javascript/custom.js

  • Committer: Michael Hudson
  • Date: 2009-03-16 02:04:32 UTC
  • mto: (299.1.1 ajaxy-revision-page)
  • mto: This revision was merged to the branch mainline in revision 300.
  • Revision ID: michael.hudson@canonical.com-20090316020432-ivdoua3uk74iwymb
make Collapsable more flexible in the direction we actually need to be
flexible.

Show diffs side-by-side

added added

removed removed

Lines of Context:
loggerhead/static/javascript/custom.js
75
75
  setTimeout("Y.get('#search_terms').setStyle('display','none')", 300);
76
76
}
77
77
 
78
 
function Collapsable(item, expand_icon, open_content, close_content, is_open)
 
78
function Collapsable(config)
79
79
{
80
 
  this.is_open = is_open;
81
 
  this.item = item;
82
 
  this.open_content  = open_content;
83
 
  this.close_content = close_content;
84
 
  this.expand_icon   = expand_icon;
85
 
  this.source = null;
86
 
  this.anim = null;
87
 
 
88
 
  if (this.is_open) {
89
 
    this.height = item.get('region').height;
90
 
  }
91
 
  else {
92
 
    this.height = null;
93
 
  }
94
 
 
95
 
  //var expander = new Fx.Slide(this.item, { duration: 200 } );
96
 
  if (!this.is_open)
97
 
  {
98
 
    this.expand_icon.set('src',this.expand_icon.get('title'));
99
 
  }
100
 
  else
101
 
  {
102
 
    this.expand_icon.set('src',this.expand_icon.get('alt'));
103
 
  }
 
80
  this.is_open = config.is_open;
 
81
  this.source_target = config.source_target;
 
82
  this.open_node = config.open_node;
 
83
  this.close_node = config.close_node;
 
84
  this.expand_icon = config.expand_icon;
 
85
  this.source = config.source;
104
86
}
105
87
 
106
88
function get_height(node) {
116
98
 
117
99
Collapsable.prototype._load_finished = function(tid, res)
118
100
{
 
101
  var newNode = Y.Node.create(res.responseText.split('\n').splice(1).join(''));
 
102
  this.source_target.ancestor().replaceChild(newNode, this.source_target);
 
103
  this.source_target = null;
119
104
  this.source = null;
120
 
  var newNode = this.item.create(res.responseText.split('\n').splice(1).join(''));
121
 
  this.item.ancestor().replaceChild(newNode, this.item);
122
 
  this.item = newNode;
123
105
  this.open();
124
106
};
125
107
 
135
117
    return;
136
118
  }
137
119
 
138
 
  if (this.height == null) {
139
 
    this.height = get_height(this.open_content[0]);
140
 
  }
141
 
 
142
 
  var clo_height = this.close_content[0].get('region').height;
143
 
 
144
 
  this.anim = new Y.Anim(
 
120
  var open_height = get_height(this.open_node);
 
121
 
 
122
  var close_height;
 
123
  if (this.close_node) {
 
124
    close_height = this.close_node.get('region').height;
 
125
  }
 
126
  else {
 
127
    close_height = 0;
 
128
  }
 
129
 
 
130
  var container = this.open_node.ancestor('.container');
 
131
 
 
132
  var anim = new Y.Anim(
145
133
    {
146
 
      node: this.item.ancestor('.container'),
 
134
      node: container,
147
135
      from: {
148
 
        marginBottom: clo_height - this.height
 
136
        marginBottom: close_height - open_height
149
137
      },
150
138
      to: {
151
139
        marginBottom: 0
152
140
      },
153
141
      duration: 0.2
154
142
    });
155
 
  this.anim.on('end', this.openComplete, this);
156
 
  this.close_content[0].setStyle('display', 'none');
157
 
  this.open_content[0].setStyle('display', 'block');
 
143
 
 
144
  anim.on('end', this.openComplete, this);
 
145
  container.setStyle('marginBottom', close_height - this.height);
 
146
  if (this.close_node) {
 
147
    this.close_node.setStyle('display', 'none');
 
148
  }
 
149
  this.open_node.setStyle('display', 'block');
158
150
  this.expand_icon.set('src',this.expand_icon.get('alt'));
159
 
  this.item.ancestor('.container').setStyle('marginBottom', clo_height - this.height);
160
 
  this.item.setStyle('display', 'block');
161
 
  this.anim.run();
 
151
  anim.run();
162
152
};
163
153
 
164
154
Collapsable.prototype.openComplete = function()
165
155
{
166
156
  this.is_open = true;
167
 
  this.anim = null;
168
157
};
169
158
 
170
159
Collapsable.prototype.close = function()
171
160
{
172
 
  var item = this.item;
 
161
  var container = this.open_node.ancestor('.container');
 
162
 
 
163
  var open_height = this.open_node.get('region').height;
 
164
 
 
165
  var close_height;
 
166
  if (this.close_node) {
 
167
    close_height = get_height(this.close_node);
 
168
  }
 
169
  else {
 
170
    close_height = 0;
 
171
  }
 
172
 
173
173
  var anim = new Y.Anim(
174
174
    {
175
 
      node: this.item.ancestor('.container'),
 
175
      node: container,
176
176
      from: {
177
177
        marginBottom: 0
178
178
      },
179
179
      to: {
180
 
        marginBottom: get_height(this.close_content[0]) - this.height
 
180
        marginBottom: close_height - open_height
181
181
      },
182
182
      duration: 0.2
183
183
    });
187
187
 
188
188
Collapsable.prototype.closeComplete = function () {
189
189
  //this.item.setStyle('display', 'none');
190
 
  this.open_content[0].setStyle('display', 'none');
191
 
  this.close_content[0].setStyle('display', 'block');
192
 
  this.item.ancestor('.container').setStyle('marginBottom', 0);
 
190
  this.open_node.setStyle('display', 'none');
 
191
  if (this.close_node) {
 
192
    this.close_node.setStyle('display', 'block');
 
193
  }
 
194
  this.open_node.ancestor('.container').setStyle('marginBottom', 0);
193
195
  this.expand_icon.set('src', this.expand_icon.get('title'));
194
196
  this.is_open = false;
195
197
};