Modify user plugin to add photo

[cheeseus]

Hello,

I have been playing with the User Plugin in 1.6 (since Beta 13). I have managed to add my own fileds for additional user information but now I'd also like to add the option for the user to add their own photo.

So far, I've simply repeated the steps for adding a new text/list/textarea field. Here they are in case someone needs them:

1. In profile.xml (root\plugins\user\profile\) add a new field for both the registration stage and the profile edit stage (in their respective positions, i.e. after the ABOUT_ME field):

Code: Select all

				<field
					name="register-require_userphoto"
					type="list"
					default="0"
					label="PLG_USER_PROFILE_FIELD_USERPHOTO_LABEL"
					description="PLG_USER_PROFILE_FIELD_USERPHOTO_DESC"
				>
					<option	value="2">JOPTION_REQUIRED</option>
					<option	value="1">JOPTION_OPTIONAL</option>
					<option	value="0">JDISABLED</option>
				</field>

and

Code: Select all

				<field
					name="profile-require_userphoto"
					type="list"
					default="0"
					label="PLG_USER_PROFILE_FIELD_USERPHOTO_LABEL"
					description="PLG_USER_PROFILE_FIELD_USERPHOTO_DESC">
					<option	value="2">JOPTION_REQUIRED</option>
					<option	value="1">JOPTION_OPTIONAL</option>
					<option	value="0">JDISABLED</option>
				</field>

2. Edit the profile.php file in the same directory to add the following (in it respective position, i.e. after the ABOUT_ME field):

Code: Select all

			// Toggle whether the userphoto field is required.
			if ($this->params->get('profile-require_userphoto', 1) > 0) {
				$form->setFieldAttribute('userphoto', 'required', $this->params->get('profile-require_userphoto') == 2, 'profile');
			} else {
				$form->removeField('userphoto', 'profile');
			}

and

Code: Select all

			// Toggle whether the userphoto field is required. EDITED BY CHEESEUS
			if ($this->params->get('register-require_userphoto', 1) > 0) {
				$form->setFieldAttribute('userphoto', 'required', $this->params->get('register-require_userphoto') == 2, 'profile');
			} else {
				$form->removeField('userphoto', 'profile');
			}

3. Edit the profile.xml file in the subfolder called Profiles (root\plugins\user\profile\profiles\) to add the new field (again after the ABOUT_ME field):

Code: Select all

			<field
				name="userphoto"
				type="text"
				description="PLG_USER_PROFILE_FIELD_USERPHOTO_DESC"
				label="PLG_USER_PROFILE_FIELD_USERPHOTO_LABEL"
				message="PLG_USER_PROFILE_FIELD_USERPHOTO_MESSAGE"
				size="30"
			/>

4. Add the text placeholders for the new field(s) you've added for the available site languages, in my case, English-UK and Bulgarian by editing the en-GB.plg_user_profile.ini file located in root\administrator\language\en-GB\ and correspondingly the other language file. In my case I have added:

Code: Select all

PLG_USER_PROFILE_FIELD_USERPHOTO_LABEL="Photo"
PLG_USER_PROFILE_FIELD_USERPHOTO_DESC="User profile photo"

5. You can control the new field - required/optional/disabled - from Admin > Extensions > Plug-in Manager > User Plugin.

Now, all of the above works for all types of fields other than IMAGES.

I need help creating a new image field with the option to browse the user's computer for images, and then for displaying the selected image as an image, not as text.

My idea to implement this is very simple and certainly leaving much to be desired but it works:

--- From the front-end (or back-end) go to Edit Profile and in the new text field called USERPHOTO type the HTML tag for image:

Code: Select all

<img src="images/userimg/crazy_teacher.jpg" border="0" alt="" />

And the image will load

This, however, does not make it easy on the ordinary user. It is actually impossible for them to add their own photo.

What is lacking is:

1. A file upload functionality that will put the user image in the relevant root/images/userimg folder.
2. A script checking the type and size of the user image.

I could really use some professional Joomla-coding help here

[mcsmom]

If you look at the JForm API you will see a field type of file. You can use that. The Joomla API also includes an upload method. So put them together and you should be able to do what you want.
You can look at the uploaded in media manager for examples.

[cheeseus]

If you look at the JForm API you will see a field type of file. You can use that. The Joomla API also includes an upload method. So put them together and you should be able to do what you want.
You can look at the uploaded in media manager for examples.

Thanks, but that's beyond my knowledge. I don't even know where to look for that JForm API

[mcsmom]

So probably it's not something you will do. I mean you could just add an editor field and let them use the normal image icon to upload. It's a bit convoluted but it would work. If you use the JCE editor you can actually give users their own folders.

[mcsmom]

I mean you can just add
<field
name="image"
type="file"
label="PLG_USER_PROFILE_FIELD_IMAGE_LABEL"
description="PLG_USER_PROFILE_FIELD_IMAGE_DESC"
/>

as another field but you will need to work out the upload.

[mcsmom]

Actually duh ... just use the media field type but make sure to give the group privileges to use com_media. Regular authors should be ok.

[cheeseus]

...give the group privileges to use com_media.

Now, that's looks like a problem... can't figure out how to do it. I get "You're not authorized..." when I click the JSELECT (browse?) button. The same happens when I am writing a new article and try to insert an image - not authorized.

On the front end, where the problem occurs, I log in as "Teacher" - that's one of the new user groups I've created. The three new groups (teachers, students, parents) have the "Registered" group as parent. In Global Config > Permissions, the Teacher group (and the other two) are allowed to:
- Site Login, Access Component, Create, Edit - the rest of the options - not allowed.

I reckon this should give the user group the right to insert an image in articles, but it doesn't.

I also tried creating a new user, whom I assigned the Registered/Author/Editor/Publisher/Teachers rights but still I can't access the Insert Image module...

EDIT: Forgot to add that I also edited the permissions under Media Manager. So now the Publisher has all permissions - to configure, access component, create, delete, edit, edit state -- but still I get access denied when I click on the Insert Image button... I don't understand, is this a bug or something?

[mcsmom]

Yes. Please report that on the tracker.

[cheeseus]

Yes. Please report that on the tracker.

Reported.

Resolved in Beta 15.