Page 2 of 2

bbcode for color and font-size

Posted: Sun 09 Jun 2013, 01:30
by efiabruni
in my blog I use a style button for any styling needs one might have:

example

Code: Select all

sub bbcode
s/\{style=(.+?)\}(.+?)\{\/style\}/<p style=$1>$2<\/p>/gi; 

Code: Select all


sub bbdecode
s/\<p style=(.+?)\>(.+?)\<\/p\>/\{style=$1\}$2\{\/style\}/gi;
button:

Code: Select all

<input type="button" style="color:red" onClick="surroundText(\'{style=text-size:;color:}\', \'{/style}\', document.forms.submitform.content); return false;" value="style" />
if you exchange the curly brackets with [] this should work in the SJPPLOG as well.

Posted: Sun 09 Jun 2013, 13:48
by jamesbond
Thanks efia, that's a good one. I'll be putting that to my blog too.

I found out nicedit problem - we need to unquote the &apos; and &quote; before displaying the html. The same problem also affected your styles, so I was kind of "forced" to fix it :)

Here is a patch for sjpplog which includes efia's styles + fix for the unquoting + fix for image bbcode (which otherwise, if you put two of them together side by side, all will be lost upon editing, except the final one).

Posted: Sun 09 Jun 2013, 18:05
by sc0ttman
jamesbond wrote:Thanks efia, that's a good one. I'll be putting that to my blog too.
I will add that to SJPPLOG, but not the simple stat thing - i run sjpplog in akita (it's included by default) so i am trying to keep it really lightweight...

stats

Posted: Mon 10 Jun 2013, 19:34
by efiabruni
I forgot to add UTF-8 support to the contact patch,
accept-charset="UTF-8"
needs to be added to the contact form.

jamesbond: I would be interested to see the stats script :)

Posted: Tue 11 Jun 2013, 16:38
by jamesbond
efia, give me sometime to tidy up the code, then I'll upload it. Watch this space :)

sc0ttman, the stat script is actually very tiny - all together is 14K. The map background (which I get from wikimedia) is a 130K png file. It is the data file which is huge (36 MB as it is now, I manage to 'compress' it a little) but you shouldn't include these with akita :)

Posted: Fri 14 Jun 2013, 12:45
by jamesbond
jamesbond wrote:efia, give me sometime to tidy up the code, then I'll upload it. Watch this space :)
Ok the sources are here.

stats

Posted: Fri 14 Jun 2013, 19:45
by efiabruni
Thank you. :D
This looks...extensive and impressive, I will see if I can make it into a plugin for my blog, but I think not for the next release

style sheet for mobile devices

Posted: Sun 16 Jun 2013, 23:02
by efiabruni
For mobile devices (esp phone) the normal blog layout is a bit awkward to use, I tried to make it a bit friendlier, so now on mobile phones it should look something like the screenshot below.

To make the slide out menu I used JQuery, but it is possible to have a similar effect with adding

Code: Select all

div#menu:hover div.show {display:block; text-align:center;}
in the mobile style sheet, only "hover" is not always supported in mobile devices see here.

I had to add some divs and classes to the html of the blog (and of course the JQuery script) to make it work, see diff file below, as well as add the link for the menu.

Because I like playing around with css scripts I also added a @print style to the original css...


I don't have an abundance of mobile phones, so this is not tested thoroughly :)

Posted: Fri 21 Jun 2013, 17:24
by sc0ttman
I'm in the process of adding most of this to SJPPLOG, but I have a question or 2 for efiabruni about the updates ..

1. Does the contact page you created for pe_pplog require the sendmail binary to be installed and working?

I ask because akita has no sendmail binary (not even a busybox one) and so I found this, which is a PERL only solution for sending email: http://search.cpan.org/dist/Mail-Sendmail/ ..

I installed it with this command:

Code: Select all

perl -MCPAN -e "install Mail::Sendmail"
I've yet to test it, but seems widely used and reliable by all accounts.
Is this what you're using in your code?

....

2. Do you have any alternative code for your dropdown menu in the mobile theme? ...

Cos I tested your site on my appletart phone and it works mostly fine, except the menu doesn't drop down in safari or any other browser i tried on the phone (all webkit rendering based i believe) ... when I click on the 'Menu' link, the entire page simply reloads 'as is'... :/

mobile theme and sendmail

Posted: Sat 22 Jun 2013, 00:53
by efiabruni
Yes, the contact page relies on sendmail, I basically used the same setting as for "send email with comments". I would love to see the perl solution because sendmail is meh.
Is it possible that you have either javascript turned off in your phone or Jquery disabled in the PPLOG? There is a CSS solution as I wrote in my post (I usually prefer CSS solutions to Javascript ones), but it is unreliable, because it relies on the hover effect.

But if you want to try, just add the CSS bit I wrote in the previous post to the mobile.css and get rid of the JQuery code in index.pl

Posted: Sun 23 Jun 2013, 19:33
by jamesbond
Following efia's excellent "style" bb code, I added this "class" bbcode so that I can use pre-defined CSS classes instead of typing a long CSS string every time I want to change colours or font-size etc.

