Show:

File: app/components/exp-lookit-text/component.js

  1. import layout from './template';
  2. import ExpFrameBaseComponent from '../exp-frame-base/component';
  3.  
  4. /**
  5. * @module exp-player
  6. * @submodule frames
  7. */
  8.  
  9. /**
  10. * A frame to display text-only instructions, etc. to the user.
  11.  
  12. ```json
  13. "frames": {
  14. "study-intro": {
  15. "blocks": [
  16. {
  17. "emph": true,
  18. "text": "Important: your child does not need to be with you until the videos begin. First, let's go over what will happen!",
  19. "title": "Your baby, the physicist"
  20. },
  21. {
  22. "text": "Some introductory text about this study."
  23. },
  24. {
  25. "text": "Another paragraph about this study."
  26. }
  27. ],
  28. "showPreviousButton": false,
  29. "kind": "exp-lookit-text"
  30. }
  31. }
  32.  
  33. * ```
  34. * @class Exp-lookit-text
  35. * @extends Exp-frame-base
  36. */
  37.  
  38. export default ExpFrameBaseComponent.extend({
  39. type: 'exp-lookit-text',
  40. layout: layout,
  41.  
  42. frameSchemaProperties: {
  43. /**
  44. * Whether to show a 'previous' button
  45. *
  46. * @property {Boolean} showPreviousButton
  47. * @default true
  48. */
  49. showPreviousButton: {
  50. type: 'boolean',
  51. default: true
  52. },
  53. /**
  54. * Array of text blocks (paragraphs) to display. Rendered using
  55. * {{#crossLink "Exp-text-block"}}{{/crossLink}}, so all parameters
  56. * of ExpTextBlock can be used.
  57. *
  58. * @property {Object} blocks
  59. * @param {String} title title to display
  60. * @param {String} text paragraph of text
  61. * @param {Boolean} emph whether to bold this paragraph
  62. */
  63. blocks: {
  64. type: 'array',
  65. items: {
  66. type: 'object',
  67. properties: {
  68. title: {
  69. type: 'string'
  70. },
  71. text: {
  72. type: 'string'
  73. },
  74. emph: {
  75. type: 'boolean'
  76. }
  77. }
  78. },
  79. default: []
  80. }
  81. },
  82.  
  83. meta: {
  84. data: {
  85. type: 'object',
  86. properties: {
  87.  
  88. }
  89. }
  90. }
  91. });
  92.