Various of additions and changes

[sjehuda]

Fixes #18 #27 #30 #31

I need help with Javascript. See below: #32 (comment)

[sjehuda]

OSX Consideration: Replace Psi by Beagle IM.

Link
https://beagle.im/

Logo
https://raw.githubusercontent.com/tigase/beagle-im/master/BeagleIM/Assets.xcassets/AppIcon.appiconset/IMG_0720_1024.png

[sjehuda]

Fixes #18 #27 #30 #31

I need help with i.css

.img-center {
	display: flex;
	/* FIXME Why margin: auto; is not equal on all sides?
	margin-right: 8%;
	margin-left: 8%; */
	width: 3%;
}

Using border: solid green shows that it's not a problems with CSS.
The problem is in Javascript, it appears.

I don't see what's wrog but my guess is that it has to do with the function function load_clients(url) which uses XMLHttpRequest and maybe too fast for the elements to properly place themselves, or I'm not doing something correctly.

	function show_clients(client_array) {
		var list = document.getElementById('client_list');
		for (var id = 0; id < client_array.length; id++) {
			var item = document.createElement('span');
			item.innerHTML = client_array[id];
			list.appendChild(item);
		}
	}

<p class="lead img-center text-center" id="client_list">
 <span>
  <a href="https://play.google.com/store/apps/details?id=org.yaxim.androidclient">
  <img src="assets/yaxim.svg" height="60">
  yaxim
  </a>
 </span>
 <span>
  <a href="https://play.google.com/store/apps/details?id=eu.siacs.conversations">
  <img src="assets/conversations.svg" height="60">
  Conversations
  </a>
 </span>
 <span>
  <a href="https://play.google.com/store/apps/details?id=com.xabber.android.beta">
  <img src="assets/xabber.svg" height="60">
  Xabber
  </a>
 </span>
 <span>
  <a href="https://play.google.com/store/apps/details?id=org.yaxim.bruno">
  <img src="assets/bruno.png" height="60">
  Bruno
  </a>
 </span>
 <span>
  <a href="https://play.google.com/store/apps/details?id=org.snikket.android">
  <img src="assets/snikket.svg" height="60">
  Snikket
  </a>
 </span>
</p>

I've changed list.appendChild(item); by list.append(item) and list.prepend(item) and it didn't change anything.

Video: https://user-images.githubusercontent.com/19249089/169046658-78d97e41-52f4-4015-93ba-d80f24c1f54f.mp4

[Echolon]

@sjehuda Thanks for putting work into this.

One thing additional note: We have started using DOAP files (see the the respective XEP) to display clients here https://xmpp.org/software/clients/

Maybe this helps your approach. Perhaps, this also triggers your interest to support at other corners of the network! It would be highly apprecitated! Let me know.

[sjehuda]

We have started using DOAP files

XML! Just as I like it!
You've a business with an XML fan, who has very recently ported New Feed Preview feature into a Userscript ;)
Can you refer me to example code?

Maybe this helps your approach. Perhaps, this also triggers your interest to support at other corners of the network! It would be highly apprecitated! Let me know.

I'm all for it! XMPP has served me for over a decade.
I'd be more than glad to give something (or things) back!

Btw, @Echolon can you refer a JS savvy to this ticket. I realy want to remove the Draft tag from this PR and make it ready. I'll take care of DOAP just after we done with this PR.

e: test link https://yax.im/i/#[email protected]?join

[Echolon]

@sjehuda Alright, feel free to join [email protected] to have a chat.

Find the website shortcode here:
https://github.com/xsf/xmpp.org/blob/master/themes/xmpp.org/layouts/shortcodes/software-list-doap.html

[sjehuda]

Marked pull request as ready for review.
Special thank you to @asdofindia who has provided this solution within an hour after my public call for help.
Also, thank you to @horazont of search.jabber.network who has referred me to this project upon my request.

[sjehuda]

This PR is ready.
Next step. convert JSON files into DOAP (XML) files. Each client has its own file DOAP file.

[ge0rg]

Thank you very much, I've slightly-squashed, reordered and merged this PR in c035b7d.

[sjehuda]

Thank you, George! You're awesome, bro!