project/resources/views/create/step3.blade.php

@extends('create.base')

@section('content')
  <div class="ui indicating progress" id="progress">
    <div class="bar">
      <div class="progress"></div>
    </div>
    <div class="label">
    </div>
  </div>
@endsection

@push('scripts')
  <script type="text/javascript">
    let project = {
      progress: '#progress',
      bar: null,
      setup: function() {
        this.bar = $(this.progress)
        this.bar.progress()
        this.start()
      },
      advanceProgress: function(percent, Total, length, start) {
        start = (typeof start === 'undefined') ? 0 : start
        let p = (percent / Total) * 100 * length / 100 + start
        this.bar.progress('set percent', p)
      },
      buildXHR: function(length, start) {
        start = (typeof start === 'undefined') ? 0 : start
        let xhr = new window.XMLHttpRequest()
        xhr.upload.addEventListener('progress', (e) => {
          if (e.lengthComputable) {
            this.advanceProgress(e.loaded, e.total, 2, start)
          }
        }, false)
        xhr.addEventListener('progress', (e) => {
          if (e.lengthComputable) {
            this.advanceProgress(e.loaded, e.total, length - 2, start + 2)
          }
        }, false)
        return xhr
      },
      send: function(messages, url, next, length, start, method, data) {
        this.bar.progress('set label', messages.init)
        method = (typeof method === 'undefined') ? 'GET' : method
        start = (typeof start === 'undefined') ? 0 : start
        let settings = {
          type: method,
          url: url,
          xhr: () => {
            return this.buildXHR(length, start)
          },
          success: (data) => {
            if (data.estado) {
              this.bar.progress('set label', messages.success)
              if (typeof next !== 'undefined' || next !== null) {
                next(start + length)
              }
              return
            }
            this.error(messages.error)
            console.debug(data)
          },
          error: (xhr) => {
            this.error('No se pudo conectar a ' + url + '. ' + xhr.statusText)
          }
        }
        if (method.toLowerCase() == 'post') {
          settings['data'] = data
        }
        return $.ajax(settings)
      },
      start: function() {
        project.send({
          init: 'Creando repo',
          success: 'Repo creado',
          error: 'No se pudo crear repo'
        }, '{{$urls->gitea->url}}/user/repos?token={{$urls->gitea->api_key}}', project.createFolder, 5, 0, 'POST', {
          auto_init: true,
          default_branch: 'master',
          name: '{{$name}}'
        })
      }, // 5
      createFolder: function(start) {
        project.send({
          init: 'Creando carpeta principal',
          success: 'Carpeta principal creada',
          error: 'No se pudo crear la carpeta principal.'
        }, '{{$urls->api}}/create/{{$name}}/folder', project.createSubfolders, 5, start)
      }
      createSubfolders: function(start) {
        project.send({
          init: 'Creando subcarpetas',
          success: 'Subcarpetas creadas',
          error: 'No se pudo crear las subcarpetas'
        }, '{{$urls->api}}/create/{{$name}}/subfolders', project.gitInit, 5, start)
      }, // 5 + 5: 10
      gitInit: function(start) {
        project.send({
          init: 'Iniciando Git',
          success: 'Git iniciado',
          error: 'No se pudo iniciar Git'
        }, '{{$urls->api}}/create/{{$name}}/git/init', project.addComposer, 5, start)
      }, // 10 + 5: 15
      addComposer: function(start) {
        project.send({
          init: 'Agregando e instalando Composer',
          success: 'Composer instalado',
          error: 'No se pudo instalar composer'
        }, '{{$urls->api}}/create/{{$name}}/composer', project.addFiles, 10, start, 'POST', {composer: {!!json_encode($composer)!!}})
      }, // 15 + 10: 25
      addFiles: function(start) {
        project.send({
          init: 'Creando archivos',
          success: 'Archivos creados',
          error: 'No se pudo crear los archivos'
        }, '{{$urls->api}}/create/{{$name}}/files', project.gitPush, 65, start)
      }, // 25 + 65: 90
      gitPush: function(start) {
        project.send({
          init: 'Git Push',
          success: 'Proyecto listo y en repo',
          error: 'No se pudo subir el proyecto al repo'
        }, '{{$urls->api}}/create/{{$name}}/git/push', null, 10, start).then(() => {
          project.end()
        })
      }, // 90 + 10: 100
      end: function() {
        window.location = '{{$urls->base}}'
        return
      },
      error: function(msg) {
        this.bar.progress('set error', 'Se ha producido un error. ' + msg)
      }
    }
    $(document).ready(() => {
      project.setup()
    })
  </script>
@endpush