[TASK] Allow multiple extractor services with the same priority
[Packages/TYPO3.CMS.git] / typo3 / sysext / core / Documentation / Changelog / 8.0 / Feature-73429-WizardComponentHasBeenAdded.rst
1
2 .. include:: ../../Includes.txt
3
4 =================================================
5 Feature: #73429 - Wizard component has been added
6 =================================================
7
8 See :issue:`73429`
9
10 Description
11 ===========
12
13 A new wizard component has been added. This component may be used for user-guided interactions.
14 The RequireJS module can be used by including `TYPO3/CMS/Backend/Wizard`.
15
16 The wizard supports straight forward actions only, junctions are not possible yet.
17
18
19 Impact
20 ======
21
22 The wizard component has the following public methods:
23
24 * :code:`addSlide(identifier, title, content, severity, callback)`
25
26 * :code:`addFinalProcessingSlide(callback)`
27
28 * :code:`set(key, value)`
29
30 * :code:`show()`
31
32 * :code:`dismiss()`
33
34 * :code:`getComponent()`
35
36 * :code:`lockNextStep()`
37
38 * :code:`unlockNextStep()`
39
40
41 addSlide
42 ~~~~~~~~
43
44 Adds a slide to the wizard.
45
46 ========== =============== ============ ======================================================================================================
47 Name       DataType        Mandatory    Description
48 ========== =============== ============ ======================================================================================================
49 identifier string          Yes          The internal identifier of the slide
50 title      string          Yes          The title of the slide
51 content    string          Yes          The content of the slide
52 severity   int                          Represents the severity of a slide. Please see TYPO3.Severity. Default is :code:`TYPO3.Severity.info`.
53 callback   function                     Callback method run after the slide appeared. The callback receives two parameters:
54                                         :code:`$slide`: The current slide as a jQuery object
55                                         :code:`settings`: The settings defined via :javascript:`Wizard.set()`
56 ========== =============== ============ ======================================================================================================
57
58 addFinalProcessingSlide
59 ~~~~~~~~~~~~~~~~~~~~~~~
60
61 Adds a slide to the wizard containing a spinner. This should always be the latest slide. This method returns a Promise
62 object due to internal handling. This means you have to add a :javascript:`done()` callback containing :javascript:`Wizard.show()` and
63 :javascript:`Wizard.getComponent()` please see the example below.
64
65 ========== =============== ============ ======================================================================================================
66 Name       DataType        Mandatory    Description
67 ========== =============== ============ ======================================================================================================
68 callback   function                     Callback method run after the slide appeared. If no callback method is given, the wizard dismisses
69                                         without any further action.
70 ========== =============== ============ ======================================================================================================
71
72 Example code:
73
74 .. code-block:: javascript
75
76         Wizard.addFinalProcessingSlide().done(function() {
77             Wizard.show();
78
79             Wizard.getComponent().on('click', '.my-element', function(e) {
80                 e.preventDefault();
81                 $(this).doSomething();
82             });
83         });
84
85 set
86 ~~~
87
88 Adds values to the internal settings stack usable in other slides.
89
90 ========== =============== ============ ======================================================================================================
91 Name       DataType        Mandatory    Description
92 ========== =============== ============ ======================================================================================================
93 key        string          Yes          The key of the setting
94 value      string          Yes          The value of the setting
95 ========== =============== ============ ======================================================================================================
96
97 Events
98 ~~~~~~
99
100 The event `wizard-visible` is fired when the wizard rendering has finished.
101
102 Example code:
103
104 .. code-block:: javascript
105
106         Wizard.getComponent().on('wizard-visible', function() {
107             Wizard.unlockNextButton();
108         });
109
110
111 Wizards can be closed by firing the `wizard-dismiss` event.
112
113 Example code:
114
115 .. code-block:: javascript
116
117         Wizard.getComponent().trigger('wizard-dismiss');
118
119
120 Wizards fire the `wizard-dismissed` event if the wizard is closed. You can integrate your own listener by using :javascript:`Wizard.getComponent()`.
121
122 Example code:
123
124 .. code-block:: javascript
125
126         Wizard.getComponent().on('wizard-dismissed', function() {
127             // Calculate the answer of life the universe and everything
128         });
129
130 .. index:: Backend, JavaScript