Widget:PillIdentifier: Difference between revisions

Jump to navigation Jump to search
← Older editNewer edit →
VisualWikitext
Christopher Popma (talk | contribs)
Bureaucrats, exportpages, nocaptcha, Administrators
2,750 edits
No edit summary
Christopher Popma (talk | contribs)
Bureaucrats, exportpages, nocaptcha, Administrators
2,750 edits
No edit summary
Line 19: Line 19:
}
}
})();
})();
$("#firstHeading").remove();
$('#submit').click(runQuery);
$('#submit').click(runQuery);
$('.navTool').click(nav);
$('.navTool').click(nav);
Line 182: Line 181:
linkName = String(drugNameShort).split(' ').join('_')
linkName = String(drugNameShort).split(' ').join('_')
//String together appropiate text to create the link
//String together appropiate text to create the link
drugNameLink = '<a href="http://www.wikidoc.org/index.php/'+linkName+'">'+drugNameShort+'</a>'
drugNameLink = 'http://www.wikidoc.org/index.php/'+linkName+'">'+drugNameShort
/////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////
Line 195: Line 194:
//  index of the .each() loop.   
//  index of the .each() loop.   
//
//
//  Cells are then added to each row with a named corresponding to the
var pillContainer ='<div class="pillResult">\
//  column header.  For example, Drug Name is the header of the first
            <a href="'+drugNameLink+'">\
//  column, so the cell in the 0 index (the first cell of the row) will
<img src="'+imageDirect+'" alt"'+drugNameShort+'">\
//  have a variable name of cellDrugName
</a>
//
<div class="pillResult-text">\
//  The cells are then populated with
<h1><a href="'+drugNameLink+'">'+drugNameShort+'</a></h1>\
//Find a <table> element with id="resultsTable-body":
<h2>'+pillDosage+'</h2>\
table = document.getElementById("resultsTable-body");
<p>'+pillShape+', '+pillColor+', '+pillSize+' mm, NDC'+ndc+'</p>\
<p>'+pillIngred+'</p>\
//Create an empty <tr> element and add it to the 1st position of the table:
</div>\
row = table.insertRow(ind);
</div>'
//Insert new cells(<td> elements) into the "new" <tr> element:
cellDrugName = row.insertCell(0);
cellPillImprint = row.insertCell(1);
cellPillDosage = row.insertCell(2);
cellPillIngred = row.insertCell(3);
cellPillColor = row.insertCell(4);
cellPillShape = row.insertCell(5);
cellPillSize = row.insertCell(6);
cellPillSocring = row.insertCell(7);
cellNDC = row.insertCell(8);
cellPillName = row.insertCell(9);
//Add Values to the cells:
//Add Values to the cells:
cellDrugName.innerHTML = drugNameLink;
$("#resultsTable-container").append(pillContainer);
cellPillImprint.innerHTML = pillImprint;
cellPillDosage.innerHTML = pillDosage;
cellPillIngred.innerHTML = pillIngred;
cellPillColor.innerHTML = pillColor;
cellPillShape.innerHTML = pillShape;
cellPillSize.innerHTML = pillSize;
cellPillSocring.innerHTML = pillScoring;
cellNDC.innerHTML = ndc;
cellPillName.innerHTML = '<img class="pillImages" src="' + imageDirect + '" />';
});
});
Line 293: Line 271:
$("#"+selectedProperty).val(selectedValue);
$("#"+selectedProperty).val(selectedValue);
}
}
function nav(){
function nav(){
Line 299: Line 276:
var dirIndex = "";
var dirIndex = "";
var position = $(".propertyContainerActive").data()["order"];
var position = $(".propertyContainerActive").data()["order"];
console.log(direction);
console.log(position);
var positionArr = [
var positionArr = [
["", ""],
["", ""],
Line 317: Line 296:
console.log("Ruh-roh. Something happened in figuring out what direction to navigate");
console.log("Ruh-roh. Something happened in figuring out what direction to navigate");
}
}
console.log(dirIndex);
var newActiveDiv = positionArr[position][dirIndex];
var newActiveDiv = positionArr[position][dirIndex];
console.log(newActiveDiv);
console.log(newActiveDiv);
 
$(".propertyContainerActive").attr("class", "propertyContainerInactive");
$(this).removeClass("propertyContainerActive");
$(newActiveDiv).attr("class", "propertyContainerActive");
$(this).addClass("propertyContainerInactive");
$(newActiveDiv).removeClass("propertyContainerInactive");
$(newActiveDiv).addClass("propertyContainerActive");
var nextPosition = $(newActiveDiv).data()["order"];
var nextPosition = $(newActiveDiv).data()["order"];
console.log(nextPosition);
console.log(nextPosition);
console.log(positionArr[nextPosition][0]);
console.log(positionArr[nextPosition][0]);
Line 332: Line 315:
if (positionArr[nextPosition][0] == ""){
if (positionArr[nextPosition][0] == ""){
$("#back").css("visibility","hidden");
$("#back").attr("visibility","hidden");
}
}
else  
else  
{
{
$("#back").css("visibility","visible");
$("#back").attr("visibility","visible");
}
}
if (positionArr[nextPosition][1] == ""){
if (positionArr[nextPosition][1] !== null){
$("#next").css("visibility","hidden");
$("#next").attr("visibility","visible");
}
}
else  
else  
{
{
$("#next").css("visibility","visible");
$("#next").attr("visibility","hidden");
}
}
};
};
Line 489: Line 472:
}
}
#pillIDNav div{
#navTool{
display:inline-block;
}
#formConatiner div{
display:inline-block;
display:inline-block;
}
}
 
