Widget:CJP4: Difference between revisions

Jump to navigation Jump to search
VisualWikitext
No edit summary
No edit summary
 
(39 intermediate revisions by the same user not shown)
Line 1: Line 1:
<includeonly>
<includeonly>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/smoothness/jquery-ui.css" />
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>


<script content-type= "application/javascript" src="http://www.wikidoc.org/includes/raty/md5.js"></script>
<script content-type= "application/javascript" src="http://www.wikidoc.org/includes/raty/md5.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script type"text/javascript">
<script type"text/javascript">
$(document).ready(loadResources);
$(document).ready(loadResources);


function loadResources() {
function loadResources() {
mw.loader.load('mediaWiki.user');
jQuery.browser = {};
(function () {
    jQuery.browser.msie = false;
    jQuery.browser.version = 0;
    if (navigator.userAgent.match(/MSIE ([0-9]+)\./)) {
        jQuery.browser.msie = true;
        jQuery.browser.version = RegExp.$1;
    }
})();
// mw.loader.load('mediaWiki.user');
$('#search').click(runQuery);
$('#search').click(runQuery);
$('#query-container').mouseover(updateDisplay);
$('#query-container').change(updateDisplay);
$('#update').click(updateDisplay);
$('#update').click(updateDisplay);


Line 17: Line 28:
         max: 25,
         max: 25,
         step: 1,
         step: 1,
         values: [1,25],
        range: true,
         values: [5, 20],
         slide: function(event, ui) {
         slide: function(event, ui) {
             if (ui.values[0] < ui.values[1])
             if (ui.values[0] < ui.values[1])
             {
             {        
                 $("input.pillSizeSlider[data-index=0]").val(ui.values[0]);
                 $("input.pillSizeSlider[data-index=0]").val(ui.values[0]);
                 $("input.pillSizeSlider[data-index=1]").val(ui.values[1]);
                 $("input.pillSizeSlider[data-index=1]").val(ui.values[1]);
                updatePillSizeImages();
             }
             }
             else if (ui.values[0] > ui.values[1])
             else if (ui.values[0] > ui.values[1])
             {
             {
                 $("input.pillSizeSlider[data-index=1]").val(ui.values[0]);
                 $("input.pillSizeSlider[data-index=1]").val(ui.values[0]);
                 $("input.pillSizeSlider[data-index=0]").val(ui.values[1]);                 
                 $("input.pillSizeSlider[data-index=0]").val(ui.values[1]);
                updatePillSizeImages();                 
             }
             }
             else
             else
             {
             {        
                 $("input.pillSizeSlider[data-index=0]").val(ui.values[0]);
                 $("input.pillSizeSlider[data-index=0]").val(ui.values[0]);
                 $("input.pillSizeSlider[data-index=1]").val(ui.values[1]);
                 $("input.pillSizeSlider[data-index=1]").val(ui.values[1]);
                updatePillSizeImages();
             }
             }
         }
         }
     });
     });
    $('input.pillSizeSlider[data-index=0]').val($("#slider").slider("option","values")[0]);
    $('input.pillSizeSlider[data-index=1]').val($("#slider").slider("option","values")[1]);


     $("input.pillSizeSlider").change(function() {
     $("input.pillSizeSlider").change(function() {
         var $this = $(this);
         var $this = $(this);
         $("#slider").slider("values", $this.data("index"), $this.val());
         $("#slider").slider("values", $this.data("index"), $this.val());
        updatePillSizeImages();
     });
     });
};
function updatePillSizeImages() {
var minPillSize = $('input.pillSizeSlider[data-index=0]').val();
var maxPillSize = $('input.pillSizeSlider[data-index=1]').val();
var pillArr = [
"http://static.wikidoc.org/3/35/Pill_Size_1_mm.png",
"http://static.wikidoc.org/3/35/Pill_Size_1_mm.png",
"http://static.wikidoc.org/8/8a/Pill_Size_2_mm.png",
"http://static.wikidoc.org/f/f7/Pill_Size_3_mm.png",
"http://static.wikidoc.org/f/fb/Pill_Size_4_mm.png",
"http://static.wikidoc.org/f/f2/Pill_Size_5_mm.png",
"http://static.wikidoc.org/d/d8/Pill_Size_6_mm.png",
"http://static.wikidoc.org/e/ec/Pill_Size_7_mm.png",
                "http://static.wikidoc.org/4/4d/Pill_Size_8_mm.png",
"http://static.wikidoc.org/9/97/Pill_Size_9_mm.png",
"http://static.wikidoc.org/3/36/Pill_Size_10_mm.png",
"http://static.wikidoc.org/2/2e/Pill_Size_11_mm.png",
                "http://static.wikidoc.org/c/c5/Pill_Size_12_mm.png",
"http://static.wikidoc.org/0/0d/Pill_Size_13_mm.png",
"http://static.wikidoc.org/1/16/Pill_Size_14_mm.png",
"http://static.wikidoc.org/4/4a/Pill_Size_15_mm.png",
"http://static.wikidoc.org/e/ee/Pill_Size_16_mm.png",
"http://static.wikidoc.org/8/86/Pill_Size_17_mm.png",
"http://static.wikidoc.org/a/af/Pill_Size_18_mm.png",
"http://static.wikidoc.org/e/ea/Pill_Size_19_mm.png",
"http://static.wikidoc.org/e/e6/Pill_Size_20_mm.png",
"http://static.wikidoc.org/e/e2/Pill_Size_21_mm.png",
"http://static.wikidoc.org/a/a3/Pill_Size_22_mm.png",
"http://static.wikidoc.org/b/b4/Pill_Size_23_mm.png",
"http://static.wikidoc.org/c/cf/Pill_Size_24_mm.png",
"http://static.wikidoc.org/9/92/Pill_Size_25_mm.png"
];
$("#queryDisplaySmallSize").attr("src",pillArr[minPillSize]);
$("#queryDisplayLargeSize").attr("src",pillArr[maxPillSize]);
};
};


