Hora posterior en un formulario

[Cota_Isla]

Buenas,
estoy aquí intentando hacer un script con la intención de que cuando yo en un formulario introduzca una hora en un input de tipo time (que será una hora de inicio) en otro input (que será la hora de fin) el valor de este ultimo sea la hora de inicio mas 30 minutos. He intentado hacer lo siguiente pero debe tener fallos:

<script languaje="javascript">
function hora (form)
{
var hora = form.ini_grupo.value;
var x1 = hora.substring(0,2);
var x2 = hora.substring(2,5);
x2 = x2 + 30;
if(x2>60)
{
x2=x2-60;
x1++;
}
var h = x1.toString() + ":" + x2.toString();
form.fin_grupo.value = h;
}
</script>

Lo que intento buscar con esto es que cuando un usuario introduzca una hora la hora de fin sea siempre posterior.
Si a alguien se le ocurre otra forma de realizar esto que intento me sería bastante util.
Los inputs son los siguientes:

<b>Hora de inicio:</b>
<br>
<input type="time" name="ini_grupo" value="12:00" onfocus="hora(this.form)" required>
<br>
<b>Hora de finalizacion:</b>
<br>
<input type="time" name="fin_grupo" required>

*Nota: el codigo es javascript pero mi aplicación esta escrita en php.
Un saludo y gracias!