Skip to content

Estado de la aplicación_es

Jump to bottom
sonsoleslp edited this page Sep 2, 2018 · 8 revisions

Introducción

Una de las principales características de Redux es que se basa en la inmutabilidad, es decir, cuando se quiere cambiar un objeto, no se le asigna el nuevo valor que se desee sino que se recrea por completo el objeto con el valor actualizado (el objeto no muta). La ventaja de esto es que se puede saber si el objeto ha mutado de manera inmediata (comparando por referencia en vez de por valor, y cuanto más profundo es el objeto, más se nota la diferencia) y si se tiene una librería gráfica que es capaz de repintar de manera eficiente la interfaz (como es el caso de React), se puede apreciar una mejora considerable del rendimiento general de la aplicación.

Para cambiar el estado, principalmente se usa la función Object.assign y la notación dispersa (...), ambas características definidas en las versiones 6 y 7 de Ecmascript, por lo que aún no están soportadas por todos los navegadores y se tienen que usar funciones traductoras al compilar para asegurar la compatibilidad. Sin embargo, esto no puede usarse en todos los casos necesarios y hay veces que lo que se hace es directamente asignar el nuevo objeto a la porción del estado deseado (por ejemplo, si se quiere reordenar un array de índices).

Para saber exactamente cómo funcionan estas dos características, lo mejor es consultar la documentación, pero a grandes rasgos lo que hacen es fusionar dos objetos y devolver uno nuevo, en el caso de Object.assign, el primer parámetro es un objeto vacío (es el que se devuelve y se rellena con el resultado de la función), el segundo es el objeto original (la parte del estado correspondiente) y el tercero es un objeto con las propiedades del segundo que se desean cambiar y sus nuevos valores. En el caso de la notación dispersa, se usa para indicar que se deben copiar todas las propiedades del objeto indicado y añadir las siguientes a un objeto nuevo (generalmente se usa para añadir elementos a un array). Sin embargo, se puede ver rápidamente que en el caso de querer borrar un elemento de un array, lo más sencillo es devolver uno nuevo filtrando el elemento no deseado.

Por otra parte, según las guías de diseño de Redux, es recomendable no tratar al estado como un árbol gigantesco de objetos sino de una manera algo más parecida a una base de datos, donde se tiene constancia de los identificadores de los objetos por un lado y de los mismos por otro. Esto ha demostrado ser cómodo en algunas ocasiones, ya que por ejemplo es muy sencillo saber el total de EditorBox que hay en una vista en un momento dado, recorrerlos o saber las relaciones de parentesco que hay entre ellos, dado que se guardan los identificadores de los EditorBox hijos y luego se dispone de un diccionario con todos ellos para acceder a sus datos en concreto.

Descripción

