File size: 6,510 Bytes
57d4ba2
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
<!-- CONFIG_HASH: 51d42ad598edc98770de6e78c02c0219_e6c84fec22420f79fd85f52fa448043d -->
<!-- Generated annotation layout file -->
<!-- This file was automatically generated based on the annotation schemes in your config -->
<!-- You can customize this file to modify the layout of your annotation interface -->
<!-- Changes to this file will be preserved across server restarts -->

<div class="annotation_schema">

    <form id="overall_preference" class="annotation-form pairwise pairwise-scale" action="javascript:void(0)" data-annotation-id="0" data-annotation-type="pairwise" data-schema-name="overall_preference" data-mode="scale" data-items-key="responses" data-grid-columns="1">
        
        <fieldset schema="overall_preference">
            <legend class="pairwise-question">Overall, which response is better?</legend>

            <!-- Compact rating scale slider -->
            <div class="pairwise-scale-widget">
                <div class="pairwise-scale-labels">
                    <span class="pairwise-scale-label-min">Response A: A is much better</span>
                    <span class="pairwise-scale-label-center"></span>
                    <span class="pairwise-scale-label-max">Response B: B is much better</span>
                </div>
                <input type="range" class="pairwise-scale-slider annotation-input"
                       name="overall_preference"
                       schema="overall_preference"
                       label_name="scale_value"
                       min="1" max="6" step="1" value="3"
                       validation="required"
                       oninput="updatePairwiseScaleDisplay(this);"
                       onchange="registerAnnotation(this);">
                <div class="pairwise-scale-value-display">
                    <span class="pairwise-scale-current-value">3</span>
                </div>
                <div class="pairwise-scale-ticks">
    <span class="pairwise-scale-tick" style="left: 0.0%">1</span><span class="pairwise-scale-tick" style="left: 20.0%">2</span><span class="pairwise-scale-tick" style="left: 40.0%">3</span><span class="pairwise-scale-tick" style="left: 60.0%">4</span><span class="pairwise-scale-tick" style="left: 80.0%">5</span><span class="pairwise-scale-tick" style="left: 100.0%">6</span>
                </div>
            </div>
        </fieldset>
    </form>
    

    <form id="helpfulness" class="annotation-form pairwise pairwise-binary" action="javascript:void(0)" data-annotation-id="1" data-annotation-type="pairwise" data-schema-name="helpfulness" data-mode="binary" data-items-key="responses" data-grid-columns="1">
        
        <fieldset schema="helpfulness">
            <legend class="pairwise-question">Which response is more helpful for the user&#x27;s actual need?</legend>

            <!-- Compact selection tiles -->
            <div class="pairwise-selection-container">
                <div class="pairwise-tile" data-value="A" data-schema="helpfulness" tabindex="0" data-key="1">
                    <span class="pairwise-tile-label">A</span>
                    <span class="pairwise-tile-shortcut">[1]</span>
                </div>
                <div class="pairwise-tile" data-value="B" data-schema="helpfulness" tabindex="0" data-key="2">
                    <span class="pairwise-tile-label">B</span>
                    <span class="pairwise-tile-shortcut">[2]</span>
                </div>
            </div>
    
            <div class="pairwise-extra-options">
                <button type="button" class="pairwise-tie-btn" data-value="tie" data-schema="helpfulness" data-key="0">
                    Equally helpful [0]
                </button>
            </div>
        
            <input type="hidden" class="pairwise-value annotation-input"
                   name="helpfulness"
                   schema="helpfulness"
                   label_name="selection"
                   validation=""
                   value="">
    
        </fieldset>
    </form>
    

    <form id="tone" class="annotation-form pairwise pairwise-binary" action="javascript:void(0)" data-annotation-id="2" data-annotation-type="pairwise" data-schema-name="tone" data-mode="binary" data-items-key="responses" data-grid-columns="1">
        
        <fieldset schema="tone">
            <legend class="pairwise-question">Which response has a more appropriate tone?</legend>

            <!-- Compact selection tiles -->
            <div class="pairwise-selection-container">
                <div class="pairwise-tile" data-value="A" data-schema="tone" tabindex="0" >
                    <span class="pairwise-tile-label">A</span>
                    <span class="pairwise-tile-shortcut"></span>
                </div>
                <div class="pairwise-tile" data-value="B" data-schema="tone" tabindex="0" >
                    <span class="pairwise-tile-label">B</span>
                    <span class="pairwise-tile-shortcut"></span>
                </div>
            </div>
    
            <div class="pairwise-extra-options">
                <button type="button" class="pairwise-tie-btn" data-value="tie" data-schema="tone" >
                    Both appropriate 
                </button>
            </div>
        
            <input type="hidden" class="pairwise-value annotation-input"
                   name="tone"
                   schema="tone"
                   label_name="selection"
                   validation=""
                   value="">
    
        </fieldset>
    </form>
    

    <form id="justification" class="annotation-form textbox shadcn-textbox-container " action="javascript:void(0)" data-annotation-id="3" data-annotation-type="text" data-schema-name="justification"   data-grid-columns="2">
            
        <fieldset schema_name="justification">
    
            <legend class="shadcn-textbox-title">Briefly explain your preference (optional)</legend>
        
            <div class="shadcn-textbox-item">
                
        
                <input class="justification shadcn-textbox-input annotation-input"
                       type="text"
                       id="justification_text_box_text"
                       name="justification:::text_box"
                       validation=""
                       schema="justification"
                       label_name="text_box"
                       
                       style=""
                       >
            </div></fieldset></form>

</div>