Collapse-O-Matic - Version 1.3.10

Version Description

  • Swaptitle system rebuilt to support images and cufon.
  • Updated CSS the over generalized names close and hover to more plug-in specific colomat-close and colomat-hover
  • removed !important from CSS arrow definitions to make it easier to redefine arrows.
Download this release

Release Info

Developer baden03
Plugin Icon 128x128 Collapse-O-Matic
Version 1.3.10
Comparing to
See all releases

Code changes from version 1.3.9 to 1.3.10

Files changed (4) hide show
  1. collapse-o-matic.php +10 -11
  2. collapse.js +43 -35
  3. readme.txt +28 -16
  4. style.css +4 -4
collapse-o-matic.php CHANGED
@@ -3,7 +3,7 @@
3
  Plugin Name: jQuery Collapse-O-Matic
4
  Plugin URI: http://www.twinpictures.de/jquery-collapse-o-matic-1-3/
5
  Description: Collapse-O-Matic adds an `[expand]` shortcode that wraps content into a lovely, jQuery collapsible div.
6
- Version: 1.3.9
7
  Author: Twinpictures
8
  Author URI: http://www.twinpictures.de
9
  License: GPL2
@@ -30,11 +30,11 @@ wp_enqueue_script('jquery');
30
  $plugin_url = trailingslashit( get_bloginfo('wpurl') ).PLUGINDIR.'/'. dirname( plugin_basename(__FILE__) );
31
  if (!is_admin()){
32
  //collapse script
33
- wp_register_script('collapseomatic-js', $plugin_url.'/collapse.js', array ('jquery'), '1.2.4' );
34
  wp_enqueue_script('collapseomatic-js');
35
 
36
  //css
37
- wp_register_style( 'collapseomatic-css', $plugin_url.'/style.css', array (), '1.3' );
38
  wp_enqueue_style( 'collapseomatic-css' );
39
  }
40
 
