Mattthew commited on
Commit
89f2ef2
β€’
1 Parent(s): 49cd608

added copy visible names to clipboard

Browse files
Files changed (4) hide show
  1. artists_and_tags.js +1 -1
  2. index.css +24 -0
  3. index.html +4 -1
  4. index.js +35 -8
artists_and_tags.js CHANGED
@@ -1130,7 +1130,7 @@ var artistsData = [
1130
  ["Smith","Jeffrey","cloudscapes|conceptual|dark|digital|dream-like|landscapes|magic-realism|surreal|added-2023-08-10",true],
1131
  ["Smith","Kiki","body-art|contemporary|feminism|minimalism|performance|sculpture|added-2023-08-08",true],
1132
  ["Smith","Michael James","contemporary|environmentalism|landscapes|added-2023-08-16",true],
1133
- ["Smith","Rodney","|fashion|monochromatic|photography|portraits|photography-bw|added-2023-08-16",false],
1134
  ["Smith","Samantha Keely","abstract|abstract-Expressionism|contemporary|Dream-like|Loneliness|painting|added-2023-08-08",false],
1135
  ["Smithson","Robert","conceptual|earthworks|environmentalism|land-art|post-minimalism|sculpture|added-2023-08-08",false],
1136
  ["Solomon","Barbara Stauffacher","Commercial-art|contemporary|Graphic-Design|Graphic-design|Pop-art|added-2023-08-08",false],
 
1130
  ["Smith","Jeffrey","cloudscapes|conceptual|dark|digital|dream-like|landscapes|magic-realism|surreal|added-2023-08-10",true],
1131
  ["Smith","Kiki","body-art|contemporary|feminism|minimalism|performance|sculpture|added-2023-08-08",true],
1132
  ["Smith","Michael James","contemporary|environmentalism|landscapes|added-2023-08-16",true],
1133
+ ["Smith","Rodney","fashion|monochromatic|photography|portraits|photography-bw|added-2023-08-16",false],
1134
  ["Smith","Samantha Keely","abstract|abstract-Expressionism|contemporary|Dream-like|Loneliness|painting|added-2023-08-08",false],
1135
  ["Smithson","Robert","conceptual|earthworks|environmentalism|land-art|post-minimalism|sculpture|added-2023-08-08",false],
1136
  ["Solomon","Barbara Stauffacher","Commercial-art|contemporary|Graphic-Design|Graphic-design|Pop-art|added-2023-08-08",false],
index.css CHANGED
@@ -114,6 +114,30 @@ h4 {
114
  width: 100%;
115
  }
116
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
117
  #alert {
118
  position: fixed;
119
  z-index: 1;
 
114
  width: 100%;
115
  }
116
 
117
+ #copy-all-names {
118
+ position: absolute;
119
+ z-index: 2;
120
+ left: calc(70% + 25px);
121
+ bottom: 50px;
122
+ transform: translateX(-50%);
123
+ white-space: nowrap;
124
+ background-color: #ffe300;
125
+ opacity: 0.8;
126
+ padding: 4px 8px;
127
+ border-radius: 4px;
128
+ box-shadow: 0 5px 10px black;
129
+ font-size: 12px;
130
+ font-weight: bold;
131
+ color: black;
132
+ cursor: pointer;
133
+ transition: opacity 100ms 200ms linear;
134
+ }
135
+
136
+ #image-container #copy-all-names:hover {
137
+ opacity: 1;
138
+ transition: opacity 100ms 0ms linear;
139
+ }
140
+
141
  #alert {
142
  position: fixed;
143
  z-index: 1;
index.html CHANGED
@@ -178,13 +178,16 @@
178
  <span id="edit_most_used" class="hidden">edit</span>
179
  <!-- JS will insert checkboxes here -->
180
  </div>
181
- <div id="gutter"><div data-tooltip="drag slowly"></div></div>
 
 
182
  <div id="image-container">
183
  <div id="filtersHidingAll">
184
  these filters hide every image<br>
185
  check-mark any tag or β€Ÿpermissive”<br>
186
  πŸ‘€
187
  </div>
 
188
  <!-- JS will insert images here -->
189
  <!--
190
  <div class="image-item tag1 tag2">
 
178
  <span id="edit_most_used" class="hidden">edit</span>