#formContainer{
background:#6e6e6e;
border:50%;
margin:auto;
}
.pillResult{
display:table-row;
}
.pillResult img{
width:150px;
height:auto;
display:table-cell;
vertical-align: middle;
border-radius:50%;
}
.pillResult-text{
display:table-cell;
vertical-align:top;
padding-left:5px;
}
.pillResult-text h1{
margin:0px;
font-size:24px;
}
.pillResult-text h2{
margin:0px;
font-size:18px;
}
.pillResult-text p{
margin:0px;
font-size:16px;
}
</style>
</style>


<div id="pillIdentifierContainer">
    <div id="pillIdentifierContainer">
<div id="pillIdentiferTitle">
        <div id="pillIdentiferTitle">
    <span>Pill Identifier</span>
            <span>Pill Identifier</span>
    </div>
        </div>
    <div id="queryContainer">
        <div id="formContainer">
        <div id="queryContainer_Shape" class="propertyContainerActive" data-order="1">
            <form id="selectedProperties" action="" method="get">
        <span class="propertyContainer_Title">SHAPE</span>
             <div id="selectedShape-container" class="ui-button">
             <div id="pillShapeContainer" class="propertyContainer" data-val="Shape">
                <span>Shape:</span><input readonly type="text" name="selectedShape" id="selectedShape" value="">
            <div id="pillShapeContainer_Row1" class="pillContainer_Row">
            </div>
                    <div id="Shape_Round" class="pillShapeOption" data-val="Round" data-prop="selectedShape"><img src="http://static.wikidoc.org/7/79/Round_Grey_Pill.png" alt="Round Pill"/></div>
            <div id="selectedColor-container" class="ui-button">
                    <div id="Shape_Oval" class="pillShapeOption" data-val="Oval" data-prop="selectedShape"><img src="http://static.wikidoc.org/3/3d/Oval_Grey_Pill.png" alt="Oval Pill"/></div>
                <span>Color:</span><input readonly type="text" name="selectedColor" id="selectedColor" value="">
                    <div id="Shape_Square" class="pillShapeOption" data-val="Square" data-prop="selectedShape"><img src="http://static.wikidoc.org/e/e9/Square_Grey_Pill.png" alt="Square Pill"/></div>
            </div>
                    <div id="Shape_Rectangular" class="pillShapeOption" data-val="Rectangular" data-prop="selectedShape"><img src="http://static.wikidoc.org/8/8e/Rectangular_Grey_Pill.png" alt="Rectangular Pill"/></div>
            <div id="selectedScoring-container" class="ui-button">
                    <div id="Shape_Triangular" class="pillShapeOption" data-val="Triangular" data-prop="selectedShape"><img src="http://static.wikidoc.org/c/cb/Triangular_Grey_Pill.png" alt="Triangular Pill"/></div>
                <span>Scoring:</span><input readonly type="text" name="selectedScoring" id="selectedScoring" value="">
                    <div id="Shape_Capsule" class="pillShapeOption" data-val="Capsule" data-prop="selectedShape"><img src="http://static.wikidoc.org/b/b8/Capsule_Grey_Pill.png" alt="Capsule"/></div>
            </div>        
                </div>
            <div class="ui-button" id="selectedMinSize-container">
                <div id="pillShapeContainer_Row2" class="pillContainer_Row">
                <span>Size:</span><input readonly type="text" name="selectedMinSize" size="3" id="selectedMinSize" value="5"><span>&nbsp;to&nbsp;</span><input readonly type="text" name="selectedMaxSize" size="3" id="selectedMaxSize" value="20">
                    <div id="Shape_Diamond" class="pillShapeOption" data-val="Diamond" data-prop="selectedShape"><img src="http://static.wikidoc.org/9/98/Diamond_Grey_Pill.png" alt="Diamond Pill"/></div>
            </div><br>
                    <div id="Shape_Pentagon" class="pillShapeOption" data-val="Pentagon" data-prop="selectedShape"><img src="http://static.wikidoc.org/b/be/Pentagon_Grey_Pill.png" alt="Pentagon Pill"/></div>
            <div class="ui-button" id="selectedImprint-container">
                    <div id="Shape_Hexagon" class="pillShapeOption" data-val="Hexagon" data-prop="selectedShape"><img src="http://static.wikidoc.org/2/25/Hexagon_Grey_Pill.png" alt="Hexagon Pill"/></div>
                <span>Imprint:</span><input readonly type="text" name="selectedImprint" id="selectedImprint" value="">
                    <div id="Shape_Octagon" class="pillShapeOption" data-val="Octagon" data-prop="selectedShape"><img src="http://static.wikidoc.org/f/f7/Octagon_Grey_Pill.png" alt="Octagon Pill"/></div>
                    <div id="Shape_DoubleCircle" class="pillShapeOption" data-val="DoubleCircle" data-prop="selectedShape"><img src="http://static.wikidoc.org/7/73/Double_Circle_Grey_Pill.png" alt="Double Circle Pill"/></div>
                    <div id="Shape_Clover" class="pillShapeOption" data-val="Clover" data-prop="selectedShape"><img src="http://static.wikidoc.org/a/a3/Clover_Grey_Pill.png" alt="Clover Pill"/></div>
            </div>
                <div id="pillShapeContainer_Row3" class="pillContainer_Row">
                    <div id="Shape_Gear" class="pillShapeOption" data-val="Gear" data-prop="selectedShape"><img src="http://static.wikidoc.org/5/56/Gear_Grey_Pill.png" alt="Gear Pill"/></div>
                    <div id="Shape_Bullet" class="pillShapeOption" data-val="Bullet" data-prop="selectedShape"><img src="http://static.wikidoc.org/8/8c/Bullet_Grey_Pill.png" alt="Bullet Pill"/></div>
                    <div id="Shape_SemiCircle" class="pillShapeOption" data-val="SemiCircle" data-prop="selectedShape"><img src="http://static.wikidoc.org/8/80/SemiCircle_Grey_Pill.png" alt="Semi-Circle Pill"/></div>
                    <div id="Shape_Trapezoid" class="pillShapeOption" data-val="Trapezoid" data-prop="selectedShape"><img src="http://static.wikidoc.org/7/7a/Trapezoid_Grey_Pill.png" alt="Trapezoid Pill"/></div>
                    <div id="Shape_Tear_Drop" class="pillShapeOption" data-val="TearDrop" data-prop="selectedShape"><img src="http://static.wikidoc.org/9/9a/Tear_Drop_Grey_Pill.png" alt="Tear Drop Pill"/></div>
                    <div id="Shape_Free_Form" class="pillShapeOption" data-val="FreeForm" data-prop="selectedShape"><img src="http://static.wikidoc.org/f/fa/Free_Form_Grey_Pill.png" alt="Free Form Pill"/></div>
                </div>
             </div>
             </div>
        </div>
             <div class="ui-button" id="selectedNDC-container">
        <div id="queryContainer_Color" class="propertyContainerInactive" data-order="2">
                 <span>NDC:</span><input readonly type="text" name="selectedNDC" id="selectedNDC" value="">
        <span class="propertyContainer_Title">COLOR</span>
             <div id="pillColorContainer" class="propertyContainer">
                <div id="pillColorContainer_Row1" class="pillContainer_Row">
                    <div id="Color_RedBrown" class="pillColorOption" data-val="Brown" data-prop="selectedColor"><img src="http://static.wikidoc.org/8/8a/Pid_redbrown.png" alt="Red/Brown"></div>
                    <div id="Color_Orange" class="pillColorOption" data-val="Orange" data-prop="selectedColor"><img src="http://static.wikidoc.org/a/ae/Pid_orange.png" alt="Orange"></div>
                    <div id="Color_Yellow" class="pillColorOption" data-val="Yellow" data-prop="selectedColor"><img src="http://static.wikidoc.org/e/e3/Pid_yellow.png" alt="Yellow"></div>
                    <div id="Color_Green" class="pillColorOption" data-val="Green" data-prop="selectedColor"><img src="http://static.wikidoc.org/c/c0/Pid_green.png" alt="Green"></div>
                    <div id="Color_Torqouise" class="pillColorOption" data-val="Torquoise" data-prop="selectedColor"><img src="http://static.wikidoc.org/1/11/Pid_turquoise.png" alt="Torqouise"></div>
                    <div id="Color_Blue" class="pillColorOption" data-val="Blue" data-prop="selectedColor"><img src="http://static.wikidoc.org/7/70/Pid_blue.png" alt="Blue"></div>
                 </div>
                <div id="pillColorContainer_Row2" class="pillContainer_Row">
                    <div id="Color_Purple" class="pillColorOption" data-val="Purple" data-prop="selectedColor"><img src="http://static.wikidoc.org/1/19/Pid_purple.png" alt="Purple"></div>
                    <div id="Color_Pink" class="pillColorOption" data-val="Pink" data-prop="selectedColor"><img src="http://static.wikidoc.org/9/97/Pid_pink.png" alt="Pink"></div>
                    <div id="Color_Black" class="pillColorOption" data-val="Black" data-prop="selectedColor"><img src="http://static.wikidoc.org/c/cb/Pid_black.png" alt="Black"></div>
                    <div id="Color_Grey" class="pillColorOption" data-val="Grey" data-prop="selectedColor"><img src="http://static.wikidoc.org/f/f5/Pid_grey.png" alt="Grey"></div>
                    <div id="Color_White" class="pillColorOption" data-val="White" data-prop="selectedColor"><img src="http://static.wikidoc.org/d/d2/Pid_white.png" alt="White"></div>
                </div>
             </div>
             </div>
        </div>
            <div class="ui-button" id="selectedIngred-container">
        <div id="queryContainer_Scoring" class="propertyContainerInactive" data-order="3">
                <span>Ingredients:</span><input readonly type="text" name="selectedIngred" id="selectedIngred" value="">
        <span class="propertyContainer_Title">SCORING</span>
            <div id="pillScoreContainer" class = "propertyContainer">
            <div id="pillScoreContainer_Row1" class="pillContainer_Row">
            <div id="pillScore1" class="pillScoreOption" data-val="1" data-prop="selectedScoring"><img src="http://static.wikidoc.org/f/f2/Score_1_Grey_Pill.jpg" alt="Score 1"></div>
            <div id="pillScore2" class="pillScoreOption" data-val="2" data-prop="selectedScoring"><img src="http://static.wikidoc.org/9/95/Score_2_Grey_Pill.jpg" alt="Score 2"></div>
            </div>
            <div id="pillScoreContainer_Row2" class="pillContainer_Row">
            <div id="pillScore3" class="pillScoreOption" data-val="3" data-prop="selectedScoring"><img src="http://static.wikidoc.org/d/d9/Score_3_Grey_Pill.jpg" alt="Score 3"></div>
            <div id="pillScore4" class="pillScoreOption" data-val="4" data-prop="selectedScoring"><img src="http://static.wikidoc.org/3/35/Score_4_Grey_Pill.jpg" alt="Score 4"></div>
            </div>
             </div>
             </div>
            </form>
         </div>
         </div>
         <div id="queryContainer_Size" class="propertyContainerInactive" data-order="4">
         <div id="queryContainer">
        <span class="propertyContainer_Title">SIZE</span>
            <div id="queryContainer_Shape" class="propertyContainerActive" data-order="1">
            <div id="pillSizeContainer" class="propertyContainer">
                <span class="propertyContainer_Title">SHAPE</span>
            <span>Search for Pills Between:&nbsp;</span>
                <div id="pillShapeContainer" class="propertyContainer" data-val="Shape">
 
                    <div id="pillShapeContainer_Row1" class="pillContainer_Row">
                <div id="sliderContainer" class="pillContainer_Row" style="m">
                        <div id="Shape_Round" class="pillShapeOption" data-val="Round" data-prop="selectedShape"><img src="http://static.wikidoc.org/7/79/Round_Grey_Pill.png" alt="Round Pill"/></div>
                    <div class="pillSizeOption">
                        <div id="Shape_Oval" class="pillShapeOption" data-val="Oval" data-prop="selectedShape"><img src="http://static.wikidoc.org/3/3d/Oval_Grey_Pill.png" alt="Oval Pill"/></div>
                         <img id="DisplaySmallSize" src="http://static.wikidoc.org/f/f2/Pill_Size_5_mm.png" alt=""/>
                        <div id="Shape_Square" class="pillShapeOption" data-val="Square" data-prop="selectedShape"><img src="http://static.wikidoc.org/e/e9/Square_Grey_Pill.png" alt="Square Pill"/></div>
                         <span id="pillMinSize">5</span><span>&nbsp;mm</span>
                         <div id="Shape_Rectangular" class="pillShapeOption" data-val="Rectangular" data-prop="selectedShape"><img src="http://static.wikidoc.org/8/8e/Rectangular_Grey_Pill.png" alt="Rectangular Pill"/></div>
                         <div id="Shape_Triangular" class="pillShapeOption" data-val="Triangular" data-prop="selectedShape"><img src="http://static.wikidoc.org/c/cb/Triangular_Grey_Pill.png" alt="Triangular Pill"/></div>
                        <div id="Shape_Capsule" class="pillShapeOption" data-val="Capsule" data-prop="selectedShape"><img src="http://static.wikidoc.org/b/b8/Capsule_Grey_Pill.png" alt="Capsule"/></div>
                     </div>
                     </div>
                     <div class="pillSizeOption">
                     <div id="pillShapeContainer_Row2" class="pillContainer_Row">
                         <img id="DisplayDime" src="http://static.wikidoc.org/c/c4/Pill_Size_Dime.png" alt="Reference Dime"/>
                        <div id="Shape_Diamond" class="pillShapeOption" data-val="Diamond" data-prop="selectedShape"><img src="http://static.wikidoc.org/9/98/Diamond_Grey_Pill.png" alt="Diamond Pill"/></div>
                        <div id="Shape_Pentagon" class="pillShapeOption" data-val="Pentagon" data-prop="selectedShape"><img src="http://static.wikidoc.org/b/be/Pentagon_Grey_Pill.png" alt="Pentagon Pill"/></div>
                        <div id="Shape_Hexagon" class="pillShapeOption" data-val="Hexagon" data-prop="selectedShape"><img src="http://static.wikidoc.org/2/25/Hexagon_Grey_Pill.png" alt="Hexagon Pill"/></div>
                        <div id="Shape_Octagon" class="pillShapeOption" data-val="Octagon" data-prop="selectedShape"><img src="http://static.wikidoc.org/f/f7/Octagon_Grey_Pill.png" alt="Octagon Pill"/></div>
                         <div id="Shape_DoubleCircle" class="pillShapeOption" data-val="DoubleCircle" data-prop="selectedShape"><img src="http://static.wikidoc.org/7/73/Double_Circle_Grey_Pill.png" alt="Double Circle Pill"/></div>
                        <div id="Shape_Clover" class="pillShapeOption" data-val="Clover" data-prop="selectedShape"><img src="http://static.wikidoc.org/a/a3/Clover_Grey_Pill.png" alt="Clover Pill"/></div>
                     </div>
                     </div>
                     <div class="pillSizeOption">
                     <div id="pillShapeContainer_Row3" class="pillContainer_Row">
                         <span id="pillMaxSize">20</span><span>&nbsp;mm</span>
                        <div id="Shape_Gear" class="pillShapeOption" data-val="Gear" data-prop="selectedShape"><img src="http://static.wikidoc.org/5/56/Gear_Grey_Pill.png" alt="Gear Pill"/></div>
                         <img id="DisplayLargeSize" src="http://static.wikidoc.org/e/e6/Pill_Size_20_mm.png" alt=""/>
                         <div id="Shape_Bullet" class="pillShapeOption" data-val="Bullet" data-prop="selectedShape"><img src="http://static.wikidoc.org/8/8c/Bullet_Grey_Pill.png" alt="Bullet Pill"/></div>
                        <div id="Shape_SemiCircle" class="pillShapeOption" data-val="SemiCircle" data-prop="selectedShape"><img src="http://static.wikidoc.org/8/80/SemiCircle_Grey_Pill.png" alt="Semi-Circle Pill"/></div>
                        <div id="Shape_Trapezoid" class="pillShapeOption" data-val="Trapezoid" data-prop="selectedShape"><img src="http://static.wikidoc.org/7/7a/Trapezoid_Grey_Pill.png" alt="Trapezoid Pill"/></div>
                         <div id="Shape_Tear_Drop" class="pillShapeOption" data-val="TearDrop" data-prop="selectedShape"><img src="http://static.wikidoc.org/9/9a/Tear_Drop_Grey_Pill.png" alt="Tear Drop Pill"/></div>
                        <div id="Shape_Free_Form" class="pillShapeOption" data-val="FreeForm" data-prop="selectedShape"><img src="http://static.wikidoc.org/f/fa/Free_Form_Grey_Pill.png" alt="Free Form Pill"/></div>
                     </div>
                     </div>
                 </div>
                 </div>
                <br>
                <br>
                <div id="slider"></div>
             </div>
             </div>
        </div>
            <div id="queryContainer_Color" class="propertyContainerInactive" data-order="2">
