Skip to content

yotta / pictogram

Go to a project
Commit a00af74b by Arturo Montejo Ráez
Options

deleted unnecessary files

parent e7d6d897
Inline Side-by-side
Showing with 1 additions and 4116 deletions
.gitignore
......@@ -27,6 +27,7 @@ sails/src/node_modules
sails/src/assets/app/bower_components
sails/src/.tmp
sails/config/tmp.sql
android/Pictogrammar/.idea
# Packages #
############
......
android/Pictogrammar/.idea/.name deleted 100644 → 0
Pictogrammar
\ No newline at end of file
android/Pictogrammar/.idea/compiler.xml deleted 100644 → 0
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="CompilerConfiguration">
<option name="DEFAULT_COMPILER" value="Javac" />
<resourceExtensions />
<wildcardResourcePatterns>
<entry name="!?*.java" />
<entry name="!?*.form" />
<entry name="!?*.class" />
<entry name="!?*.groovy" />
<entry name="!?*.scala" />
<entry name="!?*.flex" />
<entry name="!?*.kt" />
<entry name="!?*.clj" />
</wildcardResourcePatterns>
<annotationProcessing>
<profile default="true" name="Default" enabled="false">
<processorPath useClasspath="true" />
</profile>
</annotationProcessing>
</component>
</project>
\ No newline at end of file
android/Pictogrammar/.idea/copyright/profiles_settings.xml deleted 100644 → 0
<component name="CopyrightManager">
<settings default="" />
</component>
\ No newline at end of file
android/Pictogrammar/.idea/encodings.xml deleted 100644 → 0
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="Encoding">
<file url="PROJECT" charset="UTF-8" />
</component>
</project>
\ No newline at end of file
android/Pictogrammar/.idea/gradle.xml deleted 100644 → 0
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="GradleSettings">
<option name="linkedExternalProjectsSettings">
<GradleProjectSettings>
<option name="distributionType" value="LOCAL" />
<option name="externalProjectPath" value="$PROJECT_DIR$" />
<option name="gradleHome" value="C:\Program Files\Android\Android Studio\gradle\gradle-2.4" />
<option name="gradleJvm" value="1.7" />
<option name="modules">
<set>
<option value="$PROJECT_DIR$" />
<option value="$PROJECT_DIR$/app" />
</set>
</option>
</GradleProjectSettings>
</option>
</component>
</project>
\ No newline at end of file
android/Pictogrammar/.idea/misc.xml deleted 100644 → 0
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="EntryPointsManager">
<entry_points version="2.0" />
</component>
<component name="NullableNotNullManager">
<option name="myDefaultNullable" value="android.support.annotation.Nullable" />
<option name="myDefaultNotNull" value="android.support.annotation.NonNull" />
<option name="myNullables">
<value>
<list size="4">
<item index="0" class="java.lang.String" itemvalue="org.jetbrains.annotations.Nullable" />
<item index="1" class="java.lang.String" itemvalue="javax.annotation.Nullable" />
<item index="2" class="java.lang.String" itemvalue="edu.umd.cs.findbugs.annotations.Nullable" />
<item index="3" class="java.lang.String" itemvalue="android.support.annotation.Nullable" />
</list>
</value>
</option>
<option name="myNotNulls">
<value>
<list size="4">
<item index="0" class="java.lang.String" itemvalue="org.jetbrains.annotations.NotNull" />
<item index="1" class="java.lang.String" itemvalue="javax.annotation.Nonnull" />
<item index="2" class="java.lang.String" itemvalue="edu.umd.cs.findbugs.annotations.NonNull" />
<item index="3" class="java.lang.String" itemvalue="android.support.annotation.NonNull" />
</list>
</value>
</option>
</component>
<component name="ProjectLevelVcsManager" settingsEditedManually="false">
<OptionsSetting value="true" id="Add" />
<OptionsSetting value="true" id="Remove" />
<OptionsSetting value="true" id="Checkout" />
<OptionsSetting value="true" id="Update" />
<OptionsSetting value="true" id="Status" />
<OptionsSetting value="true" id="Edit" />
<ConfirmationsSetting value="0" id="Add" />
<ConfirmationsSetting value="0" id="Remove" />
</component>
<component name="ProjectRootManager" version="2" languageLevel="JDK_1_7" assert-keyword="true" jdk-15="true" project-jdk-name="1.7" project-jdk-type="JavaSDK">
<output url="file://$PROJECT_DIR$/build/classes" />
</component>
<component name="ProjectType">
<option name="id" value="Android" />
</component>
<component name="masterDetails">
<states>
<state key="ProjectJDKs.UI">
<settings>
<last-edited>1.7</last-edited>
<splitter-proportions>
<option name="proportions">
<list>
<option value="0.2" />
</list>
</option>
</splitter-proportions>
</settings>
</state>
</states>
</component>
</project>
\ No newline at end of file
android/Pictogrammar/.idea/modules.xml deleted 100644 → 0
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/Pictogrammar.iml" filepath="$PROJECT_DIR$/Pictogrammar.iml" />
<module fileurl="file://$PROJECT_DIR$/app/app.iml" filepath="$PROJECT_DIR$/app/app.iml" />
</modules>
</component>
</project>
\ No newline at end of file
android/Pictogrammar/.idea/runConfigurations.xml deleted 100644 → 0
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="RunConfigurationProducerService">
<option name="ignoredProducers">
<set>
<option value="org.jetbrains.plugins.gradle.execution.test.runner.AllInPackageGradleConfigurationProducer" />
<option value="org.jetbrains.plugins.gradle.execution.test.runner.TestClassGradleConfigurationProducer" />
<option value="org.jetbrains.plugins.gradle.execution.test.runner.TestMethodGradleConfigurationProducer" />
</set>
</option>
</component>
</project>
\ No newline at end of file
android/Pictogrammar/.idea/vcs.xml deleted 100644 → 0
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$/../.." vcs="Git" />
</component>
</project>
\ No newline at end of file
android/Pictogrammar/app/app.iml deleted 100644 → 0
<?xml version="1.0" encoding="UTF-8"?>
<module external.linked.project.id=":app" external.linked.project.path="$MODULE_DIR$" external.root.project.path="$MODULE_DIR$/.." external.system.id="GRADLE" external.system.module.group="Pictogrammar" external.system.module.version="unspecified" type="JAVA_MODULE" version="4">
<component name="FacetManager">
<facet type="android-gradle" name="Android-Gradle">
<configuration>
<option name="GRADLE_PROJECT_PATH" value=":app" />
</configuration>
</facet>
<facet type="android" name="Android">
<configuration>
<option name="SELECTED_BUILD_VARIANT" value="debug" />
<option name="SELECTED_TEST_ARTIFACT" value="_android_test_" />
<option name="ASSEMBLE_TASK_NAME" value="assembleDebug" />
<option name="COMPILE_JAVA_TASK_NAME" value="compileDebugSources" />
<option name="ASSEMBLE_TEST_TASK_NAME" value="assembleDebugAndroidTest" />
<option name="COMPILE_JAVA_TEST_TASK_NAME" value="compileDebugAndroidTestSources" />
<afterSyncTasks>
<task>generateDebugAndroidTestSources</task>
<task>generateDebugSources</task>
</afterSyncTasks>
<option name="ALLOW_USER_CONFIGURATION" value="false" />
<option name="MANIFEST_FILE_RELATIVE_PATH" value="/src/main/AndroidManifest.xml" />
<option name="RES_FOLDER_RELATIVE_PATH" value="/src/main/res" />
<option name="RES_FOLDERS_RELATIVE_PATH" value="file://$MODULE_DIR$/src/main/res" />
<option name="ASSETS_FOLDER_RELATIVE_PATH" value="/src/main/assets" />
</configuration>
</facet>
</component>
<component name="NewModuleRootManager" LANGUAGE_LEVEL="JDK_1_7" inherit-compiler-output="false">
<output url="file://$MODULE_DIR$/build/intermediates/classes/debug" />
<output-test url="file://$MODULE_DIR$/build/intermediates/classes/androidTest/debug" />
<exclude-output />
<content url="file://$MODULE_DIR$">
<sourceFolder url="file://$MODULE_DIR$/build/generated/source/r/debug" isTestSource="false" generated="true" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/source/aidl/debug" isTestSource="false" generated="true" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/source/buildConfig/debug" isTestSource="false" generated="true" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/source/rs/debug" isTestSource="false" generated="true" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/res/rs/debug" type="java-resource" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/res/resValues/debug" type="java-resource" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/source/r/androidTest/debug" isTestSource="true" generated="true" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/source/aidl/androidTest/debug" isTestSource="true" generated="true" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/source/buildConfig/androidTest/debug" isTestSource="true" generated="true" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/source/rs/androidTest/debug" isTestSource="true" generated="true" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/res/rs/androidTest/debug" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/build/generated/res/resValues/androidTest/debug" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/debug/res" type="java-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/debug/resources" type="java-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/debug/assets" type="java-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/debug/aidl" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/debug/java" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/debug/jni" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/debug/rs" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/main/res" type="java-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/main/resources" type="java-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/main/assets" type="java-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/main/aidl" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/main/java" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/main/jni" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/main/rs" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/res" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/resources" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/assets" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/aidl" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/java" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/jni" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/rs" isTestSource="true" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/assets" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/bundles" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/classes" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/coverage-instrumented-classes" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/dependency-cache" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/dex" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/dex-cache" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.android.support/appcompat-v7/21.0.3/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.android.support/support-v4/21.0.3/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.google.android.gms/play-services/6.5.87/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/incremental" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/jacoco" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/javaResources" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/libs" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/lint" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/manifests" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/ndk" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/pre-dexed" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/proguard" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/res" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/rs" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/symbols" />
<excludeFolder url="file://$MODULE_DIR$/build/outputs" />
<excludeFolder url="file://$MODULE_DIR$/build/tmp" />
</content>
<orderEntry type="jdk" jdkName="Android API 21 Platform" jdkType="Android SDK" />
<orderEntry type="sourceFolder" forTests="false" />
<orderEntry type="library" exported="" name="okio-1.3.0" level="project" />
<orderEntry type="library" exported="" name="appcompat-v7-21.0.3" level="project" />
<orderEntry type="library" exported="" name="androidasync-2.1.6" level="project" />
<orderEntry type="library" exported="" name="play-services-6.5.87" level="project" />
<orderEntry type="library" exported="" name="support-annotations-21.0.3" level="project" />
<orderEntry type="library" exported="" name="support-v4-21.0.3" level="project" />
<orderEntry type="library" exported="" name="engine.io-client-0.5.0" level="project" />
<orderEntry type="library" exported="" name="okhttp-ws-2.3.0" level="project" />
<orderEntry type="library" exported="" name="JPGF-1.1" level="project" />
<orderEntry type="library" exported="" name="okhttp-2.3.0" level="project" />
<orderEntry type="library" exported="" name="socket.io-client-0.5.0" level="project" />
</component>
</module>
\ No newline at end of file
sails/src/assets/app/add_student.html deleted 100644 → 0
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pictogram</title>
<!-- CSS de Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<!-- CSS bootstrap toggle -->
<link href="https://gitcdn.github.io/bootstrap-toggle/2.0.0/css/bootstrap-toggle.min.css" rel="stylesheet">
<!-- CSS cropper (recortar imagen) -->
<link href="css/cropper.css" rel="stylesheet">
<!-- CSS propio -->
<link href="css/main.css" rel="stylesheet" media="screen">
<!-- librerías opcionales que activan el soporte de HTML5 para IE8 -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="container">
<!-- Cabecera del Supervisor -->
<nav id="supervisor_header" class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex6-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="students.html"><img src="img/logo_pictogram.png" alt="Pictogram" title="Pictogram" style="height: 70px;" /></a>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex6-collapse">
<div class="nav navbar-nav navbar-right thumbnail img_profile">
<img src="img/dofer.jpg" alt="Supervisor" title="Supervisor" />
</div>
<div class="nav navbar-nav navbar-right navbar-text">
<h4 class="text-right">Fernando Martínez Santiago</h4>
<p class="text-right">
<!-- Botón configuración -->
<a href="setup.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración
</a>
<!-- Botón salir -->
<a href="login.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-log-out" aria-hidden="true"></span> Salir
</a>
</p>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera supervisor -->
<div class="panel panel-default">
<!-- Default panel contents -->
<div class="panel-heading">
<div class="row">
<div class="col-md-6">
<h4>Añadir alumno </h4>
</div>
<div class="col-md-6">
<!-- Buscador de alumnos -->
<form role="search" action="#">
<div class="input-group">
<input type="text" class="form-control" placeholder="Buscar alumnos del centro" name="srch-term" id="srch-term">
<div class="input-group-btn">
<button class="btn btn-default" type="submit">
<span class="glyphicon glyphicon-search"></span>
</button>
</div>
</div>
</form>
<!-- Fin de buscador de alumnos -->
</div>
</div>
</div>
<div class="panel-body">
<div class="row">
<!-- Parte izquierda: Datos personales -->
<div class="col-md-6">
<div id="student_personal_edit">
<form role="form" action="#">
<!-- Cambiar imagen de perfil -->
<div class="form-group">
<h4><span class="glyphicon glyphicon-picture" aria-hidden="true"></span> Fotografía: </h4>
<!-- Input oculto para cargar la redimensión de la imagen (awesome-cropper) -->
<input type='file' id="imgInp" />
<input type="button" id="my-button" value="Insertar imagen" />
</div>
<!-- Fin Cambiar imagen de perfil -->
<!-- Datos personales del alumno -->
<div class="form-group">
<input type="text" class="form-control" id="student_personal_edit_name" placeholder="Nombre" value="" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="student_personal_edit_surname" placeholder="Apellidos" value="" required />
</div>
<div class="form-group">
<input type='date' name='fecha' class="form-control" id="student_personal_edit_birthdate" placeholder="Fecha de nacimiento" required />
</div>
<div class="form-group">
<textarea class="form-control" rows="4" id="student_personal_edit_notes" placeholder="Notas"></textarea>
</div>
<!-- Fin de datos personales del alumno -->
<fieldset>
<legend>Idioma</legend>
<div class="form-group">
<select class="form-control" name="signin_language" id="signin_language">
<option value="ES" selected>Español</option>
<option value="EN">Inglés</option>
</select>
</div>
</fieldset>
</form>
</div>
<!-- Fin de student_personal_edit -->
</div>
<!-- Parte derecha: Tutores y dispositivos -->
<div class="col-md-6">
<div id="student_tutors">
<h4>Tutores</h4>
<!-- Buscador de tutores -->
<p>
<form role="search" action="#">
<div class="input-group">
<input type="text" class="form-control" placeholder="Buscar tutores por dni, teléfono o nombre" name="srch-term-tutor" id="srch-term-tutor">
<div class="input-group-btn">
<button class="btn btn-default" type="submit">
<span class="glyphicon glyphicon-search"></span>
</button>
</div>
</div>
</form>
</p>
<!-- Fin de buscador de tutores -->
<!-- Botón añadir tutor -->
<p class="text-right">
<a href="#" class="btn btn-success btn-sm" role="button" data-toggle="modal" data-target="#add_tutor">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Nuevo tutor
</a>
</p>
<!-- Fin de botón añadir tutor -->
<!-- DIV Modal Añadir tutor -->
<div class="modal fade" id="add_tutor" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!-- Formulario -->
<form role="form" action="#">
<!-- Cabecera modal -->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Cerrar</span></button>
<h4 class="modal-title" id="myModalLabel">Añadir tutor</h4>
</div>
<!-- Fin Cabecera modal -->
<!-- Cuerpo modal -->
<div class="modal-body">
<!-- Imagen de perfil del alumno -->
<div class="thumbnail img_profile">
<img src="img/default.jpg" alt="" title="" />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_name" placeholder="Nombre" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_surname" placeholder="Apellidos" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_address" placeholder="Dirección postal" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_phone" placeholder="Teléfono" required />
</div>
<div class="form-group">
<input type="email" class="form-control" id="signin_email1" placeholder="Email" required />
</div>
<fieldset>
<legend>Contraseña</legend>
<div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="Escribe la contraseña" required />
</div>
<div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="Repite la contraseña" required />
</div>
<fieldset>
<fieldset>
<legend>Idioma</legend>
<div class="form-group">
<select class="form-control" name="signin_language" id="signin_language">
<option value="ES" selected>Español</option>
<option value="EN">Inglés</option>
</select>
</div>
</fieldset>
</div>
<!-- Fin cuerpo modal -->
<!-- Pie modal -->
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
<button type="submit" class="btn btn-primary">Guardar</button>
</div>
<!-- Fin pie modal -->
</form>
</div>
</div>
</div>
<!-- Fin del DIV Modal Añadir tutor -->
<!-- Tutores asignados -->
<ul class="list-group" id="user_tutors">
</ul>
<!-- Fin de Tutores asignados -->
</div>
<!-- Fin de id student-tutors -->
<div id="student_devices">
<h4>Dispositivos</h4>
<!-- Formulario para introducir ID de dispositivo -->
<p>
<form role="search" action="#">
<div class="input-group">
<input type="text" class="form-control" placeholder="ID de dispositivo" name="srch-term-device" id="srch-term-device" required />
<div class="input-group-btn">
<button class="btn btn-success" type="submit">
<span class="glyphicon glyphicon-plus"></span>
</button>
</div>
</div>
</form>
</p>
<!-- Fin del formulario para añadir dispositivo -->
<!-- Dispositivos asignados -->
<ul class="list-group" id="user_devices">
</ul>
<!-- Fin de Dispositivos asignados -->
</div>
<!-- Fin de id student-devices -->
</div>
</div><!-- Fin de row -->
<!-- Parte de abajo: Configuración de los dispositivos -->
<div>
<div class="page-header">
<h2>Configuración dispositivos</h2>
</div>
<form role="form">
<div class="row">
<!-- Pictogramas -->
<fieldset class="col-md-6">
<legend>Pictogramas</legend>
<div class="input-group">
<label>Fondo:
<input id="picto-background" type="color" value="#0000ff" />
</label>
</div>
<div class="radio">
Tamaño:
<label>
<input type="radio" name="device_edit_picto1" id="device_edit_picto1_1" value="" />
Pequeño
</label>
<label>
<input type="radio" name="device_edit_picto1" id="device_edit_picto1_2" value="" checked />
Normal
</label>
<label>
<input type="radio" name="device_edit_picto1" id="device_edit_picto1_3" value="" />
Grande
</label>
</div>
<div class="checkbox">
<label class="student_setup">Leyenda:</label>
<input data-toggle="toggle" data-on="Mostrar" data-off="Ocultar" type="checkbox" name="device_edit_picto2" id="device_edit_picto2" />
<input checked data-toggle="toggle" data-on="Arriba" data-off="Abajo" data-offstyle="warning" type="checkbox" name="device_edit_picto3" id="device_edit_picto3" />
</div>
<div class="checkbox">
<label class="student_setup">Animación:</label>
<input data-toggle="toggle" data-on="Mostrar" data-off="Ocultar" type="checkbox" checked />
</div>
<div class="checkbox">
<label class="student_setup">Categorías:</label>
<input data-toggle="toggle" data-on="Mostrar" data-off="Ocultar" type="checkbox" checked />
</div>
<p>Comportamiento del pictograma al seleccionarlo (sin cinta de frase):</p>
<input checked data-toggle="toggle" data-on="Ampliar" data-off="Marcar" data-offstyle="warning" type="checkbox" name="device_edit_symbol" id="device_edit_symbol" />
</fieldset>
<!-- Colocación en cinta de frase -->
<fieldset class="col-md-3">
<legend>Cinta de frase</legend>
<div class="input-group">
<label>Fondo:
<input id="phrase-background" type="color" value="#ff0000" />
</label>
</div>
<p>Colocar pictogramas en cinta:</p>
<div class="radio">
<label>
<input type="radio" name="device_edit_phrase" id="device_edit_phrase_1" value="" />
Clicar
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="device_edit_phrase" id="device_edit_phrase_2" value="" />
Desplazar pictograma
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="device_edit_phrase" id="device_edit_phrase_3" value="" checked />
Doble click
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="device_edit_phrase" id="device_edit_phrase_4" value="" />
Pulsación larga
</label>
</div>
</fieldset>
<!-- Ajustes de voz -->
<fieldset class="col-md-3">
<legend>Ajustes de voz</legend>
<div class="checkbox">
<label>
<input name="device_edit_sound2" id="device_edit_sound2" data-toggle="toggle" type="checkbox" /> Cada picto habla
</label>
</div>
<div class="checkbox">
<label>
<input name="device_edit_sound3" id="device_edit_sound3" data-toggle="toggle" type="checkbox" /> La frase habla
</label>
</div>
<div class="radio" id="device_edit_sound4">Voz:
<label>
<input type="radio" name="device_edit_sound4" id="device_edit_sound4_1" value="hombre" />
Hombre
</label>
<label>
<input type="radio" name="device_edit_sound4" id="device_edit_sound4_2" value="mujer" />
Mujer
</label>
<label>
<input type="radio" name="device_edit_sound4" id="device_edit_sound4_3" value="niño" checked />
Niño
</label>
</div>
</fieldset>
</div>
<!-- Fin de row -->
</form>
</div>
<!-- Fin de Configuración de los dispositivos -->
</div>
</div>
<!-- Fin de panel -->
</div>
<!-- Fin de container -->
<!-- Librería jQuery requerida por los plugins de JavaScript -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Todos los plugins JavaScript de Bootstrap (también puedes incluir archivos JavaScript individuales de los únicos plugins que utilices) -->
<script src="js/bootstrap.min.js"></script>
<!-- Librería Para los toggle button -->
<script src="https://gitcdn.github.io/bootstrap-toggle/2.0.0/js/bootstrap-toggle.min.js"></script>
<!-- Librería cropper (Recortar imágenes) -->
<script src="js/cropper.js"></script>
<script>
$(document).ready(function () {
/* CAMBIAR IMAGEN DE PERFIL */
// Llamada al botón examinar oculto al hacer clic en el botón de cambiar imagen
$('#my-button').click(function(){
$('#imgInp').click();
});
//var imgsrc = $("#student_profile").attr("src");
//$(".bootstrap-modal-cropper img").attr("src", imgsrc);
var $image = $(".bootstrap-modal-cropper img");
originalData = {};
$("#bootstrap-modal").on("shown.bs.modal", function() {
$image.cropper({
multiple: true,
aspectRatio: 1,
data: originalData,
done: function(data) {
console.log(data);
}
});
});
// Al hacer clic en Guardar de la ventana modal de recortar imagen, que se cambie la imagen y almacene
$('#button_crop').click(function(){
originalData = $image.cropper("getDataURL",{width:100, height:100}, "image/jpeg", 0.8);
//$image.cropper("destroy");
$("#supervisor_profile").attr("src", originalData);
// Cerrar ventana modal
$('#bootstrap-modal').modal("hide");
});
// Imagen subida se carga en la ventana modal
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
//$('#blah').attr('src', e.target.result);
$(".bootstrap-modal-cropper img").attr("src", e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
// Cuando cambia el estado del botón examinar imagen, leer imagen y abrir ventana modal
$("#imgInp").change(function(){
readURL(this);
// Abrir ventana modal para cambiar tamaño de imagen
$('#bootstrap-modal').modal();
});
/* FIN CAMBIAR IMAGEN DE PERFIL */
// Comprobación para mostrar campos o no del formulario de configuración
var checked = $("#device_edit_picto2").prop('checked');
// Y si lo está, se muestra
if(checked) $("#device_edit_picto3").parent().show();
else $("#device_edit_picto3").parent().hide();
// Se comprueba si está marcado
var checked_picto = $("#device_edit_sound2").prop('checked');
// Y se comprueba también el otro de sonido
var checked_phrase = $("#device_edit_sound3").prop('checked');
// Y si no están ambos, no se oculta el control del tipo de voz
if(!checked_picto && !checked_phrase) $("#device_edit_sound4").hide();
else $("#device_edit_sound4").show();
// Eliminar tutor del alumno
$(document).on('click', '.delete_tutor', (function(e) {
e.preventDefault();
// Confirmación para eliminar
var c = confirm("¿Estás seguro de eliminar?");
if (c == true) $(this).parent().remove();
}));
// Añadir tutor a un alumno cuando se envía el formulario
$(document).on('submit', '#add_tutor form', function(e) {
e.preventDefault();
// Obtener nombre y apellidos
var name = $("#add_tutor #signin_name").val();
var surname = $("#add_tutor #signin_surname").val();
// Añadir al final del listado de tutores
$("#user_tutors").append('<li class="list-group-item"><a href="#"><span class="glyphicon glyphicon-user" aria-hidden="true"></span> '+ name +' '+ surname +'</a> <a href="#" class="delete_tutor"><span class="color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></li>');
// Poner en blanco los campos del formulario
$(this).find("input, textarea").val("");
// Ocultar ventana modal
$('#add_tutor').modal('hide');
});
// Eliminar dispositivo del alumno
$(document).on('click', '.delete_device', (function(e) {
e.preventDefault();
// Confirmación para eliminar
var c = confirm("¿Estás seguro de eliminar?");
if (c == true) $(this).parent().remove();
}));
// Añadir dispositivo a un alumno cuando se envía el formulario
$(document).on('submit', '#student_devices form', function(e) {
e.preventDefault();
// Obtener nombre y apellidos
var device_name = $("#student_devices #srch-term-device").val();
// Añadir al final del listado de tutores
$("#user_devices").append('<li class="list-group-item"><span class="glyphicon glyphicon-phone" aria-hidden="true"></span> '+ device_name +' <a href="#" class="delete_device"><span class="color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></li>');
// Poner en blanco los campos del formulario
$(this).find("input, textarea").val("");
});
// Al cambiar el estado de mostrar leyenda, desactivar o activar el siguiente control (mostrar arriba o abajo)
$(document).on('change', '#device_edit_picto2', function() {
// Se comprueba si está marcado
var checked = $(this).prop('checked');
// Y si lo está, se muestra
if(checked) $("#device_edit_picto3").parent().show();
else $("#device_edit_picto3").parent().hide();
});
// Al cambiar el estado picto habla
$(document).on('change', '#device_edit_sound2, #device_edit_sound3', function() {
// Se comprueba si está marcado
var checked_picto = $("#device_edit_sound2").prop('checked');
// Y se comprueba también el otro de sonido
var checked_phrase = $("#device_edit_sound3").prop('checked');
// Y si no están ambos, no se oculta el control del tipo de voz
if(!checked_picto && !checked_phrase) $("#device_edit_sound4").hide();
else $("#device_edit_sound4").show();
});
});
</script>
</body>
</html>
sails/src/assets/app/bower.json~ deleted 100644 → 0
{
"name": "angular-pictogram",
"description": "Client side dashboard in AngularJS",
"version": "0.0.0",
"homepage": "http://scm.ujaen.es/softuno/pictogram.git",
"license": "Private",
"private": true,
"dependencies": {
"angular": "1.3.x",
"angular-mocks": "1.3.x",
"jquery": "~2.1.1",
"bootstrap": "~3.1.1",
"angular-route": "1.3.x",
"jquery-timeago": "1.4.x",
"angular-translate": "~2.6.0",
"angular-translate-loader-static-files": "~2.6.1",
"angular-re-captcha": "~0.2.0",
"angular-bootstrap": "~0.12.1",
"angular-file-upload": "~1.1.5",
"ng-file-upload": "~3.2.4",
"ngImgCrop": "~0.3.2",
"angular-ui-router": "~0.2.13"
}
}
sails/src/assets/app/collections.html deleted 100644 → 0
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pictogram</title>
<!-- CSS de Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<!-- CSS bootstrap toggle -->
<link href="https://gitcdn.github.io/bootstrap-toggle/2.0.0/css/bootstrap-toggle.min.css" rel="stylesheet">
<!-- CSS propio -->
<link href="css/main.css" rel="stylesheet" media="screen">
<!-- librerías opcionales que activan el soporte de HTML5 para IE8 -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="container">
<!-- Cabecera del Supervisor -->
<nav id="supervisor_header"class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex6-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="students.html"><img src="img/logo_pictogram.png" alt="Pictogram" title="Pictogram" style="height: 70px;" /></a>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex6-collapse">
<div class="nav navbar-nav navbar-right thumbnail img_profile">
<img src="img/dofer.jpg" alt="Supervisor" title="Supervisor" />
</div>
<div class="nav navbar-nav navbar-right navbar-text">
<h4 class="text-right">Fernando Martínez Santiago</h4>
<p class="text-right">
<!-- Botón configuración -->
<a href="setup.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración
</a>
<!-- Botón salir -->
<a href="login.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-log-out" aria-hidden="true"></span> Salir
</a>
</p>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera supervisor -->
<!-- Cabecera alumno -->
<nav id="student_header" class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex16-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex16-collapse">
<div class="nav navbar-nav navbar-left thumbnail img_profile">
<img src="img/eladio.jpg" alt="Alumno" title="Alumno" />
</div>
<div class="nav navbar-nav navbar-left navbar-text">
<h4>Eladio Blanco López</h4>
<p>Centro Juan Martos | Método CAA (PECS) | Fase 3</p>
</div>
<div class="nav navbar-nav navbar-right tabs_student">
<ul class="nav nav-tabs">
<li role="presentation" class="active"><a href="collections.html"><span class="glyphicon glyphicon-th" aria-hidden="true"></span> Colecciones</a></li>
<li role="presentation"><a href="instructions.html"><span class="glyphicon glyphicon-tasks" aria-hidden="true"></span> Instrucciones</a></li>
<li role="presentation"><a href="session.html"><span class="glyphicon glyphicon-transfer" aria-hidden="true"></span> Sesión</a></li>
<li role="presentation"><a href="reports.html"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Informes</a></li>
<li role="presentation"><a href="student_setup.html"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración</a></li>
</ul>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera alumno -->
<!-- Pestaña del alumno -->
<div class="panel panel-default student_tab_panel">
<div class="panel-body">
<h2>Pictogramas del alumno</h2>
<div class="row">
<div class="col-md-6">
<!-- Buscador de pictogramas -->
<form role="search" action="#">
<div class="input-group">
<input type="text" class="form-control" placeholder="Buscar pictogramas" name="srch-term-picto" id="srch-term-picto">
<div class="input-group-btn">
<button class="btn btn-default" type="submit">
<span class="glyphicon glyphicon-search"></span>
</button>
</div>
</div>
</form>
</div>
<!-- Fin de columna buscador -->
<div class="col-md-4">
<form>
<div class="checkbox">
<label> <input data-toggle="toggle" type="checkbox" checked> Vista por categorías </label>
</div>
</form>
</div>
<!-- Fin de columna vistas por categorías -->
<div class="col-md-2 text-right">
<a href="#" class="btn btn-success btn-sm" role="button" data-toggle="modal" data-target="#add_picto">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Añadir Picto
</a>
</div>
</div>
<!-- Fin de row -->
<!-- Pictogramas del alumno -->
<div id="student_collection">
<h4 class="category">Acciones</h4>
<!-- Galería de imágenes -->
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\answer.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\ask.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\arrested.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\beat.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\blow.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\boo.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\blame.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\break_1.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="clearfix"></div>
<h4 class="category">Comida</h4>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\buffet.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\calzone.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\carrot_raisin_salad.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\breakfast.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\chips_baked.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\cold_dish.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="clearfix"></div>
<h4 class="category">Objetos</h4>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\back_seat.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\bake_sale.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\award_prizes.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\birth1.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\birthday.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\birthday_2.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\break_work.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\bench.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\business_card.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\brochures.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\celebrations.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\certificate.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\chain.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\choices_picks.png">
<div class="picto_options">
<a class="picto_remove" href="#"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a>
<a class="picto_ok" href="#"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
<a class="picto_tags" href="#" data-toggle="modal" data-target="#picto_tags"><span class="glyphicon glyphicon-tags" aria-hidden="true"></span></a>
<a class="picto_config" href="#" data-toggle="modal" data-target="#picto_config"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span></a>
</div>
</div>
<div class="clearfix"></div>
</div>
<!-- Fin de student_collection -->
</div>
<!-- Fin de panel body -->
</div>
<!-- Fin de panel -->
<!-- DIV Modal Añadir picto -->
<div class="modal " id="add_picto" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<!-- Pestaña del alumno -->
<div class="panel panel-default student_tab_panel">
<div class="panel-body">
<h2>Pictogramas disponibles</h2>
<div class="row">
<div class="col-sm-6 col-xs-8">
<!-- Buscador de pictogramas -->
<form role="search" action="#">
<div class="input-group">
<input type="text" class="form-control" placeholder="Buscar pictogramas" name="srch-term-picto" id="srch-term-picto">
<div class="input-group-btn">
<button class="btn btn-default" type="submit">
<span class="glyphicon glyphicon-search"></span>
</button>
</div>
</div>
<div class="input-group">
<!-- Checkboxes de colecciones -->
<label class="checkbox-inline">
<input type="checkbox" id="checkbox_symbolstx" value="symbolstx" checked /> Symbolstx
</label>
<label class="checkbox-inline">
<input type="checkbox" id="checkbox_propias" value="propias" checked /> Propias
</label>
<label class="checkbox-inline">
<input type="checkbox" id="checkbox_Otras" value="otras" checked /> Otras
</label>
</div>
</form>
</div>
<!-- Fin de columna buscador -->
<div class="col-sm-6 col-xs-4">
<!-- Botones para añadir picto nuevo -->
<button class="btn btn-md" type="submit">
<span class="glyphicon glyphicon-picture"></span>
</button>
<button class="btn btn-md" type="submit">
<span class="glyphicon glyphicon-camera"></span>
</button>
<button class="btn btn-md" type="submit">
<span class="glyphicon glyphicon-pencil"></span>
</button>
</div>
<!-- Fin de columna vistas por categorías -->
</div>
<!-- Fin de row -->
<!-- Panel migas de pan y categorías -->
<div class="panel panel-default" id="bread_and_categories">
<!-- Migas de pan -->
<div class="panel-heading">
<a href="#">
<span class="glyphicon glyphicon-home"></span> Inicio
</a>
</div>
<!-- Categorías -->
<div class="panel-body">
<div class="row">
<div class="col-md-2 col-sm-3 col-xs-4">
<a href="#"><span class="glyphicon glyphicon-folder-close"></span> Acciones</a>
</div>
<div class="col-md-2 col-sm-3 col-xs-4">
<a href="#"><span class="glyphicon glyphicon-folder-close"></span> Comida</a>
</div>
<div class="col-md-2 col-sm-3 col-xs-4">
<a href="#"><span class="glyphicon glyphicon-folder-close"></span> Juguetes</a>
</div>
<div class="col-md-2 col-sm-3 col-xs-4">
<a href="#"><span class="glyphicon glyphicon-folder-close"></span> Herramientas</a>
</div>
<div class="col-md-2 col-sm-3 col-xs-4">
<a href="#"><span class="glyphicon glyphicon-folder-close"></span> Vehículos</a>
</div>
<div class="col-md-2 col-sm-3 col-xs-4">
<a href="#"><span class="glyphicon glyphicon-folder-close"></span> Lugares</a>
</div>
<div class="col-md-2 col-sm-3 col-xs-4">
<a href="#"><span class="glyphicon glyphicon-folder-close"></span> Animales</a>
</div>
<div class="col-md-2 col-sm-3 col-xs-4">
<a href="#"><span class="glyphicon glyphicon-folder-close"></span> Muebles</a>
</div>
<div class="col-md-2 col-sm-3 col-xs-4">
<a href="#"><span class="glyphicon glyphicon-folder-close"></span> General</a>
</div>
</div>
<!-- Fin de categorías -->
</div>
</div>
<!-- Fin del panel migas de pan y categorías -->
<div class="row">
<!-- Pictogramas de la categoría actual -->
<div id="collections" class="col-md-9">
<!-- Galería de imágenes -->
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\answer.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\ask.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\arrested.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\beat.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\blow.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\boo.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\blame.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\actions\break_1.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\buffet.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\calzone.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\carrot_raisin_salad.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\breakfast.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\chips_baked.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\food_drink\cold_dish.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\back_seat.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\bake_sale.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\award_prizes.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\birth1.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\birthday.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\birthday_2.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\break_work.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\bench.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\business_card.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\brochures.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\celebrations.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\certificate.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\chain.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="picto pull-left">
<img src="img/symbolstx/color\png\general\choices_picks.png">
<div class="picto_options">
<a class="picto_info" href="#" data-toggle="modal" data-target="#picto_info"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>
</div>
</div>
<div class="clearfix"></div>
</div>
<!-- Fin de collections -->
<div class="col-md-3">
<div id="pictos_to_add">
<h4 class="text-center">Para añadir</h4>
<div class="clearfix"></div>
<!-- Botón Añadir pictos -->
<p class="text-center">
<a href="#" id="pictos_to_add_button" class="btn btn-success btn-sm" role="button" data-toggle="modal" data-target="#add_picto">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Añadir
</a>
</p>
<!-- Fin botón Añadir pictos -->
</div>
</div>
</div>
</div>
<!-- Fin de row -->
</div>
<!-- Fin de panel body -->
</div>
<!-- Fin de panel -->
</div>
<!-- Fin de modal-content -->
</div>
<!-- Fin de modal-dialog -->
</div>
<!-- Fin de modal Añadir picto -->
<!-- DIV Modal picto_tags -->
<div class="modal fade" id="picto_tags" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!-- Cabecera modal -->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Cerrar</span></button>
<h4 class="modal-title" id="myModalLabel">Etiquetas del pictograma</h4>
</div>
<!-- Fin Cabecera modal -->
<!-- Cuerpo modal -->
<div class="modal-body">
<ul class="list-group">
<li class="list-group-item">
<div id="add_label" class="input-group">
<span class="input-group-addon glyphicon glyphicon-tag" aria-hidden="true"></span>
<input type="text" class="form-control" />
<span class="input-group-btn">
<button class="btn btn-success" type="button">Añadir</button>
</span>
</div>
</li>
<li class="list-group-item">
<p>Generales:</p>
<div class="label label-primary text_sm">
<span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Comida
</div>
<div class="label label-primary text_sm">
<span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Naranja
</div>
</li>
<li class="list-group-item" id="own_labels">
<p>Propias:</p>
<div class="label label-info text_sm">
<span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Premio
<a href="#" class="delete_label">
<span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span>
</a>
</div>
<div class="label label-info text_sm">
<span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Fruta
<a href="#" class="delete_label">
<span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span>
</a>
</div>
</li>
</ul>
</div>
<!-- Fin cuerpo modal -->
</div>
<!-- Fin de modal-content -->
</div>
<!-- Fin de modal-dialog -->
</div>
<!-- Fin de modal picto_tags -->
<!-- DIV Modal picto_config -->
<div class="modal fade" id="picto_config" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!-- Cabecera modal -->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Cerrar</span></button>
<h4 class="modal-title" id="myModalLabel">Configuración del pictograma</h4>
</div>
<!-- Fin Cabecera modal -->
<!-- Cuerpo modal -->
<div class="modal-body">
<ul class="list-group">
<li class="list-group-item">
<p>Expresión:</p>
<!-- Modificable sólo si es el propietario del picto -->
<div class="input-group">
<span class="input-group-addon glyphicon glyphicon-comment" aria-hidden="true"></span>
<input type="text" class="form-control" value="Naranja" />
<span class="input-group-btn">
<button class="btn btn-success" type="button">Guardar</button>
</span>
</div>
</li>
<li class="list-group-item">
<div class="checkbox">
<label><input data-toggle="toggle" type="checkbox" checked> Aumentado</label>
</div>
</li>
<li class="list-group-item">
<div class="checkbox">
<label><input data-toggle="toggle" type="checkbox"> Resaltado con color de fondo</label>
</div>
</li>
<li class="list-group-item">
<div class="checkbox">
<label><input data-toggle="toggle" type="checkbox"> Desactivado</label>
</div>
</li>
</ul>
</div>
<!-- Fin cuerpo modal -->
</div>
<!-- Fin de modal-content -->
</div>
<!-- Fin de modal-dialog -->
</div>
<!-- Fin de modal picto_config -->
<!-- DIV Modal picto_info -->
<div class="modal fade" id="picto_info" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!-- Cabecera modal -->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Cerrar</span></button>
<h4 class="modal-title" id="myModalLabel">Configuración del pictograma</h4>
</div>
<!-- Fin Cabecera modal -->
<!-- Cuerpo modal -->
<div class="modal-body">
<ul class="list-group">
<li class="list-group-item">
<p>Expresión:</p>
<!-- Modificable sólo si es el propietario del picto -->
<div class="input-group">
<span class="input-group-addon glyphicon glyphicon-comment" aria-hidden="true"></span>
<input type="text" class="form-control" value="Naranja" readonly />
<span class="input-group-btn">
<button id="playSound" class="btn btn-primary" type="button"><span class="glyphicon glyphicon-volume-up" aria-hidden="true"></span></button>
</span>
</div>
<audio id="sound">
<source src="sounds/Naranja.mp3" />
</audio>
</li>
<li class="list-group-item">
<p>Etiquetas:</p>
<div class="label label-primary text_sm">
<span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Comida
</div>
<div class="label label-primary text_sm">
<span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Naranja
</div>
</li>
<li class="list-group-item">
<p>Fuente: Symbolstx</p>
</li>
</ul>
</div>
<!-- Fin cuerpo modal -->
</div>
<!-- Fin de modal-content -->
</div>
<!-- Fin de modal-dialog -->
</div>
<!-- Fin de modal picto_info -->
</div>
<!-- Fin de container -->
<!-- Librería jQuery requerida por los plugins de JavaScript -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Librería Para los toggle button -->
<script src="https://gitcdn.github.io/bootstrap-toggle/2.0.0/js/bootstrap-toggle.min.js"></script>
<!-- Todos los plugins JavaScript de Bootstrap (también puedes incluir archivos JavaScript individuales de los únicos plugins que utilices) -->
<script src="js/bootstrap.min.js"></script>
<script>
$(document).ready(function(){
// Hacer editable las celdas al hacer clic
$(".picto_plus").click(function(){
var uri = $(this).parent().parent().children(':first-child').html();
//alert(uri);
// .appendTo('#myList');
});
// Al hacer clic en un picto, que se queden marcadas sus propiedades
/*
$(".picto").hover(
function() {
$(this).children(".picto_options").show();
},
function() {
$(this).children(".picto_options").hide();
}
);
$(document).on("mouseleave", ".picto", function (e) {
// Si no se está seleccionado el picto, que haga el efecto hover
if (!$(e.target).is(".selected")) {
$(this).children(".picto_options").show();
}
});
*/
$(document).on('click', '.picto', function() {
// Se añade la clase selected para que no le afecte el hover
//$(this).addClass("selected");
// Se ocultan todas las opciones abiertas en otros pictos
$(".picto_options").hide();
// Se muestran las opciones de este picto
$(this).children(".picto_options").show();
});
// Eliminar picto al pulsar en X
$(document).on('click', '.picto_remove', function(e) {
e.preventDefault();
// Confirmación para eliminar
var c = confirm("¿Estás seguro de eliminar?");
if (c == true) $(this).parent().parent().remove();
});
// Poner no visible el picto al pulsar en el ojo
$(document).on('click', '.picto_ok', function(e) {
e.preventDefault();
var opacidad = $(this).parent().parent().children("img").css("opacity");
if(opacidad < 1) $(this).parent().parent().children("img").css("opacity", "1");
else $(this).parent().parent().children("img").css("opacity", "0.1");
});
// Añadir picto al listado de añadir al clicar en +
$(document).on('click', '.picto_plus', function(e) {
e.preventDefault();
// Enviar al panel derecho
$(this).parent().parent().appendTo("#pictos_to_add");
// Cambiar símbolo + por -
$(this).replaceWith('<a class="picto_minus" href="#"><span class="glyphicon glyphicon-minus-sign" aria-hidden="true"></span></a>');
});
// Eliminar picto del listado de añadir al clicar en -
$(document).on('click', '.picto_minus', function(e) {
e.preventDefault();
// Enviar al panel izquierdo
$(this).parent().parent().prependTo("#collections");
// Cambiar símbolo - por +
$(this).replaceWith('<a class="picto_plus" href="#"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span></a>');
});
// Reproducir expresión del pictograma al hacer clic en el botón
$(document).on('click', '#playSound', function(e) {
//$("#sound").children(0).src = "sounds/Naranja.mp3";
$("#sound").attr("autoplay" ,true); // Sólo funciona con autoplay a true
$("#sound").load();
});
// Eliminar etiqueta propia de un pictograma
$(document).on('click', '.delete_label', function(e) {
e.preventDefault();
// Eliminar
$(this).parent().remove();
});
// Añadir etiqueta propia a un pictograma
$(document).on('click', '#add_label button', function(e) {
e.preventDefault();
// Obtener texto de la etiqueta
var value = $(this).parent().parent().children("input").val();
$("#own_labels").append('<div class="label label-info text_sm"><span class="glyphicon glyphicon-tag" aria-hidden="true"></span> '+ value +' <a href="#" class="delete_label"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></div>');
});
});
</script>
</html>
sails/src/assets/app/partials/instructions.html deleted 100755 → 0
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pictogram</title>
<!-- CSS de Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<!-- CSS propio -->
<link href="css/main.css" rel="stylesheet" media="screen">
<!-- CSS para el menú contextual -->
<link href="http://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css" type="text/css" rel="stylesheet" />
<!-- librerías opcionales que activan el soporte de HTML5 para IE8 -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="container">
<!-- Cabecera del Supervisor -->
<nav id="supervisor_header"class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex6-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="students.html"><img src="img/logo_pictogram.png" alt="Pictogram" title="Pictogram" style="height: 70px;" /></a>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex6-collapse">
<div class="nav navbar-nav navbar-right thumbnail img_profile">
<img src="img/dofer.jpg" alt="Supervisor" title="Supervisor" />
</div>
<div class="nav navbar-nav navbar-right navbar-text">
<h4 class="text-right">Fernando Martínez Santiago</h4>
<p class="text-right">
<!-- Botón configuración -->
<a href="setup.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración
</a>
<!-- Botón salir -->
<a href="login.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-log-out" aria-hidden="true"></span> Salir
</a>
</p>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera supervisor -->
<!-- Cabecera alumno -->
<nav id="student_header" class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex16-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex16-collapse">
<div class="nav navbar-nav navbar-left thumbnail img_profile">
<img src="img/eladio.jpg" alt="Alumno" title="Alumno" />
</div>
<div class="nav navbar-nav navbar-left navbar-text">
<h4>Eladio Blanco López</h4>
<p>Centro Juan Martos | Método CAA (PECS) | Fase 3</p>
</div>
<div class="nav navbar-nav navbar-right tabs_student">
<ul class="nav nav-tabs">
<li role="presentation"><a href="collections.html"><span class="glyphicon glyphicon-th" aria-hidden="true"></span> Colecciones</a></li>
<li role="presentation" class="active"><a href="instructions.html"><span class="glyphicon glyphicon-tasks" aria-hidden="true"></span> Instrucciones</a></li>
<li role="presentation"><a href="session.html"><span class="glyphicon glyphicon-transfer" aria-hidden="true"></span> Sesión</a></li>
<li role="presentation"><a href="reports.html"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Informes</a></li>
<li role="presentation"><a href="student_setup.html"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración</a></li>
</ul>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera alumno -->
<!-- Pestaña del alumno -->
<div class="panel panel-default student_tab_panel">
<div class="panel-body" id="tables_instructions">
<h2>Métodos</h2>
<!-- Select para añadir método -->
<form role="form" action="#">
<fieldset>
<div class="form-group">
<select class="form-control" name="method_select" id="method_select">
<option value="CAA" selected>Comunicación Aumentativa y Adaptativa (PECS)</option>
<option value="Method2">Método 2</option>
</select>
<!-- Botón añadir método -->
<button type="submit" class="btn btn-success btn-sm"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></button>
</div>
</fieldset>
</form>
<!-- Instrucciones de un método -->
<div class="method_details">
<h4>Comunicación Aumentativa y Adaptativa</h4>
<!-- Tabla método -->
<table class="table_instructions table">
<tr>
<th></th>
<th>Instrucción</th>
<th>Objetivo</th>
<th>Inicio</th>
<th>Fin</th>
<th>Estado</th>
<th></th>
</tr>
<tr>
<td>
<a href="#" data-toggle="modal" data-target="#instruction_details"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<td class="editable"><input type="text" value="Fase 1 - Intercambio físico" /></td>
<td class="editable"><input class="elipsis" type="text" value="En cuanto vea un objeto altamente preferido, el estudiante tomará la imagen del objeto, se acercará hacia el terapeuta y dejará la imagen (fotografía) en la mano del terapeuta. Al hacer esto, el niño inicia un acto comunicativo para obtener un resultado concreto dentro de un contexto social." /></td>
<td class="editable"><input type='date' name='fecha' value='2014-12-05' /></td>
<td class="editable"><input type='date' name='fecha' value='2014-12-09' /></td>
<td class="editable_status">
<span class="color_green text_medium glyphicon glyphicon-check" aria-hidden="true" title="Finalizada"></span>
</td>
<td><a href="#" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td>
</tr>
<tr>
<td>
<a href="#" data-toggle="modal" data-target="#instruction_details"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<td class="editable"><input type="text" value="Fase 2 - Desarrollar la espontaneidad" /></td>
<td class="editable"><input class="elipsis" type="text" value="El estudiante irá a su tablero de comunicación, tomará una fotografía, irá a un adulto y la dejará en su mano!" /></td>
<td class="editable"><input type='date' name='fecha' value='2014-12-08' /></td>
<td class="editable"><input type='date' name='fecha' value='2014-12-10' /></td>
<td class="editable_status">
<span class="color_green text_medium glyphicon glyphicon-check" aria-hidden="true" title="Finalizada"></span>
</td>
<td><a href="#" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td>
</tr>
<tr>
<td>
<a href="#" data-toggle="modal" data-target="#instruction_details"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<td class="editable"><input type="text" value="Fase 3 - Discriminar pictogramas" /></td>
<td class="editable"><input class="elipsis" type="text" value="El estudiante solicitará los objetos deseados yendo al tablero de comunicación, seleccionando la fotografía apropiada y volviendo de nuevo hasta el interlocutor a darle la fotografía." /></td>
<td class="editable"><input type='date' name='fecha' value='2014-12-09' /></td>
<td class="editable"><input type='date' name='fecha' value='-' /></td>
<td class="editable_status">
<span class="color_blue text_medium glyphicon glyphicon-edit" aria-hidden="true" title="Iniciada"></span>
</td>
<td><a href="#" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td>
</tr>
<tr>
<td>
<a href="#" data-toggle="modal" data-target="#instruction_details"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<td class="editable"><input type="text" value="Fase 4 - Estructura de la frase" /></td>
<td class="editable"><input class="elipsis" type="text" value="El estudiante solicita artículos presentes y no presentes usando una frase de varias palabras yendo al libro. El estudiante toma una fotografía/símbolo de 'Yo quiero' y la coloca en una línea de frase (tira de Velcro). Luego, el estudiante toma una imagen de lo que desea, la coloca en la línea de frase, quita toda la tira de Velcro, y la lleva a su interlocutor." /></td>
<td class="editable"><input type='date' name='fecha' value='-' /></td>
<td class="editable"><input type='date' name='fecha' value='-' /></td>
<td class="editable_status">
<span class="text_medium glyphicon glyphicon-minus" aria-hidden="true" title="Sin comenzar"></span>
</td>
<td><a href="#" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td>
</tr>
<tr>
<td>
<a href="#" data-toggle="modal" data-target="#instruction_details"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<td class="editable"><input type="text" value="Fase 5 - Responder a '¿Qué quieres?'" /></td>
<td class="editable"><input class="elipsis" type="text" value="El estudiante puede de manera espontánea solicitar una variedad de objetos y puede responder a la pregunta, 'Qué quieres?'" /></td>
<td class="editable"><input type='date' name='fecha' value='-' /></td>
<td class="editable"><input type='date' name='fecha' value='-' /></td>
<td class="editable_status">
<span class="text_medium glyphicon glyphicon-minus" aria-hidden="true" title="Sin comenzar"></span>
</td>
<td><a href="#" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td>
</tr>
<tr>
<td>
<a href="#" data-toggle="modal" data-target="#instruction_details"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<td class="editable"><input type="text" value="Fase 6 - Responder y comentar espontáneamente" /></td>
<td class="editable"><input class="elipsis" type="text" value="El estudiante responde apropiadamente a 'Qué quieres?', 'Qué ves?', 'Qué tienes?' y a otras preguntas similares cuando éstas son hechas de manera aleatoria." /></td>
<td class="editable"><input type='date' name='fecha' value='-' /></td>
<td class="editable"><input type='date' name='fecha' value='-' /></td>
<td class="editable_status">
<span class="text_medium glyphicon glyphicon-minus" aria-hidden="true" title="Sin comenzar"></span>
</td>
<td><a href="#" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td>
</tr>
</table>
<!-- Añadir instrucción al método -->
<p class="text-right">
<a href="#" class="add_instruction btn btn-success btn-sm" role="button">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Añadir instrucción
</a>
</p>
</div>
<!-- Fin de .method_details -->
<!-- Instrucciones de un método -->
<div class="method_details">
<h4>Método 2</h4>
<!-- Tabla método -->
<table class="table_instructions table table-hover">
<tr>
<th></th>
<th>Instrucción</th>
<th>Objetivo</th>
<th>Inicio</th>
<th>Fin</th>
<th>Estado</th>
<th></th>
</tr>
<tr>
<td>
<a href="#" data-toggle="modal" data-target="#instruction_details"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<td class="editable"><input type="text" value="1" /></td>
<td class="editable"><input type="text" value="Familiarizarse con Método 2" /></td>
<!-- Formato de fecha: YYYY-MM-DD -->
<td class="editable"><input type='date' name='fecha' value='2014-12-01' /></td>
<td class="editable"><input type='date' name='fecha' value='2014-12-03' /></td>
<td class="editable_status">
<span class="color_green text_medium glyphicon glyphicon-check" aria-hidden="true" title="Finalizada"></span>
</td>
<td><a href="#" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td>
</tr>
<tr>
<td>
<a href="#" data-toggle="modal" data-target="#instruction_details"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<td class="editable"><input type="text" value="2" /></td>
<td class="editable"><input class="elipsis" type="text" value="Colocar ficha en cinta y esto es más largo para que no coja" /></td>
<td class="editable"><input type='date' name='fecha' value='2014-12-03' /></td>
<td class="editable"><input type='date' name='fecha' value='2014-12-05' /></td>
<td class="editable_status">
<span class="color_green text_medium glyphicon glyphicon-check" aria-hidden="true" title="Finalizada"></span>
</td>
<td><a href="#" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td>
</tr>
<tr>
<td>
<a href="#" data-toggle="modal" data-target="#instruction_details"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a>
</td>
<td class="editable"><input type="text" value="3071A9" /></td>
<td class="editable"><input type="text" value="Formar frase sencilla" /></td>
<td class="editable"><input type='date' name='fecha' value='2014-12-06' /></td>
<td class="editable"><input type='date' name='fecha' value='2014-12-09' /></td>
<td class="editable_status">
<span class="color_green text_medium glyphicon glyphicon-check" aria-hidden="true" title="Finalizada"></span>
</td>
<td><a href="#" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td>
</tr>
</table>
<!-- Añadir instrucción al método -->
<p class="text-right">
<a href="#" class="add_instruction btn btn-success btn-sm" role="button">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Añadir instrucción
</a>
</p>
</div>
<!-- Fin de .method_details -->
<!-- Menú contextual para cada editable_status -->
<ul id="options_status" style="display: none;">
<li data-command="finish">
<span class="color_green text_medium glyphicon glyphicon-check" aria-hidden="true"></span> Finalizada
</li>
<li data-command="started">
<span class="color_blue text_medium glyphicon glyphicon-edit" aria-hidden="true"></span> Iniciada
</li>
<li data-command="nobegin">
<span class="text_medium glyphicon glyphicon-minus" aria-hidden="true"></span> Sin comenzar
</li>
</ul>
<!-- Fin de menú contextual -->
</div>
<!-- Fin de panel body -->
</div>
<!-- Fin de panel -->
<!-- DIV Modal Detalles Instrucción -->
<div class="modal" id="instruction_details" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<!-- Panel-->
<div class="panel panel-default">
<div class="panel-heading">
<h2>Fase 3 - Discriminar pictogramas</h2>
</div>
<div class="panel-body">
<div class="row">
<div class="col-md-6">
<p><label for="instruction_notes">Objetivo:</label></p>
<textarea id="instruction_objective" placeholder="Escribe aquí" rows="4" style="width:100%; margin-bottom: 10px;">El estudiante solicitará los objetos deseados yendo al tablero de comunicación, seleccionando la fotografía apropiada y volviendo de nuevo hasta el interlocutor a darle la fotografía.</textarea>
<p><span class="date_span">Inicio: </span><input type='date' name='fecha' value='2014-12-09' /></p>
<p><span class="date_span">Fin: </span><input type='date' name='fecha' value='-' /></p>
</div>
<div class="col-md-6">
<p><label for="instruction_notes">Notas:</label></p>
<textarea id="instruction_notes" placeholder="Escribe aquí" rows="4" style="width:100%; margin-bottom: 10px;"></textarea>
<p>Sesiones: 4</p>
<p>Última sesión: <abbr class="timeago" title="December 12, 2014">12 de diciembre de 2014</abbr></p>
<p>Duración total: 6 horas</p>
</div>
</div>
<!-- Fin de row -->
<!-- Listado de LU por sesiones de trabajo -->
<div id="instruction_LUs">
<h4>12/12/2014</h4>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\beat.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\celebrations.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\certificate.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true"></span>
</div>
</div>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\blow.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\award_prizes.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true"></span>
</div>
</div>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\blow.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true"></span>
</div>
</div>
<h4>11/12/2014</h4>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\beat.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\celebrations.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true"></span>
</div>
</div>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\blow.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\award_prizes.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true"></span>
</div>
</div>
<h4>10/12/2014</h4>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\beat.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\celebrations.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\certificate.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true"></span>
</div>
</div>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\blow.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\award_prizes.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true"></span>
</div>
</div>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\blow.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true"></span>
</div>
</div>
<h4>09/12/2014</h4>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\beat.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\celebrations.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\certificate.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true"></span>
</div>
</div>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\blow.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\award_prizes.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true"></span>
</div>
</div>
<div class="instruction_LU">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\blow.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true"></span>
</div>
</div>
</div>
<!-- Fin de learning_units -->
<!-- Menú contextual para cada LU_result -->
<ul id="options" style="display: none;">
<li data-command="success">
<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true"></span> Correcto
</li>
<li data-command="guide">
<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true"></span> Guiado
</li>
<li data-command="fail">
<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true"></span> Fallido
</li>
<li data-command="spontaneous">
<span class="glyphicon glyphicon-ok-sign color_blue" aria-hidden="true"></span> Espontáneo
</li>
<li data-command="demo">
<span class="glyphicon glyphicon-ok-sign color_blue" aria-hidden="true"></span> Demostración
</li>
</ul>
<!-- Fin de menú contextual -->
</div>
<!-- Fin de panel body de ventana modal -->
</div>
<!-- Fin de panel -->
</div>
<!-- Fin de modal-content -->
</div>
<!-- Fin de modal-dialog -->
</div>
<!-- Fin de Modal Detalles Instrucción -->
</div>
<!-- Fin de container -->
<!-- Librería jQuery requerida por los plugins de JavaScript -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Todos los plugins JavaScript de Bootstrap (también puedes incluir archivos JavaScript individuales de los únicos plugins que utilices) -->
<script src="js/bootstrap.min.js"></script>
<!-- Librería jQuery timeago para mostrar tiempo del tipo "hace 4 minutos" -->
<script src="js/jquery.timeago.js" type="text/javascript"></script>
<!-- Mensajes en español de timeago -->
<script src="js/locales/jquery.timeago.es.js" type="text/javascript"></script>
<!-- Para el menú contextual -->
<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.min.js" type="text/javascript"></script>
<script src="js/jquery.ui-contextmenu.min.js"></script>
<script>
$(document).ready(function(){
// Inicio de librería timeago
$("abbr.timeago").timeago();
// Al hacer clic en celda, cambiar estilos
$(document).on('click', 'td.editable', (function(e) {
// Modificar estilos de la celda
//$(this).css("background-color", "#3071A9");
$(this).css("border", "1px solid #333");
// Modificar estilos del input
//$(this).children("input").css("background-color", "#3071A9");
//$(this).children("input").css("color", "#fff");
}));
// Al salir de un celda, volver a dejar estilos como estaban
$(document).on('focusout', 'td.editable', (function(e) {
// GUARDAR en BDD (o también al ir escribiendo)
// Modificar estilos de la celda
//$(this).css("background-color", "inherit");
$(this).css("border", "none");
$(this).css("border-bottom", "1px solid #ccc");
$(this).css("border-top", "1px solid #ccc");
// Modificar estilos del input
//$(this).children("input").css("background", "none");
//$(this).children("input").css("color", "inherit");
}));
// Eliminar instrucción
$(document).on('click', '.delete_instruction', (function(e) {
e.preventDefault();
// Confirmación para eliminar
var c = confirm("¿Estás seguro de eliminar?");
if (c == true) $(this).parent().parent().remove();
}));
// Añadir instrucción al final de la lista de métodos
$(document).on('click', '.add_instruction', (function(e) {
e.preventDefault();
var table = $(this).parent().parent().children(".table_instructions").children("tbody");
table.append('<tr><td><a href="#" data-toggle="modal" data-target="#instruction_details"><span class="glyphicon glyphicon-file text_medium" aria-hidden="true"></span></a> </td><td class="editable"><input type="text" value="" autofocus /></td><td class="editable elipsis"><input type="text" value="" /></td><td class="editable"><input type="date" name="fecha" value="-" /></td><td class="editable"><input type="date" name="fecha" value="-" /></td><td class="editable_status"><span class="text_medium glyphicon glyphicon-minus" aria-hidden="true"></span></td><td><a href="#" class="delete_instruction"><span class="text_medium delete color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></td></tr>');
}));
// Menú contextual para evaluar los ensayos (LU)
$(".LU_result").click(function(){
$("#instruction_LUs").contextmenu("open", $(this));
});
$("#instruction_LUs").contextmenu({
delegate: ".LU_result",
hide: { effect: "fadeOut", duration: "fast" },
menu: "#options",
// position: {my: "left top", at: "left bottom"},
position: function(event, ui){
return {my: "left top", at: "left bottom", of: ui.target};
},
preventSelect: true,
autoTrigger: false,
show: { effect: "fold", duration: "fast"},
taphold: true,
uiMenuOptions: {
// Additional options, used when UI Menu is created
position: { my: "left top", at: "right+10 top+10" }
},
focus: function(event, ui) {
var menuId = ui.item.find(">a").attr("href");
$("#info").text("focus " + menuId);
console.log("focus", ui.item);
},
blur: function(event, ui) {
$("#info").text("");
console.log("blur", ui.item);
},
beforeOpen: function(event, ui) {
// $("#container").contextmenu("replaceMenu", "#options2");
// $("#container").contextmenu("replaceMenu", [{title: "aaa"}, {title: "bbb"}]);
},
open: function(event, ui) {
// alert("open on " + ui.target.text());
},
select: function(event, ui) {
// Array asociativo con las opciones y sus iconos para cambiar
var icons = {
'success': '<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true" title="Correcto"></span>',
'guide': '<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true" title="Guiado"></span>',
'fail': '<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true" title="Fallido"></span>',
'spontaneous': '<span class="glyphicon glyphicon-ok-sign color_blue" aria-hidden="true" title="Espontáneo"></span>',
'demo': '<span class="glyphicon glyphicon-ok-sign color_blue" aria-hidden="true" title="Demostración"></span>'
};
// Leer opción seleccionada
var option = ui.cmd;
// Reemplazar con el icono correspondiente
ui.target.html(icons[option]);
}
});
// Menú contextual para marcar finalizada o no una instrucción
$(document).on('click', '.editable_status', (function(e) {
$("#tables_instructions").contextmenu("open", $(this));
}));
$("#tables_instructions").contextmenu({
delegate: ".editable_status",
hide: { effect: "fadeOut", duration: "fast" },
menu: "#options_status",
// position: {my: "left top", at: "left bottom"},
position: function(event, ui){
return {my: "left top", at: "left bottom", of: ui.target};
},
preventSelect: true,
autoTrigger: false,
show: { effect: "fold", duration: "fast"},
taphold: true,
uiMenuOptions: {
// Additional options, used when UI Menu is created
position: { my: "left top", at: "right+10 top+10" }
},
focus: function(event, ui) {
var menuId = ui.item.find(">a").attr("href");
$("#info").text("focus " + menuId);
console.log("focus", ui.item);
},
blur: function(event, ui) {
$("#info").text("");
console.log("blur", ui.item);
},
beforeOpen: function(event, ui) {
// $("#container").contextmenu("replaceMenu", "#options2");
// $("#container").contextmenu("replaceMenu", [{title: "aaa"}, {title: "bbb"}]);
},
open: function(event, ui) {
// alert("open on " + ui.target.text());
},
select: function(event, ui) {
// Array asociativo con las opciones y sus iconos para cambiar
var icons = {
'finish': '<span class="color_green text_medium glyphicon glyphicon-check" aria-hidden="true" title="Finalizada"></span>',
'started': '<span class="color_blue text_medium glyphicon glyphicon-edit" aria-hidden="true" title="Iniciada">',
'nobegin': '<span class="text_medium glyphicon glyphicon-minus" aria-hidden="true" title="Sin comenzar"></span>'
};
// Leer opción seleccionada
var option = ui.cmd;
// Reemplazar con el icono correspondiente
ui.target.html(icons[option]);
}
});
});
</script>
</body>
</html>
sails/src/assets/app/partials/reports.html deleted 100755 → 0
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pictogram</title>
<!-- CSS de Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<!-- CSS propio -->
<link href="css/main.css" rel="stylesheet" media="screen">
<!-- librerías opcionales que activan el soporte de HTML5 para IE8 -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- GOOGLE CHART -->
<!--Load the AJAX API-->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load('visualization', '1.0', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
// Callback that creates and populates a data table,
// instantiates the pie chart, passes in the data and
// draws it.
function drawChart() {
/* Gráfica Total de ensayos por mes */
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Meses');
data.addColumn('number', 'Correctos');
data.addColumn('number', 'Fallidos');
data.addColumn('number', 'Guiados');
data.addColumn('number', 'Espontáneos');
data.addColumn('number', 'Demostración');
data.addRows([
['Septiembre', 1, 4, 3, 0, 3],
['Octubre', 2, 3, 2, 0, 3],
['Noviembre', 3, 3, 2, 1, 2],
['Diciembre', 3, 2, 1, 2, 2],
['Enero', 4, 1, 1, 3, 1]
]);
// Set chart options
var options = {title:'Total de ensayos por mes',
curveType: 'function',
height:300,
vAxis: {
title: "Ensayos",
viewWindowMode:'explicit',
viewWindow:{
min:0 // Para que no muestre valores negativos en los ejes
}
},
legend: { position: 'right' }
};
// Instantiate and draw our chart, passing in some options.
var chart1 = new google.visualization.LineChart(document.getElementById('chart_div1'));
chart1.draw(data, options);
/* Gráfica horas por instrucción */
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Fases');
data.addColumn('number', 'horas');
data.addRows([
['Fase 1', 1],
['Fase 2', 2],
['Fase 3', 3],
['Fase 4', 3],
['Fase 5', 4],
['Fase 6', 2]
]);
// Set chart options
var options = {title:'Total de horas por instrucción en Método CAA (PECS)',
curveType: 'function',
height:300,
legend: { position: 'right' }
};
// Instantiate and draw our chart, passing in some options.
var chart2 = new google.visualization.PieChart(document.getElementById('chart_div2'));
chart2.draw(data, options);
/* Gráfica Evolución número de pictogramas utilizado */
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Meses');
data.addColumn('number', 'Pictos');
data.addRows([
['Septiembre', 5],
['Octubre', 7],
['Noviembre', 11],
['Diciembre', 16],
['Enero',23]
]);
// Set chart options
var options = {title:'Pictogramas utilizados por mes',
curveType: 'function',
height:300,
vAxis: {
title: "Pictos",
viewWindowMode:'explicit',
viewWindow:{
min:0 // Para que no muestre valores negativos en los ejes
}
},
legend: { position: 'right' }
};
// Instantiate and draw our chart, passing in some options.
var chart3 = new google.visualization.LineChart(document.getElementById('chart_div3'));
chart3.draw(data, options);
/* Gráfica horas uso Pictogram con docente o como comunicador */
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Uso');
data.addColumn('number', 'horas');
data.addRows([
['Con Docente', 34],
['Como Comunicador', 18]
]);
// Set chart options
var options = {title:'Horas de uso Pictogram',
curveType: 'function',
height:300,
legend: { position: 'right' }
};
// Instantiate and draw our chart, passing in some options.
var chart4 = new google.visualization.PieChart(document.getElementById('chart_div4'));
chart4.draw(data, options);
/* Gráfico con el total de sesiones de trabajo */
var data = google.visualization.arrayToDataTable([
['Sesiones', 'Total'],
['Total', 13]
]);
var options = {
title: 'Total de sesiones de trabajo',
height:300
//hAxis: {title: 'Total', titleTextStyle: {color: 'red'}}
};
var chart5 = new google.visualization.ColumnChart(document.getElementById('chart_div5'));
chart5.draw(data, options);
/* Gráfica aciertos/errores por instrucción */
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Instrucción');
data.addColumn('number', 'Correctos');
data.addColumn('number', 'Fallidos');
data.addColumn('number', 'Guiados');
data.addColumn('number', 'Espontáneos');
data.addColumn('number', 'Demostración');
data.addRows([
['Fase 1', 1, 4, 3, 0, 3],
['Fase 2', 2, 3, 2, 0, 3],
['Fase 3', 3, 3, 2, 1, 2],
['Fase 4', 3, 2, 1, 2, 2],
['Fase 5', 4, 1, 1, 3, 1],
['Fase 6', 7, 0, 1, 0, 1]
]);
// Set chart options
var options = {title:'Ensayos por instrucción en método CAA( PECS)',
curveType: 'function',
height:300,
vAxis: {
title: "Ensayos",
viewWindowMode:'explicit',
viewWindow:{
min:0 // Para que no muestre valores negativos en los ejes
}
},
legend: { position: 'right' }
};
// Instantiate and draw our chart, passing in some options.
var chart6 = new google.visualization.LineChart(document.getElementById('chart_div6'));
chart6.draw(data, options);
/* Gráfica aciertos/errores por sesión */
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Sesión');
data.addColumn('number', 'Correctos');
data.addColumn('number', 'Fallidos');
data.addColumn('number', 'Guiados');
data.addColumn('number', 'Espontáneos');
data.addColumn('number', 'Demostración');
data.addRows([
['10/12/2014', 1, 4, 3, 0, 3],
['11/12/2014', 2, 3, 2, 0, 3],
['14/12/2014', 3, 3, 2, 1, 2],
['15/12/2014', 3, 2, 1, 2, 2]
]);
// Set chart options
var options = {title:'Ensayos por sesión',
curveType: 'function',
height:300,
vAxis: {
title: "Ensayos",
viewWindowMode:'explicit',
viewWindow:{
min:0 // Para que no muestre valores negativos en los ejes
}
},
legend: { position: 'right' }
};
// Instantiate and draw our chart, passing in some options.
var chart7 = new google.visualization.LineChart(document.getElementById('chart_div7'));
chart7.draw(data, options);
/* Gráfica tiempo medio de ensayo por sesión */
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Sesión');
data.addColumn('number', 'Minutos');
data.addRows([
['10/12/2014', 14],
['11/12/2014', 11],
['14/12/2014', 8],
['15/12/2014', 7]
]);
// Set chart options
var options = {title:'Tiempo medio de ensayo por sesión',
curveType: 'function',
height:300,
vAxis: {
title: "Minutos",
viewWindowMode:'explicit',
viewWindow:{
min:0 // Para que no muestre valores negativos en los ejes
}
},
legend: { position: 'right' }
};
// Instantiate and draw our chart, passing in some options.
var chart8 = new google.visualization.LineChart(document.getElementById('chart_div8'));
chart8.draw(data, options);
}
</script>
</head>
<body>
<div class="container">
<!-- Cabecera del Supervisor -->
<nav id="supervisor_header"class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex6-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="students.html"><img src="img/logo_pictogram.png" alt="Pictogram" title="Pictogram" style="height: 70px;" /></a>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex6-collapse">
<div class="nav navbar-nav navbar-right thumbnail img_profile">
<img src="img/dofer.jpg" alt="Supervisor" title="Supervisor" />
</div>
<div class="nav navbar-nav navbar-right navbar-text">
<h4 class="text-right">Fernando Martínez Santiago</h4>
<p class="text-right">
<!-- Botón configuración -->
<a href="setup.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración
</a>
<!-- Botón salir -->
<a href="login.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-log-out" aria-hidden="true"></span> Salir
</a>
</p>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera supervisor -->
<!-- Cabecera alumno -->
<nav id="student_header" class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex16-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex16-collapse">
<div class="nav navbar-nav navbar-left thumbnail img_profile">
<img src="img/eladio.jpg" alt="Alumno" title="Alumno" />
</div>
<div class="nav navbar-nav navbar-left navbar-text">
<h4>Eladio Blanco López</h4>
<p>Centro Juan Martos | Método CAA (PECS) | Fase 3</p>
</div>
<div class="nav navbar-nav navbar-right tabs_student">
<ul class="nav nav-tabs">
<li role="presentation"><a href="collections.html"><span class="glyphicon glyphicon-th" aria-hidden="true"></span> Colecciones</a></li>
<li role="presentation"><a href="instructions.html"><span class="glyphicon glyphicon-tasks" aria-hidden="true"></span> Instrucciones</a></li>
<li role="presentation"><a href="session.html"><span class="glyphicon glyphicon-transfer" aria-hidden="true"></span> Sesión</a></li>
<li role="presentation" class="active"><a href="reports.html"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Informes</a></li>
<li role="presentation"><a href="student_setup.html"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración</a></li>
</ul>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera alumno -->
<!-- Pestaña del alumno -->
<div class="panel panel-default student_tab_panel">
<div class="panel-body" style="text-align:center;">
<p>Alumno registrado <abbr class="timeago" title="December 12, 2013">12 de diciembre de 2013</abbr></p>
<!-- Gráfica Total de ensayos por mes -->
<div id="chart_div1"></div>
<div class="row">
<div class="col-sm-6">
<!-- Gráfica horas por instrucción -->
<div id="chart_div2"></div>
</div>
<div class="col-sm-6">
<!-- Gráfica tiempo medio de ensayo por sesión -->
<div id="chart_div8"></div>
</div>
</div>
<!-- fin de row -->
<!-- Gráfica Evolución número de pictogramas utilizado -->
<div id="chart_div3"></div>
<div class="row">
<div class="col-sm-6">
<!-- Gráfica horas uso Pictogram con docente o como comunicador -->
<div id="chart_div4"></div>
</div>
<div class="col-sm-6">
<!-- Gráfico con el total de sesiones de trabajo -->
<div id="chart_div5"></div>
</div>
</div>
<!-- fin de row -->
<!-- Gráfica aciertos/errores por instrucción -->
<div id="chart_div6"></div>
<!-- Gráfica aciertos/errores por sesión -->
<div id="chart_div7"></div>
</div>
<!-- Fin de panel body -->
</div>
<!-- Fin de panel -->
</div>
<!-- Fin de container -->
<!-- Librería jQuery requerida por los plugins de JavaScript -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Todos los plugins JavaScript de Bootstrap (también puedes incluir archivos JavaScript individuales de los únicos plugins que utilices) -->
<script src="js/bootstrap.min.js"></script>
<!-- Librería jQuery timeago para mostrar tiempo del tipo "hace 4 minutos" -->
<script src="js/jquery.timeago.js" type="text/javascript"></script>
<!-- Mensajes en español de timeago -->
<script src="js/locales/jquery.timeago.es.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
// Inicio de librería timeago
$("abbr.timeago").timeago();
});
</script>
</body>
</html>
sails/src/assets/app/partials/session.html deleted 100755 → 0
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pictogram</title>
<!-- CSS de Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<!-- CSS propio -->
<link href="css/main.css" rel="stylesheet" media="screen">
<!-- CSS para el menú contextual -->
<link href="http://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css" type="text/css" rel="stylesheet" />
<!-- CSS Contadores de tiempo -->
<link rel="stylesheet" type="text/css" href="css/jquery.countdown.css" />
<!-- librerías opcionales que activan el soporte de HTML5 para IE8 -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="container">
<!-- Cabecera del Supervisor -->
<nav id="supervisor_header"class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex6-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="students.html"><img src="img/logo_pictogram.png" alt="Pictogram" title="Pictogram" style="height: 70px;" /></a>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex6-collapse">
<div class="nav navbar-nav navbar-right thumbnail img_profile">
<img src="img/dofer.jpg" alt="Supervisor" title="Supervisor" />
</div>
<div class="nav navbar-nav navbar-right navbar-text">
<h4 class="text-right">Fernando Martínez Santiago</h4>
<p class="text-right">
<!-- Botón configuración -->
<a href="setup.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración
</a>
<!-- Botón salir -->
<a href="login.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-log-out" aria-hidden="true"></span> Salir
</a>
</p>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera supervisor -->
<!-- Cabecera alumno -->
<nav id="student_header" class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex16-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex16-collapse">
<div class="nav navbar-nav navbar-left thumbnail img_profile">
<img src="img/eladio.jpg" alt="Alumno" title="Alumno" />
</div>
<div class="nav navbar-nav navbar-left navbar-text">
<h4>Eladio Blanco López</h4>
<p>Centro Juan Martos | Método CAA (PECS) | Fase 3</p>
</div>
<div class="nav navbar-nav navbar-right tabs_student">
<ul class="nav nav-tabs">
<li role="presentation"><a href="collections.html"><span class="glyphicon glyphicon-th" aria-hidden="true"></span> Colecciones</a></li>
<li role="presentation"><a href="instructions.html"><span class="glyphicon glyphicon-tasks" aria-hidden="true"></span> Instrucciones</a></li>
<li role="presentation" class="active"><a href="session.html"><span class="glyphicon glyphicon-transfer" aria-hidden="true"></span> Sesión</a></li>
<li role="presentation"><a href="reports.html"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Informes</a></li>
<li role="presentation"><a href="student_setup.html"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración</a></li>
</ul>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera alumno -->
<!-- Pestaña del alumno -->
<div class="panel panel-default student_tab_panel">
<div class="panel-body">
<div class="row">
<!-- Listado de dispositivos conectados al usuario -->
<div class="col-md-4">
<ul class="list-group">
<li class="list-group-item"><span class="glyphicon glyphicon-phone color_green" aria-hidden="true"></span> Samsung Galaxy Tab 4</li>
<li class="list-group-item"><span class="glyphicon glyphicon-phone color_green" aria-hidden="true"></span> Sony Xperia Z3</li>
<li class="list-group-item"><span class="glyphicon glyphicon-phone" aria-hidden="true"></span> HTC One X</li>
</ul>
</div>
<!-- Fin de listado de dispositivos -->
<!-- Select con Instrucciones -->
<div class="col-md-4">
<!-- Select para seleccionar Instrucción -->
<form role="form" action="#">
<select class="form-control" name="met_select" id="met_select">
<option value="1" selected>Comunicación Aumentativa y Adaptativa</option>
<option value="2">Método 2</option>
</select>
<select class="form-control" name="instruction_select" id="instruction_select">
<option value="1">Fase 1</option>
<option value="2">Fase 2</option>
<option value="3" selected>Fase 3</option>
<option value="4">Fase 4</option>
<option value="5">Fase 5</option>
<option value="6">Fase 6</option>
</select>
</form>
</div>
<!-- Fin de select con Instrucciones -->
<!-- Temporizador Sesión de trabajo -->
<div class="col-md-4">
<p class="text-right text_large">
<a href="#" class="btn btn-success btn-sm" role="button" id="session_new">
Nueva sesión
</a>
<span class="color_blue" id='timer_ws'>00:00:00</span>
</p>
</div>
<!-- Fin temporizador sesión de trabajo -->
</div>
<!-- Fin de row -->
<div class="page-header">
<h2 id="LU_title">Ensayos de la última sesión</h2>
</div>
<!-- Controles de Learning Unit -->
<div class="LU_controls text_large">
<a href="#" id="lu_new">
<span class="glyphicon glyphicon-record color_red" aria-hidden="true" title="Empezar ensayo"></span>
</a>
<a href="#" id="lu_pause">
<span class="glyphicon glyphicon-pause" aria-hidden="true" title="Pausar ensayo"></span>
</a>
<a href="#" id="lu_stop">
<span class="glyphicon glyphicon-stop color_black" aria-hidden="true" title="Terminar ensayo"></span>
</a>
<span class="text_large color_blue" id='timer_lu'>00:00</span>
</div>
<!-- Listado de LU -->
<div id="learning_units">
<div class="learning_unit">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\beat.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\celebrations.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\certificate.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true" title="Correcto"></span>
</div>
<div class="LU_time">07:45</div>
</div>
<div class="learning_unit">
<div class="picto pull-left"><img src="img/symbolstx/color\png\actions\blow.png"></div>
<div class="picto pull-left"><img src="img/symbolstx/color\png\general\award_prizes.png"></div>
<div class="LU_result">
<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true" title="Fallido"></span>
</div>
<div class="LU_time">01:24</div>
</div>
</div>
<!-- Fin de learning_units -->
<!-- Menú contextual para cada LU_result -->
<ul id="options_LU" style="display: none;">
<li data-command="success">
<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true"></span> Correcto
</li>
<li data-command="guide">
<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true"></span> Guiado
</li>
<li data-command="fail">
<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true"></span> Fallido
</li>
<li data-command="spontaneous">
<span class="glyphicon glyphicon-ok-sign color_blue" aria-hidden="true"></span> Espontáneo
</li>
<li data-command="demo">
<span class="glyphicon glyphicon-ok-sign color_blue" aria-hidden="true"></span> Demostración
</li>
</ul>
<!-- Fin de menú contextual -->
</div>
<!-- Fin de panel body -->
</div>
<!-- Fin de panel -->
</div>
<!-- Fin de container -->
<!-- Librería jQuery requerida por los plugins de JavaScript -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Todos los plugins JavaScript de Bootstrap (también puedes incluir archivos JavaScript individuales de los únicos plugins que utilices) -->
<script src="js/bootstrap.min.js"></script>
<!-- Para el menú contextual -->
<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.min.js" type="text/javascript"></script>
<script src="js/jquery.ui-contextmenu.min.js"></script>
<script>
$(document).ready(function(){
var worker_ws = null; // Inicializar variable web worker para tiempo de sesión de trabajo
var worker_lu = null; // Variable para web worker para tiempo de LU
// Iniciar LU
$("#lu_new").click(function(){
// Mostrar botones de pause y stop
$("#lu_pause, #lu_stop").show();
// Ocultar botón de grabar
$("#lu_new").hide();
// Se recupera el tiempo por el que va (si se ha pausado)
// para pasárselo al nuevo worker y que siga contando
var str = $("#timer_lu").html();
var res = str.split(":");
// Asignar los segundos de los minutos
var secsToAdd = parseInt(res[0]) * 60;
// Y sumar los segundos
secsToAdd += parseInt(res[1]);
// CREAR WEB WORKER
// Comprobar si el navegador soporta web workers
if (typeof(Worker)!=="undefined"){
// Si no existe el web worker lo creo con el código del archivo timer_lu.js
if (worker_lu==null){
worker_lu = new Worker("js/timer_lu.js");
// Enviar información al worker: Pasamos los segundos (como cadena, que es lo que acepta postMessage o también JSON) que lleva el contador (si se ha pausado)
worker_lu.postMessage(secsToAdd.toString());
}
// Recibir información del worker: Actualizar el div donde se muestra lo que devuelve el web worker mediante postMessage
worker_lu.onmessage = function (event) {
$("#timer_lu").html(event.data);
};
} else {
// Mensaje si el navegador no soporta web workers
$("#timer_lu").html("El navegador no soporta Web Workers. Por favor, actualícelo.");
}
// FIN WEB WORKER
});
// Pausar contador lu
$(document).on('click', '#lu_pause', function() {
// Si existe el worker, se elimina para pausar
if (worker_lu!=null){
worker_lu.terminate();
timerStart = true;
worker_lu = null;
}
// Ocultar botón de pause
$("#lu_pause").hide();
// Mostrar botón de grabar y cambiar su title de "Empezar ensayo" a "Reanudar ensayo"
$("#lu_new").show();
$("#lu_new span").attr("title", "Reanudar ensayo");
});
// Parar contador lu
$(document).on('click', '#lu_stop', function() {
// Si existe el worker, se elimina para parar
if (worker_lu!=null){
worker_lu.terminate();
timerStart = true;
worker_lu = null;
}
// Ocultar botones de pause y stop
$("#lu_pause, #lu_stop").hide();
// Mostrar botón de grabar y cambiar su title de "Reanudar ensayo" a "Empezar ensayo"
$("#lu_new").show();
$("#lu_new span").attr("title", "Empezar ensayo");
// Recuperar el tiempo del ensayo
var LU_time = $("#timer_lu").html();
// Añadir ensayo a listado
$("#learning_units").append('<div class="learning_unit"><div class="picto pull-left"><img src="img/symbolstx/color/png/actions/beat.png"></div><div class="picto pull-left"><img src="img/symbolstx/color/png/general/celebrations.png"></div><div class="picto pull-left"><img src="img/symbolstx/color/png/general/certificate.png"></div><div class="LU_result"><span class="glyphicon glyphicon-question-sign color_black" aria-hidden="true" title="Sin evaluar"></span></div><div class="LU_time">'+ LU_time +'</div></div>');
// Poner a 00:00 el temporizador
$("#timer_lu").html("00:00");
});
// Nueva sesión ws
$(document).on('click', '#session_new', function() {
// Intercambiar botón añadir por botón parar
$("#session_new").replaceWith('<a href="#" class="btn btn-danger btn-sm" role="button" id="session_stop">Parar sesión</a>');
// CREAR WEB WORKER
// Comprobar si el navegador soporta web workers
if (typeof(Worker)!=="undefined"){
// Si no existe el web worker lo creo con el código del archivo timer_ws.js
if (worker_ws==null){
worker_ws = new Worker("js/timer_ws.js");
}
// Actualizar el div donde se muestra lo que devuelve el web worker mediante postMessage
worker_ws.onmessage = function (event) {
$("#timer_ws").html(event.data);
};
} else {
// Mensaje si el navegador no soporta web workers
$("#timer_ws").html("El navegador no soporta Web Workers. Por favor, actualícelo.");
}
// FIN WEB WORKER
// Mostrar controles de ensayos
$(".LU_controls").show();
// Limpiar los ensayos de la última sesión
$("#learning_units").empty();
// Cambiar título "Ensayos última sesión" por "Ensayos"
$("#LU_title").html("Ensayos");
});
// Parar contador ws
$(document).on('click', '#session_stop', function() {
worker_ws.terminate();
timerStart = true;
worker_ws = null;
// Intercambiar botón parar por botón añadir
$("#session_stop").replaceWith('<a href="#" class="btn btn-success btn-sm" role="button" id="session_new">Nueva sesión</a>');
// Cambiar título "Ensayos" por "Ensayos última sesión"
$("#LU_title").html("Ensayos última sesión");
// PARAR TAMBIÉN ENSAYO
// Si existe el worker, se elimina para parar
if (worker_lu!=null){
worker_lu.terminate();
timerStart = true;
worker_lu = null;
// Ocultar botones de pause y stop
$("#lu_pause, #lu_stop").hide();
// Mostrar botón de grabar y cambiar su title de "Reanudar ensayo" a "Empezar ensayo"
$("#lu_new").show();
$("#lu_new span").attr("title", "Empezar ensayo");
// Recuperar el tiempo del ensayo
var LU_time = $("#timer_lu").html();
// Añadir ensayo a listado
$("#learning_units").append('<div class="learning_unit"><div class="picto pull-left"><img src="img/symbolstx/color/png/actions/beat.png"></div><div class="picto pull-left"><img src="img/symbolstx/color/png/general/celebrations.png"></div><div class="picto pull-left"><img src="img/symbolstx/color/png/general/certificate.png"></div><div class="LU_result"><span class="glyphicon glyphicon-question-sign color_black" aria-hidden="true" title="Sin evaluar"></span></div><div class="LU_time">'+ LU_time +'</div></div>');
// Poner a 00:00 el temporizador
$("#timer_lu").html("00:00");
// Fin de parar ensayo
}
});
// Menú contextual para evaluar los ensayos (LU)
$(document).on('click', '.LU_result', function() {
$("#learning_units").contextmenu("open", $(this));
});
$("#learning_units").contextmenu({
delegate: ".LU_result",
hide: { effect: "fadeOut", duration: "fast" },
menu: "#options_LU",
// position: {my: "left top", at: "left bottom"},
position: function(event, ui){
return {my: "left top", at: "left bottom", of: ui.target};
},
preventSelect: true,
autoTrigger: false,
show: { effect: "fold", duration: "fast"},
taphold: true,
uiMenuOptions: {
// Additional options, used when UI Menu is created
position: { my: "left top", at: "right+10 top+10" }
},
focus: function(event, ui) {
var menuId = ui.item.find(">a").attr("href");
$("#info").text("focus " + menuId);
console.log("focus", ui.item);
},
blur: function(event, ui) {
$("#info").text("");
console.log("blur", ui.item);
},
beforeOpen: function(event, ui) {
// $("#container").contextmenu("replaceMenu", "#options2");
// $("#container").contextmenu("replaceMenu", [{title: "aaa"}, {title: "bbb"}]);
},
open: function(event, ui) {
// alert("open on " + ui.target.text());
},
select: function(event, ui) {
// Array asociativo con las opciones y sus iconos para cambiar
var icons = {
'success': '<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true" title="Correcto"></span>',
'guide': '<span class="glyphicon glyphicon-ok-sign color_green" aria-hidden="true" title="Guiado"></span>',
'fail': '<span class="glyphicon glyphicon-remove-sign color_red" aria-hidden="true" title="Fallido"></span>',
'spontaneous': '<span class="glyphicon glyphicon-ok-sign color_blue" aria-hidden="true" title="Espontáneo"></span>',
'demo': '<span class="glyphicon glyphicon-ok-sign color_blue" aria-hidden="true" title="Demostración"></span>'
};
// Leer opción seleccionada
var option = ui.cmd;
// Reemplazar con el icono correspondiente
ui.target.html(icons[option]);
}
});
});
</script>
</body>
</html>
sails/src/assets/app/partials/student_setup.html deleted 100755 → 0
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Pictogram</title>
<!-- CSS de Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<!-- CSS bootstrap toggle -->
<link href="https://gitcdn.github.io/bootstrap-toggle/2.0.0/css/bootstrap-toggle.min.css" rel="stylesheet">
<!-- CSS cropper (recortar imagen) -->
<link href="css/cropper.css" rel="stylesheet">
<!-- CSS propio -->
<link href="css/main.css" rel="stylesheet" media="screen">
<!-- librerías opcionales que activan el soporte de HTML5 para IE8 -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="container">
<!-- Cabecera del Supervisor -->
<nav id="supervisor_header"class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex6-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="students.html"><img src="img/logo_pictogram.png" alt="Pictogram" title="Pictogram" style="height: 70px;" /></a>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex6-collapse">
<div class="nav navbar-nav navbar-right thumbnail img_profile">
<img src="img/dofer.jpg" alt="Supervisor" title="Supervisor" />
</div>
<div class="nav navbar-nav navbar-right navbar-text">
<h4 class="text-right">Fernando Martínez Santiago</h4>
<p class="text-right">
<!-- Botón configuración -->
<a href="setup.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración
</a>
<!-- Botón salir -->
<a href="login.html" class="btn btn-default btn-sm" role="button">
<span class="glyphicon glyphicon-log-out" aria-hidden="true"></span> Salir
</a>
</p>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera supervisor -->
<!-- Cabecera alumno -->
<nav id="student_header" class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Lo que se muestra en dispositivos móviles -->
<div class="navbar-header">
<button class="navbar-toggle" data-target=".navbar-ex16-collapse" data-toggle="collapse" type="button">
<span class="sr-only">Desplegar navegación</span>
<!-- Un span por línea del icono de abrir menú -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- Agrupar los enlaces de navegación, los formularios y cualquier otro elemento que se pueda ocultar al minimizar la barra -->
<div class="collapse navbar-collapse navbar-ex16-collapse">
<div class="nav navbar-nav navbar-left thumbnail img_profile">
<img id="student_profile" src="img/eladio.jpg" alt="Eladio Blanco López" title="Eladio Blanco López" />
</div>
<div class="nav navbar-nav navbar-left navbar-text">
<h4>Eladio Blanco López</h4>
<p>Centro Juan Martos | Método CAA (PECS) | Fase 3</p>
</div>
<div class="nav navbar-nav navbar-right tabs_student">
<ul class="nav nav-tabs">
<li role="presentation"><a href="collections.html"><span class="glyphicon glyphicon-th" aria-hidden="true"></span> Colecciones</a></li>
<li role="presentation"><a href="instructions.html"><span class="glyphicon glyphicon-tasks" aria-hidden="true"></span> Instrucciones</a></li>
<li role="presentation"><a href="session.html"><span class="glyphicon glyphicon-transfer" aria-hidden="true"></span> Sesión</a></li>
<li role="presentation"><a href="reports.html"><span class="glyphicon glyphicon-file" aria-hidden="true"></span> Informes</a></li>
<li role="presentation" class="active"><a href="student_setup.html"><span class="glyphicon glyphicon-cog" aria-hidden="true"></span> Configuración</a></li>
</ul>
</div>
</div>
</div>
</nav>
<!-- Fin cabecera alumno -->
<!-- DIV Modal cropper para recorte de imagen -->
<div class="modal fade" id="bootstrap-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!-- Formulario -->
<form role="form" action="#">
<!-- Cabecera modal -->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Cerrar</span></button>
<h4 class="modal-title" id="myModalLabel">Recortar imagen</h4>
</div>
<!-- Fin Cabecera modal -->
<!-- Cuerpo modal -->
<div class="modal-body">
<div class="bootstrap-modal-cropper">
<img src="" />
</div>
</div>
<!-- Fin cuerpo modal -->
<!-- Pie modal -->
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
<button id="button_crop" type="submit" class="btn btn-primary">Guardar</button>
</div>
<!-- Fin pie modal -->
</form>
</div>
</div>
</div>
<!-- Fin del DIV Modal recortar imagen -->
<div class="panel panel-default student_tab_panel">
<div class="panel-body">
<div class="row">
<!-- Parte izquierda: Datos personales -->
<div class="col-md-6">
<div id="student_personal_edit">
<form role="form" action="#">
<!-- Cambiar imagen de perfil -->
<div class="form-group">
<h4><span class="glyphicon glyphicon-picture" aria-hidden="true"></span> Cambiar fotografía: </h4>
<!-- Input oculto para cargar la redimensión de la imagen (awesome-cropper) -->
<input type='file' id="imgInp" />
<input type="button" id="my-button" value="Cambiar imagen" />
</div>
<!-- Fin Cambiar imagen de perfil -->
<!-- Datos personales del alumno -->
<div class="form-group">
<input type="text" class="form-control" id="student_personal_edit_name" placeholder="Nombre" value="Eladio" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="student_personal_edit_surname" placeholder="Apellidos" value="Blanco López" required />
</div>
<div class="form-group">
<input type='date' name='fecha' value='1983-03-24' class="form-control" id="student_personal_edit_birthdate" placeholder="Fecha de nacimiento" required />
</div>
<div class="form-group">
<textarea class="form-control" rows="4" id="student_personal_edit_notes" placeholder="Notas">Ampliar matrícula hasta junio</textarea>
</div>
<!-- Fin de datos personales del alumno -->
<fieldset>
<legend>Idioma</legend>
<div class="form-group">
<select class="form-control" name="signin_language" id="signin_language">
<option value="ES" selected>Español</option>
<option value="EN">Inglés</option>
</select>
</div>
</fieldset>
</form>
</div>
<!-- Fin de student_personal_edit -->
</div>
<!-- Parte derecha: Tutores y dispositivos -->
<div class="col-md-6">
<div id="student_tutors">
<h4>Tutores</h4>
<!-- Buscador de tutores -->
<p>
<form role="search" action="#">
<div class="input-group">
<input type="text" class="form-control" placeholder="Buscar tutores por dni, teléfono o nombre" name="srch-term-tutor" id="srch-term-tutor">
<div class="input-group-btn">
<button class="btn btn-default" type="submit">
<span class="glyphicon glyphicon-search"></span>
</button>
</div>
</div>
</form>
</p>
<!-- Fin de buscador de tutores -->
<!-- Botón añadir tutor -->
<p class="text-right">
<a href="#" class="btn btn-success btn-sm" role="button" data-toggle="modal" data-target="#add_tutor">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Nuevo tutor
</a>
</p>
<!-- Fin de botón añadir tutor -->
<!-- DIV Modal Añadir tutor -->
<div class="modal fade" id="add_tutor" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!-- Formulario -->
<form role="form" action="#">
<!-- Cabecera modal -->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Cerrar</span></button>
<h4 class="modal-title" id="myModalLabel">Añadir tutor</h4>
</div>
<!-- Fin Cabecera modal -->
<!-- Cuerpo modal -->
<div class="modal-body">
<!-- Imagen de perfil del alumno -->
<div class="thumbnail img_profile">
<img src="img/default.jpg" alt="" title="" />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_name" placeholder="Nombre" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_surname" placeholder="Apellidos" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_address" placeholder="Dirección postal" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_phone" placeholder="Teléfono" required />
</div>
<div class="form-group">
<input type="email" class="form-control" id="signin_email1" placeholder="Email" required />
</div>
<fieldset>
<legend>Contraseña</legend>
<div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="Escribe la contraseña" required />
</div>
<div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="Repite la contraseña" required />
</div>
<fieldset>
<fieldset>
<legend>Idioma</legend>
<div class="form-group">
<select class="form-control" name="signin_language" id="signin_language">
<option value="ES" selected>Español</option>
<option value="EN">Inglés</option>
</select>
</div>
</fieldset>
</div>
<!-- Fin cuerpo modal -->
<!-- Pie modal -->
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
<button type="submit" class="btn btn-primary">Guardar</button>
</div>
<!-- Fin pie modal -->
</form>
</div>
</div>
</div>
<!-- Fin del DIV Modal Añadir tutor -->
<!-- DIV Modal Ver tutor -->
<div class="modal fade" id="view_tutor" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<!-- Formulario -->
<form role="form" action="#">
<!-- Cabecera modal -->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Cerrar</span></button>
<h4 class="modal-title" id="myModalLabel">Detalle tutor</h4>
</div>
<!-- Fin Cabecera modal -->
<!-- Cuerpo modal -->
<div class="modal-body">
<!-- Imagen de perfil del alumno -->
<div class="thumbnail img_profile">
<img src="img/mcarlos.jpg" alt="" title="" />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_name" placeholder="Nombre" value="Juan" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_surname" placeholder="Apellidos" value="López Torres" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_address" placeholder="Dirección postal" value="Avda. Andalucía 3 (Jaén)" required />
</div>
<div class="form-group">
<input type="text" class="form-control" id="signin_phone" placeholder="Teléfono" value="658741478" required />
</div>
<div class="form-group">
<input type="email" class="form-control" id="signin_email1" placeholder="Email" value="juanlopez@gmail.com" required />
</div>
<!--
<fieldset>
<legend>Contraseña</legend>
<div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="Escribe la contraseña" value="" />
</div>
<div class="form-group">
<input type="password" class="form-control" id="signin_password1" placeholder="Repite la contraseña" />
</div>
<fieldset>
-->
<fieldset>
<legend>Idioma</legend>
<div class="form-group">
<select class="form-control" name="signin_language" id="signin_language">
<option value="ES" selected>Español</option>
<option value="EN">Inglés</option>
</select>
</div>
</fieldset>
</div>
<!-- Fin cuerpo modal -->
<!-- Pie modal -->
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
<button type="submit" class="btn btn-primary">Guardar</button>
</div>
<!-- Fin pie modal -->
</form>
</div>
</div>
</div>
<!-- Fin del DIV Modal Añadir tutor -->
<!-- Tutores asignados -->
<ul class="list-group" id="user_tutors">
<li class="list-group-item">
<!-- Imagen de perfil del tutor -->
<img src="img/mcarlos.jpg" class="profile" alt="" title="" />
<a href="#" data-toggle="modal" data-target="#view_tutor">Juan López Torres</a>
<a href="#" class="delete_tutor">
<span class="color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span>
</a>
</li>
<li class="list-group-item">
<!-- Imagen de perfil del tutor -->
<img src="img/maite.png" class="profile" alt="" title="" />
<a href="#" data-toggle="modal" data-target="#view_tutor">María Cano Hernández</a>
<a href="#" class="delete_tutor">
<span class="color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span>
</a>
</li>
</ul>
<!-- Fin de Tutores asignados -->
</div>
<!-- Fin de id student-tutors -->
<div id="student_devices">
<h4>Dispositivos</h4>
<!-- Formulario para introducir ID de dispositivo -->
<p>
<form role="search" action="#">
<div class="input-group">
<input type="text" class="form-control" placeholder="ID de dispositivo" name="srch-term-device" id="srch-term-device" required />
<div class="input-group-btn">
<button class="btn btn-success" type="submit">
<span class="glyphicon glyphicon-plus"></span>
</button>
</div>
</div>
</form>
</p>
<!-- Fin del formulario para añadir dispositivo -->
<!-- Dispositivos asignados -->
<ul class="list-group" id="user_devices">
<li class="list-group-item">
<span class="glyphicon glyphicon-phone" aria-hidden="true"></span> Samsung Galaxy Tab 4
<a href="#" class="delete_device">
<span class="color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span>
</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-phone" aria-hidden="true"></span> Sony Xperia Z3
<a href="#" class="delete_device">
<span class="color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span>
</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-phone" aria-hidden="true"></span> HTC One X
<a href="#" class="delete_device">
<span class="color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span>
</a>
</li>
</ul>
<!-- Fin de Dispositivos asignados -->
</div>
<!-- Fin de id student-devices -->
</div>
</div><!-- Fin de row -->
<!-- Parte de abajo: Configuración de los dispositivos -->
<div>
<div class="page-header">
<h2>Configuración dispositivos</h2>
</div>
<form role="form">
<div class="row">
<!-- Pictogramas -->
<fieldset class="col-md-6">
<legend>Pictogramas</legend>
<div class="input-group">
<label>Fondo:
<input id="picto-background" type="color" value="#0000ff" />
</label>
</div>
<div class="radio">
Tamaño:
<label>
<input type="radio" name="device_edit_picto1" id="device_edit_picto1_1" value="" />
Pequeño
</label>
<label>
<input type="radio" name="device_edit_picto1" id="device_edit_picto1_2" value="" checked />
Normal
</label>
<label>
<input type="radio" name="device_edit_picto1" id="device_edit_picto1_3" value="" />
Grande
</label>
</div>
<div class="checkbox">
<label class="student_setup">Leyenda:</label>
<input data-toggle="toggle" data-on="Mostrar" data-off="Ocultar" type="checkbox" name="device_edit_picto2" id="device_edit_picto2" />
<input checked data-toggle="toggle" data-on="Arriba" data-off="Abajo" data-offstyle="warning" type="checkbox" name="device_edit_picto3" id="device_edit_picto3" />
</div>
<div class="checkbox">
<label class="student_setup">Animación:</label>
<input data-toggle="toggle" data-on="Mostrar" data-off="Ocultar" type="checkbox" checked />
</div>
<div class="checkbox">
<label class="student_setup">Categorías:</label>
<input data-toggle="toggle" data-on="Mostrar" data-off="Ocultar" type="checkbox" checked />
</div>
<p>Comportamiento del pictograma al seleccionarlo (sin cinta de frase):</p>
<input checked data-toggle="toggle" data-on="Ampliar" data-off="Marcar" data-offstyle="warning" type="checkbox" name="device_edit_symbol" id="device_edit_symbol" />
</fieldset>
<!-- Colocación en cinta de frase -->
<fieldset class="col-md-3">
<legend>Cinta de frase</legend>
<div class="input-group">
<label>Fondo:
<input id="phrase-background" type="color" value="#ff0000" />
</label>
</div>
<p>Colocar pictogramas en cinta:</p>
<div class="radio">
<label>
<input type="radio" name="device_edit_phrase" id="device_edit_phrase_1" value="" />
Clicar
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="device_edit_phrase" id="device_edit_phrase_2" value="" />
Desplazar pictograma
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="device_edit_phrase" id="device_edit_phrase_3" value="" checked />
Doble click
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="device_edit_phrase" id="device_edit_phrase_4" value="" />
Pulsación larga
</label>
</div>
</fieldset>
<!-- Ajustes de voz -->
<fieldset class="col-md-3">
<legend>Ajustes de voz</legend>
<div class="checkbox">
<label>
<input name="device_edit_sound2" id="device_edit_sound2" data-toggle="toggle" type="checkbox" /> Cada picto habla
</label>
</div>
<div class="checkbox">
<label>
<input name="device_edit_sound3" id="device_edit_sound3" data-toggle="toggle" type="checkbox" /> La frase habla
</label>
</div>
<div class="radio" id="device_edit_sound4">Voz:
<label>
<input type="radio" name="device_edit_sound4" id="device_edit_sound4_1" value="hombre" />
Hombre
</label>
<label>
<input type="radio" name="device_edit_sound4" id="device_edit_sound4_2" value="mujer" />
Mujer
</label>
<label>
<input type="radio" name="device_edit_sound4" id="device_edit_sound4_3" value="niño" checked />
Niño
</label>
</div>
</fieldset>
</div>
<!-- Fin de row -->
</form>
</div>
<!-- Fin de Configuración de los dispositivos -->
</div>
<!-- Fin de panel body -->
</div>
<!-- Fin de panel -->
</div>
<!-- Fin de container -->
<!-- Librería jQuery requerida por los plugins de JavaScript -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Librería Para los toggle button -->
<script src="https://gitcdn.github.io/bootstrap-toggle/2.0.0/js/bootstrap-toggle.min.js"></script>
<!-- Todos los plugins JavaScript de Bootstrap (también puedes incluir archivos JavaScript individuales de los únicos plugins que utilices) -->
<script src="js/bootstrap.min.js"></script>
<!-- Librería cropper (Recortar imágenes) -->
<script src="js/cropper.js"></script>
<script>
$(document).ready(function () {
/* CAMBIAR IMAGEN DE PERFIL */
// Llamada al botón examinar oculto al hacer clic en el botón de cambiar imagen
$('#my-button').click(function(){
$('#imgInp').click();
});
//var imgsrc = $("#student_profile").attr("src");
//$(".bootstrap-modal-cropper img").attr("src", imgsrc);
var $image = $(".bootstrap-modal-cropper img");
originalData = {};
$("#bootstrap-modal").on("shown.bs.modal", function() {
$image.cropper({
multiple: true,
aspectRatio: 1,
data: originalData,
done: function(data) {
console.log(data);
}
});
});
// Al hacer clic en Guardar de la ventana modal de recortar imagen, que se cambie la imagen y almacene
$('#button_crop').click(function(){
originalData = $image.cropper("getDataURL",{width:100, height:100}, "image/jpeg", 0.8);
//$image.cropper("destroy");
$("#student_profile").attr("src", originalData);
// Cerrar ventana modal
$('#bootstrap-modal').modal("hide");
});
// Imagen subida se carga en la ventana modal
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
//$('#blah').attr('src', e.target.result);
$(".bootstrap-modal-cropper img").attr("src", e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
// Cuando cambia el estado del botón examinar imagen, leer imagen y abrir ventana modal
$("#imgInp").change(function(){
readURL(this);
// Abrir ventana modal para cambiar tamaño de imagen
$('#bootstrap-modal').modal();
});
/* FIN CAMBIAR IMAGEN DE PERFIL */
// Comprobación para mostrar campos o no del formulario de configuración
var checked = $("#device_edit_picto2").prop('checked');
// Y si lo está, se muestra
if(checked) $("#device_edit_picto3").parent().show();
else $("#device_edit_picto3").parent().hide();
// Se comprueba si está marcado
var checked_picto = $("#device_edit_sound2").prop('checked');
// Y se comprueba también el otro de sonido
var checked_phrase = $("#device_edit_sound3").prop('checked');
// Y si no están ambos, no se oculta el control del tipo de voz
if(!checked_picto && !checked_phrase) $("#device_edit_sound4").hide();
else $("#device_edit_sound4").show();
// Eliminar tutor del alumno
$(document).on('click', '.delete_tutor', (function(e) {
e.preventDefault();
// Confirmación para eliminar
var c = confirm("¿Estás seguro de eliminar?");
if (c == true) $(this).parent().remove();
}));
// Añadir tutor a un alumno cuando se envía el formulario
$(document).on('submit', '#add_tutor form', function(e) {
e.preventDefault();
// Obtener nombre y apellidos
var name = $("#add_tutor #signin_name").val();
var surname = $("#add_tutor #signin_surname").val();
// Añadir al final del listado de tutores
$("#user_tutors").append('<li class="list-group-item"><a href="#"><span class="glyphicon glyphicon-user" aria-hidden="true"></span> '+ name +' '+ surname +'</a> <a href="#" class="delete_tutor"><span class="color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></li>');
// Poner en blanco los campos del formulario
$(this).find("input, textarea").val("");
// Ocultar ventana modal
$('#add_tutor').modal('hide');
});
// Eliminar dispositivo del alumno
$(document).on('click', '.delete_device', (function(e) {
e.preventDefault();
// Confirmación para eliminar
var c = confirm("¿Estás seguro de eliminar?");
if (c == true) $(this).parent().remove();
}));
// Añadir dispositivo a un alumno cuando se envía el formulario
$(document).on('submit', '#student_devices form', function(e) {
e.preventDefault();
// Obtener nombre y apellidos
var device_name = $("#student_devices #srch-term-device").val();
// Añadir al final del listado de tutores
$("#user_devices").append('<li class="list-group-item"><span class="glyphicon glyphicon-phone" aria-hidden="true"></span> '+ device_name +' <a href="#" class="delete_device"><span class="color_red glyphicon glyphicon-remove-circle" aria-hidden="true"></span></a></li>');
// Poner en blanco los campos del formulario
$(this).find("input, textarea").val("");
});
// Al cambiar el estado de mostrar leyenda, desactivar o activar el siguiente control (mostrar arriba o abajo)
$(document).on('change', '#device_edit_picto2', function() {
// Se comprueba si está marcado
var checked = $(this).prop('checked');
// Y si lo está, se muestra
if(checked) $("#device_edit_picto3").parent().show();
else $("#device_edit_picto3").parent().hide();
});
// Al cambiar el estado picto habla
$(document).on('change', '#device_edit_sound2, #device_edit_sound3', function() {
// Se comprueba si está marcado
var checked_picto = $("#device_edit_sound2").prop('checked');
// Y se comprueba también el otro de sonido
var checked_phrase = $("#device_edit_sound3").prop('checked');
// Y si no están ambos, no se oculta el control del tipo de voz
if(!checked_picto && !checked_phrase) $("#device_edit_sound4").hide();
else $("#device_edit_sound4").show();
});
});
</script>
</body>
</html>
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 sign in to comment