1. 1 : /**
  2. 2 : * @module EventView/Parts
  3. 3 : * @local Parts
  4. 4 : * @local FakePart
  5. 5 : */
  6. 6 :
  7. 7 : export {Parts, FakePart}
  8. 8 :
  9. 9 : /**
  10. 10 : * @abstract
  11. 11 : * @class
  12. 12 : * @classdesc Représentation d'une partie de la vue de la création/édition d'un évènement. Il gère les actions visuels et comportements de cette partie.
  13. 13 : */
  14. 14 : class Parts {
  15. 15 : /**
  16. 16 : * Constructeur de la classe. Il demande le champs qui sera gérer ainsi que son "mode de fonctionnement". (cad, si il est actionner par un clique ou un changement d'état)
  17. 17 : * @param {external:jQuery} $field Champs qui sera gérer par cette classe.
  18. 18 : * @param {...Parts.MODE} modes Mode de fonctionnement.
  19. 19 : */
  20. 20 : constructor($field, ...modes) {
  21. 21 : /**
  22. 22 : * Champ qui sera gérer par cette partie. Ce champ sera utiliser pour sauvegarder les données qui lui sont liés.
  23. 23 : * @protected
  24. 24 : * @member
  25. 25 : * @type {external:jQuery}
  26. 26 : */
  27. 27 : this._$field = $field;
  28. 28 : this._p_initField(modes);
  29. 29 : }
  30. 30 :
  31. 31 : /**
  32. 32 : * Met à jours le champ
  33. 33 : * @abstract
  34. 34 : * @param {*} new_value Nouvelle valeur du champ
  35. 35 : */
  36. 36 : onUpdate(new_value) {
  37. 37 : throw "Abstract !";
  38. 38 : }
  39. 39 :
  40. 40 : /**
  41. 41 : * Action qui sera appelé lorsque le champ changera de valeur.
  42. 42 : *
  43. 43 : * En général, appelle {@link Parts~onUpdate}
  44. 44 : * @abstract
  45. 45 : * @param {...any} args Le premier argument est généralement un `Event`
  46. 46 : */
  47. 47 : onChange(...args) {
  48. 48 : throw "Abstract !";
  49. 49 : }
  50. 50 :
  51. 51 : /**
  52. 52 : * Action qui sera appelé lorsque l'on cliquera sur le champ
  53. 53 : *
  54. 54 : * En général, appelle {@link Parts~onUpdate}
  55. 55 : * @abstract
  56. 56 : * @param {...any} args Le premier argument est généralement un `Event`
  57. 57 : */
  58. 58 : onClick(...args) {
  59. 59 : throw "Abstract !";
  60. 60 : }
  61. 61 :
  62. 62 : /**
  63. 63 : * Action qui sera appelé lorsque le champ changera de valeur alors que le focus est toujours dessus.
  64. 64 : *
  65. 65 : * En général, appelle {@link Parts~onUpdate}
  66. 66 : * @abstract
  67. 67 : * @param {...any} args Le premier argument est généralement un `Event`
  68. 68 : */
  69. 69 : onInput(...args) {
  70. 70 : throw "Abstract !";
  71. 71 : }
  72. 72 :
  73. 73 : /**
  74. 74 : * Récupère le champ
  75. 75 : * @protected
  76. 76 : * @returns {external:jQuery}
  77. 77 : */
  78. 78 : _p_get_field() {
  79. 79 : return this._$field;
  80. 80 : }
  81. 81 :
  82. 82 : /**
  83. 83 : * Initialise le champ en fonction des modes défini dans le constructeur.
  84. 84 : * @protected
  85. 85 : * @param {Parts.MODE[]} modes
  86. 86 : */
  87. 87 : _p_initField(modes) {
  88. 88 : let $field = this._p_get_field();
  89. 89 :
  90. 90 : if (!!$field) {
  91. 91 : for (const mode of modes) {
  92. 92 : switch (mode) {
  93. 93 : case Parts.MODE.click:
  94. 94 : this._p_try_add_event($field, 'click', this.onClick.bind(this));
  95. 95 : break;
  96. 96 :
  97. 97 : case Parts.MODE.change:
  98. 98 : this._p_try_add_event($field, 'change', this.onChange.bind(this));
  99. 99 : break;
  100. 100 :
  101. 101 : case Parts.MODE.input:
  102. 102 : this._p_try_add_event($field, 'input', this.onInput.bind(this));
  103. 103 : break;
  104. 104 :
  105. 105 : default:
  106. 106 : break;
  107. 107 : }
  108. 108 : }
  109. 109 : }
  110. 110 :
  111. 111 : }
  112. 112 :
  113. 113 : /**
  114. 114 : * @callback EventCallback
  115. 115 : * @param {Event}
  116. 116 : * @returns {void}
  117. 117 : */
  118. 118 :
  119. 119 : /**
  120. 120 : * Essaye d'ajouter l'évènement lié aux modes au champ
  121. 121 : * @protected
  122. 122 : * @param {external:jQuery} $field
  123. 123 : * @param {string} event Nom de l'évènement que l'on souhaite ajouter {exemple : 'click'}
  124. 124 : * @param {EventCallback} callback
  125. 125 : * @returns {external:jQuery} Champ modifié
  126. 126 : */
  127. 127 : _p_try_add_event($field, event, callback) {
  128. 128 : if (!$._data($field[0], 'events' )?.[event]) {
  129. 129 : $field.on(event, callback);
  130. 130 : }
  131. 131 : else {
  132. 132 : $field.off(event);
  133. 133 : $field.on(event, callback);
  134. 134 : }
  135. 135 :
  136. 136 : return $field;
  137. 137 : }
  138. 138 :
  139. 139 : }
  140. 140 :
  141. 141 : /**
  142. 142 : * @class
  143. 143 : * @classdesc Représentation d'une partie de la vue d'évènement. Cette partie contient un champs visuel qui modifie le champ qui sera utiliser pour la sauvegarde de l'évènement.
  144. 144 : * @extends Parts
  145. 145 : */
  146. 146 : class FakePart extends Parts {
  147. 147 : /**
  148. 148 : *
  149. 149 : * @param {external:jQuery} $field Champ qui sera modifier par le champ visuel.
  150. 150 : * @param {externam:jQuery} $fakeField Champ visuel qui modifiera le champ de sauvegarde
  151. 151 : * @param {...Parts.MODE} modes Mode de fonctionnement.
  152. 152 : */
  153. 153 : constructor($fields, $fakeField, ...modes) {
  154. 154 : super($fields, ...modes);
  155. 155 : this._$fakeField = $fakeField;
  156. 156 : this._p_initField(modes);
  157. 157 : }
  158. 158 :
  159. 159 : /**
  160. 160 : * Initialise le champs visuel à partir de l'évènement
  161. 161 : * @abstract
  162. 162 : * @param {*} event Evènement du plugin `Calendar`
  163. 163 : */
  164. 164 : init(event) {
  165. 165 : throw "Abstract !";
  166. 166 : }
  167. 167 :
  168. 168 : /**
  169. 169 : * Récupère le champ principal
  170. 170 : * @protected
  171. 171 : * @returns {external:jQuery}
  172. 172 : */
  173. 173 : _p_get_field() {
  174. 174 : return this._$fakeField;
  175. 175 : }
  176. 176 : }
  177. 177 :
  178. 178 : /**
  179. 179 : * Mode de fonctionnements disponible pour un champ
  180. 180 : * @static
  181. 181 : * @enum {Symbol}
  182. 182 : */
  183. 183 : Parts.MODE = {
  184. 184 : change:Symbol(),
  185. 185 : click:Symbol(),
  186. 186 : input:Symbol()
  187. 187 : };