@@ -56,23 +56,22 @@ function collapsTronic($atts, $content = null){
56
 
57
  $altatt = '';
58
  if($alt){
59
- $altatt = 'alt="'.$alt.'"';
 
 
 
60
  }
61
  $relatt = '';
62
  if($rel){
63
  $relatt = 'rel="'.$rel.'"';
64
  }
65
  if($expanded){
66
- $trigclass .= ' close';
67
  }
68
- $link = '<'.$tag.' class="collapseomatic '.$trigclass.'" title="';
69
  if($swaptitle){
70
- $link .= $swaptitle;
71
- }
72
- else{
73
- $link .= $title;
74
  }
75
- $link .= '" id="'.$id.'" '.$relatt.' '.$altatt.'>'.$title.'</'.$tag.'>';
76
  $eDiv = '';
77
  if($content != ' '){
78
  $eDiv = '<div id="target-'.$id.'" class="collapseomatic_content '.$targclass.'">'.do_shortcode($content).'</div>';
3
  Plugin Name: jQuery Collapse-O-Matic
4
  Plugin URI: http://www.twinpictures.de/jquery-collapse-o-matic-1-3/
5
  Description: Collapse-O-Matic adds an `[expand]` shortcode that wraps content into a lovely, jQuery collapsible div.
6
+ Version: 1.3.10
7
  Author: Twinpictures
8
  Author URI: http://www.twinpictures.de
9
  License: GPL2
30
  $plugin_url = trailingslashit( get_bloginfo('wpurl') ).PLUGINDIR.'/'. dirname( plugin_basename(__FILE__) );
31
  if (!is_admin()){
32
  //collapse script
33
+ wp_register_script('collapseomatic-js', $plugin_url.'/collapse.js', array ('jquery'), '1.2.5' );
34
  wp_enqueue_script('collapseomatic-js');
35
 
36
  //css
37
+ wp_register_style( 'collapseomatic-css', $plugin_url.'/style.css', array (), '1.4' );
38
  wp_enqueue_style( 'collapseomatic-css' );
39
  }
40
 
56
 
57
  $altatt = '';
58
  if($alt){
59
+ $altatt = 'alt="'.$alt.'" title="'.$alt.'"';
60
+ }
61
+ else{
62
+ $altatt = 'title="'.$title.'"';
63
  }
64
  $relatt = '';
65
  if($rel){
66
  $relatt = 'rel="'.$rel.'"';
67
  }
68
  if($expanded){
69
+ $trigclass .= ' colomat-close';
70
  }
71
+ $link = '<'.$tag.' class="collapseomatic '.$trigclass.'" id="'.$id.'" '.$relatt.' '.$altatt.'>'.$title.'</'.$tag.'>';
72
  if($swaptitle){
73
+ $link .= '<'.$tag.' id="swap-'.$id.'" style="display:none;">'.$swaptitle.'</'.$tag.'>';
 
 
 
74
  }
 
75
  $eDiv = '';
76
  if($content != ' '){
77
  $eDiv = '<div id="target-'.$id.'" class="collapseomatic_content '.$targclass.'">'.do_shortcode($content).'</div>';
collapse.js CHANGED
@@ -1,5 +1,5 @@
1
  /*!
2
- * jQuery Collapse-O-Matic v1.2.4
3
  * http://www.twinpictures.de/collapse-o-matic/
4
  *
5
  * Copyright 2011, Twinpictures
@@ -27,51 +27,59 @@
27
  jQuery(document).ready(function() {
28
 
29
  //inital collapse
30
- jQuery('.collapseomatic:not(.close)').each(function(index) {
31
  var thisid = jQuery(this).attr('id');
32
  jQuery('#target-'+thisid).css('display', 'none');
33
  });
34
 
35
  jQuery('.collapseomatic').hover(function () {
36
- jQuery(this).addClass("hover");
37
  },
38
  function () {
39
- jQuery(this).removeClass("hover");
40
  }
41
  );
42
 
43
  jQuery('.collapseomatic').click(function() {
44
- //alert('phones ringin dude');
45
- jQuery(this).toggleClass('close');
46
- //check if the title needs to be swapped out
47
- var title = jQuery(this).attr('title');
48
- var htmlstr = jQuery(this).html();
49
- if(title != htmlstr && htmlstr.indexOf("<img") == -1 && htmlstr.indexOf("<cufon") == -1){
50
- jQuery(this).attr('title', htmlstr);
51
- jQuery(this).html(title);
52
- }
53
- var id = jQuery(this).attr('id');
54
- jQuery('#target-'+id).slideToggle('fast', function() {
55
- // Animation complete.
56
- });
 
 
 
 
 
 
 
 
57
 
58
  //deal with grouped items if needed
59
  if(jQuery(this).attr('rel') !== undefined){
60
  var rel = jQuery(this).attr('rel');
61
- if(rel.indexOf('-highlander') != '-1'){
62
- closeOtherMembers(rel, id);
63
- }
64
- else{
65
- closeOtherGroups(rel);
66
- }
67
  }
68
  });
69
 
70
  function closeOtherGroups(rel){
71
  jQuery('.collapseomatic[rel!="' + rel +'"]').each(function(index) {
72
  //add close class if open
73
- if(jQuery(this).hasClass('close') && jQuery(this).attr('rel') !== undefined){
74
- jQuery(this).removeClass('close');
75
  var id = jQuery(this).attr('id');
76
  jQuery('#target-'+id).slideToggle('fast', function() {
77
  // Animation complete.
@@ -83,8 +91,8 @@ jQuery(document).ready(function() {
83
  function closeOtherMembers(rel, id){
84
  jQuery('.collapseomatic[rel="' + rel +'"]').each(function(index) {
85
  //add close class if open
86
- if(jQuery(this).attr('id') != id && jQuery(this).hasClass('close') && jQuery(this).attr('rel') !== undefined){
87
- jQuery(this).removeClass('close');
88
  var thisid = jQuery(this).attr('id');
89
  jQuery('#target-'+thisid).slideToggle('fast', function() {
90
  // Animation complete.
@@ -103,8 +111,8 @@ jQuery(document).ready(function() {
103
  jQuery('.expandall').click(function() {
104
  if(jQuery(this).attr('rel') !== undefined){
105
  var rel = jQuery(this).attr('rel');
106
- jQuery('.collapseomatic[rel="' + rel +'"].collapseomatic:not(.close)').each(function(index) {
107
- jQuery(this).addClass('close');
108
  var thisid = jQuery(this).attr('id');
109
  jQuery('#target-'+thisid).slideToggle('fast', function() {
110
  // Animation complete.
@@ -112,8 +120,8 @@ jQuery(document).ready(function() {
112
  });
113
  }
114
  else{
115
- jQuery('.collapseomatic:not(.close)').each(function(index) {
116
- jQuery(this).addClass('close');
117
  var thisid = jQuery(this).attr('id');
118
  jQuery('#target-'+thisid).slideToggle('fast', function() {
119
  // Animation complete.
@@ -125,8 +133,8 @@ jQuery(document).ready(function() {
125
  jQuery('.collapseall').click(function() {
126
  if(jQuery(this).attr('rel') !== undefined){
127
  var rel = jQuery(this).attr('rel');
128
- jQuery('.collapseomatic[rel="' + rel +'"].collapseomatic.close').each(function(index) {
129
- jQuery(this).removeClass('close');
130
  var thisid = jQuery(this).attr('id');
131
  jQuery('#target-'+thisid).slideToggle('fast', function() {
132
  // Animation complete.
@@ -134,8 +142,8 @@ jQuery(document).ready(function() {
134
  });
135
  }
136
  else{
137
- jQuery('.collapseomatic.close').each(function(index) {
138
- jQuery(this).removeClass('close');
139
  var thisid = jQuery(this).attr('id');
140
  jQuery('#target-'+thisid).slideToggle('fast', function() {
141
  // Animation complete.
1
  /*!
2
+ * jQuery Collapse-O-Matic v1.2.5
3
  * http://www.twinpictures.de/collapse-o-matic/
4
  *
5
  * Copyright 2011, Twinpictures
27
  jQuery(document).ready(function() {
28
 
29
  //inital collapse
30
+ jQuery('.collapseomatic:not(.colomat-close)').each(function(index) {
31
  var thisid = jQuery(this).attr('id');
32
  jQuery('#target-'+thisid).css('display', 'none');
33
  });
34
 
35
  jQuery('.collapseomatic').hover(function () {
36
+ jQuery(this).addClass("colomat-hover");
37
  },
38
  function () {
39
+ jQuery(this).removeClass("colomat-hover");
40
  }
41
  );
42
 
43
  jQuery('.collapseomatic').click(function() {
44
+ //alert('phones ringin dude');
45
+ jQuery(this).toggleClass('colomat-close');
46
+ var id = jQuery(this).attr('id');
47
+
48
+ //check if the title needs to be swapped out
49
+ if(jQuery("#swap-"+id).length > 0){
50
+ var orightml = jQuery(this).html();
51
+ var swaphtml = jQuery("#swap-"+id).html();
52
+ jQuery(this).html(swaphtml);
53
+ jQuery("#swap-"+id).html(orightml);
54
+
55
+ //is cufon involved? if so, do that thing
56
+ if(swaphtml.indexOf("<cufon") != -1){
57
+ var trigelem = jQuery(this).get(0).tagName;
58
+ Cufon.replace(trigelem);
59
+ }
60
+ }
61
+
62
+ jQuery('#target-'+id).slideToggle('fast', function() {
63
+ // Animation complete.
64
+ });
65
 
66
  //deal with grouped items if needed
67
  if(jQuery(this).attr('rel') !== undefined){
68
  var rel = jQuery(this).attr('rel');
69
+ if(rel.indexOf('-highlander') != '-1'){
70
+ closeOtherMembers(rel, id);
71
+ }
72
+ else{
73
+ closeOtherGroups(rel);
74
+ }
75
  }
76
  });
77
 
78
  function closeOtherGroups(rel){
79
  jQuery('.collapseomatic[rel!="' + rel +'"]').each(function(index) {
80
  //add close class if open
81
+ if(jQuery(this).hasClass('colomat-close') && jQuery(this).attr('rel') !== undefined){
82
+ jQuery(this).removeClass('colomat-close');
83
  var id = jQuery(this).attr('id');
84
  jQuery('#target-'+id).slideToggle('fast', function() {
85
  // Animation complete.
91
  function closeOtherMembers(rel, id){
92
  jQuery('.collapseomatic[rel="' + rel +'"]').each(function(index) {
93
  //add close class if open
94
+ if(jQuery(this).attr('id') != id && jQuery(this).hasClass('colomat-close') && jQuery(this).attr('rel') !== undefined){
95
+ jQuery(this).removeClass('colomat-close');
96
  var thisid = jQuery(this).attr('id');
97
  jQuery('#target-'+thisid).slideToggle('fast', function() {
98
  // Animation complete.
111
  jQuery('.expandall').click(function() {
112
  if(jQuery(this).attr('rel') !== undefined){
113
  var rel = jQuery(this).attr('rel');
114
+ jQuery('.collapseomatic[rel="' + rel +'"].collapseomatic:not(.colomat-close)').each(function(index) {
115
+ jQuery(this).addClass('colomat-close');
116
  var thisid = jQuery(this).attr('id');
117
  jQuery('#target-'+thisid).slideToggle('fast', function() {
118
  // Animation complete.
120
  });
121
  }
122
  else{
123
+ jQuery('.collapseomatic:not(.colomat-close)').each(function(index) {
124
+ jQuery(this).addClass('colomat-close');
125
  var thisid = jQuery(this).attr('id');
126
  jQuery('#target-'+thisid).slideToggle('fast', function() {
127
  // Animation complete.
133
  jQuery('.collapseall').click(function() {
134
  if(jQuery(this).attr('rel') !== undefined){
135
  var rel = jQuery(this).attr('rel');
136
+ jQuery('.collapseomatic[rel="' + rel +'"].collapseomatic.colomat-close').each(function(index) {
137
+ jQuery(this).removeClass('colomat-close');
138
  var thisid = jQuery(this).attr('id');
139
  jQuery('#target-'+thisid).slideToggle('fast', function() {
140
  // Animation complete.
142
  });
143
  }
144
  else{
145
+ jQuery('.collapseomatic.colomat-close').each(function(index) {
146
+ jQuery(this).removeClass('colomat-close');
147
  var thisid = jQuery(this).attr('id');
148
  jQuery('#target-'+thisid).slideToggle('fast', function() {
149
  // Animation complete.
readme.txt CHANGED
@@ -4,23 +4,23 @@ Contributors: Twinpictures
4
  Donate link: http://www.twinpictures.de/collapse-o-matic/
5
  Tags: collapse, expand, collapsible, expandable, content, shortcode, hidden, jQuery, javascript, twinpictures
6
  Requires at least: 2.8
7
- Tested up to: 3.2
8
- Stable tag: 1.3.9
9
 
10
  Collapse-O-Matic adds an `[expand]` shortcode that wraps any object or content--including other shortcodes--into a lovely jQuery collapsible div.
11
 
12
  == Description ==
13
 
14
- Collapse-O-Matic adds an `[expand title="trigger text"]hidden content[/expand]` shortcode that will wrap any content, including other shortcodes, into a lovely jQuery collapsible div. A <a href='http://www.twinpictures.de/jquery-collapse-o-matic-1-3/'>complete listing of shortcode options</a> and attribute demos are available. This plugin was inspired by DrLebowski's Collapsing Objects.
15
 
16
  == Installation ==
17
 
18
- 1. Old-school: upload the `collapse-o-matic` folder to the `/wp-content/plugins/` directory via FTP. Hipster: Ironically add collapse-o-matic via the WordPress Plugins menu.
19
- 1. Activate the Plugin
20
- 1. Add a the shortcode to your post like so: `[expand title=Displayed Title Goes Here]Hidden content goes here[/expand]`
21
- 1. Test that the this plugin meets your demanding needs.
22
  1. Tweak the CSS to match your flavor.
23
- 1. Rate the plugin and verify if it works at wordpress.org.
24
  1. Leave a comment regarding bugs, feature request, cocktail recipes at http://www.twinpictures.de/jquery-collapse-o-matic-1-3/
25
 
26
  == Frequently Asked Questions ==
@@ -29,7 +29,7 @@ Collapse-O-Matic adds an `[expand title="trigger text"]hidden content[/expand]`
29
  Yes, yes... <a href='http://www.facebook.com/twinpictures'>Twinpictures is on Facebook</a>.
30
 
31
  = Does Twinpictures do the Twitter? =
32
- Ah yes! <a href='twitter.com/twinpictures'>@Twinpictures</a> does the twitter tweeting around here.
33
 
34
  = How does one use the shortcode, exactly? =
35
  A <a href='http://www.twinpictures.de/jquery-collapse-o-matic-1-3/'>complete listing of shortcode options</a> has been provided to answer this exact question.
@@ -44,20 +44,25 @@ No. Not even close.
44
 
45
  == Changelog ==
46
 
47
- = 1.3.8 =
 
 
 
 
 
48
  * Swaptitle will not be triggered if either <img> or <cufon> tags are used in trigger titles
49
- * Added rel grouping to the collapseall/expandall tirggers to target only elements of a single group.
50
 
51
  = 1.3.8 =
52
  * Expand elements containing content with one empty space will no longer insert empty target elements.
53
 
54
  = 1.3.7 =
55
  * Added expandsub1 - expandsub3 shortcodes for nested expand elements.
56
- * Added collapseall and expandall triggers.
57
  * Better looking 24bit arrows.
58
 
59
  = 1.3.6 =
60
- * Plugin now degrades gracefully if JS is disabled. Added swaptitle attribute to change the title on expand/collapse.
61
 
62
  = 1.3.5 =
63
  * Random ID's now start with letters, for valid xhtml.
@@ -76,7 +81,7 @@ No. Not even close.
76
  * Added the hover style to pimp the element style when moused over.
77
 
78
  = 1.3 =
79
- * Added the rel attribute to deal with grouping collpase elements.
80
  * Added the trigclass and targclass attributes.
81
  * Added the alt attribute to define the title's hover-over text.
82
 
@@ -93,9 +98,16 @@ No. Not even close.
93
  * Added auto expand feature if an anchor tag is used in the URL
94
 
95
  = 1.0 =
96
- * The plugin came to be.
97
 
98
  == Upgrade Notice ==
 
 
 
 
 
 
 
99
  = 1.3.8 =
100
  Expand elements that have content containing only one space will not insert target elements.
101
 
@@ -103,7 +115,7 @@ Expand elements that have content containing only one space will not insert targ
103
  New expandsub1 - expandsub3 shortcodes for nested expand elements. Collapse/Expand all triggers. Improved arrow icons.
104
 
105
  = 1.3.6 =
106
- Plugin degrades gracefully when JS is disabled. Title can now have expand/collapse states using swaptitle attribute.
107
 
108
  = 1.3.5 =
109
  Random ID's are now valid xhtml.
4
  Donate link: http://www.twinpictures.de/collapse-o-matic/
5
  Tags: collapse, expand, collapsible, expandable, content, shortcode, hidden, jQuery, javascript, twinpictures
6
  Requires at least: 2.8
7
+ Tested up to: 3.2.1
8
+ Stable tag: 1.3.10
9
 
10
  Collapse-O-Matic adds an `[expand]` shortcode that wraps any object or content--including other shortcodes--into a lovely jQuery collapsible div.
11
 
12
  == Description ==
13
 
14
+ Collapse-O-Matic adds an `[expand title="trigger text"]hidden content[/expand]` shortcode that will wrap any content, including other shortcodes, into a lovely jQuery collapsible div. A <a href='http://www.twinpictures.de/jquery-collapse-o-matic-1-3/'>complete listing of shortcode options</a> and attribute demos are available. This plug-in was inspired by DrLebowski's Collapsing Objects.
15
 
16
  == Installation ==
17
 
18
+ 1. Old-school: upload the `collapse-o-matic` folder to the `/wp-content/plug-ins/` directory via FTP. Hipster: Ironically add collapse-o-matic via the WordPress Plug-ins menu.
19
+ 1. Activate the Plug-in
20
+ 1. Add a the shortcode to your post like so: `[expand title="Displayed Title Goes Here"]Hidden content goes here[/expand]`
21
+ 1. Test that the this plug-in meets your demanding needs.
22
  1. Tweak the CSS to match your flavor.
23
+ 1. Rate the plug-in and verify if it works at wordpress.org.
24
  1. Leave a comment regarding bugs, feature request, cocktail recipes at http://www.twinpictures.de/jquery-collapse-o-matic-1-3/
25
 
26
  == Frequently Asked Questions ==
29
  Yes, yes... <a href='http://www.facebook.com/twinpictures'>Twinpictures is on Facebook</a>.
30
 
31
  = Does Twinpictures do the Twitter? =
32
+ Ah yes! <a href='http://twitter.com/#!/twinpictures'>@Twinpictures</a> does the twitter tweeting around here.
33
 
34
  = How does one use the shortcode, exactly? =
35
  A <a href='http://www.twinpictures.de/jquery-collapse-o-matic-1-3/'>complete listing of shortcode options</a> has been provided to answer this exact question.
44
 
45
  == Changelog ==
46
 
47
+ = 1.3.10 =
48
+ * Swaptitle system rebuilt to support images and cufon.
49
+ * Updated CSS the over generalized names close and hover to more plug-in specific colomat-close and colomat-hover
50
+ * removed !important from CSS arrow definitions to make it easier to redefine arrows.
51
+
52
+ = 1.3.9 =
53
  * Swaptitle will not be triggered if either <img> or <cufon> tags are used in trigger titles
54
+ * Added rel grouping to the collapse/expand-all triggers to target only elements of a single group.
55
 
56
  = 1.3.8 =
57
  * Expand elements containing content with one empty space will no longer insert empty target elements.
58
 
59
  = 1.3.7 =
60
  * Added expandsub1 - expandsub3 shortcodes for nested expand elements.
61
+ * Added collapse/expand-all triggers.
62
  * Better looking 24bit arrows.
63
 
64
  = 1.3.6 =
65
+ * Plug-in now degrades gracefully if JS is disabled. Added swaptitle attribute to change the title on expand/collapse.
66
 
67
  = 1.3.5 =
68
  * Random ID's now start with letters, for valid xhtml.
81
  * Added the hover style to pimp the element style when moused over.
82
 
83
  = 1.3 =
84
+ * Added the rel attribute to deal with grouping collapse elements.
85
  * Added the trigclass and targclass attributes.
86
  * Added the alt attribute to define the title's hover-over text.
87
 
98
  * Added auto expand feature if an anchor tag is used in the URL
99
 
100
  = 1.0 =
101
+ * The plug-in came to be.
102
 
103
  == Upgrade Notice ==
104
+
105
+ = 1.3.10 =
106
+ Rebuilt swaptitle to support images and cufon text. Change CSS names to be more plug-in specific.
107
+
108
+ = 1.3.9 =
109
+ Title triggers that contain <img> or <cufon> tags will not trigger swaptitle. Added rel grouping option to expand/collapse-all triggers.
110
+
111
  = 1.3.8 =
112
  Expand elements that have content containing only one space will not insert target elements.
113
 
115
  New expandsub1 - expandsub3 shortcodes for nested expand elements. Collapse/Expand all triggers. Improved arrow icons.
116
 
117
  = 1.3.6 =
118
+ Plug-in degrades gracefully when JS is disabled. Title can now have expand/collapse states using swaptitle attribute.
119
 
120
  = 1.3.5 =
121
  Random ID's are now valid xhtml.
style.css CHANGED
@@ -1,5 +1,5 @@
1
  .collapseomatic {
2
- background-image: url(images/arrow-down.png) !important;
3
  background-repeat: no-repeat;
4
  padding: 0 0 10px 16px;
5
  cursor: pointer;
@@ -8,11 +8,11 @@
8
  background-position: top right;
9
  padding: 0 16px 10px 0;
10
  }
11
- .hover {
12
  text-decoration: underline;
13
  }
14
- .close {
15
- background-image: url(images/arrow-up.png) !important;
16
  }
17
  .collapseomatic_content {
18
  margin-top: 0px;
1
  .collapseomatic {
2
+ background-image: url(images/arrow-down.png);
3
  background-repeat: no-repeat;
4
  padding: 0 0 10px 16px;
5
  cursor: pointer;
8
  background-position: top right;
9
  padding: 0 16px 10px 0;
10
  }
11
+ .colomat-hover {
12
  text-decoration: underline;
13
  }
14
+ .colomat-close {
15
+ background-image: url(images/arrow-up.png);
16
  }
17
  .collapseomatic_content {
18
  margin-top: 0px;