I need help with implementing a feature

Dominik L Posted in Component Development 2 months ago

a user of mine had an idea for a bio component

We already have one by Michael, but he had another idea:

When you open the profile of a user, there should be a container above the wall container with the label "tell us something about yourself" with a pencil icon for direct editing - here the user has the possibility to add a few words about himself so other users who visit his profile, can directly see a few infos about the user he gives about himself.

something like "hi my name is Dominik, I am 27 and I like to play games and go hiking"

Something like the bio component, but with fewer words and directly visible when opening a profile

makes the whole thing a little bit more personal, especially for mobile users

Would this be hard to implement?

Replies
German Dominik L Replied 3 weeks ago

Thank you!!!

German Michael Zülsdorff Replied 3 weeks ago

Ah ok,
I put all that I wrote into a component now ...
see https://www.opensource-socialnetwork.org/component/view/7333

German Dominik L Replied 3 weeks ago

Didn't had time yet, sorry.

Have to take care of my newest Google fonts problem first.

Thanks for your help so far, I'll let you know if that worked, when the stress is over

German Michael Zülsdorff Replied 3 weeks ago

He Dominik,
is there any progress regarding this component?

German Michael Zülsdorff Replied 3 weeks ago

I'm wondering how you expect some help on that as long as you don't provide a single line of code?

You want to add that bio-box on top of the profile timeline. Ok, so it makes sense to have a look into the pagehandler of OssnProfile. And voila, It comes with a hook which allows to change the output:

$contents['content'] = ossn_call_hook('profile', 'load:content', $vars, $content);

So, create a component that makes use of this hook like

ossn_add_hook('profile', 'load:content', 'zzz_add_minibio');

and an accompanying function

function zzz_add_minibio($hook, $type, $return, $params) {
// error_log('zzz params ' . ossn_dump($params));
error_log('zzz return ' . ossn_dump($return));
$plugin = 'blabla'; // replace by $plugin = ossn_plugin_view('your_minibio_plugin', $params);
$new_content = str_replace('<div class="ossn-profile-wall">', '<div id="minibio">my mini bio: ' . $plugin . '</div><div class="ossn-profile-wall">', $return);
return $new_content;

}

Log the output of $params and $return and you'l l find that $return includes all that html the profile page is made of.
Use your browser's developer console to narrow down the location where you want to insert your bio box. That's

<div class="ossn-profile-wall">

Thus, in order to insert your box html before that div, we can use str_replace to replace it by a new div which will show the bio box and add the former ossn-profile-wall div at the end again to keep it complete.

That's the starting point. Proceed with developing your mini bio plugin which needs to return the html of the form to enter/save the member's mini bio and/or display it as Arsalan wrote.

enter image description here

German Dominik L Replied 4 weeks ago

If someone can help me with that, it would be awesome

German Dominik L Replied 2 months ago

thanks! i will try! :)

Indonesian Arsalan Shah Replied 2 months ago

I think chatgpt didn't know this so far. 😂😂😂😂😂

You can do that by

  1. Adding a box
  2. User can click on box to edit
  3. JS used to send request on server where $user->data->someshortbio is save(); saved
  4. If $user->someshortbio() exists simply show it

I can not write a component.