A continuación, se puede observar un estado de ejemplo y tras ello, una breve descripción de los elementos más relevantes.

    {
    	"undoGroup": {
    		"past": [],
    		"present":{
    			"version":"1",
    			"lastActionDispatched":"INDEX_SELECT",
    			"globalConfig":{
    				"title":"EdiphyDoc",
    				"author":"GING",
    				"canvasRatio":1.7777777777777777,
    				"age":{
    					"max":100,
    					"min":0
    				},
    				"typicalLearningTime":{
    					"h":0,
    					"m":"30",
    					"s":0
    				},
    				"difficulty":"very easy",
    				"rights":"cc-by",
    				"description":"Example",
    				"thumbnail":"http://localhost:8081/fb8d18d216bebbe4dfc39f0b1771a3b4.jpg",
    				"language":"en",
    				"keywords":[{"id":1,"text":"github"}, {"id":2, "text":"ediphy"}, {"id":3, "text":"docs"}],
    				"version":"1.0.0",
    				"status":"draft",
    				"context":"other",
    				"hideGlobalScore":false,
    				"minTimeProgress":10,
    				"visorNav":{
    					"player":true,
    					"sidebar":true,
    					"keyBindings":true
    				},
    				"modifiedState":true,
    				"showAlert":false,
    				"everPublished":false
    			},
    			"boxesById":{
    				"bs-1535353910908":{
    					"parent":"pa-1535353910908",
    					"id":"bs-1535353910908",
    					"container":0,
    					"level":-1,
    					"col":0,
    					"row":0,
    					"position":{
    						"type":"relative",
    						"x":0,
    						"y":0
    					},
    					"draggable":false,
    					"resizable":false,
    					"showTextEditor":false,
    					"fragment":{},
    					"children":["sc-1535353912282"],
    					"sortableContainers":{
    						"sc-1535353912282":{
    							"children":["bo-1535353912282"],
    							"style":{
    								"padding":"0px",
    								"borderColor":"#ffffff",
    								"borderWidth":"0px",
    								"borderStyle":"solid",
    								"opacity":"1",
    								"textAlign":"center",
    							},
    							"height":"auto",
    							"key":"sc-1535353912282",
    							"colDistribution":[100],
    							"cols":[[100]]
    						}
    					},
    					"containedViews":[]
    					},
    				"bo-1535353912282":{
    					"id":"bo-1535353912282",
    					"parent":"bs-1535353910908",
    					"container":"sc-1535353912282",
    					"level":0,
    					"col":0,
    					"row":0,
    					"position":{
    						"x":0,
    						"y":0,
    						"type":"relative"
    					},
    					"draggable":true,
    					"resizable":false,
    					"showTextEditor":false,
    					"fragment":{
    					},
    					"children":[],
    					"sortableContainers":{ },
    					"containedViews":["cv-1535353924845"]
    				},
    				"bo-1535353943033":{
    					"id":"bo-1535353943033",
    					"parent":"pa-1497983247795",
    					"container":0,
    					"level":0,
    					"col":0,
    					"row":0,
    					"position":{
    					"x":"27.430293896006027%",
    					"y":"14.611260053619302%",
    					"type":"absolute"},
    					"draggable":true,
    					"resizable":true,
    					"showTextEditor":false,
    					"fragment":{
    					},
    					"children":[],
    					"sortableContainers":{
    					},
    					"containedViews":["cv-1535353959572"]
    				},
    				"bo-1535353987146":{
    					"id":"bo-1535353987146",
    					"parent":"cv-1535353924845",
    					"container":0,
    					"level":0,
    					"col":0,
    					"row":0,
    					"position":{
    						"x":"21.77%",
    						"y":"26.47%",
    						"type":"absolute"
    					},
    					"draggable":true,
    					"resizable":true,
    					"showTextEditor":false,
    					"fragment":{},
    					"children":[
    						"sc-Question",
    						"sc-Answer0",
    						"sc-Answer1",
    						"sc-Answer2",
    						"sc-Feedback"
    					],
    					"sortableContainers":{
    						"sc-Question":{
        						"children":["bo-1535353987152_0"],
        						"style":{
        						"padding":"0px",
        						"borderColor":"#ffffff",
        						"borderWidth":"0px",
        						"borderStyle":"solid",
        						"opacity":"1",
        						"textAlign":"left",
        						"className":""},
        						"height":"auto",
        						"key":"sc-Question",
        						"colDistribution":[100],
        						"cols":[[100]]
                            },
    						"sc-Answer0":{
        						"children":["bo-1535353987152_1"],
        						"style":{
        						"padding":"0px",
        						"borderColor":"#ffffff",
        						"borderWidth":"0px",
        						"borderStyle":"solid",
        						"opacity":"1",
        						"textAlign":"left",
        						"className":""},
        						"height":"auto",
        						"key":"sc-Answer0",
        						"colDistribution":[100],
        						"cols":[[100]]
                            },
    						"sc-Answer1":{
        						"children":["bo-1535353987152_2"],
        						"style":{
        						"padding":"0px",
        						"borderColor":"#ffffff",
        						"borderWidth":"0px",
        						"borderStyle":"solid",
        						"opacity":"1",
        						"textAlign":"left",
        						"className":""},
        						"height":"auto",
        						"key":"sc-Answer1",
        						"colDistribution":[100],
        						"cols":[[100]]
                            },
    						"sc-Answer2":{
        						"children":["bo-1535353987152_3"],
        						"style":{
        						"padding":"0px",
        						"borderColor":"#ffffff",
        						"borderWidth":"0px",
        						"borderStyle":"solid",
        						"opacity":"1",
        						"textAlign":"left",
        						"className":""},
        						"height":"auto",
        						"key":"sc-Answer2",
        						"colDistribution":[100],
        						"cols":[[100]]
                            },
    						"sc-Feedback":{
        						"children":["bo-1535353987152_4"],
        						"style":{
        						"padding":"0px",
        						"borderColor":"#ffffff",
        						"borderWidth":"0px",
        						"borderStyle":"solid",
        						"opacity":"1",
        						"textAlign":"left",
        						"className":""},
        						"height":"auto",
        						"key":"sc-Feedback",
        						"colDistribution":[100],
        						"cols":[[100]]
                            }
                        },
						"containedViews":[]
                    },
					"bo-1535353987152_0":{
						"id":"bo-1535353987152_0",
						"parent":"bo-1535353987146",
						"container":"sc-Question",
						"level":1,
						"col":0,
						"row":0,
						"position":{
						"x":0,
						"y":0,
						"type":"relative"},
						"content":{
						"node":"root",
						"child":[{"node":"element",
						"tag":"p",
						"child":[{"node":"text",
						"text":"Esta es una pregunta con varias opciones para responder. Sólo una puede ser correcta. Puedes escribir aquí el enunciado de la pregunta"}]}]},
						"draggable":true,
						"resizable":false,
						"showTextEditor":false,
						"fragment":{
						},
						"children":[],
						"sortableContainers":{
						},
						"containedViews":[]
                    },
    				"bo-1535353987152_1":{
    					"id":"bo-1535353987152_1",
    					"parent":"bo-1535353987146",
    					"container":"sc-Answer0",
    					"level":1,
    					"col":0,
    					"row":0,
    					"position":{
    						"x":0,
    						"y":0,
    						"type":"relative"
    					},
    					"content":{
    					"node":"root",
    					"child":[{"node":"element",
    					"tag":"p",
    					"child":[{"node":"text",
    					"text":"Respuesta 1"}]}]},
    					"draggable":true,
    					"resizable":false,
    					"showTextEditor":false,
    					"fragment":{
    					},
    					"children":[],
    					"sortableContainers":{
    					},
    					"containedViews":[]},
    				"bo-1535353987152_2":{
    					"id":"bo-1535353987152_2",
    					"parent":"bo-1535353987146",
    					"container":"sc-Answer1",
    					"level":1,
    					"col":0,
    					"row":0,
    					"position":{
    					"x":0,
    					"y":0,
    					"type":"relative"},
    					"content":{
    					"node":"root",
    					"child":[{"node":"element",
    					"tag":"p",
    					"child":[{"node":"text",
    					"text":"Respuesta 2"}]}]},
    					"draggable":true,
    					"resizable":false,
    					"showTextEditor":false,
    					"fragment":{
    					},
    					"children":[],
    					"sortableContainers":{
    					},
    					"containedViews":[]
    				},
    				"bo-1535353987152_3":{
    					"id":"bo-1535353987152_3",
    					"parent":"bo-1535353987146",
    					"container":"sc-Answer2",
    					"level":1,
    					"col":0,
    					"row":0,
    					"position":{
    					"x":0,
    					"y":0,
    					"type":"relative"},
    					"content":{
    					"node":"root",
    					"child":[{"node":"element",
    					"tag":"p",
    					"child":[{"node":"text",
    					"text":"Respuesta 3"}]}]},
    					"draggable":true,
    					"resizable":false,
    					"showTextEditor":false,
    					"fragment":{
    					},
    					"children":[],
    					"sortableContainers":{
    					},
    					"containedViews":[]
    				},
    				"bo-1535353987152_4":{
    					"id":"bo-1535353987152_4",
    					"parent":"bo-1535353987146",
    					"container":"sc-Feedback",
    					"level":1,
    					"col":0,
    					"row":0,
    					"position":{
    					"x":0,
    					"y":0,
    					"type":"relative"},
    					"content":{
    					"node":"root",
    					"child":[{"node":"element",
    					"tag":"p",
    					"child":[{"node":"text",
    					"text":"Aquí puedes incluir una explicación acerca de la respuesta"}]}]},
    					"draggable":true,
    					"resizable":false,
    					"showTextEditor":false,
    					"fragment":{
    					},
    					"children":[],
    					"sortableContainers":{
    					},
    					"containedViews":[]
    				}
    			},
    			"boxSelected":-1,
    			"boxLevelSelected":0,
    			"indexSelected":"cv-1535353924845",
    			"marksById":{
    				"rm-1535353924845":{
    					"id":"rm-1535353924845",
    					"origin":"bo-1535353912282",
    					"title":"Nueva marca 1",
    					"connection":"cv-1535353924845",
    					"color":"#3939ac",
    					"connectMode":"existing",
    					"displayMode":"navigate",
    					"value":"48.51,53.59"
    				},
    				"rm-1535353936013":{
    					"id":"rm-1535353936013",
    					"origin":"bo-1535353912282",
    					"title":"Nueva marca 2",
    					"connection":"Hello!",
    					"color":"#000001",
    					"connectMode":"popup",
    					"displayMode":"navigate",
    					"value":"79.25,60.38"
    				},
    				"rm-1535353952372":{
    					"id":"rm-1535353952372",
    					"origin":"bo-1535353943033",
    					"title":"Nueva marca 3",
    					"connection":"http://vishub.org/",
    					"color":"#020100",
    					"connectMode":"external",
    					"displayMode":"navigate",
    					"value":"41.18,40.11, 1"
    				},
    				"rm-1535353959572":{
    					"id":"rm-1535353959572",
    					"origin":"bo-1535353943033",
    					"title":"Nueva marca 4",
    					"connection":"pa-1535353910908",
    					"color":"#000002",
    					"connectMode":"existing",
    					"displayMode":"navigate",
    					"value":"70.26,27.86,1"
    				}
    			},
    			"navItemsIds":[
    				"pa-1497983247795",
    				"se-1535354055428",
    				"pa-1535353910908"
    				],
    			"navItemSelected":"pa-1535353910908",
    			"navItemsById":{
    				"0":{
    					"id":0,
    					"children":[
    						"pa-1497983247795",
    						"se-1535354055428"
    					],
    					"boxes":[],
    					"level":0,
    					"type":"",
    					"hidden":false,
    					"isExpanded":true
    					},
    				"pa-1497983247795":{
    					"id":"pa-1497983247795",
    					"isExpanded":true,
    					"parent":0,
    					"linkedBoxes":{ },
    					"children":[],
    					"boxes":["bo-1535353943033"],
    					"level":1,
    					"type":"slide",
    					"hidden":false,
    					"customSize":0
    				},
    				"pa-1535353910908":{
    					"id":"pa-1535353910908",
    					"isExpanded":true,
    					"parent":"se-1535354055428",
    					"children":[],
    					"boxes":["bs-1535353910908"],
    					"linkedBoxes":{
    						"rm-1535353959572":"bo-1535353943033"
    					},
    					"level":2,
    					"type":"document",
    					"hidden":false,
    					"customSize":0
    				},
    				"se-1535354055428":{
    					"id":"se-1535354055428",
    					"isExpanded":true,
    					"parent":0,
    					"children":["pa-1535353910908"],
    					"boxes":[],
    					"linkedBoxes":{ },
    					"level":1,
    					"type":"section",
    					"hidden":false,
    				}
    			},
    			"containedViewsById":{
    				"cv-1535353924845":{
    					"info":"new",
    					"type":"slide",
    					"id":"cv-1535353924845",
    					"parent":{
    						"rm-1535353924845":"bo-1535353912282"
    					},
    					"boxes":["bo-1535353987146"],
    				}
    			},
    			"containedViewSelected":"cv-1535353924845",
    			"displayMode":"list",
    			"pluginToolbarsById":{
    				"bs-1535353910908":{
    					"id":"bs-1535353910908",
    					"pluginId":"sortable_container",
    					"showTextEditor":false,
    					"state":{ },
    					"structure":{
    						"aspectRatio":true,
    						"height":"",
    						"position":"absolute",
    						"rotation":"",
    						"width":""
    					},
    					"style":{
    						"backgroundColor":"#ffffff",
    						"boderWidth":0,
    						"borderColor":"#000000",
    						"borderRadius":0,
    						"borderStyle":"solid",
    						"opacity":1,
    						"padding":0
    					}
    				},
    				"bo-1535353912282":{
    					"id":"bo-1535353912282",
    					"pluginId":"HotspotImages",
    					"state":{
    						"url":"http://vishub.org/pictures/12.jpg"
    					},
    					"structure":{
    						"height":"auto",
    						"width":25,
    						"widthUnit":"%",
    						"heightUnit":"px",
    						"rotation":0,
    						"aspectRatio":true,
    						"position":"absolute"
    					},
    					"style":{
    						"padding":0,
    						"backgroundColor":"#ffffff",
    						"borderWidth":0,
    						"borderStyle":"solid",
    						"borderColor":"#000000",
    						"borderRadius":0,
    						"opacity":1
    						},
    						"showTextEditor":false
    					},
    				"bo-1535353943033":{
    					"id":"bo-1535353943033",
    					"pluginId":"EnrichedPDF",
    					"state":{
    						"url":"https://media.readthedocs.org/pdf/flask-cors/latest/flask-cors.pdf",
    						"numPages":null,
    						"pageNumber":1
    					},
    					"structure":{
    						"height":78.88739946380697,
    						"width":43.03692539562924,
    						"widthUnit":"%",
    						"heightUnit":"%",
    						"rotation":0,
    						"aspectRatio":false,
    						"position":"absolute",
    						"x":"21.57%",
    						"y":"15.622815013404825%"
    					},
    					"style":{
    						"borderWidth":2,
    						"borderStyle":"solid",
    						"borderColor":"#333",
    						"borderRadius":0,
    						"opacity":1
    					},
    					"showTextEditor":false
    				},
    				"bo-1535353987146":{
    					"id":"bo-1535353987146",
    					"pluginId":"MultipleChoice",
    					"state":{
    						"nBoxes":3,
    						"showFeedback":true,
    						"letters":true,
    						"__pluginContainerIds":{
    							"sc-Question":{
    								"id":"sc-Question",
    								"name":"Pregunta",
    								"height":"auto"
    							},
    							"sc-Answer0":{
    								"id":"sc-Answer0",
    								"name":"Respuesta 1",
    								"height":"auto"
    							},
    							"sc-Answer1":{
    								"id":"sc-Answer1",
    								"name":"Respuesta 2",
    								"height":"auto"
    							},
    							"sc-Answer2":{
    								"id":"sc-Answer2",
    								"name":"Respuesta 3",
    								"height":"auto"
    							},
    							"sc-Feedback":{
    								"id":"sc-Feedback",
    								"name":"Explicación",
    								"height":"auto"
    							}
    						}
    					},
    					"structure":{
    						"height":"auto",
    						"width":60,
    						"widthUnit":"%",
    						"heightUnit":"%",
    						"rotation":0,
    						"aspectRatio":false,
    						"position":"absolute"
    					},
    					"style":{
    						"padding":10,
    						"backgroundColor":"#ffffff",
    						"borderWidth":1,
    						"borderStyle":"solid",
    						"borderColor":"#dbdbdb",
    						"borderRadius":0,
    						"opacity":1
    					},
    					"showTextEditor":false
    				},
    				"bo-1535353987152_0":{
    					"id":"bo-1535353987152_0",
    					"pluginId":"BasicText",
    					"state":{
    						__text":"<p>Esta es una pregunta con varias opciones para responder. Sólo una puede ser correcta. Puedes escribir aquí el enunciado de la pregunta</p>"
    					},
    					"structure":{
    						"height":"auto",
    						"width":"auto",
    						"widthUnit":"%",
    						"heightUnit":"px",
    						"rotation":0,
    						"aspectRatio":false,
    						"position":"absolute"
    					},
    					"style":{
    						"padding":7,
    						"backgroundColor":"rgba(255, 255, 255, 0)",
    						"borderWidth":0,
    						"borderStyle":"solid",
    						"borderColor":"#000000",
    						"borderRadius":0,
    						"opacity":1
    					},
    					"showTextEditor":false
    				},
    				"bo-1535353987152_1":{
    					"id":"bo-1535353987152_1",
    					"pluginId":"BasicText",
    					"state":{
    						"__text":"<p>Respuesta 1</p>"
    					},
    					"structure":{
    						"height":"auto",
    						"width":"auto",
    						"widthUnit":"%",
    						"heightUnit":"px",
    						"rotation":0,
    						"aspectRatio":false,
    						"position":"absolute"
    					},
    					"style":{
    						"padding":7,
    						"backgroundColor":"rgba(255, 255, 255, 0)",
    						"borderWidth":0,
    						"borderStyle":"solid",
    						"borderColor":"#000000",
    						"borderRadius":0,
    						"opacity":1
    					},
    					"showTextEditor":false
    				},
    				"bo-1535353987152_2":{
    					"id":"bo-1535353987152_2",
    					"pluginId":"BasicText",
    					"state":{
    						"__text":"<p>Respuesta 2</p>"
    					},
    					"structure":{
    						"height":"auto",
    						"width":"auto",
    						"widthUnit":"%",
    						"heightUnit":"px",
    						"rotation":0,
    						"aspectRatio":false,
    						"position":"absolute"
    					},
    					"style":{
    						"padding":7,
    						"backgroundColor":"rgba(255, 255, 255, 0)",
    						"borderWidth":0,
    						"borderStyle":"solid",
    						"borderColor":"#000000",
    						"borderRadius":0,
    						"opacity":1
    					},
    					"showTextEditor":false
    				},
    				"bo-1535353987152_3":{
    					"id":"bo-1535353987152_3",
    					"pluginId":"BasicText",
    					"state":{
    						"__text":"<p>Respuesta 3</p>"
    					},
    					"structure":{
    						"height":"auto",
    						"width":"auto",
    						"widthUnit":"%",
    						"heightUnit":"px",
    						"rotation":0,
    						"aspectRatio":false,
    						"position":"absolute"
    					},
    					"style":{
    						padding":7,
    						"backgroundColor":"rgba(255, 255, 255, 0)",
    						"borderWidth":0,
    						"borderStyle":"solid",
    						"borderColor":"#000000",
    						"borderRadius":0,
    						"opacity":1
    					},
    					"showTextEditor":false},
    				"bo-1535353987152_4":{
    					"id":"bo-1535353987152_4",
    					"pluginId":"BasicText",
    					"state":{
    						"__text":"<p>Aquí puedes incluir una explicación acerca de la respuesta</p>"},
    					"structure":{
    						"height":"auto",
    						"width":"auto",
    						"widthUnit":"%",
    						"heightUnit":"px",
    						"rotation":0,
    						"aspectRatio":false,
    						"position":"absolute"
    					},
    					"style":{
    						"padding":7,
    						"backgroundColor":"rgba(255, 255, 255, 0)",
    						"borderWidth":0,
    						"borderStyle":"solid",
    						"borderColor":"#000000",
    						"borderRadius":0,
    						"opacity":1
    					},
    					"showTextEditor":false
    				}
    			},
    			"viewToolbarsById":{
    				"pa-1497983247795":{
    					"id":"pa-1497983247795",
    					"viewName":"Intro",
    					"breadcrumb":"hidden",
    					"courseTitle":"hidden",
    					"documentSubtitle":"hidden",
    					"documentSubtitleContent":"Subtítulo",
    					"documentTitle":"expanded",
    					"documentTitleContent":"",
    					"numPage":"hidden",
    					"numPageContent":"",
    					"background":"#ffffff",
    					"backgroundAttr":"",
    					"aspectRatio":""
    				},
    				"pa-1535353910908":{
    					"id":"pa-1535353910908",
    					"breadcrumb":"reduced",
    					"doc_type":"document",
    					"viewName":"Final",
    					"courseTitle":"hidden",
    					"documentSubtitle":"hidden",
    					"documentSubtitleContent":"Subtítulo",
    					"documentTitle":"expanded",
    					"documentTitleContent":"",
    					"numPage":"hidden",
    					"numPageContent":1,
    					"customSize":0,
    					"aspectRatio":true,
    					"background":"#ffffff",
    					"backgroundAttr":""
    					},
    				"cv-1535353924845":{
    					"id":"cv-1535353924845",
    					"breadcrumb":"hidden",
    					"doc_type":"slide",
    					"viewName":"Extra",
    					"courseTitle":"hidden",
    					"documentSubtitle":"hidden",
    					"documentSubtitleContent":"Subtítulo",
    					"documentTitle":"expanded",
    					"documentTitleContent":"",
    					"numPage":"hidden",
    					"numPageContent":"",
    					"customSize":0,
    					"aspectRatio":true,
    					"background":"#ffffff",
    					"backgroundAttr":""},
    				"se-1535354055428":{
    					"id":"se-1535354055428",
    					"breadcrumb":"reduced",
    					"doc_type":"section",
    					"viewName":"F1",
    					"courseTitle":"hidden",
    					"documentSubtitle":"hidden",
    					"documentSubtitleContent":"Subtítulo",
    					"documentTitle":"expanded",
    					"documentTitleContent":"",
    					"numPage":"hidden",
    					"numPageContent":2,
    					"customSize":0,
    					"aspectRatio":true,
    					"background":"#ffffff",
    					"backgroundAttr":""
    				}
    			},
    			"exercises":{
    				"pa-1497983247795":{
    					"id":"pa-1497983247795",
    					"submitButton":true,
    					"trackProgress":false,
    					"attempted":false,
    					"weight":10,
    					"minForPass":50,
    					"exercises":{},
    					"score":0
    				},
    				"pa-1535353910908":{
    					"id":"pa-1535353910908",
    					"submitButton":true,
    					"trackProgress":false,
    					"attempted":false,
    					"minForPass":50,
    					"score":0,
    					"weight":10,
    					"exercises":{}
    				},
    				"cv-1535353924845":{
    					"id":"cv-1535353924845",
    					"submitButton":true,
    					"trackProgress":false,
    					"attempted":false,
    					"minForPass":50,
    					"score":0,
    					"weight":10,
    					"exercises":{
    						"bo-1535353987146":{
    							"name":"MultipleChoice",
    							"id":"bo-1535353987146",
    							"weight":1,
    							"correctAnswer":0,
    							"currentAnswer":false,
    							"attempted":false,
    							"score":0
    						}
    					}
    				}
    			},
    			"isBusy":{
    				"value":false,
    				"msg":"La operación se ha realizado correctamente",
    				"reason":"saving_state"
    			},
    		},
    		"future":[]
    	},
    	"status":"draft",
    	"everPublished":false,
    	"filesUploaded":{
    		"file-1535354328935":{
    			"id":"file-1535354328935",
    			"url":"http://localhost:8081/fb8d18d216bebbe4dfc39f0b1771a3b4.jpg",
    			"name":"desert.jpg",
    			"keywords":"",
    			"mimetype":"image/jpeg"
    		}
    	}
    }

