LenderShareAPI

TypeScript : Typage statique, formulaire HTML et import dynamique du module.

interface ShareData {
  title: string;
  text: string;
  url: string;
  image: "logo.png";
}

document.addEventListener('DOMContentLoaded', () => {
  const titleInput = document.getElementById('title') as HTMLInputElement;
  const textInput = document.getElementById('text') as HTMLInputElement;
  const urlInput = document.getElementById('url') as HTMLInputElement;
  const shareButton = document.getElementById('share') as HTMLButtonElement;

  shareButton.addEventListener('click', async () => {
    const { LenderShareAPI } = await import('https://lendershareapi.pages.dev/LenderShareAPI.js');
    LenderShareAPI.share({
      title: titleInput.value,
      text: textInput.value,
      url: urlInput.value,
      image: "logo.png"
    });
  });
});

    

Brython (Python) : Python dans le navigateur via Brython, import dynamique LenderShareAPI.

<script src="https://brython.info/src/brython.js"></script>
<script type="text/python">
from browser import document, window

def share():
    window.import('https://lendershareapi.pages.dev/LenderShareAPI.js').then(
        lambda module: module.LenderShareAPI.share({
            'title': document['title'].value,
            'text': document['text'].value,
            'url': document['url'].value,
            'image': 'logo.png'
        })
    )
</script>

    

GWT (Java) : Interface formulaire, JSNI pour importer LenderShareAPI et appeler share.

public class ShareEntryPoint implements EntryPoint {
    private native void share(String title, String text, String url) /*-{
        import('https://lendershareapi.pages.dev/LenderShareAPI.js').then(module => {
            module.LenderShareAPI.share({ title: title, text: text, url: url });
        });
    }-*/;

    public void onModuleLoad() {
        TextBox titleBox = new TextBox(); titleBox.setPlaceHolder("Titre");
        TextBox textBox = new TextBox(); textBox.setPlaceHolder("Message");
        TextBox urlBox = new TextBox(); urlBox.setPlaceHolder("URL");
        Button shareButton = new Button("Partager");
        VerticalPanel panel = new VerticalPanel();
        panel.add(titleBox); panel.add(textBox); panel.add(urlBox); panel.add(shareButton);
        RootPanel.get().add(panel);

        shareButton.addClickHandler(event -> {
            share(titleBox.getValue(), textBox.getValue(), urlBox.getValue());
        });
    }
}

    

Kotlin/JS : Formulaire HTML, interop JS et import dynamique LenderShareAPI.

import kotlinx.browser.document
import kotlinx.browser.window
import org.w3c.dom.HTMLInputElement
import kotlin.js.Promise

fun main() {
    val titleInput = document.createElement("input") as HTMLInputElement
    titleInput.placeholder = "Titre"
    val textInput = document.createElement("input") as HTMLInputElement
    textInput.placeholder = "Message"
    val urlInput = document.createElement("input") as HTMLInputElement
    urlInput.placeholder = "URL"
    val shareButton = document.createElement("button").apply { textContent = "Partager" }
    val div = document.createElement("div").apply { append(titleInput, textInput, urlInput, shareButton) }
    document.body?.append(div)

    shareButton.addEventListener("click", {
        window.dynamicImport("https://lendershareapi.pages.dev/LenderShareAPI.js").then { module ->
            module.LenderShareAPI.share(jsObject { title = titleInput.value; text = textInput.value; url = urlInput.value })
        }
    })
}

private external fun dynamicImport(url: String): Promise
private fun jsObject(init: dynamic.() -> Unit): dynamic {
    val obj = js("{}")
    init(obj)
    return obj
}

    

Dart Web : Formulaire HTML, import via dart:js et appel share.

import 'dart:html';
import 'dart:js';

void main() {
  var titleInput = InputElement()..placeholder = 'Titre';
  var textInput = InputElement()..placeholder = 'Message';
  var urlInput = InputElement()..placeholder = 'URL';
  var shareButton = ButtonElement()..text = 'Partager';
  document.body!.append(DivElement()..append(titleInput)..append(textInput)..append(urlInput)..append(shareButton));

  shareButton.onClick.listen((_) {
    context.callMethod('import', ['https://lendershareapi.pages.dev/LenderShareAPI.js']).then((module) {
      module['LenderShareAPI'].callMethod('share', [JsObject.jsify({'title': titleInput.value,'text': textInput.value,'url': urlInput.value})]);
    });
  });
}