Hugging Face's logo

Spaces:
MonkeyJuice
/
tagger
Running

App Files Community
tagger
File size: 2,371 Bytes 
da72583
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
7d3b3b8
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
aa7c58e
7d3b3b8
aa7c58e
7d3b3b8
da72583
 
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
 
<style>
  .m5dd_list {
    display: flex;
    cursor: pointer;
    font-size: 1.2em;
    padding: .5em;
    user-select: none;
  }  
  .m5dd_list>span.label {
    flex: 1;
    padding: 0 .5em;
  }
  
  .m5dd_list>span.prob {
    color: #aaa;
    padding: 0 .5em;
  }
  
  .m5dd_list:nth-child(even) { background: #ECEDF0; }
  .dark .m5dd_list:nth-child(even) { background: #1F2937; }
  
  .m5dd_list:not(.use)>span.label {
    text-decoration: line-through;
    color: #ccc;
  }
  
  .m5dd_image .upload-container .image-frame {
    height: 20em;
  }
  
  .m5dd_image .upload-container .image-frame {
    height: 20em;
  }
  .m5dd_image2 .image-container {
    height: 20em;
  }
  .m5dd_html{
    min-height: 6em;
  }
</style>
  
<script>
  document.addEventListener('click', function (event) {
    let tagItem = event.target.closest('.m5dd_list')
    let resultArea = event.target.closest('#m5dd_result')
    if (tagItem) {
      let labelItem = event.target.closest('span.label')
      let upItem = event.target.closest('span.up')
      let downItem = event.target.closest('span.down')
      let addItem = event.target.closest('span.add')
      let decItem = event.target.closest('span.dec')
      let actionItem = event.target.closest('span.action')
      if (labelItem) {
        if (tagItem.classList.contains('use')) {
          tagItem.classList.remove('use')
        } else {
          tagItem.classList.add('use')
        }
      }
      if (upItem) { }
      if (downItem) { }
      if (addItem) {
        let label = tagItem.querySelector('span.label').innerText
        tagItem.querySelector('span.label').innerText = `(${label})`
      }
      if (decItem) {
        let label = tagItem.querySelector('span.label').innerText
        label = label.replace(/^\s*\(\s*(.+?)\s*\)\s*$/, '$1')
        tagItem.querySelector('span.label').innerText = label
      }
      if (actionItem) {
        document.getElementById('m5dd_result').innerText =
          Array.from(document.querySelectorAll('.m5dd_list.use>span.label'))
            .map(v => v.innerText)
            .join(', ')
      }
    } else if (resultArea) {
      const selection = window.getSelection()
      selection.removeAllRanges()
      const range = document.createRange()
      range.selectNodeContents(resultArea)
      selection.addRange(range)
    } else {
      return
    }
  })
</script>