ClockPicker with Bootstrap

<!DOCTYPE html>
<html>

<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <link rel="stylesheet" href="http://weareoutman.github.io/clockpicker/dist/bootstrap-clockpicker.min.css">
    <link rel="stylesheet" href="style.css">
    <script src="http://code.jquery.com/jquery-2.2.0.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <script src="http://weareoutman.github.io/clockpicker/dist/bootstrap-clockpicker.min.js"></script>
</head>

<body>
    <div class="input-group clock">
        <input type="text" class="form-control" value="" placeholder="Ahora">
        <span class="input-group-addon">
            <span class="glyphicon glyphicon-time"></span>
        </span>
    </div>
    
    <script src="script.js"></script>
    
</body>

</html>

var $input = $('.clock').clockpicker({
    default:          'now',
    placement:        'bottom', 
    align:            'left',
    donetext:         'Listo',
    autoclose:        false,
    vibrate:          true,
    fromnow:          0,
    init:             function () { console.log('iniciado') },
    beforeShow:       function () { console.log('antes de mostrarse') },
    afterShow:        function () { console.log('después de mostrarse') },
    beforeHide:       function () { console.log('antes de ocultarse') },
    afterHide:        function () { console.log('después de ocultarse') },
    beforeHourSelect: function () { console.log('antes de seleccionar la hora') },
    afterHourSelect:  function () { console.log('después de seleccionar la hora') },
    beforeDone:       function () { console.log('antes de finalizar') },
    afterDone:        function () { console.log('después de finalizar') }
});

$input.clockpicker('show');

html, body {
    height: 100%;
}

body {
    background-color: darkseagreen;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
}

.clock {
    max-width: 160px;
    margin-top: 2em;
    padding: 1em;
}

.clock input,
.clock span {
    border-color: #999;
}