179
  <!-- JS will insert checkboxes here -->
180
  </div>
181
+ <div id="gutter">
182
+ <div data-tooltip="drag slowly"></div>
183
+ </div>
184
  <div id="image-container">
185
  <div id="filtersHidingAll">
186
  these filters hide every image<br>
187
  check-mark any tag or β€Ÿpermissive”<br>
188
  πŸ‘€
189
  </div>
190
+ <div id="copy-all-names">copy all visible names</div>
191
  <!-- JS will insert images here -->
192
  <!--
193
  <div class="image-item tag1 tag2">
index.js CHANGED
@@ -1420,6 +1420,27 @@ function copyStuffToClipboard(item,stuff) {
1420
  .catch(() => {
1421
  doAlert('😭😭 Can\'t access clipboard',1);
1422
  });
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1423
  }
1424
  }
1425
 
@@ -1578,6 +1599,7 @@ function movePartition(e) {
1578
  document.getElementById('toggles').style.width = 'calc(' + gutterEndPercentX + '% - 20px)';
1579
  document.getElementById('gutter').style.left = gutterEndPercentX + '%';
1580
  document.getElementById('image-container').style.marginLeft = 'calc(' + gutterEndPercentX + '% + 50px)';
 
1581
  imgHoverRule.style.width = gutterEndPercentX + '%';
1582
  // prevent text from being selected during drag
1583
  if (window.getSelection) {
@@ -1889,7 +1911,7 @@ function deleteAllEdits() {
1889
  }
1890
 
1891
  function addAllListeners() {
1892
- // add checkbox event listeners
1893
  var checkboxes = document.querySelectorAll('input[type="checkbox"]');
1894
  checkboxes.forEach(function(checkbox) {
1895
  let isTop = checkbox.parentNode.classList.contains('top_control');
@@ -1940,7 +1962,7 @@ function addAllListeners() {
1940
  }
1941
  }
1942
  });
1943
- // add options event listeners
1944
  var infoI = document.getElementById('infoI');
1945
  infoI.addEventListener('click', function(e) {
1946
  showInstructions();
@@ -1953,7 +1975,7 @@ function addAllListeners() {
1953
  infoX.addEventListener('click', function(e) {
1954
  showExport();
1955
  });
1956
- // prompt options
1957
  var promptA = document.getElementById('promptA');
1958
  promptA.addEventListener('click', function(e) {
1959
  highlightSelectedOption('promptA');
@@ -1972,7 +1994,7 @@ function addAllListeners() {
1972
  rotatePromptsImages();
1973
  storeOptionsState();
1974
  });
1975
- // add information event listeners
1976
  var export_favorites = document.getElementById('export_favorites_button');
1977
  export_favorites.addEventListener('click', function(e) {
1978
  exportTextarea('favorites');
@@ -2001,7 +2023,7 @@ function addAllListeners() {
2001
  }
2002
  });
2003
  });
2004
- // sort options
2005
  var sortTA = document.getElementById('sortTA');
2006
  sortTA.addEventListener('click', function(e) {
2007
  sortTagsByAlpha();
@@ -2048,7 +2070,7 @@ function addAllListeners() {
2048
  }
2049
  });
2050
  });
2051
- // add artist event listeners
2052
  var imageItems = document.getElementsByClassName('image-item');
2053
  Array.from(imageItems).forEach(function(imageItem) {
2054
  imageItem.addEventListener('mouseenter', function(e) {
@@ -2092,7 +2114,7 @@ function addAllListeners() {
2092
  }
2093
  });
2094
  });
2095
- // add gutter event listener
2096
  var gutter = document.getElementById('gutter');
2097
  gutter.addEventListener('mousedown', function(e) {
2098
  e.preventDefault();
@@ -2103,7 +2125,12 @@ function addAllListeners() {
2103
  gutter.removeEventListener('mousemove', movePartition, false);
2104
  }, false);
2105
  }, false);
2106
- // add footer event listeners
 
 
 
 
 
2107
  var closeFooter = document.getElementById('close_footer');
2108
  closeFooter.addEventListener('click', function(e) {
2109
  document.getElementById('layout').classList.add('footerHidden');
 
1420
  .catch(() => {
1421
  doAlert('😭😭 Can\'t access clipboard',1);
1422
  });
1423
+ } else if(stuff == 'copyAllNames') {
1424
+ let str = '';
1425
+ let count = 0;
1426
+ let imageItems = document.querySelectorAll('.image-item:not(.hidden)');
1427
+ let imageItemsArr = Array.from(imageItems).sort(function (a, b) {
1428
+ return a.querySelectorAll('h3 span')[1].textContent.toLowerCase().localeCompare(
1429
+ b.querySelectorAll('h3 span')[1].textContent.toLowerCase());
1430
+ });
1431
+ for(i=0,il=imageItemsArr.length;i<il;i++) {
1432
+ let item = imageItemsArr[i];
1433
+ str += item.querySelectorAll('h3 span')[0].textContent + ' ';
1434
+ str += item.querySelectorAll('h3 span')[1].textContent + '\n';
1435
+ count++;
1436
+ }
1437
+ navigator.clipboard.writeText(str)
1438
+ .then(() => {
1439
+ doAlert('Copied ' + count.toLocaleString() + ' names to clipboard!',1);
1440
+ })
1441
+ .catch(() => {
1442
+ doAlert('😭😭 Can\'t access clipboard',1);
1443
+ });
1444
  }
1445
  }
1446
 
 
1599
  document.getElementById('toggles').style.width = 'calc(' + gutterEndPercentX + '% - 20px)';
1600
  document.getElementById('gutter').style.left = gutterEndPercentX + '%';
1601
  document.getElementById('image-container').style.marginLeft = 'calc(' + gutterEndPercentX + '% + 50px)';
1602
+ document.getElementById('copy-all-names').style.left = 'calc(' + (gutterEndPercentX + ((100-gutterEndPercentX)/2)) + '% + 25px)';
1603
  imgHoverRule.style.width = gutterEndPercentX + '%';
1604
  // prevent text from being selected during drag
1605
  if (window.getSelection) {
 
1911
  }
1912
 
1913
  function addAllListeners() {
1914
+ // checkboxes
1915
  var checkboxes = document.querySelectorAll('input[type="checkbox"]');
1916
  checkboxes.forEach(function(checkbox) {
1917
  let isTop = checkbox.parentNode.classList.contains('top_control');
 
1962
  }
1963
  }
1964
  });
