diff --git a/src/index.ts b/src/index.ts index 4c6cf44..a63fa65 100644 --- a/src/index.ts +++ b/src/index.ts @@ -5,6 +5,16 @@ import { import { ICommandPalette, MainAreaWidget } from '@jupyterlab/apputils'; import { Widget } from '@lumino/widgets'; + +interface APODResponse { + copyright: string; + date: string; + explanation: string; + media_type: 'video' | 'image'; + title: string; + url: string; +}; + /** * Initialization data for the jupyterlab_apod extension. */ @@ -13,30 +23,54 @@ const plugin: JupyterFrontEndPlugin = { description: 'A JupyterLab extension.', autoStart: true, requires: [ICommandPalette], - activate: (app: JupyterFrontEnd, palette: ICommandPalette) => { + activate: async (app: JupyterFrontEnd, palette: ICommandPalette) => { console.log('JupyterLab extension jupyterlab_apod is activated!'); // Define a widget creator function, // then call it to make a new widget - const newWidget = () => { + const newWidget = async () => { // Create a blank content widget inside of a MainAreaWidget const content = new Widget(); const widget = new MainAreaWidget({ content }); widget.id = 'apod-jupyterlab'; widget.title.label = 'Astronomy Picture'; widget.title.closable = true; + + // Add an image element to the content + let img = document.createElement('img'); + content.node.appendChild(img); + + // Get a random date string in YYYY-MM-DD format + function randomDate() { + const start = new Date(2010, 1, 1); + const end = new Date(); + const randomDate = new Date(start.getTime() + Math.random()*(end.getTime() - start.getTime())); + return randomDate.toISOString().slice(0, 10); + } + + // Fetch info about a random picture + const response = await fetch(`https://api.nasa.gov/planetary/apod?api_key=DEMO_KEY&date=${randomDate()}`); + const data = await response.json() as APODResponse; + + if (data.media_type === 'image') { + // Populate the image + img.src = data.url; + img.title = data.title; + } else { + console.log('Random APOD was not a picture.'); + } return widget; } - let widget = newWidget(); + let widget = await newWidget(); // Add an application command const command: string = 'apod:open'; app.commands.addCommand(command, { label: 'Random Astronomy Picture', - execute: () => { + execute: async () => { // Regenerate the widget if disposed if (widget.isDisposed) { - widget = newWidget(); + widget = await newWidget(); } if (!widget.isAttached) { // Attach the widget to the main work area if it's not there