Another mod for phpBB2 that I have just completed is the well sought after “Facebook Connect” mod. It’s a very straightforward version and should be very simply to install, though I give no guarantee that it will work for you.
I used to JavaScript Api to get the job done. In a nutshell what it does is it first adds in a column to your User’s table to store someone’s Facebook ID. Then the first time a user clicks on the “facebook connect” button it will ask the user if they want to link to an existing account or create a new one. It will then add in the facebook ID to th row for the selected account. Then the next time a user clicks on the “Facebook Connect” button it will check the User’s table for the user’s facebook ID and automatically log them in.
So, like I said, pretty straight forward. The forum account will still work independently from Facebook, but will give the user instant activation and a faster way to login.
Features:
- Instant account activation.
- Single click log in when user is already logged into Facebook.
- Allows for linking/unlinking for logged in users.
- Will add the user’s Facebook avatar if they don’t already have one.
Click here to download the mod
8/02/10 Minor edit needed: It reads “Please submit both an email and password” which should be changed to “Please submit both a username and password”
For a project I wrote this JavaScript based image zoom in application. At the time I couldn’t find anything out there that I could use to get the desired effect (at least w/out shelling out some dough) – so I opted to write something myself.
The entire idea was not well received…so I never actually finished it. So this is essentially just a “proof of concept”. It demonstrates that you can zoom in, zoom out, and move an image around within a specified area without the use of flash. I don’t know if I’ll ever get the chance to finish this, or really even have a reason to finish, but so it doesn’t get lost I thought I would post it up here.
Regardless of the outcome it was a good exercise in JavaScript
Click here to see it in action!
The zoom icons used in this are from Dry Icons
I’ve created a very, very, simple online converter for special characters. I’ll often get handed off a Word document with text to be included in a website. Word by default will create curly quotes, and it may have a myriad of special characters littered in there. So I made a simple script that replaces special characters with their ASCII entity counterparts.
You Simply copy and paste the text into the large textbox, click on the button and voila! It does have some limited conversion of ampersands. It will only convert and ampersands to & if there is a space in from of it to remove the risk of converting any entities that may be already in the code. So while “Tea & crumpets” will convert “M&M” won’t.
Special Character Converter
I’m always forgetting what the JavaScript equivalent is of certain CSS styles. for instance you could change the border by:
document.getElementById(‘myText’).style.border = ’1px solid #333′;
| CSS Property | JavaScript Reference |
| background | background |
| background-attachment | backgroundAttachment |
| background-color | backgroundColor |
| background-image | backgroundImage |
| background-position | backgroundPosition |
| background-repeat | backgroundRepeat |
| border | border |
| border-bottom | borderBottom |
| border-bottom-color | borderBottomColor |
| border-bottom-style | borderBottomStyle |
| border-bottom-width | borderBottomWidth |
| border-color | borderColor |
| border-left | borderLeft |
| border-left-color | borderLeftColor |
| border-left-style | borderLeftStyle |
| border-left-width | borderLeftWidth |
| border-right | borderRight |
| border-right-color | borderRightColor |
| border-right-style | borderRightStyle |
| border-right-width | borderRightWidth |
| border-style | borderStyle |
| border-top | borderTop |
| border-top-color | borderTopColor |
| border-top-style | borderTopStyle |
| border-top-width | borderTopWidth |
| border-width | borderWidth |
| clear | clear |
| clip | clip |
| color | color |
| cursor | cursor |
| display | display |
| filter | filter |
| font | font |
| font-family | fontFamily |
| font-size | fontSize |
| font-variant | fontVariant |
| font-weight | fontWeight |
| height | height |
| left | left |
| letter-spacing | letterSpacing |
| line-height | lineHeight |
| list-style | listStyle |
| list-style-image | listStyleImage |
| list-style-position | listStylePosition |
| list-style-type | listStyleType |
| margin | margin |
| margin-bottom | marginBottom |
| margin-left | marginLeft |
| margin-right | marginRight |
| margin-top | marginTop |
| overflow | overflow |
| padding | padding |
| padding-bottom | paddingBottom |
| padding-left | paddingLeft |
| padding-right | paddingRight |
| padding-top | paddingTop |
| page-break-after | pageBreakAfter |
| page-break-before | pageBreakBefore |
| position | position |
| float | styleFloat |
| text-align | textAlign |
| text-decoration | textDecoration |
| text-decoration: blink | textDecorationBlink |
| text-decoration: line-through | textDecorationLineThrough |
| text-decoration: none | textDecorationNone |
| text-decoration: overline | textDecorationOverline |
| text-decoration: underline | textDecorationUnderline |
| text-indent | textIndent |
| text-transform | textTransform |
| top | top |
| vertical-align | verticalAlign |
| visibility | visibility |
| width | width |
| z-index | z-index |
Javascript CSS Style reference
Shamelessly stolen from: http://codepunk.hardwar.org.uk/css2js.htm