Add minutes to the hour

Question

I have a code that adds an hour or more in the hour field, I would now like to add in minutes as well. That is, if the movement of minutes is equal to 30, add another 30 min.

var decalage = +1
var decalage_minute = 30

var d = new Date(); //date

//convert date timestamp
function heure_decalage_f(date, decalage){
    var data = new Date(date.getTime() + (decalage * 60 * 60 * 1e3));
    return data.getHours();
}

var heure_decalage = heure_decalage_f(d,decalage);

var minute = d.getMinutes();
var seconds = d.getSeconds();

alert(heure_decalage + ":" + minute);

Example

Answer 1

You have to do the same for the minutes you made for the hours:

var decalage        = +1
var decalage_minute = 50

var d = new Date( ); //date

//convert date timestamp
function decalage_f( date, decalage, decalage_minute )
{
    var data = new Date( date.getTime( ) + ( decalage * 60 * 60 * 1e3) + ( decalage_minute * 60 * 1e3 ));
    return data;
}

var data = decalage_f ( d, decalage , decalage_minute );

alert( data.getHours( )  + ":" + data.getMinutes( ) );

Example

Answer 2

I simplified your code a little bit.

Follows a possible solution:

var decalage = 1
var decalage_minute = 30

var d = new Date(); //date
d.setHours(d.getHours()+decalage, d.getMinutes()+decalage_minute);

alert(d.getHours() + ":" + d.getMinutes());

In this case the most important point, as you implied, is the addition of hours and minutes on the current date/time.

Follows below the code using function:

var decalage = 1
var decalage_minute = 30

var d = new Date();

function heure_decalage_f(umaData, horas, minutos){
    umaData.setHours(umaData.getHours()+horas, umaData.getMinutes()+minutos);
    return umaData;
}

var dataHoraAtualizada = heure_decalage_f(d, decalage, decalage_minute);

alert(dataHoraAtualizada.getHours() + ":" + dataHoraAtualizada.getMinutes());

Answer 3

I think you could simplify your logic a little bit, so you could even include other fields more easily (like days or seconds).

$(function () {   
  $(document).foundation();
  
  var inputs = {};
  inputs.dias = document.getElementById("dias");
  inputs.horas = document.getElementById("horas");
  inputs.minutos = document.getElementById("minutos");
  inputs.segundos = document.getElementById("segundos");
  inputs.deslocacao = document.getElementById("deslocacao");

  var getValue = function (input) {
    var value = parseInt(input.value);
    if (!Number.isInteger(value)) 
      value = 0;
    return value;
  }

  var setData = function () {          
    var datatime = new Date();
    datatime.setDate(datatime.getDate() + getValue(inputs.dias));
    datatime.setHours(datatime.getHours() + getValue(inputs.horas));
    datatime.setMinutes(datatime.getMinutes() + getValue(inputs.minutos));
    datatime.setSeconds(datatime.getSeconds() + getValue(inputs.segundos));

    var data = datatime.toISOString();
    data = data.substring(0, data.length - 5);

    inputs.deslocacao.value = data;
  }

  setData();    
  window.setInterval(setData, 100);
  
});

<link href="http://cdn.foundation5.zurb.com/foundation.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.foundation5.zurb.com/foundation.js"></script>
<fieldset>
  <div class="row collapse">
    <div class="small-2 columns">
      <label for="dias" class="prefix">Dias</span>
    </div>
    <div class="small-10 columns">
      <input id="dias" type="number" />
    </div>    
  </div>
  <div class="row collapse">
    <div class="small-2 columns">
      <label for="horas" class="prefix">Horas</span>
    </div>
    <div class="small-10 columns">
      <input id="horas" type="number" />
    </div>    
  </div>
  <div class="row collapse">
    <div class="small-2 columns">
      <label for="minutos" class="prefix">Minutos</span>
    </div>
    <div class="small-10 columns">
      <input id="minutos" type="number" />
    </div>    
  </div>
  <div class="row collapse">
    <div class="small-2 columns">
      <label for="segundos" class="prefix">Segundos</span>
    </div>
    <div class="small-10 columns">
      <input id="segundos" type="number" />
    </div>    
  </div>
  <div class="row collapse">
    <div class="small-2 columns">
      <label for="deslocacao" class="prefix">Deslocação</span>
    </div>
    <div class="small-10 columns">
      <input id="deslocacao" type="datetime-local" disabled />
    </div> 
  </div>
</fieldset>

Answer 4

The Moment.js is a great tool to work with dates in Javascript. It has several very useful features. Follow some examples with addition.

var now = moment();

console.log(now.calendar());
console.log(now.format('DD MMM YYYY H:mm:ss'));

// Adicionar

// Adiciona 5 dias
console.log(now.add(5, 'day').format('DD MMM YYYY H:mm:ss'));

// Adiciona 3 horas
console.log(now.add(3, 'hour').format('DD MMM YYYY H:mm:ss'));

// Adiciona 5 horas
console.log(now.add(5, 'year').format('DD MMM YYYY H:mm:ss'));

// Adiciona 6 meses
console.log(now.add(6, 'month').format('DD MMM YYYY H:mm:ss'));

var natal = moment('2015-12-25', 'YYYY-MM-DD');

console.log(natal.format('DD/MM/YYYY'))

<script src="http://momentjs.com/downloads/moment.js"></script>

To see the various features see documentation.