reversa paginas

parent 92a9c307
...@@ -11,43 +11,73 @@ ...@@ -11,43 +11,73 @@
<meta content="Cristian Diaz" name="author" /> <meta content="Cristian Diaz" name="author" />
<!-- ================== BEGIN BASE CSS STYLE ================== --> <!-- ================== BEGIN BASE CSS STYLE ================== -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> <link href="{{ asset('backend/plugins/jquery-ui/themes/base/minified/jquery-ui.min.css')}}" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <link href="{{ asset('backend/plugins/bootstrap/css/bootstrap.min.css')}}" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <link href="{{ asset('backend/plugins/font-awesome/css/font-awesome.min.css')}}" rel="stylesheet" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> <link href="{{ asset('frontend/css/landing.css')}}" rel="stylesheet" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat">
<!-- ================== END BASE CSS STYLE ================== --> <!-- ================== END BASE CSS STYLE ================== -->
<link href="https://fonts.googleapis.com/css?family=Rubik:300,400,500,500i,700,900" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/css/bootstrap-select.min.css" rel="stylesheet"/>
{% block stylesheets %} {% block stylesheets %}
{% endblock %} {% endblock %}
<!-- ================== BEGIN BASE JS ================== --> <!-- ================== BEGIN BASE JS ================== -->
<!-- ================== END BASE JS ================== --> <script src="{{ asset('backend/plugins/pace/pace.min.js')}}"></script>
<!-- ================== END BASE JS ================== -->
{% block head %} {% block head %}
{% endblock %} {% endblock %}
</head> </head>
<!-- end #header -->
<body> <body>
<!-- end #header -->
<!-- end #sidebar -->
<!-- begin #content --> <!-- begin #content -->
<div class="container-fluid">
<div id="content" class="content">
{% block body %} {% block body %}
{% endblock %} {% endblock %}
</div> </div>
<!-- end #content -->
<!-- end page container -->
<!-- ================== BEGIN BASE JS ================== --> <!-- ================== BEGIN BASE JS ================== -->
<script src="{{ asset('backend/plugins/jquery/jquery-1.9.1.min.js')}}"></script> <script src="{{ asset('backend/plugins/jquery/jquery-1.9.1.min.js')}}"></script>
<script src="{{ asset('backend/plugins/jquery/jquery-migrate-1.1.0.min.js')}}"></script>
<script src="{{ asset('backend/plugins/jquery-ui/ui/minified/jquery-ui.min.js')}}"></script>
<script src="{{ asset('backend/plugins/bootstrap/js/bootstrap.min.js')}}"></script>
<!--[if lt IE 9]>
<script src="{{ asset('backend/crossbrowserjs/html5shiv.js')}}"></script>
<script src="{{ asset('backend/crossbrowserjs/respond.min.js')}}"></script>
<script src="{{ asset('backend/crossbrowserjs/excanvas.min.js')}}"></script>
<![endif]-->
<script src="{{ asset('backend/plugins/slimscroll/jquery.slimscroll.min.js')}}"></script>
<script src="{{ asset('backend/plugins/jquery-cookie/jquery.cookie.js')}}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/js/bootstrap-select.min.js"></script>
<!-- ================== END BASE JS ================== --> <!-- ================== END BASE JS ================== -->
<!-- ================== BEGIN PAGE LEVEL JS ================== --> <!-- ================== BEGIN PAGE LEVEL JS ================== -->
<script src="{{ asset('backend/js/apps.js')}}"></script>
{% block javascripts %} {% block javascripts %}
{% endblock %} {% endblock %}
<!-- ================== END PAGE LEVEL JS ================== --> <!-- ================== END PAGE LEVEL JS ================== -->
{% block jsApp %} {% block jsApp %}
<script>
$(document).ready(function () {
App.init();
});
</script>
{% endblock %} {% endblock %}
</body> </body>
{% block docready %}
{% endblock %}
</html> </html>
\ No newline at end of file
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
<div id="tomarFotoContainer" style="display:none"> <div id="tomarFotoContainer" style="display:none">
<div class="form-group"> <div class="form-group">
<div id="cameraContainer" class="camera" style="display: block"> <div id="cameraContainer" class="camera" style="display: block">
<video id="video" width="600" height="315">No se encuentra disponible una camara</video> <video id="video" width="320" height="240">No se encuentra disponible una camara</video>
<button id="startbutton">Tomar Foto</button> <button id="startbutton">Tomar Foto</button>
</div> </div>
</div> </div>
......
...@@ -26,57 +26,92 @@ ...@@ -26,57 +26,92 @@
{% endblock %} {% endblock %}
{% block body %} {% block body %}
<div class="row"> <div class="row">
<div class="col-md-12" id="title"> {{ include('producto/includes/alert.messages.html.twig') }}
&nbsp;
</div> </div>
<div class="row">
<div class="panel-body">
<h2>COMIENZA TU TRATAMIENTO CON INOVAGE</h2>
</div> </div>
<br><br><br>
<div class="row" id="foto" align="center">
<div class="col-md-6 col-xs-12">
<div id="foto_anterior"><img width="100%" height="100%" src="{{urlSitio}}nutrapharm/get/photo?file_name={{idp}}.{{extInicial}}"/></div><br>
<p align="center"><button id="btn-ant" class="btn btn-lg btn-warning">FOTO ANTERIOR</button></p>
</div> </div>
<div class="col-md-6 col-xs-12"> <div class="row">
<div id="foto_siguiente"></div><br> <div class="col-lg-12">
<p align="center"><button id="btn-sig" class="btn btn-lg btn-warning">TOMAR FOTO</button></p> <label>Esta es la foto que te tomaste al iniciar el tratamiento</label>
</div> </div>
</div> </div>
<br><br><br><br><br><br><br><br><br>
{#<div class="row">
<div class="col-md-12">
<div class="row"> <div class="row">
<div class="col-md-3 col-xs-12"> <div class="col-lg-12">
<img width="200" height="auto" src="{{urlSitio}}nutrapharm/get/photo?file_name={{idp}}.{{extInicial}}" />
</div> </div>
<div class="col-md-6 col-xs-12">
<h3 align="center">Tú Experiencia</h3>
<textarea id="comentario" class="form-control" cols="20" rows="4"></textarea>
</div>
<div class="col-md-3 col-xs-12">
</div> </div>
<div class="row">
<div class="col-lg-12">
<label>Ahora queremos ver cuales han sido los cambios en estos días</label>
</div> </div>
</div> </div>
</div>#}
<br><br>
{#
<div class="row"> <div class="row">
<div class="col-md-12" align="center"> <div class="panel-body">
<a href="#" target="_blank"><img src={{asset("nutrapharm/img/fb.png")}} height="50" width="50"></a> <label class="col-md-12 control-label">Toma una foto con tu cámara aquí</label>
&nbsp; <div class="col-md-12">
<a href="#" target="_blank"><img src="img/ig.png" height="50" width="50"></a> <button id="tomarFoto" name="tomarFoto" onclick="mostrarTomarFoto(event)">Tomar Foto</button>
</div>
<label class="col-md-12 control-label">Subo una foto desde tu galería o desde tu PC</label>
<div class="col-md-12">
<button id="subirFoto" name="subirFoto" onclick="mostrarSubirFoto(event)">Subir Foto</button>
</div>
<div class="col-md-12">
<div id="tomarFotoContainer" style="display:none">
<div class="form-group">
<div id="cameraContainer" class="camera" style="display: block">
<video id="video" width="600" height="315">No se encuentra disponible una camara</video>
<button id="startbutton">Tomar Foto</button>
</div>
</div>
<div class="form-group">
<canvas id="canvas" width="auto" height="auto">
</canvas>
<div class="output">
<img id="photo" width="auto" height="auto" alt="Foto Tomada" src="">
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div id="subirFotoContainer" style="display:none">
<div class="form-group">
<input type='file' id="imgInp" accept="image/*" />
<img id="imagenUsuario" width="200" height="auto" style="display:none" src="#" alt="Imagen subida" />
</div>
</div>
</div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-12" align="center"> <div class="col-lg-12">
<span class="titulo">COMPARTE con el hashtag</span><br> <div id="containerFormulario" style="display:none">
<span class="subtitulo">#selfietestinovage</span> <div class="panel-body">
<div class="form-group">
<label class="col-md-12 control-label"> Escribe un comentario de como va el tratamiento</label>
<div class="col-md-12">
<input id="comentarioFotoUsuario" type="textarea" placeholder="Comentario..."/>
</div>
</div>
</div>
<div class="panel-body">
<div class="form-group">
<div class="col-md-12">
<button id="btnGuardar">Guardar</button>
</div>
</div>
<div id="mensaje-nutrapharm" style="display:none" class="alert alert-success" role="alert"></div>
</div>
</div>
</div> </div>
</div> </div>
#}
<br><br>
</div>
{% endblock %} {% endblock %}
{% block javascripts %} {% block javascripts %}
{#<script src="{{asset('frontend/js/capture.js')}}"></script>#} <script src="{{asset('frontend/js/capture.js')}}"></script>
<script> <script>
var imagenSubida = false; var imagenSubida = false;
var imagenTomada = false; var imagenTomada = false;
......
...@@ -23,17 +23,17 @@ ...@@ -23,17 +23,17 @@
video = document.getElementById('video'); video = document.getElementById('video');
canvas = document.getElementById('canvas'); canvas = document.getElementById('canvas');
photo = document.getElementById('photo'); photo = document.getElementById('photo');
startbutton = document.getElementById('startbutton'); startbutton = document.getElementById('btn-sig');
var video_constraints = {mandatory: { var video_constraints = {mandatory: {
maxWidth: 320, maxWidth: 320,
maxHeight: 240, maxHeight: 240,
maxAspectRatio: 4 / 3, maxAspectRatio: 4 / 3,
maxFrameRate: 60 //minWidth: 1280, minHeight: 720, minFrameRate: 30
}, },
optional: [] optional: []
}; };
navigator.mediaDevices.getUserMedia({video: true, audio: false}) //navigator.mediaDevices.getUserMedia({video: true, audio: false})
//navigator.mediaDevices.getUserMedia({video:video_constraints, audio: false}) navigator.mediaDevices.getUserMedia({video:video_constraints, audio: false})
.then(function (stream) { .then(function (stream) {
video.srcObject = stream; video.srcObject = stream;
video.play(); video.play();
...@@ -66,11 +66,17 @@ ...@@ -66,11 +66,17 @@
ev.preventDefault(); ev.preventDefault();
showForm(); showForm();
hidePhotoButtons(); hidePhotoButtons();
showTakenImage();
}, false); }, false);
clearphoto(); clearphoto();
} }
function showTakenImage(){
$("#output_foto_tomada").show();
}
// Fill the photo with an indication that none has been // Fill the photo with an indication that none has been
// captured. // captured.
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment