How to use the color.js function in color

To help you get started, we’ve selected a few color examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github ModuleArt / ferny / modules / DownloadManager / Download.js View on Github external
this.node.classList.add("download-item");
        this.node.name = id;
        this.node.id = "download-" + id;
        this.node.innerHTML = `
            <div class="download-body">
                <img src="${extToImagePath(fileExtension(name))}" class="download-icon">
                <label class="download-name">${name}</label><br>
                <label class="download-url">${url}</label><br>
                <hr>
                <label class="download-status">Started</label>
                <label class="download-time">${epochToDate(time)} / ${epochToTime(time)}</label>
            </div>
            <div class="download-buttons"></div>
        `;

        let color = new GetAvColor(this.node.getElementsByClassName("download-icon")[0]);
        color.mostUsed(result =&gt; {
            if(Array.isArray(result)) {
                this.node.style.backgroundColor = rgbToRgbaString(result[0]);
            } else {
                this.node.style.backgroundColor = rgbToRgbaString(result);
            }
        });
    }
github ModuleArt / ferny / modules / HistoryManager / HistoryItem.js View on Github external
updateHistoryIconColor() {
        let icon = this.node.getElementsByClassName("history-icon")[0];
        let color = new GetAvColor(icon);
        color.mostUsed((result) => {
            if(Array.isArray(result)) {
                icon.parentNode.style.backgroundColor = rgbToRgbaString(result[0]);
            } else {
                icon.parentNode.style.backgroundColor = rgbToRgbaString(result);
            }
        });
    }
github ModuleArt / ferny / js / bookmarks.js View on Github external
<button title="Copy URL" class="nav-btn">
        <img name="copy-16" class="theme-icon">
        <label>Copy</label>
      </button>
      <button title="Edit" class="nav-btn">
        <img name="edit-16" class="theme-icon">
        <label>Edit</label>
      </button>
    `;

  div.getElementsByClassName('bookmark-menu')[0].addEventListener("click", (e) =&gt; {
    e.stopPropagation();
    div.getElementsByClassName('bookmark-menu')[0].classList.remove('active');
  });

  var color = new getAvColor(div.getElementsByTagName('img')[0]);
  color.mostUsed(result =&gt; {
    div.style.backgroundColor = rgbToRgbaString(result[0]);
  });

  var options = document.createElement('button');
  options.classList.add('bookmark-options');
  options.innerHTML = "<img class="theme-icon" name="options-12">"
  options.onclick = function(e) {
    e.stopPropagation();

    if(div.getElementsByClassName('bookmark-menu')[0].classList.contains('active')) {
      div.getElementsByClassName('bookmark-menu')[0].classList.remove('active');
    } else {
      var bookmarks = document.getElementsByClassName('bookmark');
      for(var i = 0; i &lt; bookmarks.length; i++) {
        bookmarks[i].getElementsByClassName('bookmark-menu')[0].classList.remove('active');
github ModuleArt / ferny / js / downloads.js View on Github external
var div = document.createElement('div');
  div.classList.add('download');
  div.id = "download-" + index;
  div.name = "stopped";

  var ext = fileExtension(url);
  div.innerHTML = `
    <img src="` + extToImagePath(ext) + `" class="download-icon">
    <label class="download-ext">` + ext.toUpperCase() + ` file</label>
    <label class="download-status">Finished</label>
    <hr>
    File: <label title="` + name + `" class="download-file">` + name + `</label><br>
    Url: <label title="` + url + `" class="download-link">` + url + `</label><br>
    Date: <label class="download-date">` + epochToDate(time) + `</label> / Time: <label class="download-time">` + epochToTime(time) + `</label><hr>`;

  var color = new GetAvColor(div.getElementsByTagName('img')[0]);
  color.mostUsed(result =&gt; {
    div.style.backgroundColor = rgbToRgbaString(result[0]);
  });

  fs.exists(path.replace(/\\/g, "/"), function(exists) {
    if (exists) {
      div.innerHTML += `
        <center class="download-buttons">
          <button title="Show file in folder" class="nav-btn">
            <img name="folder-16" class="theme-icon">
            <label>Folder</label>
          </button>
          <button title="Open file" class="nav-btn">
            <img name="file-16" class="theme-icon">
            <label>Open</label>
          </button>
</center>
github ModuleArt / ferny / modules / BookmarkManager / Bookmark.js View on Github external
updateBookmarkColor() {
        let icon = this.node.getElementsByClassName("bookmark-icon")[0];
        let color = new GetAvColor(icon);
        color.mostUsed((result) => {
            if(Array.isArray(result)) {
                icon.parentNode.style.backgroundColor = rgbToRgbaString(result[0]);
            } else {
                icon.parentNode.style.backgroundColor = rgbToRgbaString(result);
            }
        });
    }
github ModuleArt / ferny / modules / TabManager / TabRenderer.js View on Github external
updateTabColor(tab) {
        if(tab.classList.contains("active")) {
            tab.style.backgroundColor = "";
        } else {
            let img = tab.getElementsByClassName("tabman-tab-icon")[0];

            let color = new GetAvColor(img);
            color.mostUsed((result) => {
                if(Array.isArray(result)) {
                    tab.style.backgroundColor = rgbToRgbaString(result[0]);
                } else {
                    tab.style.backgroundColor = rgbToRgbaString(result);
                }
            });
        }

        return null;
    }