La aplicación emplea redux-undo, para facilitar la implementación de las acciones de deshacer/rehacer. Es por ello que las propiedades que se pueden deshacer/rehacer están en un grupo aparte (undoGroup), que contiene el estado actual (present) y la lista de estados pasados y futuros (past y future respectivamente). Dentro del objeto present, se encuentra la información más relevante acerca del contenido del documento Ediphy. Alguno de los campos más interesantes son los siguientes:

  • version es el nº de versión de Ediphy con el que se está editando el contenido.
  • globalConfig es un objeto que contiene la configuración global del proyecto. En la sección de Configuración Global se explica cada una de las propiedades
  • boxesById es un diccionario que contiene todas los EditorBox usando su identificador como clave. Se puede apreciar que cada una tiene mucha información entre la que destaca:
    • id si se trata de un EditorBox, el identificador empieza por "bo-", si es un EditorBoxSortable, por "bs-".
    • parent: el identificador del padre. Puede ser tanto una vista (página o sección) como otro EditorBox.
    • container: el identificador del contenedor. Si es hijo de un EditorBox, estará alojado en un SortableContainer y esta propiedad guarda el identificador del mismo (este SortableContainer y probablemente otros aparecerán como hijos del EditorBox padre.
    • children: array de identificadores de hijos (se refiere a SortableContainer, no a EditorBox).
    • sortableContainers: diccionario que contiene la definición de todos los SortableContainer hijos del EditorBox actual. Estos tienen un array de identificadores (esta vez de EditorBox), altura y distribución de filas y columnas del SortableContainer.
    • content: JSON que describe el HTML de la plantilla del plugin.
    • text: variable que guarda la salida exacta del CKEditor para reestablecerla al volver a editar. Sólo se usa si el plugin ha activado la edición de texto.
    • draggable: Booleano que indica si se puede arrastrar dentro de su contenedor.
    • resizable: Booleano que indica si la caja se sitúa flotando en su contenedor (diapositiva)
    • col: Número de columna en el que está dentro de su SortableContainer.
    • row: Número de fila en el que está dentro de su SortableContainer.
    • position: Diccionario que incluye información sobre el posicionamento de un EditorBox. Concretamente:
      • x: Posición x.
      • y: Posición y.
      • type: Puede ser una caja flotante (absolute) o ordenada (relative)
  • boxSelected almacena el identificador del EditorBox seleccionado o -1 si no hay ninguno.
  • boxes es un array con todos los identificadores de todos los EditorBox en el curso.
  • navItemsIds es un array con todos los identificadores de todas las vistas (páginas y secciones) del curso.
  • navItemsById es un diccionario que contiene todas las vistas usando su identificador como clave (como prefijo se usa "se-" para las secciones y "pa-" para las páginas). Es de destacar que siempre existe una vista fantasma con identificador 0 que es el padre del resto.
  • navItemSelected almacena el identificador único de la vista que se está editando.
  • containedViewsById es un diccionario que contiene todas las vistas contenidas usando su identificador como clave (se usa "cv-" como prefijo para distinguirse de las demás vistas). Es importante destacar que, como todas las vistas contenidas están al mismo nivel), el objeto parent de cada una hace referencia a las EditorBox y marca concreta desde las que se enlaza. En el ejemplo se ve claramente.
  • containedViewSelected almacena el identificador único de la vista contenida que se está editando.
  • marksById almacena la información relativa a las marcas. Es un objeto cuyas claves son los identificadores de las marcas y los valores contienen la información de cada marca con las siguientes propiedades:
  • id": Identificador de la marca
  • origin": Identificador de la caja que la contiene
  • title": Nombre de la marca
  • connection": Destino (identificador de la vista, enlace, o texto)
  • color: Color en el que se muestra
  • connectMode": Tipo de conexión (a una vista existente, a una nueva, externa, o pop-up)
  • value": Valor de la marca (el formato se define de forma distinta en cada plugin)
  • indexSelected almacena el identificador único de la vista contenida o vista que se está editando en el índice, es decir, la que se puede eliminar, crear páginas hijas/hermanas, etc.
  • pluginToolbarsById es un diccionario con todas las barras de herramientas de los EditorBox, usando como clave el identificador del EditorBox correspondiente. Las siguientes propiedades son especialmente relevantes:
    • id: Identificador de la caja
    • pluginId: Identificador del plugin
    • state: Estado de la caja (depende del plugin)
    • structure: Estructura (contiene información relativa a la anchura, altura, etc)
    • style: Estilo de la caja (propiedades CSS)
  • viewToolbarsById es un diccionario con todas las barras de herramientas de las distintas vistas y vistas contendas, usando como clave el identificador de la vista correspondiente. Las siguientes propiedades son especialmente relevantes para cada una de las vistas:
    • id: almacena el identificador de la vista
    • viewName: Nombre de la vista en el índice
    • breadcrumb: Determina si se muestra o no la jerarquía de secciones en la vista
    • courseTitle: Determina si se muestra o no el título del documento global en la vista
    • documentSubtitle: Determina si se muestra o no un subtítulo en la vista
    • documentSubtitleContent: Contenido del subtítulo
    • documentTitle: Determina si se muestra o no el título en la vista
    • documentTitleContent: Contenido del título (por defecto igual que en el índice)
    • numPage: Determina si se muestra o no el nº de página
    • numPageContent: Nº de página
    • background: Fondo de la vista
    • backgroundAttr: Tipo de fondo (centrado, repetido), igual que en CSS
    • aspectRatio: Relación de aspecto (en diapositivas)
  • exercises: es un diccionario con toda la información relativa a los ejercicios. Tiene dos niveles de jerarquía (vistas y cajas). El objeto exercises contiene pares clave-valor en los que la clave es el identificador de la vista y el valor es un objeto con las siguientes propiedades.
    • id: Identificador de la vista
    • submitButton: Indica si debe mostrar un botón para enviar la respuesta
    • attempted: Indica si el usuario ya ha enviado los ejercicios de esta vista (se usa en el visor)
    • minForPass: Mínima nota para aprobar
    • score: Puntuación obtenida tras cursar la vista (se usa en el visor)
    • weight: Peso que tiene la vista sobre el total de vistas
    • exercises: Es un objeto que contiene pares clave-valor en los que la clave es el identificador de la caja ejercicio y el valor es un objeto con las siguientes propiedades.
      • name: Nombre del tipo de ejercicio
      • id: Identificador de la caja
      • weight: Peso del ejercicio sobre los demás de la vista
      • correctAnswer: Respuesta correcta
      • currentAnswer: Respuesta marcada por el usuario (se usa en el visor)
      • attempted: Indica si el usuario ya ha enviado el ejercicio( se usa en el visor)
      • score : Puntuación obtenida tras cursar el ejercicio (se usa en el visor)

Mejoras futuras

Eliminar las propiedades del estado que ya no se usen o que sean redundantes

ENGLISH

ESPAÑOL

Clone this wiki locally