function buildQueryParameters(){
function buildQueryParameters(){
Line 284: Line 342:
};
};
</script>
</script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/smoothness/jquery-ui.css" />
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<style type="text/css">
<style type="text/css">
/*Query Container********************************************
/*Query Container********************************************
Line 358: Line 419:
height:auto !important;
height:auto !important;
}
}
#queryDisplayContent img{
height:44px !important;
                float:right !important;
}
/*Results*****************************************************
/*Results*****************************************************
Line 485: Line 549:
             </div>
             </div>
             <div id="propertySize-container">
             <div id="propertySize-container">
             Show Pills between:<input type="text" class="pillSizeSlider" data-index="0" name="selectedMinSize" id="selectedMinSize" size="5" /> mm and <input type="text" class="pillSizeSlider" data-index="1" name="selectedMaxSize" id="selectedMaxSize" size="5" /> mm
             Show Pills between:<input type="text" class="pillSizeSlider" data-index="0" name="selectedMinSize" id="selectedMinSize" size="5"/> mm and <input type="text" class="pillSizeSlider" data-index="1" name="selectedMaxSize" id="selectedMaxSize" size="5" /> mm
                 <br/>
                 <br/>
                 <div id="slider"></div>
                 <div id="slider"></div>
Line 532: Line 596:
             </div>
             </div>
             <div id="queryDisplaySize-container">
             <div id="queryDisplaySize-container">
            <div class="queryDisplayHeader">
            <span>Selected Size:</span>
                </div>
                <div id="queryDisplaySize-container">
             <div class="queryDisplayHeader">
             <div class="queryDisplayHeader">
             <span>Selected Size:</span>
             <span>Selected Size:</span>
                 </div>
                 </div>
                 <div class="queryDisplayContent">
                 <div class="queryDisplayContent">
                <img id="queryDisplaySize" src="http://static.wikidoc.org/2/29/Relative_Pill_Size_13_mm.jpg" />
<img id="queryDisplaySmallSize" style="height:44px !important" src="http://static.wikidoc.org/f/f2/Pill_Size_5_mm.png" />
<img id="queryDisplayDime" style="height:44px !important" src="http://static.wikidoc.org/c/c4/Pill_Size_Dime.png" />
<img id="queryDisplayLargeSize" style="height:44px !important" src="http://static.wikidoc.org/e/e6/Pill_Size_20_mm.png" />
                 </div>
                 </div>
            </div>
             </div>
             </div>
             <div id="queryDisplaySearch-container" style="align-content:center;">
             <div id="queryDisplaySearch-container" style="align-content:center;">

Latest revision as of 03:49, 23 July 2015

Retrieved from "https://www.wikidoc.org/index.php?title=Widget:CJP4&oldid=1120552"