Skip to content

Instantly share code, notes, and snippets.

@trestletech

trestletech/global.R

Forked from jpd527/server.R
Last active May 30, 2017 10:44
Download ZIP

Revisions

  1. trestletech revised this gist Mar 21, 2014. 3 changed files with 16 additions and 13 deletions.
    16 changes: 16 additions & 0 deletions global.R
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,16 @@
    sortListInput <- function(inputId,data) {

    tagList(
    singleton(tags$head(tags$script(src = "js/sortList.js"))),
    HTML(paste('
    <script>
    $(function() {
    $( ".sortableList" ).sortable();
    $( ".sortableList" ).disableSelection();
    });
    </script>
    <ul id="',inputId,'" class="sortableList">
    ',paste('<li id="',data,'" class="ui-state-default">',if(is.null(names(data))) data else names(data),'</li>
    ',collapse="\n",sep=""),'</ul>',sep=""))
    )
    }
    2 changes: 0 additions & 2 deletions server.R
    View file
    Original file line number Diff line number Diff line change
    @@ -1,8 +1,6 @@
    library(shiny)


    shinyServer(function(input, output,session) {

    output$list <- renderUI({
    sortListInput("sortable",c(test1="one",test2="two"))
    })
    11 changes: 0 additions & 11 deletions ui.R
    View file
    Original file line number Diff line number Diff line change
    @@ -1,16 +1,5 @@
    library(shiny)

    sortListInput <- function(inputId,data) {

    tagList(
    singleton(tags$head(tags$script(src = "js/sortList.js"))),
    HTML(paste('
    <ul id="',inputId,'" class="sortableList">
    ',paste('<li id="',data,'" class="ui-state-default">',if(is.null(names(data))) data else names(data),'</li>
    ',collapse="\n",sep=""),'</ul>',sep=""))
    )
    }

    shinyUI(pageWithSidebar(
    headerPanel("Drag n drop"),
    sidebarPanel(
  2. @jpd527 jpd527 revised this gist Mar 21, 2014. 2 changed files with 46 additions and 0 deletions.
    9 changes: 9 additions & 0 deletions server.R
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,9 @@
    library(shiny)


    shinyServer(function(input, output,session) {

    output$list <- renderUI({
    sortListInput("sortable",c(test1="one",test2="two"))
    })
    })
    37 changes: 37 additions & 0 deletions ui.R
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,37 @@
    library(shiny)

    sortListInput <- function(inputId,data) {

    tagList(
    singleton(tags$head(tags$script(src = "js/sortList.js"))),
    HTML(paste('
    <ul id="',inputId,'" class="sortableList">
    ',paste('<li id="',data,'" class="ui-state-default">',if(is.null(names(data))) data else names(data),'</li>
    ',collapse="\n",sep=""),'</ul>',sep=""))
    )
    }

    shinyUI(pageWithSidebar(
    headerPanel("Drag n drop"),
    sidebarPanel(
    uiOutput("list")
    ),
    mainPanel(
    tags$head(HTML('<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.9.1.js"></script>
    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <!--<link rel="stylesheet" href="/resources/demos/style.css">-->
    <style>
    .sortableList { list-style-type: none; margin: 0; padding: 0; width: 60%; }
    .sortableList li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; }
    .sortableList li span { position: absolute; margin-left: -1.3em; }
    </style>
    <script>
    $(function() {
    $( ".sortableList" ).sortable();
    $( ".sortableList" ).disableSelection();
    });
    </script>')),
    sortListInput("sortable",c(test1="one",test2="two"))
    )
    ))
  3. @jpd527 jpd527 created this gist Mar 21, 2014.
    29 changes: 29 additions & 0 deletions sortList.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,29 @@
    $(document).on("sortupdate", "ul.sortableList", function(evt) {
    // evt.target is the button that was clicked
    var el = $(evt.target);

    // Raise an event to signal that the value changed
    el.trigger("change");
    });
    var sortListInput = new Shiny.InputBinding();
    $.extend(sortListInput, {
    find: function(scope) {
    return $(scope).find(".sortableList");
    },
    getValue: function(el) {
    return $(el).sortable("toArray");
    },
    setValue: function(el, value) {
    $(el).text(value);
    },
    subscribe: function(el, callback) {
    $(el).on("change.sortableList", function(e) {
    callback();
    });
    },
    unsubscribe: function(el) {
    $(el).off(".sortableList");
    }
    });
    Shiny.inputBindings.register(sortListInput, "sortListInput");
    Shiny.inputBindings.setPriority("sortListInput", 10);