Equipment Catalog - LibCal - University of California, San Francisco

<!DOCTYPE html> <html lang="en"> <head>  <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="https://static-assets-us.libcal.com/css_651/bootstrap3.min.css" rel="stylesheet"> <link href="https://static-assets-us.libcal.com/css_651/jquery-ui.min.css" rel="stylesheet"> <link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <link href="https://static-assets-us.libcal.com/css_651/LibCal_public.min.css" rel="stylesheet"> <link href="https://static-assets-us.libcal.com/css_651/print.min.css" rel="stylesheet" media="print"> <script src="https://static-assets-us.libcal.com/js_651/jquery.min.js"></script> <script src="https://static-assets-us.libcal.com/js_651/jquery-ui.min.js"></script> <script src="https://static-assets-us.libcal.com/js_651/bootstrap3.min.js"></script> <script src="https://static-assets-us.libcal.com/js_651/LibCal_public.min.js"></script> <script> springSpace.dateFormat = "dddd, MMM D YYYY"; springSpace.dateShortFormat = "MMMM D, YYYY"; springSpace.timeFormat = "h:mma"; springSpace.timezone = 'America/Los_Angeles'; springSpace.currency = "USD"; springSpace.currencySymbol = "$"; springSpace.language = 'en'; // en springSpace.locale = 'en-US'; // en-US springSpace.phpTimeFormat = 'g:ia'; springSpace.bootstrapAsset = 'https://static-assets-us.libcal.com/css_651/bootstrap3_16.min.css'; springSpace.publicCssAsset = 'https://static-assets-us.libcal.com/css_651/LibCal_public.min.css'; springSpace.adminCssAsset = 'https://static-assets-us.libcal.com/css_651/LibCal_admin.min.css'; </script> <title> Equipment Catalog - LibCal - University of California, San Francisco </title> <style> #s-lc-public-banner { padding: 0; margin: 0; } .s-lc-public-footer { margin: 0; } </style> <link rel="stylesheet" href="https://static-assets-us.libcal.com/css_651/fullcalendar.min.css"/> <script defer src="https://static-assets-us.libcal.com/js_651/datepicker.min.js"></script> <link rel="stylesheet" href="https://static-assets-us.libcal.com/css_651/datepicker.min.css"/> <style> .s-lc-eq-avail, .label-eq-avail, .s-lc-eq-period-available { background: #14951f none !important; border-color: #14951f !important; } .s-lc-eq-avail:hover, .s-lc-eq-period-available:hover { background: #095212 none !important; border-color: #095212 !important; } .s-lc-eq-pending, .label-eq-pending, .s-lc-eq-period-pending { background: #F59F16 none !important; border-color: #F59F16 !important; } .s-lc-eq-checkout, .s-lc-eq-r-unavailable, .s-lc-eq-r-padding, .label-eq-unavailable, .s-lc-eq-period-booked { background: #c91908 none !important; border-color: #c91908 !important; } </style>  <script id="ze-snippet" src="https://static.zdassets.com/ekr/snippet.js?key=adf68403-a4fd-4dfb-8db7-26bd8920eef0"> </script>  <style> /*Remove empty bullet point from calendar home page*/ #s-lc-content-eqlist-26122 > ul > li.divider { display: none; } /*Change color of tentative blocks*/ .lc_rm_t { background-color: #999; } /* UCSF banner & library logo styles */ body { padding: 0; margin: 0; } #ucsf-banner-nav .top-header-container, #ucsf-headers { margin-right: auto; margin-left: auto; max-width: 100%; } #ucsf-banner-nav { height: 40px; overflow: visible; font-family: "Helvetica Neue", arial, sans-serif; background: #052049; } #ucsf-banner-nav.no-logo .top-header-container ul.menu li.first { background: 0 0; text-indent: 0; padding-left: 0; } #ucsf-banner-nav .top-header-container { padding-left: 15px; padding-right: 15px; } #ucsf-banner-nav .top-header-container ul.menu { padding: 0; margin: 0; } #ucsf-banner-nav .top-header-container ul.menu li.first { display: inline-block; float: left; padding: 12px 0 12px 58px; background: url(ucsf-logo-banner.png) 0 35% no-repeat; background-position-x: 0; background-position-y: 35%; } #ucsf-banner-nav .top-header-container ul.menu li { display: inline-block; float: right; font-size: 14px; padding: 12px 10px; } @media (max-width: 830px) { #ucsf-banner-nav .top-header-container ul.menu li { display: none; } } @media (max-width: 600px) { #ucsf-banner-nav .top-header-container ul.menu li.first { text-indent: 100%; white-space: nowrap; overflow: visible; } #ucsf-banner-nav .top-header-container ul.menu li { display: none; } } #ucsf-banner-nav .top-header-container ul.menu li a { text-decoration: none; color: #fff; } #ucsf-banner-nav .top-header-container ul.menu li a:hover { text-decoration: underline; } #ucsf-banner-nav.arial { font-family: arial, sans-serif; } #ucsf-banner-nav.bluetint { background: #506380; } :root #ucsf-banner-nav .top-header-container ul.menu li.first { background: 0 35%; background-size: 45px 22px; background-position-x: 0; background-position-y: 35%; } header { background: #052049; padding: 1.25em; margin: 0 0 0.5em; border-radius: 0; } /* footer feedback button styles */ .ucsf-footer { width: 100%; margin: 15px auto 0; max-width: 1230px; padding: 5px 15px; border-top: 1px solid #aaa; } #s-lc-public-footer { background-color: #052049; color: white; } #s-lc-public-footer a { color: white; } .inline-list { margin: 0 0 1.0625rem -1.375rem; padding: 0; list-style: none; overflow: visible; } .inline-list > li { list-style: none; float: left; margin-left: 1.375rem; margin-top: 5px; display: block; } .inline-list > li > * { display: block; } #feedback-link { background-color: #007cbe; color: #fff; font-weight: 700; padding: 0 4px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } #feedback-link:hover { cursor: pointer; background-color: #052429; } /* Overrides Equipment image fixed height and makes equipment images responsive */ .col-item .photo img { height: auto; } /* Makes equipment cards consistently sized */ @media (min-width: 992px) { .col-item .info { position: absolute; bottom: 20px; width: 90%; } .col-item { min-height: 400px; } } @media (min-width: 768px) and (max-width: 991px) { .col-item .info { position: absolute; bottom: 20px; width: 90%; } .col-item { min-height: 300px; } } /*Adds title to LibCal landing page in Book a Consultation dropdown*/ /*Anneliese Taylor*/ #s-lc-content-mysched-494243953:after { content: ' - Publishing and Open Access Expert'; } /*Ariel Deardorff*/ #s-lc-content-mysched-4942410642::after { content: ' - Data Science Services Librarian'; } /*Evans Whiteaker*/ #s-lc-content-mysched-49424921::after { content: ' - Medicine and Pharmacy Research Librarian'; } /*Geoff Boushey*/ #s-lc-content-mysched-4942415596::after { content: ' - Data Science Expert'; } /*Karla Lindquist*/ #s-lc-content-mysched-4942434278::after { content: ' - Data Science Expert'; } /*Min-Lin Fang*/ #s-lc-content-mysched-494243941::after { content: ' - Nursing and Social and Behavioral Sciences Research Librarian'; } /*Peggy Tahir*/ #s-lc-content-mysched-494243950::after { content: ' - Research and Copyright Librarian'; } /*Stephen Fernandez*/ #s-lc-content-mysched-4942411486::after { content: ' - Student IT Support'; } /*Lisa Leiva*/ #s-lc-content-mysched-494249794::after { content: ' - Instructional Designer'; } /*Angelo Pelonero*/ #s-lc-content-mysched-4942451469::after { content: ' - Data Science Instructional Designer'; } /* Adds color to Next Available button */ #eq-time-grid > div.fc-toolbar.fc-header-toolbar > div.fc-left > button.fc-goToNextAvailable-button.btn.btn-default { background-color: #5bc0de; Border-color: #46b8da; color: #ffffff; } /* Equipment module increasing card height #cat_cont .col-sm-3 { height: 350px; }*/ </style> </head> <body id="equip_" class="s-lc-public s-lc-public-page-5"> <a id="s-lc-public-skiplink" class="s-lc-skiplink alert-info" href="#s-lc-public-title-area">Skip to Main Content</a> <div id="s-lc-public-cust-header" role="banner"><body> <div id="ucsf-headers container"> <div id="ucsf-banner-nav" class="bluetint no-logo"> <div class="top-header-container row"> <ul class="menu"> <li class="first"><a href="http://www.ucsf.edu">University of California San Francisco</a></li> <li><a href="http://www.ucsfhealth.org/">UCSF Medical Center</a></li> <li><a href="http://www.ucsf.edu/about">About UCSF</a></li> </ul> </div> </div> <header> <div class="container"><a href="http://library.ucsf.edu/"><img alt="" src="https://ucsf-ckm.github.io/assets/ucsf_library_logo2015.svg"></a></div> </header> </div> </body></div> <div class="container"> <div id="s-lc-public-bc" class="row"> <div class="col-md-12"> <nav aria-label="Breadcrumb"> <ol class="breadcrumb"> <li><a href="http://www.library.ucsf.edu/">University of California, San Francisco</a></li> <li class="s-lc-desktop-only"><a href="https://calendars.library.ucsf.edu">LibCal</a></li> <li class="active s-lc-desktop-only">Equipment Catalog</li> </ol> </nav> </div> </div> <noscript> <div class="alert alert-danger" id="noscript">Your browser has javascript disabled. Without javascript some functions will not work.</div> </noscript> <div id="s-lc-public-title-area"> </div> <main> <div id="s-lc-public-main" class="s-lc-public-main"> <div id="s-lc-public-page-content" class="row"> <div id="col1" class="col-md-12 center"> <div id="s-lc-eq-cart-cont" class="pull-right" role="region" aria-label="cart"> <span class="cart" id="cart-nav"></span> </div> <h1 class="sr-only">Equipment Catalog</h1> <div id="s-lc-eq-p-navform"> <form id="s-lc-eq-catalog-filters" class="form-inline" role="search"> <input type="hidden" name="page" id="page" value="1"> <input type="hidden" name="type" id="type" value="1"> <div class="form-group form-group-sm"> <label class="hidden-sm" for="lid">Location</label> <select class="form-control" name="lid" id="lid" disabled="disabled"> <option value="31" >Tech Commons at Parnassus</option> <option value="242" >Makers Lab at Parnassus</option> </select> </div> <div class="form-group form-group-sm"> <label class="hidden-sm" for="gid">Category</label> <select class="form-control" name="gid" id="gid"> <option value="0">Show All</option> <option value="76" >Audio Equipment</option> <option value="77" >Computing Devices and Storage</option> <option value="29296" >Document Cameras</option> <option value="78" >Pen Tablets</option> <option value="75" >Video and Photo Equipment</option> </select> </div> <div class="form-group form-group-sm" style="clear: both"> <input type="search" class="form-control" name="q" id="s-lc-eq-search" value="" aria-required="false" placeholder="Search for equipment..." aria-label="Search for equipment..."> <button type="submit" class="btn btn-default btn-sm" id="s-lc-eq-searchbtn">Search</button> </div> </form> </div> <div id="cat_cont"></div> <div id="time_grid_cont" class="s-lc-equipment-time-grid" role="grid"> <div id="eq-time-grid"></div> <div class="s-lc-time-grid-legend"> <span class="label-eq-cont" data-toggle="tooltip" data-placement="top" title="Slot is available, click to book!"><span class="label label-eq-avail">  </span> Available</span> <span class="label-eq-cont" data-toggle="tooltip" data-placement="top" title="Your pending booking."><span class="label label-eq-pending">  </span> Your Booking</span> <span class="label-eq-cont" data-toggle="tooltip" data-placement="top" title="This slot is unavailable for starting a new booking. Bookings may occasionally extend into this slot."><span class="label label-eq-unavailable">  </span> Unavailable/Padding</span> <br> <span class="label label-eq-filtered" id="restrictTimeNote"></span> </div> </div> <div id="eq-additem" class="s-lc-eq-well" style="display: none;" aria-label="booking form"> <hr> <div class="well" style="min-height: 220px;"> <div class="container-fluid"> <div class="col-md-2" id="eq-additem-image"></div> <div class="col-md-10 form-horizontal"> <span id="eq-additem-name" class="s-lc-eq-cart-itemname"></span> <div class="form-group"> <label class="col-md-2 control-label" for="eq-additem-from">From:</label> <div class="col-md-8"> <p class="form-control-static" id="eq-additem-from"></p> </div> </div> <div class="form-group"> <div id="eq-dur-load"> <label class="col-md-2 control-label"> To: </label> <div class="col-md-4"> <p class="form-control-static"> Determining return time <i class="fa fa-spinner fa-spin fa-lg" aria-hidden="true"></i> </p> </div> </div> <div id="eq-dur-end-dateonly" style="display: none;"> <label class="col-md-2 control-label" for="eq-dur-end-dateonly-val">To:</label> <div class="col-md-4"> <p class="form-control-static" id="eq-dur-end-dateonly-val"></p> </div> <div class="col-md-5"> <button class="btn btn-default" id="eq-dur-end-dateonly-btn"><i class="fa fa-calendar fa-sm" aria-hidden="true"></i> Change Return Date</button> <button type="button" class="btn btn-default" onclick="return cancelAddItem();"><i class="fa fa-trash-o" aria-hidden="true"></i><span class="sr-only">Remove Pending Booking</span></button> </div> </div> <div id="eq-dur-end-dateandtime" style="display: none;"> <label class="col-md-2 control-label" for="eq-dur-end-dateandtime-select">To:</label> <div class="col-md-5"> <select class="form-control" id="eq-dur-end-dateandtime-select"></select> </div> <div class="col-md-5"> <button class="btn btn-default" id="eq-dur-end-dateandtime-btn"><i class="fa fa-calendar fa-sm" aria-hidden="true"></i> Change Return Date</button> <button type="button" class="btn btn-default" onclick="return cancelAddItem();"><i class="fa fa-trash-o" aria-hidden="true"></i><span class="sr-only">Remove Pending Booking</span></button> </div> </div> <div id="eq-dur-end-timeonly" style="display: none;"> <label class="col-md-2 control-label" for="eq-dur-end-timeonly-select">To:</label> <div class="col-md-5"> <select id="eq-dur-end-timeonly-select" class="form-control"></select> </div> <div class="col-md-5"> <button type="button" class="btn btn-default" onclick="return cancelAddItem();"><i class="fa fa-trash-o" aria-hidden="true"></i><span class="sr-only">Remove Pending Booking</span></button> </div> </div> </div> <div id="s-lc-booking-cost-container" class="form-group"> <label class="col-md-2 control-label" for="eq-additem-from"> Cost: </label> <div class="col-md-8"> <p class="form-control-static" id="s-lc-booking-cost"> Determining cost <i class="fa fa-spinner fa-spin fa-lg" aria-hidden="true"></i> </p> </div> </div> <div class="form-group"> <div class="col-md-offset-2 col-md-11"> <button class="btn btn-primary eq-atc-btn" id="eq-atc-btn" data-act="atc" disabled="disabled"><i class="fa fa-shopping-cart fa-lg eq-fa-add" aria-hidden="true"></i> Add Item</button> <button class="btn btn-default eq-atc-btn" id="eq-atcc-btn" data-act="atcc" disabled="disabled">Submit Reservation</button> </div> </div> </div> </div> </div> </div> </div> </div> </div> </main> <footer id="s-lc-public-footer" class="row s-lc-public-footer"> <div id="s-lc-public-footer-brand"> <span title="libcal-us-4">Powered by</span> <a href="https://www.springshare.com">Springshare</a>. </div> <div id="s-lc-public-footer-rights"> All rights reserved. </div> <div id="s-lc-footer-support-link"> <a href="https://ucsflibrary.zendesk.com/hc/en-us/requests/new">Report a tech support issue.</a> </div> <div id="s-lc-public-footer-admin-links" role="navigation" aria-label="Admin Footer"> <a id="s-lc-sign-in" href="https://ucsf.libapps.com/libapps/login.php?site_id=4237&target=">Login to LibApps</a> </div> <div class="s-lc-public-footer-actions"> <div id="s-lc-language"> <select id="s-lc-language-selector" aria-label="Select Language"> <option value="ca" >català</option> <option value="cy" >Cymraeg</option> <option value="en" selected>English</option> <option value="es" >español</option> <option value="fr" >français</option> <option value="ga" >Irish</option> <option value="ja" >日本語 Nihongo</option> <option value="nl" >Nederlands</option> <option value="sl" >slovenski jezik</option> <option value="vi" >Tiếng Việt</option> <option value="zh" >中文 Zhōngwén</option> </select> </div> </div> </footer>  <script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-552286-50', 'auto'); ga('send', 'pageview'); </script>  <script type="text/javascript"> /*<![CDATA[*/ (function() { var sz = document.createElement('script'); sz.type = 'text/javascript'; sz.async = true; sz.src = '//siteimproveanalytics.com/js/siteanalyze_8343.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(sz, s); })(); /*]]>*/ </script>  <script type="text/javascript" src="//script.crazyegg.com/pages/scripts/0014/1423.js" async="async"></script> </div> <div id="s-lc-public-cust-footer"><div class="ucsf-footer"> <ul class="inline-list"> <li><a href="https://www.library.ucsf.edu/about">About the Library</a></li> <li><a href="https://www.library.ucsf.edu/contact">Contact Us</a></li> </ul> </div></div> <script type='text/javascript' src='https://static-assets-us.libcal.com/js_651/fullcalendar.min.js'></script> <script> var springyFullCalendar = { commonOptions: { schedulerLicenseKey: '0391239527-fcs-1659132663', now: '2024\u002D11\u002D26\u002017\u003A06', nowIndicator: true, scrollTime: '16\u003A00\u003A00', lazyFetching: false, locale: springSpace.language, themeSystem: 'bootstrap', eventTextColor: '#222', eventDisplay: 'block', moreLinkClick: 'day', bootstrapFontAwesome: { goToDate: 'fa-calendar', goToNextAvailable: 'fa-fast-forward', refresh: 'fa-refresh', }, navLinks: true, // https://fullcalendar.io/docs/navLinks resourceOrder: false, // https://fullcalendar.io/docs/resourceOrder stickyHeaderDates: false, // https://fullcalendar.io/docs/stickyHeaderDates && https://github.com/springshare/LibCal/issues/11801 dayCellContent: function (info) { // regardless of language, show the day as a number with no extra characters return info.date.getDate(); }, }, timelineOptions: { height: 'auto', refetchResourcesOnNavigate: false, eventOverlap: false, displayEventTime: false, slotDuration: '01\u003A00', titleFormat: springSpace.dateFormat, views: { timelineSingleDay: { type: 'resourceTimeline', buttonText: 'Day\u0020View', duration: {days: 1}, slotLabelFormat: springSpace.timeFormat, }, timelineHourlyShort: { type: 'resourceTimeline', duration: {days: 3}, slotLabelFormat: [springSpace.dateFormat, springSpace.timeFormat], }, timelineHourlyLong: { type: 'resourceTimeline', duration: {days: 7}, slotLabelFormat: [springSpace.dateFormat, springSpace.timeFormat], }, timelineDailyLong: { type: 'resourceTimeline', slotDuration: '24:00', duration: {days: 28}, slotLabelFormat: ['dd D'], nowIndicator: false }, resourceTimeGridWeek: { buttonText: 'Week\u0020View', slotLabelFormat: springSpace.timeFormat, } }, }, publicTexts: { allDay: 'All\u0020Day', available: 'Available', dayGridMonth: 'Month', dayGridWeek: 'Agenda', goToDate: 'Go\u0020To\u0020Date', goToNextAvailable: 'Next\u0020Available', next: 'Next', prev: 'Previous', timeGridDay: 'Day', timeGridWeek: 'Week', today: 'Today', unavailable: 'Unavailable\/Padding', yourBooking: 'Your\u0020Booking', listWeek: 'Week\u0020List', }, adminTexts: { goToDate: 'Go\u0020To\u0020Date', refresh: 'Refresh', prev: 'Previous', next: 'Next', today: 'Today', week: 'Week', month: 'Month', day: 'Day', dayGridWeek: 'Agenda', allDay: 'All\u0020Day', atLocation: '\u0025title\u0025\u0020at\u0020\u0025location\u0025', }, dateTimeFormats: { monthViewTitle: 'MMMM YYYY', }, }; // placeholder for dynamic content boxes with a full calendar var calendarList = {}; function reRenderCalendarList() { for (var calId in calendarList) { calendarList[calId].render(); } } </script> <script defer src="https://static-assets-us.libcal.com/js_651/direct/full-calendar-common.min.js"></script> <script defer src="https://static-assets-us.libcal.com/js_651/direct/public/equipment/common.min.js"></script> <script> var springyPage = { iid: 138, wantAlternatingBackground: true, billingEnabled: true, locationId: 31, cartStart: null, timelineOptions: { resourceAreaWidth: '25%', initialView: "", eventSourceSuccess: function (content) { var currentView = timelineInstance.view.type; springyFullCalendar.formatEventsFromSource(content, currentView); // the next available logic has to be based off the server data for equipment // as the events aren't rendered on-screen until after this function returns var isNextAvailableButtonWanted = !isAnyTimeslotAvailable(content); jQuery('.fc-goToNextAvailable-button').toggle(isNextAvailableButtonWanted); return content; }, resourceLabelDidMount: function(info) { jQuery(info.el).find('.fc-icon').hide(); } }, language: { determiningCostLabel: 'Determining\u0020cost', restrictTimeNote: 'All\u0020additional\u0020items\u0020must\u0020have\u0020a\u0020starting\u0020time\u0020of ', } }; var resources = []; var eventSources = []; </script> <script defer src='https://static-assets-us.libcal.com/js_651/direct/public/equipment/equipment-page.min.js'></script> <script> /*Search*/ var catalogTemplate = "<div class=\"col-sm-3\">\r\n\t<div class=\"col-item\">\r\n\t\t{{#IMAGE}}\r\n\t\t\t<div class=\"photo\">\r\n\t\t\t\t<a href=\"\/equipment_item.php?id={{ID}}\">\r\n\t\t\t\t\t<img src=\"{{IMAGE}}\" class=\"img-responsive\" alt=\"{{NAME}}\" \/>\r\n\t\t\t\t<\/a>\t\r\n\t\t\t<\/div>\r\n\t\t{{\/IMAGE}}\r\n\t\t<div class=\"info\">\r\n\t\t\t<div class=\"row\">\r\n\t\t\t\t<div class=\"name\">\r\n\t\t\t\t\t<h4>{{NAME}}<\/h4>\r\n\t\t\t\t<\/div>\r\n\t\t\t<\/div>\r\n\t\t\t<div class=\"row\">\r\n\t\t\t\t<div class=\"info-details\">\r\n\t\t\t\t\t{{#MODEL}}{{MODEL}}{{\/MODEL}}\r\n\t\t\t\t<\/div>\r\n\t\t\t<\/div>\r\n\t\t\t<div class=\"separator clear-left\">\r\n\t\t\t\t<p class=\"btn-add\">\r\n\t\t\t\t\t<a href=\"#\" data-gid=\"{{GID}}\" data-eid=\"{{ID}}\" data-cat=\"{{CATEGORY}}\" data-loc=\"{{LOCATION}}\" class=\"s-lc-eq-availability\">\r\n\t\t\t\t\t\t<i class=\"fa fa-clock-o fa-lg\"><\/i> Availability\r\n\t\t\t\t\t<\/a>\r\n\t\t\t\t<\/p>\r\n\t\t\t\t<p class=\"btn-details\">\r\n\t\t\t\t\t<a href=\"\/equipment_item.php?id={{ID}}\">\r\n\t\t\t\t\t\t<i class=\"fa fa-list fa-lg\"><\/i> More details\r\n\t\t\t\t\t<\/a>\r\n\t\t\t\t<\/p>\r\n\t\t\t<\/div>\r\n\t\t\t<div class=\"clearfix\"><\/div>\r\n\t\t<\/div>\r\n\t<\/div>\r\n<\/div>"; var per_page = 36; var eq_search_res_for = "search\u0020results\u0020for\u0020"; var eq_search_showing = "Showing\u0020"; var eq_search_results = "result\u0028s\u0029"; var eq_search_noresult = "No\u0020items\u0020found\u0021"; springyPage = Object.assign(springyPage, { imageDefault: 'https://d68g328n4ug0e.cloudfront.net/default-equipment.png', }); function runSearch() { var l = jQuery("#lid").val(); var g = jQuery("#gid").val(); var q = jQuery("#s-lc-eq-search").val(); var p = jQuery("#page").val(); var r = jQuery("#type").val(); var buttonId = '#s-lc-eq-catalog-filters :input'; pageBusyBegin(buttonId); var head = ""; var t = q.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">"); if (t != "") { head += eq_search_res_for + " \"" + t + "\""; } jQuery("#time_grid_cont").hide(); jQuery("#eq-additem").hide(); jQuery('#cat_cont').html(''); equipCatalogItemsShowing = 0; jQuery.ajax({ url: "/process_equip_cat.php?lid=" + l + "&gid=" + g + "&type=" + r + "&perpage=" + per_page + "&page=" + p + "&q=" + encodeURIComponent(q), dataType: "json", }) .always(function() { pageBusyEnd(buttonId); }) .done(function(searchData) { head += '    <small class="s-lc-color-grey pull-right">' + eq_search_showing + " " + searchData.total_results + " " + eq_search_results + "</small>" var output = '<h2 class="s-lc-eq-srh">' + head + "</h2>"; if (searchData.status == 0) { output += "<p>" + searchData.error + "</p>"; } if (searchData.status == 1) { var results = searchData.results.length; if (results < 1) { output += "<div class=\"alert alert-info s-lc-eq-s-nores\">" + eq_search_noresult + "</div>"; } else { //Loop over each result for (var i = 0; i < results; i++) { var itemData = searchData.results[i]; output += Mustache.render(catalogTemplate, itemData); } output += "<div id=\"pag\"></div>"; } equipCatalogItemsShowing = results; springyPage.locationId = parseInt(l); springyPage.groupId = parseInt(g); } jQuery("#cat_cont").html(output); paginate(searchData.total_results, searchData.perpage); // listen for clicks on the "availability" button tgListener(); }) .fail(ajaxErrorHandler); } function paginate(tot, pp) { var total = tot; var perPage = pp; var curPage = jQuery("#page").val(); var view = jQuery("#view").val(); if (total > perPage) { var pager = jQuery('<ul class="pagination pull-right" style="clear:both"></ul>'); var totalPages = Math.ceil(total / perPage); if (totalPages > 1) { var pagelinks = []; if (curPage > 1) { //prev page link p = curPage - 1; var li = jQuery('<li class="pager-step"></li>').html('<a href="#" data-page="' + p + '"><</a>'); pagelinks.push(li); } //loop var startpage = ((curPage - 2) < 1) ? 1 : curPage - 2; var endpage = startpage + 4; if (endpage > totalPages) { endpage = totalPages; } var p = startpage; while (p <= endpage) { var li = jQuery('<li></li>').html('<a href="#" data-page="' + p + '">' + p + '</a>'); if (p == curPage) { li.addClass("active"); } pagelinks.push(li); p++; } if (curPage < totalPages) { //next prev link var p = curPage + 1; if (p > totalPages) { p = totalPages; } var li = jQuery('<li class="pager-step"></li>').html('<a href="#" data-page="' + p + '">></a>'); pagelinks.push(li); } pager.append(pagelinks); } jQuery("#pag").append(pager); } jQuery("#pag li a").click(function () { var p = jQuery(this).data("page"); jQuery("#page").val(p); runSearch(); return false; }); } jQuery(function () { setupTimeline(); accessibleIcons(); runSearch(); equipCatalogGetCart(); jQuery("#s-lc-eq-searchbtn").click(function () { jQuery("#page").val("1"); var q = jQuery("#s-lc-eq-search").val(); if (q.trim().length === 1) { return false; } runSearch(); return false; }); jQuery("#s-lc-eq-search").keyup(function (e) { if (e.keyCode == 13) { jQuery("#page").val("1"); var q = jQuery("#s-lc-eq-search").val(); if (q.trim().length === 1) { return false; } runSearch(); return false; } }); jQuery("#lid").change(function () { var l = jQuery("#lid").val(); window.location = "/equipment?lid=" + l; }); jQuery("#gid").change(function () { jQuery("#page").val("1"); runSearch(); }); }); </script> </body> </html>

CINXE.COM

Equipment Catalog - LibCal - University of California, San Francisco