1965
+ // options
1966
  var infoI = document.getElementById('infoI');
1967
  infoI.addEventListener('click', function(e) {
1968
  showInstructions();
 
1975
  infoX.addEventListener('click', function(e) {
1976
  showExport();
1977
  });
1978
+ // prompts
1979
  var promptA = document.getElementById('promptA');
1980
  promptA.addEventListener('click', function(e) {
1981
  highlightSelectedOption('promptA');
 
1994
  rotatePromptsImages();
1995
  storeOptionsState();
1996
  });
1997
+ // information
1998
  var export_favorites = document.getElementById('export_favorites_button');
1999
  export_favorites.addEventListener('click', function(e) {
2000
  exportTextarea('favorites');
 
2023
  }
2024
  });
2025
  });
2026
+ // sorting
2027
  var sortTA = document.getElementById('sortTA');
2028
  sortTA.addEventListener('click', function(e) {
2029
  sortTagsByAlpha();
 
2070
  }
2071
  });
2072
  });
2073
+ // artists
2074
  var imageItems = document.getElementsByClassName('image-item');
2075
  Array.from(imageItems).forEach(function(imageItem) {
2076
  imageItem.addEventListener('mouseenter', function(e) {
 
2114
  }
2115
  });
2116
  });
2117
+ // gutter
2118
  var gutter = document.getElementById('gutter');
2119
  gutter.addEventListener('mousedown', function(e) {
2120
  e.preventDefault();
 
2125
  gutter.removeEventListener('mousemove', movePartition, false);
2126
  }, false);
2127
  }, false);
2128
+ // copy-all
2129
+ var copyAllNames = document.getElementById('copy-all-names');
2130
+ copyAllNames.addEventListener('click', function(e) {
2131
+ copyStuffToClipboard(this, 'copyAllNames')
2132
+ });
2133
+ // footer
2134
  var closeFooter = document.getElementById('close_footer');
2135
  closeFooter.addEventListener('click', function(e) {
2136
  document.getElementById('layout').classList.add('footerHidden');