In bbcode, add:

Code: Select all

s/\[class=(.+?)\](.+?)\[\/class\]/<span class=$1>$2<\/span>/gi; # james class
In bbdecode, add:

Code: Select all

s/\<span class=(.+?)\>(.+?)\<\/span\>/\[class=$1\]$2\[\/class\]/gi; # james class
I considered adding [h2] and [h3] codes to make <h2> and <h3> as well, but I figured I could achieve the same thing with the "class" bbcode (like, [class=h2]heading2[/class]).

Posted: Tue 02 Jul 2013, 22:44
by sc0ttman
updated to 1.5
thanks to efiabruni and jamesbond for all their updates! :)

changelog for 1.5:

- fixes in single quotes
- fixes for unquoting stuff (for nicedit?)
- added [style] and [center] bcode
- fixed order of archive entries,
- moved config and funcs to external files..
- added $config_currentStylesheet..
- added admin page to edit config file & stylesheet.. (link to admin page in menu)
- fallback to default css file (style1.css) & print error, if needed..
- added 'class' to bbcode..
- added .error class in style1.css

i still plan to do add:

- mobile css
- contact page without sendmail

screenshot of admin page: http://i.imgur.com/WUn3NFT.png

nice

Posted: Wed 03 Jul 2013, 03:19
by efiabruni
I see you found my editConfig page did it work ok for you or did you find any kinks? On my admin page I had added a test for if there is a syntax error in the Config file, basically

Code: Select all

do "pe_Config.pl" or print ""There is something wrong with your Config. file using pe_Config.pl.bak. The blog is working, but maybe not how you want to?";
Did you get the mobile css to work? It is working for me, I tested it on several Iphones I could get my hands on and my Android and it was working, but I did notice that I had to add the line

Code: Select all

<meta name="Viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2.0, user-scaleable=yes"/>
to the header to make it display in a readable font size.

Re: nice

Posted: Wed 03 Jul 2013, 19:23
by sc0ttman
efiabruni wrote:I see you found my editConfig page did it work ok for you or did you find any kinks? On my admin page I had added a test for if there is a syntax error in the Config file, basically

Code: Select all

do "pe_Config.pl" or print ""There is something wrong with your Config. file using pe_Config.pl.bak. The blog is working, but maybe not how you want to?";
Yeah it works fine, the only the difference is I integrated it into the main pup_pplog.pl file, keeping it in one file, so that it follows the same coding style as the rest of the script, and the other bits i added before, i did the same way, so it was the easiest way for me.
Did you get the mobile css to work? It is working for me, I tested it on several Iphones I could get my hands on and my Android and it was working, but I did notice that I had to add the line

Code: Select all

<meta name="Viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2.0, user-scaleable=yes"/>
to the header to make it display in a readable font size.
I haven't had a good play with it since last time - i boot a 'fresh' install each time, and dip into whatever.. I plan to add it soon... will be doing other stuff for a bit, then come back to it.. thanks for all your updates and stuff, very useful! :)

BTW, i actually have planned for a long time to integrate a csv2<table> <table>2sortable, table2graph/csv2graph etc (i have the libraries ready to test), and then ultimately to have something like:

[chart="pie"]/path/to/file.csv[/chart]

[chart="bar"]/path/to/file.csv[/chart]

[table]/path/to/file.csv[/table]

[sortable]/path/to/file.csv[/sortable]

and so on... the libraries I might use are:

csv2table, graphtable/cubism/tablechart/etc, jquery.tablesorter,

And I also found a nice little PERL calendar called "calendar3", or another lighter one if i find it, which I'm vaguely planning to integrate nicely with posts/archives somehow.... at some point... ;)

Posted: Fri 05 Jul 2013, 00:43
by sc0ttman
updated to 1.6

- added support for mobile css themes

Image

..screenshot says 1.5, but it's 1.6 that is running on the phone

Posted: Tue 30 Jul 2013, 21:36
by koulaxizis
I have noticed a weird bug on the original Pplog. When a user puts an apostrophe in the comments, "breaks" the comment into two, creating two comments with the content until the apostrophe in the first half and the rest of the content in the second half. Does SjPplog have the same problem? Any ideas how to solve it?

security issue

Posted: Tue 01 Apr 2014, 09:31
by efiabruni
There is a security issue with having bbcode enabled in comments in all the pplogs (original, SJPPlog and the pe_pplog)

Due to very admissive parsing of the bbcode it is possible to insert javascript in comments when posting a link or a picture. Basically one can enter: [ u r l=javascript:maliciouscode]click![/ u r l]
See last comment on http://pplog.scottjarvis.com/?viewDetailed=00021 for an example. This makes comments vulnerable to xss attacks.

My advise is to disable bbcode on the comments of ALL versions of the PPLOG

What is needed:
URL / SRC validating and escaping
strict rules for which attributes are allowed, validating and escaping
additional html escaping