Necesito ayuda con formulario php

Hola a todos, les cuento que estoy hace poco en el desarrollo web, y estoy desarrollando una página web donde utilizo semantic ui para todo lo que es su entorno grafico. Resulta que ahora estoy con una parte del desarrollo en la que el usuario registrado suba una fotografía para su perfil (fotografía o logotipo si es una empresa).
El tema es que tengo un formulario en el que tengo un area donde muestro la imagen de perfil, un boton que dice "Elija una foto de perfil" y despues una serie de campos. Ahora bien cuando elijo la foto, me gustaría que se cargara la imagen elegida en el espacio de imagen...
pero no sé por donde arrancar...
si alguien puede darme una mano, se los agradecería mucho...

A continuación les muestro el código donde tengo el contenedor de la imagen y el botón

Código:

---

                    <div class="field">
                      <div class="ui divided items">
                        <div class="item">
                          <div class="ui tiny image">
                            <?php if (isset($usuario)) { ?>
                              <img class="ui middle aligned tiny image" src="../../users/<?php echo $usuario; ?>/<?php echo $foto; ?>">
                            <?php } ?>
                          </div>


                          <div class="middle aligned content">
                            <a class="header"><?php if (isset($usuario)) { echo $usuario; } ?></a>
                          </div>
                      </div>


                      <div class="item">
                        <label for="fotoperfil" class="ui icon button"><i class="user icon"></i>
                          Elegir foto de Perfil
                        </label>
                        <input type="file" id="fotoperfil" name="fotoperfil" style="display: none">
                      </div>
                    </div>
                  </div>

---