<div id = "misc" class="propertyContainerInactive" data-order="5">
                <span class="propertyContainer_Title">COLOR</span>
        <form name="selectMisc">
                <div id="pillColorContainer" class="propertyContainer">
                <div class="pillMiscContainer" id="queryContainer-Imprint" data-prop="selectedImprint" data-inputName="pillImprint">
                    <div id="pillColorContainer_Row1" class="pillContainer_Row">
                     <span class="propertyContainer_Title">IMPRINT</span>
                        <div id="Color_RedBrown" class="pillColorOption" data-val="Brown" data-prop="selectedColor"><img src="http://static.wikidoc.org/8/8a/Pid_redbrown.png" alt="Red/Brown"></div>
                    <div id="PillImprintContainer" class="propertyContainer-Small">
                        <div id="Color_Orange" class="pillColorOption" data-val="Orange" data-prop="selectedColor"><img src="http://static.wikidoc.org/a/ae/Pid_orange.png" alt="Orange"></div>
                         <span>Please Enter the Pill Imprint:&nbsp;</span><br>
                        <div id="Color_Yellow" class="pillColorOption" data-val="Yellow" data-prop="selectedColor"><img src="http://static.wikidoc.org/e/e3/Pid_yellow.png" alt="Yellow"></div>
<input id="pillImprint" name="pillImprint" type="text">
                        <div id="Color_Green" class="pillColorOption" data-val="Green" data-prop="selectedColor"><img src="http://static.wikidoc.org/c/c0/Pid_green.png" alt="Green"></div>
                        <div id="Color_Torqouise" class="pillColorOption" data-val="Torquoise" data-prop="selectedColor"><img src="http://static.wikidoc.org/1/11/Pid_turquoise.png" alt="Torqouise"></div>
                        <div id="Color_Blue" class="pillColorOption" data-val="Blue" data-prop="selectedColor"><img src="http://static.wikidoc.org/7/70/Pid_blue.png" alt="Blue"></div>
                    </div>
                     <div id="pillColorContainer_Row2" class="pillContainer_Row">
                        <div id="Color_Purple" class="pillColorOption" data-val="Purple" data-prop="selectedColor"><img src="http://static.wikidoc.org/1/19/Pid_purple.png" alt="Purple"></div>
                        <div id="Color_Pink" class="pillColorOption" data-val="Pink" data-prop="selectedColor"><img src="http://static.wikidoc.org/9/97/Pid_pink.png" alt="Pink"></div>
                         <div id="Color_Black" class="pillColorOption" data-val="Black" data-prop="selectedColor"><img src="http://static.wikidoc.org/c/cb/Pid_black.png" alt="Black"></div>
                        <div id="Color_Grey" class="pillColorOption" data-val="Grey" data-prop="selectedColor"><img src="http://static.wikidoc.org/f/f5/Pid_grey.png" alt="Grey"></div>
                        <div id="Color_White" class="pillColorOption" data-val="White" data-prop="selectedColor"><img src="http://static.wikidoc.org/d/d2/Pid_white.png" alt="White"></div>
                     </div>
                     </div>
                 </div>
                 </div>
                <div class="pillMiscContainer" id="queryContainer-NDC" data-prop="selectedNDC" data-inputName="pillNDC">
            </div>
                    <span class="propertyContainer_Title">NDC</span>
            <div id="queryContainer_Scoring" class="propertyContainerInactive" data-order="3">
                     <div id="pillNDCContainer" class="propertyContainer-Small">
                <span class="propertyContainer_Title">SCORING</span>
                         <span>If available, please enter the NDC:&nbsp;</span><br>
                <div id="pillScoreContainer" class = "propertyContainer">
                         <input id="pillNDC" name="pillNDC" type="text">
                     <div id="pillScoreContainer_Row1" class="pillContainer_Row">
                         <div id="pillScore1" class="pillScoreOption" data-val="1" data-prop="selectedScoring"><img src="http://static.wikidoc.org/f/f2/Score_1_Grey_Pill.jpg" alt="Score 1"></div>
                         <div id="pillScore2" class="pillScoreOption" data-val="2" data-prop="selectedScoring"><img src="http://static.wikidoc.org/9/95/Score_2_Grey_Pill.jpg" alt="Score 2"></div>
                     </div>
                     </div>
                </div>  
                    <div id="pillScoreContainer_Row2" class="pillContainer_Row">
                <div class="pillMiscContainer" id="queryContainer-Ingred" data-prop="selectedIngred" data-inputName="pillIngred">
                        <div id="pillScore3" class="pillScoreOption" data-val="3" data-prop="selectedScoring"><img src="http://static.wikidoc.org/d/d9/Score_3_Grey_Pill.jpg" alt="Score 3"></div>
                    <span class="propertyContainer_Title">INGREDIENTS</span>
                        <div id="pillScore4" class="pillScoreOption" data-val="4" data-prop="selectedScoring"><img src="http://static.wikidoc.org/3/35/Score_4_Grey_Pill.jpg" alt="Score 4"></div>
                    <div id="PillIngredContainer" class="propertyContainer-Small">
                        <span>If available, please enter the ingredients:&nbsp;</span><br>
