Bootstrap Student Assessment Panel Selectonic

by Steve Coffman

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<div class="container">
    <div class="panel panel-primary">
        <!-- Default panel contents -->
        <div class="panel-heading">Choose Assessment Purposes for Panel</div>
        <ul class="list-group">
            <li class="list-group-item disabled">Course Assessment Purposes</li>
            <li class="list-group-item">
                <div class="btn-group btn-group-lg btn-group-vertical" role="group" aria-label="..." data-toggle="buttons">
                    <label class="btn btn-primary active">
                        <input type="checkbox" autocomplete="off" checked="checked" />Checkbox 1 (pre-checked)</label>
                    <label class="btn btn-primary">
                        <input type="checkbox" autocomplete="off" />Checkbox 2</label>
                    <label class="btn btn-primary">
                        <input type="checkbox" autocomplete="off" />Checkbox 3</label>
                </div>
            </li>
            <li class="list-group-item disabled">Other Available Assessment Purposes</li>
            <li class="list-group-item">
                <div class="actions-list" id="actions-list">
                    <ul class="actions-list__group">
                        <li class="actions-list__option">Item 1</li>
                        <li class="actions-list__option">Item 2</li>
                        <li class="actions-list__option">Item 3</li>
                        <li class="actions-list__option">Item 4</li>
                        <li class="actions-list__option">Item 5</li>
                        <li class="actions-list__option">Item 6</li>
                    </ul>
                    <div class="actions-list__actionbar">
                     ...

CSS

.col-sm-3, .col-sm-4 {
    border: 1px solid #000;
}
.padding-top-5 {
    padding-top: 5px;
}

JavaScript

/*! Selectonic - v0.6.1 - 2015-01-05
 * https://github.com/anovi/selectonic
 * Copyright (c) 2015 Alexey Novichkov; Licensed MIT */ (function ($, window, undefined) {
    'use strict'; // remove this line, this script will be support running on IE6

    // Method for getting full elements height, jQuery's outerHeight is like Zepto's height
    var outerHeight = $.fn.outerHeight ? 'outerHeight' : 'height';
    if (!$.fn.jquery && !$.fn.zepto) {
        $.fn.zepto = true;
    }

    // From Underscore library - http://underscorejs.org/#throttle
    var _throttle = function (func, wait, options) {
        var context, args, result;
        var timeout = null;
        var previous = 0;
        options = options || {};
        var later = function () {
            previous = options.leading === false ? 0 : new Date();
            timeout = null;
            result = func.apply(context, args);
        };
        return function () {
            var now = new Date();
            if (!previous && options.leading === false) {
                previous = now;
            }
            var remaining = wait - (now - previous);
            context = this;
            args = arguments;
            if (remaining <= 0) {
                clearTimeout(timeout);
                timeout = null;
                previous = now;
                result = func.apply(context, args);
            } else if (!timeout && options.trailing !== false) {
                timeout = setTimeout(later, remaining);
            }
            return result;
        };
    },

    __indexOf = Array.prototype.indexOf || function (item) {
            for (var i = 0, l = this.length; i < l; i++) {
                if (this[i] === item) {
                    return i;
                }
            }
            return -1;
        },

        itContains = function (array, elem) {
            if (array instanceof Array) {
                return __indexOf.call(array, elem) >= 0;
            }
            return...