zappingseb

div(
  shiny::textInput(inputId = "custom"),
  HMTL("<script>
     $('#custom').spectrum({
       color: '#f00'
     });
   </script>"
  )
)

zappingseb

library(shiny)
library(glue)

source("DoubleColorPickerInput.R")

ui <- fluidPage(
  
  tags$head(
    tags$link(rel = "stylesheet", type = "text/css", href = "spectrum.css"),
    tags$script(src="spectrum.js")

zappingseb

// DoubleColorPicker Input Binding
//
// Definition of a Shiny InputBinding extension to
// get the values of two color pickers.
//
// https://github.com/zappingseb/customshinyinput
// Author: Sebastian Wolf
// License: MIT

// -----------------------------------------------------

zappingseb

getValue: function(el) {
  // create an empty output array
  var output = []

  // go over each input element inside the
  // defined InputBinding and add the ID
  // and the value as a dictionary to the output
  $(el).find("input").each(function(inputitem){

    output.push({

zappingseb

// DoubleColorPicker Input Binding
//
// Definition of a Shiny InputBinding extension to
// get the values of two color pickers.
//
// https://github.com/zappingseb/customshinyinput
// Author: Sebastian Wolf
// License: MIT

// -----------------------------------------------------

zappingseb

subscribe: function(el, callback) {
    // the jQuery "change" function allows you
    // to notice any change to your input elements
   $(el).on('change.input', function(event) {
     callback(false);
       // When called with false, it will NOT use the rate policy,
	  // so changes will be sent immediately
   }); 
  }

zappingseb

#' Function to return a DoubleColorPicker input
#' @param id (\code{character}) A web element ID, shall not contain dashes or underscores or colon
#' @param col_border (\code{character}) A hex code for the border color default value
#' @param col_fill (\code{character}) A hex code for the fill color default value
#' @return An \code{shiny::div} element with two color pickers
#' @author Sebastian Wolf \email{sebastian@@mail-wolf.de}
DoubleColorPickerInput <- function(id="fancycolorpicker", col_border = "#f00", col_fill="#00f"){
  
  # Return a div element of class "doubleclorpicker"
  div(

zappingseb

// DoubleColorPicker Input Binding
//
// Definition of a Shiny InputBinding extension to
// get the values of two color pickers.
//
// https://github.com/zappingseb/customshinyinput
// Author: Sebastian Wolf
// License: MIT

// -----------------------------------------------------

zappingseb

# Try to remove the input Handler as shiny does not allow double input
# handlers
try({ removeInputHandler("DoubleColorPickerBinding") })

# Use the shiny registerInputHandler function to
# register a way to deal with the inputs coming
shiny::registerInputHandler(
  "DoubleColorPickerBinding", 
  function(x, shinysession, name) {
    

zappingseb

 HTML(glue("<script>$('#{id}').on('change',function(){{check_doublecolorpicker('{id}');}});</script>")),
 HTML("<div class='warning' style='color:red;display:none'>Please choose more different colors</div>")