BB Code Enhancements - BB Code [table]

BB Code [table]
by StGaensler

Description
This Hack provides a BB code [table] to add a table to the post
The skin of the table automatically fits the style because the CSS classes of vBulletin are used.

A table is simply made of some lines (will be the rows). The cols are seperated by |. So this will be a table:

[table="head"]head col1|head col2|head col3
row1 col1|row1 col2|row1 col3
row2 col1|row2 col2|row2 col3[/table]

A screenshot of a "ready" table is attached

Usage

1. install attached product XML through product manager (overwrite existing)
2. install at least one language pack in AdminCP -> Languages & Phrases -> Download / Upload Languages -> Import Language XML File
   Important: Select the language you want to import the phrases into, not "(Create New Language)" - this won't work! If you use another version of vBulletin than I use enable "Ignore Language Version" to import the language pack.

Please note: (installing)
Installing this product will: (reverted during uninstall)

1. rename a existing BB code "table" to "table_saved"
2. add a new BB code [table]

If you want to have live sortable columns (JavaScript): Download attached sorttable.js.txt rename it to sorttable.js and place it into the /clientscript/ folder of your vBulletin. Then go to AdminCP -> vBulletin Options -> BB Code [table] Settings -> Enabled Features Of This BB Code and enable sortable
Note: Including the file on the webpages where it is necessary is done by my product. So if sortable is disabled, it won't be included automatically.
If you want to have a icon for the editor you may use this for free: Download this icon and place it in your /images/editor/ folder.

Please note: (usage)

• Of course you can use vB Code and smilies inside the table!
• The first line defines how much columns are in the table. If the other lines have more or less colums they are cut off or filled with   (space)
• You can find a detailed description of the options (please read it before requesting help)
• Empty rows are (should be ) removed.

New features

• define colspan of cells
• small panel in AdminCP
• define CSS class of table and tablerows
• live sorting of table through clicking the head of a column
• defining maximum width of a table

Maybe planned features

• detailed description of the vB Code in misc.php?do=bbcode depending on the features enabled in AdminCP (planned for next beta version)
• define formatting (bold, italic), align (left, right, center) and width of the cols

Suggested but not planned features

• none

Known problems

• Bugfix of version 0.1.1 doesn't work if vBulletin should write template names into the source code

Version history:
0.0.1 - 0.0.5 internal releases for testing purposes (Thanks to Zombie79 from powerforen.de for testing)
0.1 first official release
0.1.1 fixed small bug: if a line ends with eg vbcode quote no new row was generated (should already have been fixed but did not work)
0.1.2 workaround: removed call to function bcmod(), it could also be done another way
0.1.3.x beta version described here (and following) - added admin panel, colpan and css feature
0.1.4 stable version - no significant changes to the last beta (0.1.3.8)
0.1.5.x beta version described here (and following) - added sortable, maxwidth, versioncheck, upgrade message, compatibility to vB 3.6
0.1.6 stable version - two bugfixes to last beta, {br} for posting linebreaks in a tablecell
0.1.7.x stable version - compatibility to vB 3.7 (description) - added tab seperated tables

This hack can be used for free. If you want to make a small donation, just contact me. We will find a way
I don't want this product to be distributed from other sources. Please don't upload it to other vBulletin related boards etc.

[StGaensler]

Thanks, too. I fixed this - one space should be allowed

[Renada]

Hi,

Thank you for this wonderful code, it's made our lives so much easier on my site

In your screenshots you have a table inside a table and also you've aligned text left, right and centre. Could you please explain how you did that?

Thank you
Regards,
Renada

[StGaensler]

That was simply formating the Table content with vB code. Here is the code of the example table:

[table="autonumtitle=number;head"]column 1|[B]coumn 2[/B]|[I]column 3[/I]
[table]this|is|a
small|table|inside
the|big|table[/table]|[B][COLOR=Red]hallo[/COLOR][/B]|[SIZE=4][COLOR=Blue][B]everything is possible[/B][/COLOR][/SIZE]
[B][B][B][URL="http://google.com"]visit Google?[/URL][/B][/B][/B]|[quote]small quote[/quote]|:D :o :) ;) :p :mad: :( :confused: :rolleyes: :eek: :cool: 
wanna have a list?[LIST][*]list 1[*]list 2[*]list 3[/LIST]|[LEFT]align left[/LEFT]
[CENTER]align center[/CENTER]
[RIGHT]align right[/RIGHT]
|contact me: [URL="mailto:example@example.net"]example@example.net[/URL][/table]

I can't answer your questions for the next week because I'm on holidays

[Renada]

Originally Posted by StGaensler

That was simply formating the Table content with vB code. Here is the code of the example table:

[table="autonumtitle=number;head"]column 1|[b]coumn 2[/b]|[i]column 3[/i]
[table]this|is|a
small|table|inside
the|big|table[/table]|[b][color=Red]hallo[/color][/b]|[size=4][color=Blue][b]everything is possible[/b][/color][/size]
[b][b][b][url="http://google.com"]visit Google?[/url][/b][/b][/b]||:D :o :) ;) :p :mad: :( :confused: :rolleyes: :eek: :cool: 
wanna have a list?[list][*]list 1[*]list 2[*]list 3[/list]|[left]align left[/left]
[center]align center[/center]
[right]align right[/right]
|contact me: [url="mailto:example@example.net"]example@example.net[/url][/table]

I can't answer your questions for the next week because I'm on holidays

Hi,

Thank you so much that worked perfectly except the left/centre/right cell, not sure why that puts everything in different cells.

Have a great holiday

Regards,
Renada

[barca4ever]

Great Plugin :banana: .. INSTALL

[havefun]

THX for it

[high]* havefun clicked install[/high]

[ChiliVB]

Originally Posted by StGaensler

New: Tables (with a head) now can be live sorted through JavaScript!
Download attached sorttable.js.txt rename it to sorttable.js and place it into the clientscript folder of your vBulletin. Then go to AdminCP -> vBulletin Options -> BB Code [table] Settings -> Enabled Features Of This BB Code and enable sortable
PS: Including the file on the pages where it is necessary is done by my product. If sortable is disabled, it won't be included automatically.

Hi Stefan,

I love the new live sort feature but I'm not able to get this feature to work. When I click on the head row nothing happens.

I uploaded the sorttable.js to the clientscript folder and the feature is enabled in the ACP.

Do I need to add something in the table's bbcode? I reviewed the advanced options post but didn't see anything about this new feature.

[StGaensler]

Sorry Chili that was my fault. I accidentally left one plugin out which linked this javascipt in the <head> section of the output file.

Download and import the new version from here https://vborg.vbsupport.ru/showpost....5&postcount=53 then it should work.

Thanks for the feedback,
Stefan

[ChiliVB]

I've installed the new version, columns are sorting. Yay!

Note the little broken image box in my attached pic. Is there an image file I need to place somewhere?

Attachment 49545

EDIT: Stefan I found something looking at the javascript. I'll PM you.

[StGaensler]

Grr, sorry. As I modified the code of the javascript I put in the absolute path to my webserver. This server (and domain) isn't aviable from the internet so the image couldn't be displayed.
Now I use the correct relative path to the image directory of the currently selected style - that should have been the default behaviour from the beginning.

Thanks for the feedback again I updated the files (both product and javascript).