Widget / Zipwhip Ice Luge

Let people send a text inbound to trigger the ice luge.

by chilipeppr

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="http://www.chilipeppr.com/js/require.js"></script>
<div id="com-chilipeppr-widget-zwiceluge" class="panel panel-default">
    <div class="panel-heading">
        <div class="btn-toolbar pull-right " role="toolbar">
            
            <div class="btn-group"></div>
            
            <div class="btn-group" xstyle="margin-right:6px;">
                <button type="button" id="" class="btn btn-xs btn-default zwiceluge-run " data-container="body" data-toggle="popover" data-placement="auto" data-content="Run the ice luge." data-trigger="hover" data-delay="800"> Run <span class="glyphicon glyphicon-play"></span>
                </button>
            </div>
            
            <div class="btn-group">
                <div class="dropdown">
                    <button type="button" class="btn btn-xs btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu dropdown-menu-right" role="menu"></ul>
                </div>
            </div>
            
            
        </div> 
        
        <span class="panel-title " data-toggle="popover">Zipwhip Ice Luge</span>
        <span class="panel-title-status"></span>

    </div>
    <div  class="panel-body">
        <!-- <div class="container-fluid"> -->
        <div id="zwiceluge-identity-instantiation" class="zwiceluge-identity">
            Incoming Texts to (844) 564-6528
        </div>
        <div class="zwiceluge-calltoaction">Text the word "Zipwhip" to get your shot.</div>

            <div class="zwiceluge-vendingfor">
                
            </div>
            
        <!-- </div> -->
    </div>
    <div class="panel-footer xhidden">
        Last query (Never)
    </div>
</div>

CSS

#com-chilipeppr-widget-zwiceluge .zwiceluge-runnng {
    color: #3c763d;
    background-color: #dff0d8;
    /* background-color: #3c763d; */
}
#com-chilipeppr-widget-zwiceluge .panel-body {
    padding:0;
}
#com-chilipeppr-widget-zwiceluge .panel-footer {
    cursor:pointer;
}
.zwiceluge-bg {
    width: 100%;
  height: 100%;
  /* background-color: red; */
  /* opacity: 0.9; */
  background-image: url('http://ftp.zipwhip.com/public/dashboard/belltowngetdown.png');
  background-size: cover;
}
.zwiceluge-identity {
    /* margin:-16px .-16px 0 -16px; */
    background-color:#ddd;
    zoom:2;
}
.zwiceluge-calltoaction {
    background-color:#ddd;
    padding:0 6px 6px 6px;
    zoom:2;
}
.zwiceluge-identity .zw-dashboardcard {
    padding-left:4px;
    pointer-events:none;
}
.zwiceluge-identity .zw-contactcard-name {
    width:200%;
    line-height:20px;
}
.zwiceluge-identity .zw-contactcard-phone {
    width:200%;
}

.zw-contactcard {
    pointer-events:none;
}
.zw-contactcard-menu {
    display:none;
}
.zwiceluge-vendingfor {
    /* padding:0 10px; */
    max-height: 250px;
    overflow: auto;
}
.zwiceluge-vendingfor-item {
    padding:0 10px 6px 10px;
    background-color: #D0F9FF;
    border-radius: 6px;
    margin: 10px;
}
.zwiceluge-vendingfor-item.zwiceluge-busy {
      color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}
.zwiceluge-huge {
    zoom:4;
    position:absolute;
    left:30px;
    right:30px;
    top:30px;
    bottom:30px;
}

JavaScript

// Test this element. This code is auto-removed by the chilipeppr.load()
cprequire_test(["inline:com-chilipeppr-widget-zwiceluge"], function (zipwhip) {
    console.log("test running of " + zipwhip.id);
    
    // this makes it so we don't poll, so that we don't handle the response while the main workspace does
    zipwhip.noPollingWhileTesting = true;
    
    zipwhip.init();
    
    var testPubSub = function() {
        chilipeppr.publish("/com-chilipeppr-widget-gcode/done", "param1", "p2");
    }
    setTimeout(testPubSub, 10000);
        
} /*end_test*/ );

cpdefine("inline:com-chilipeppr-widget-zwiceluge", ["chilipeppr_ready"], function () {
    return {
        id: "com-chilipeppr-widget-zwiceluge",
        url: "http://fiddle.jshell.net/chilipeppr/e4zhx4n7/show/light/",
        fiddleurl: "http://jsfiddle.net/chilipeppr/e4zhx4n7/",
        name: "Widget / Zipwhip Ice Luge",
        desc: "Let people send a text inbound to trigger the ice luge.",
        foreignSubscribe: {
            "/com-chilipeppr-widget-gcode/done" : "When we see this signal, we know we can queue up the next trigger.",
            "/com-chilipeppr-widget-gcode/onpause" : "When we see this signal, we know the operator is having a problem and is pausing.",
            "/com-chilipeppr-widget-gcode/onplay" : "When we see this signal, we know that the gcode is in play mode so we can reject incoming texts.",
            "/com-chilipeppr-widget-gcode/onstop" : "When we see this signal, we know the operator is having a problem and is stopping."
        },
        // http://landline.zipwhip.com/session/update?_dc=1436834301125&sessions=b80b572e-1f29-42ba-9a4e-a0a5b3bb6682%3A259476803
        // http://landline.zipwhip.com/session/update?_dc=1436834557815&sessions=7c5a05a9-924f-431a-ac5e-e9913f0b243d%3A259476803
        sessionkey: "7c5a05a9-924f-431a-ac5e-e9913f0b243d:259476803",
        vending: false,
        isTimerMode: true,
        timeOut: 20000,
        noPollingWhileTesting:...