Ayuda con JS y eventListeners

Buenas! El otro día hice una pequeña basura de la que no me siento muy orgulloso (era para clase y lo hice deprisa y sin pararme a pensarlo), así que me ha dado por mejorar el código un poco.

El primer código es este: -
El código que estoy haciendo ahora: https://jsfiddle.net/cc82etxc/1/

Es una pequeña página en la que introduces el nombre de una figura geométrica (cuadrado, círculo, rectángulo o triángulo) y te calcula su área a partir de los parámetros que introduzcas.

El problema que tengo es que no termino de entender como hacer que el botón me sirva para recoger el dato introducido cuando quiero.
Para el ejercicio de clase conseguí salir del paso haciendo esta burrada:

function calcularTriangulo() {
    reiniciarInput();
    boton.addEventListener('click', function(){recogerBaseTriangulo()});
    var resultado = document.getElementById('resultado');

titulo.textContent = "Triángulo";
subtitulo.textContent = "Introduce base";

function recogerBaseTriangulo() {
	var base = campo.value;
	if (comprobarNumero(base)) {
    	subtitulo.textContent = "Introduce altura";
    	boton.addEventListener('click', function(){recogerAlturaTriangulo(base)});
    }
}

function recogerAlturaTriangulo(base) {
	var altura = campo.value;

	if (comprobarNumero(altura)) {
		reiniciarInput();
		calcularAreaTriangulo(base, altura);
	}
	
}

function calcularAreaTriangulo(base, altura) {
	subtitulo.textContent = altura;
	var area = (base * altura) / 2;

	mostrarResultado(area);
}
}

Básicamente hice una función para cada dato que tenía que enviar, y en cada función cambiaba la función a la que llamaba el botón al clicarlo.

Ahora, para mejorarlo y dejarlo más claro, me gustaría hacer una única función que recoja el dato que sea, (base, altura, radio... lo que sea) en vez de tener 40 funciones diferentes.

El problema que tengo es que no se como funciona el listener, asi que no consigo sacar nada claro

function introduceCircle() {
    var radius;

button.removeEventListener('click', function(){introduceShape()});

title.textContent = "Circle";
subtitle.textContent = "Introduce radius";

radius = button.addEventListener('click', function(){introduceShapeParameter()});

}

function introduceShapeParameter() {
    var parameter = field.value;

if (checkParameter(parameter)) {
    return parameter;
}
return -1;
}

Hay alguna forma de hacer esto? Es decir, que recoja el dato devuelve la función cuando clico en el botón

 radius = button.addEventListener('click', function(){introduceShapeParameter()});

No se si he conseguido explicar muy bien lo que quiero hacer. Soy novato en esto y soy consciente de que ambos códigos son una mierda.

Gracias por la ayuda!