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.

[Stefanus]

Originally Posted by StGaensler

I currently can't promise when this feature will come.

Any help on the possibility to change column widths?

Thanks,
Stefanus

[SteamyLightning]

Unless I'm doing the {css=myclass} wrong, the function is not working.

Say I want to declare a class in my CSS declarations:

.stg_table_myclass {
padding:5px;
}

Then I'd add {css=myclass} to the new row. Unfortunately, it does nothing.

[SteamyLightning]

Also, is there anyway to stop the autosort from detecting BBCode? I really don't need to know that [center] comes before Alpha.

[HolyKiller]

Perfect! installed !

[adnoid]

Installed, works great!

[singabaloo]

I'm still not able to get the sortable columns when I have a table within a Web Templates page (https://vborg.vbsupport.ru/showthread.php?t=186644).

has anyone had any success doing this ?

[Danielgsc]

First of all, thank you very much for this mod. Second, sorry my english.

Well, I have the next doubt:
In the first post, StGaensler, shows three screenshots. In the second screenshot there is a table in wich c3 cell there are three lines with differents aligns.
How can I open three lines in the same cell? If a clic <enter> to open a line, I make a new row...

Anybody can help me?

Pd. StGaensler, if you could show the code of this second table.... I will be you very grateful

Thanks in advance.

[Elenna]

Danielgsc,

You should be able to use BBCode in the cells. Use {br} to do a new line without starting a new row.

Try this for the code:

[table=head]number|column 1|[b]column 2[/b]|[i]column 3[/i]
1|[table]this|is|a
small|table|inside
the|big|table[/table]|[b][color=red]hallo[/color][/b]|[size=3][b][color=blue]everything is possible[/color][/b][/size]
2|[url="http://www.google.com"]visit Google?[/url]|[quote=Zitat]small quote[/quote]|:D :) 8)
3|wanna have a list?[list][*]list 1[*] list 2[*] list 3[/list]|[left]align left[/left]{br}[center]align center[/center]{br}[right]align right[/right]|contact me: [email]example@example.net[/email][/table]

[Danielgsc]

Thank you very much for your big help, Elenna. It has been very useful for me.

[imported_silkroad]

This is an amazing mod. Thank you!

We have just used these BB codes to create a table where we compare pulling a vB forum image (small gif) from a web server, and then the same object from Amazon CloudFront. These tables are great !!!!

Amazon CloudFront / S3 Small Object Test Results


Thank you Stefan!!

PS: There is a bug in your JS sorting code. Signed and unsigned numbers are sorted the same, it seems ;-) So, if you sort 4, -3 and -6, your code will sort this incorrectly as -3, 4 and -6, instead of 4, -3, -6, etc.