<input  id ="pillIngred" name="pillIngred" type="text">
                     </div>
                     </div>
                 </div>
                 </div>
</form>
            </div>
</div>
            <div id="queryContainer_Size" class="propertyContainerInactive" data-order="4">
    </div>
                <span class="propertyContainer_Title">SIZE</span>
    <div id="formContainer">
                <div id="pillSizeContainer" class="propertyContainer">
    <form id="selectedProperties" action="" method="get">
                    <span>Search for Pills Between:&nbsp;</span>
        <input type="hidden" name="selectedShape" id="selectedShape" value="">
   
            <input type="hidden" name="selectedColor" id="selectedColor" value="">
                    <div id="sliderContainer" class="pillContainer_Row" style="m">
            <input type="hidden" name="selectedScoring" id="selectedScoring" value="">
                        <div class="pillSizeOption">
            <input type="hidden" name="selectedMinSize" id="selectedMinSize" value="5">
                            <img id="DisplaySmallSize" src="http://static.wikidoc.org/f/f2/Pill_Size_5_mm.png" alt=""/>
            <input type="hidden" name="selectedMaxSize" id="selectedMaxSize" value="20">
                            <span id="pillMinSize">5</span><span>&nbsp;mm</span>
            <input type="hidden" name="selectedImprint" id="selectedImprint" value="">
                        </div>
            <input type="hidden" name="selectedNDC" id="selectedNDC" value="">
                        <div class="pillSizeOption">
            <input type="hidden" name="selectedIngred" id="selectedIngred" value="">
                            <img id="DisplayDime" src="http://static.wikidoc.org/c/c4/Pill_Size_Dime.png" alt="Reference Dime"/>
        </form>
                        </div>
    </div>
                        <div class="pillSizeOption">
    <div id="pillIDNav">
                            <span id="pillMaxSize">20</span><span>&nbsp;mm</span>
    <div id="back" class="navTool" data-direction="back" style="visibility:hidden">
                            <img id="DisplayLargeSize" src="http://static.wikidoc.org/e/e6/Pill_Size_20_mm.png" alt=""/>
        <img src="http://static.wikidoc.org/8/83/Pid_backbutton.png" alt="back">
                        </div>
                    </div>
                    <br>
                    <br>
                    <div id="slider"></div>
                </div>
            </div>
            <div id = "misc" class="propertyContainerInactive" data-order="5">
                <form name="selectMisc">
                    <div class="pillMiscContainer" id="queryContainer-Imprint" data-prop="selectedImprint" data-inputName="pillImprint">
                        <span class="propertyContainer_Title">IMPRINT</span>
                        <div id="PillImprintContainer" class="propertyContainer-Small">
                            <span>Please Enter the Pill Imprint:&nbsp;</span><br>
                            <input id="pillImprint" name="pillImprint" type="text">
                        </div>
                    </div>
                    <div class="pillMiscContainer" id="queryContainer-NDC" data-prop="selectedNDC" data-inputName="pillNDC">
                        <span class="propertyContainer_Title">NDC</span>
                        <div id="pillNDCContainer" class="propertyContainer-Small">
                            <span>If available, please enter the NDC:&nbsp;</span><br>
                            <input id="pillNDC" name="pillNDC" type="text">
                        </div>
                    </div>  
                    <div class="pillMiscContainer" id="queryContainer-Ingred" data-prop="selectedIngred" data-inputName="pillIngred">
                        <span class="propertyContainer_Title">INGREDIENTS</span>
                        <div id="PillIngredContainer" class="propertyContainer-Small">
                            <span>If available, please enter the ingredients:&nbsp;</span><br>
                            <input  id ="pillIngred" name="pillIngred" type="text">
                        </div>
                    </div>
                </form>
            </div>
         </div>
         </div>
    <div id="next" class="navTool" data-direction="next" style="visibility:visible">
        <div id="pillIDNav">
        <img src="http://static.wikidoc.org/8/8a/Pid_nextbutton.png" alt="next">
            <div id="back" class="navTool" data-direction="back" style="visibility:hidden">
        </div>
                <img src="http://static.wikidoc.org/8/83/Pid_backbutton.png" alt="back">
        <div id="submit">
            </div>
        <img src="http://static.wikidoc.org/6/6c/Pid_submitbutton.png" alt="Submit">
            <div id="next" class="navTool" data-direction="next" style="visibility:visible">
                <img src="http://static.wikidoc.org/8/8a/Pid_nextbutton.png" alt="next">
            </div>
            <div id="submit">
                <img src="http://static.wikidoc.org/6/6c/Pid_submitbutton.png" alt="Submit">
            </div>
         </div>
         </div>
     </div>
     </div>
</div>
    <div id="resultsTable-container" style="visibility:collapse;">
<div id="resultsTable-container" style="visibility:collapse;">
    <table id="resultsTable" class="resultsTable-class">
        <thead>
            <th>
            Drug Name
            </th>
           
            <th>
            Pill Imprint
            </th>
           
            <th style="width:60px;">
            Dosage
            </th>
           
            <th>
            Ingredients
            </th>
           
            <th style="width:60px;">
            Pill Color
            </th>
           
            <th style="width:60px;">
            Pill Shape
            </th>
           
            <th>
            Pill Size (mm)
            </th>
           
            <th style="width:60px;">
            Score
            </th>
           
            <th>
            NDC
            </th>
           
            <th style="width:360px;">
            Pill Image
            </th>
        </thead>
       
        <tbody id="resultsTable-body">
       
        </tbody>
</table>
</div>


    </div>
</includeonly>
</includeonly>

Revision as of 02:55, 2 August 2015

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