widgets-toolbox/widgets/+wt/SearchField.m at 0366416be602c04b1346e61fcb93f8f72e79819b · mathworks/widgets-toolbox · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
classdef SearchField < wt.abstract.BaseWidget
    % A search entry field

    % Copyright 2021 The MathWorks Inc.


    %% Public properties
    properties (AbortSet)

        % The current value shown
        Value (1,1) string

    end %properties


    %% Events
    events (HasCallbackProperty, NotifyAccess = protected)

        % Triggered on value changed, has companion callback
        ValueChanged

    end %events


    %% Internal Properties
    properties ( Transient, NonCopyable, ...
            Access = {?wt.abstract.BaseWidget, ?wt.test.BaseWidgetTest} )

        % Search control
        SearchControl (1,1) matlab.ui.control.HTML

    end %properties


    %% Protected methods
    methods (Access = protected)

        function setup(obj)

            % Call superclass setup first to establish the grid
            obj.setup@wt.abstract.BaseWidget();

            % Set default size
            obj.Position(3:4) = [100 25];

            % Define the HTML source
            html = ['<input type="search" id="value" name="search" style="width:100%;height:100%" >',...
                '<script type="text/javascript">',...
                'function setup(htmlComponent) {',...
                'htmlComponent.addEventListener("DataChanged", function(event) {',...
                'document.getElementById("value").value = htmlComponent.Data;',...
                '});',...
                'document.getElementById("value").addEventListener("input", function() {',...
                'htmlComponent.Data = document.getElementById("value").value;',...
                '});',...
                '}',...
                '</script>'];

            % Create a html search input
            obj.SearchControl = uihtml(...
                'Parent',obj.Grid,...
                'HTMLSource',html,...
                'DataChangedFcn',@(h,e)obj.onSearchChanged(e) );

        end %function


        function update(obj)

            % Update the edit control text
            obj.SearchControl.Data = obj.Value;

        end %function

    end %methods


    %% Private methods
    methods (Access = private)

        function onSearchChanged(obj,evt)
            % Triggered on interaction

            % Return early if data hasn't changed
            % The html control may send a double callback on edits
            if strcmp(evt.Data, evt.PreviousData)
                return
            end

            % Prepare event data
            evtOut = wt.eventdata.PropertyChangedData('Value',evt.Data, obj.Value);

            % Store new result
            obj.Value = evt.Data;

            % Trigger event
            notify(obj,"ValueChanged",evtOut);

        end %function

    end %methods


    %% Accessors
    methods

        function set.Value(obj,value)
            drawnow %needs a moment to render so that display can update
            obj.Value = value;
        end

    end % methods


end % classdef