File size: 5,495 Bytes
32f0b26
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
<script>
    import Section from "./Section.svelte";
    import ClusterResults from "./ClusterResults.svelte";
    import Button, { Label } from "@smui/button";
    import Textfield from "@smui/textfield";
    import LayoutGrid, { Cell } from "@smui/layout-grid";
    import LinearProgress from "@smui/linear-progress";
    import Chip, { Set, Text } from '@smui/chips';

    export let clusters;
    export let personalized_model;
    export let evidence;
    export let width_pct = 80;

    let topic_df_ids = [];
    let promise_iter_cluster = Promise.resolve(null);
    let keyword = null;
    let n_neighbors = null;
    let cur_iter_cluster = null;
    let history = [];

    async function getIterCluster(search_type) {
        let req_params = {
            cluster: cur_iter_cluster,
            topic_df_ids: topic_df_ids,
            n_examples: 500, // TEMP
            pers_model: personalized_model,
            example_sort: "descending", // TEMP
            comparison_group: "status_quo", // TEMP
            search_type: search_type,
            keyword: keyword,
            n_neighbors: n_neighbors,
        };
        console.log("topic_df_ids", topic_df_ids);
        let params = new URLSearchParams(req_params).toString();
        const response = await fetch("./get_cluster_results?" + params);
        const text = await response.text();
        const data = JSON.parse(text);
        // if (data["cluster_comments"] == null) {
        //     return false
        // }
        topic_df_ids = data["topic_df_ids"];
        return data;
    }

    function findCluster() {
        promise_iter_cluster = getIterCluster("cluster");
        history = history.concat("bulk-add cluster: " + cur_iter_cluster);
    }

    function findNeighbors() {
        promise_iter_cluster = getIterCluster("neighbors");
        history = history.concat("find " + n_neighbors + " neighbors");
    }

    function findKeywords() {
        promise_iter_cluster = getIterCluster("keyword");
        history = history.concat("keyword search: " + keyword);
    }
</script>

<div>
    <div>
        <!-- <h6>Hunch {ind} examples</h6> -->
        <div>
            <h6>Search Settings</h6>
            <!-- Start with cluster -->
            <!-- <div class="">
                <Section
                    section_id="iter_cluster"
                    section_title="Bulk-add cluster"
                    section_opts={clusters}
                    bind:value={cur_iter_cluster}
                    width_pct={100}
                />
                <Button
                    on:click={findCluster}
                    variant="outlined"
                    class="button_float_right"
                    disabled={cur_iter_cluster == null}
                >
                    <Label>Search</Label>
                </Button>
            </div> -->

            <!-- Manual keyword -->
            <div class="spacing_vert">
                <Textfield
                    bind:value={keyword}
                    label="Keyword search"
                    variant="outlined"
                    style="width: {width_pct}%"
                />
                <Button
                    on:click={findKeywords}
                    variant="outlined"
                    class="button_float_right spacing_vert"
                    disabled={keyword == null}
                >
                    <Label>Search</Label>
                </Button>
            </div>

            <!-- Find neighbors of current set -->
            <div class="spacing_vert">
                <Textfield
                    bind:value={n_neighbors}
                    label="Number of neighbors to retrieve"
                    type="number"
                    min="1"
                    max="50"
                    variant="outlined"
                    style="width: {width_pct}%"
                />
                <Button
                    on:click={findNeighbors}
                    variant="outlined"
                    class="button_float_right spacing_vert"
                    disabled={n_neighbors == null}
                >
                    <Label>Search</Label>
                </Button>
            </div>
        </div>
    </div>

    {#await promise_iter_cluster}
        <div class="app_loading" style="width: {width_pct}%">
            <LinearProgress indeterminate />
        </div>
    {:then iter_cluster_results}
        {#if iter_cluster_results}
            {#if history.length > 0}
                <div class="bold" style="padding-top:40px;">Search History</div>
                <Set chips={history} let:chip choice>
                    <Chip {chip}>
                        <Text>{chip}</Text>
                    </Chip>
                </Set>
            {/if}
            {#if iter_cluster_results.cluster_comments != null}
                <ClusterResults
                    cluster={""}
                    clusters={clusters}
                    model={personalized_model}
                    data={iter_cluster_results}
                    show_vis={false}
                    table_width_pct={80}
                    bind:evidence={evidence}
                    on:change
                />
            {:else}
                <div class="bold" style="padding-top:40px;">
                    No results found
                </div>
            {/if}
        {/if}
    {:catch error}
        <p style="color: red">{error.message}</p>
    {/await}
</div>

<style>
</style>