Permalink
Browse files

added search capabilities and more ...

  • Loading branch information...
1 parent f3f3364 commit bb31dbbb2cd93bddefceac466571dbd9e8369c05 Michael Aufreiter committed May 5, 2009
View
7 MIT-LICENSE.txt
@@ -1,9 +1,4 @@
-Copyright (c) 2008 Paul Bakaus, http://ui.jquery.com/
-
-This software consists of voluntary contributions made by many
-individuals (AUTHORS.txt, http://ui.jquery.com/about) For exact
-contribution history, see the revision history and logs, available
-at http://jquery-ui.googlecode.com/svn/
+Copyright (c) 2009 Michael Aufreiter, http://www.quasipartikel.at
Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
View
BIN css/smoothness/images/ui-bg_flat_0_aaaaaa_40x100.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-bg_flat_75_ffffff_40x100.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-bg_glass_55_fbf9ee_1x400.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-bg_glass_65_ffffff_1x400.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-bg_glass_75_dadada_1x400.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-bg_glass_75_e6e6e6_1x400.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-bg_glass_95_fef1ec_1x400.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-icons_222222_256x240.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-icons_2e83ff_256x240.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-icons_454545_256x240.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-icons_888888_256x240.png
Deleted file not rendered
View
BIN css/smoothness/images/ui-icons_cd0a0a_256x240.png
Deleted file not rendered
View
425 css/smoothness/jquery-ui-1.7.1.custom.css
@@ -1,425 +0,0 @@
-/*
-* jQuery UI CSS Framework
-* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
-* Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
-*/
-
-/* Layout helpers
-----------------------------------*/
-.ui-helper-hidden { display: none; }
-.ui-helper-hidden-accessible { position: absolute; left: -99999999px; }
-.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
-.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
-.ui-helper-clearfix { display: inline-block; }
-/* required comment for clearfix to work in Opera \*/
-* html .ui-helper-clearfix { height:1%; }
-.ui-helper-clearfix { display:block; }
-/* end clearfix */
-.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }
-
-
-/* Interaction Cues
-----------------------------------*/
-.ui-state-disabled { cursor: default !important; }
-
-
-/* Icons
-----------------------------------*/
-
-/* states and images */
-.ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }
-
-
-/* Misc visuals
-----------------------------------*/
-
-/* Overlays */
-.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
-
-/*
-* jQuery UI CSS Framework
-* Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
-* Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
-* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Verdana,Arial,sans-serif&fwDefault=normal&fsDefault=1.1em&cornerRadius=4px&bgColorHeader=cccccc&bgTextureHeader=03_highlight_soft.png&bgImgOpacityHeader=75&borderColorHeader=aaaaaa&fcHeader=222222&iconColorHeader=222222&bgColorContent=ffffff&bgTextureContent=01_flat.png&bgImgOpacityContent=75&borderColorContent=aaaaaa&fcContent=222222&iconColorContent=222222&bgColorDefault=e6e6e6&bgTextureDefault=02_glass.png&bgImgOpacityDefault=75&borderColorDefault=d3d3d3&fcDefault=555555&iconColorDefault=888888&bgColorHover=dadada&bgTextureHover=02_glass.png&bgImgOpacityHover=75&borderColorHover=999999&fcHover=212121&iconColorHover=454545&bgColorActive=ffffff&bgTextureActive=02_glass.png&bgImgOpacityActive=65&borderColorActive=aaaaaa&fcActive=212121&iconColorActive=454545&bgColorHighlight=fbf9ee&bgTextureHighlight=02_glass.png&bgImgOpacityHighlight=55&borderColorHighlight=fcefa1&fcHighlight=363636&iconColorHighlight=2e83ff&bgColorError=fef1ec&bgTextureError=02_glass.png&bgImgOpacityError=95&borderColorError=cd0a0a&fcError=cd0a0a&iconColorError=cd0a0a&bgColorOverlay=aaaaaa&bgTextureOverlay=01_flat.png&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=aaaaaa&bgTextureShadow=01_flat.png&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=8px
-*/
-
-
-/* Component containers
-----------------------------------*/
-.ui-widget { font-family: Verdana,Arial,sans-serif; font-size: 1.1em; }
-.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif; font-size: 1em; }
-.ui-widget-content { border: 1px solid #aaaaaa; background: #ffffff url(images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x; color: #222222; }
-.ui-widget-content a { color: #222222; }
-.ui-widget-header { border: 1px solid #aaaaaa; background: #cccccc url(images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x; color: #222222; font-weight: bold; }
-.ui-widget-header a { color: #222222; }
-
-/* Interaction states
-----------------------------------*/
-.ui-state-default, .ui-widget-content .ui-state-default { border: 1px solid #d3d3d3; background: #e6e6e6 url(images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x; font-weight: normal; color: #555555; outline: none; }
-.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #555555; text-decoration: none; outline: none; }
-.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus { border: 1px solid #999999; background: #dadada url(images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x; font-weight: normal; color: #212121; outline: none; }
-.ui-state-hover a, .ui-state-hover a:hover { color: #212121; text-decoration: none; outline: none; }
-.ui-state-active, .ui-widget-content .ui-state-active { border: 1px solid #aaaaaa; background: #ffffff url(images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x; font-weight: normal; color: #212121; outline: none; }
-.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #212121; outline: none; text-decoration: none; }
-
-/* Interaction Cues
-----------------------------------*/
-.ui-state-highlight, .ui-widget-content .ui-state-highlight {border: 1px solid #fcefa1; background: #fbf9ee url(images/ui-bg_glass_55_fbf9ee_1x400.png) 50% 50% repeat-x; color: #363636; }
-.ui-state-highlight a, .ui-widget-content .ui-state-highlight a { color: #363636; }
-.ui-state-error, .ui-widget-content .ui-state-error {border: 1px solid #cd0a0a; background: #fef1ec url(images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x; color: #cd0a0a; }
-.ui-state-error a, .ui-widget-content .ui-state-error a { color: #cd0a0a; }
-.ui-state-error-text, .ui-widget-content .ui-state-error-text { color: #cd0a0a; }
-.ui-state-disabled, .ui-widget-content .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }
-.ui-priority-primary, .ui-widget-content .ui-priority-primary { font-weight: bold; }
-.ui-priority-secondary, .ui-widget-content .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; }
-
-/* Icons
-----------------------------------*/
-
-/* states and images */
-.ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_222222_256x240.png); }
-.ui-widget-content .ui-icon {background-image: url(images/ui-icons_222222_256x240.png); }
-.ui-widget-header .ui-icon {background-image: url(images/ui-icons_222222_256x240.png); }
-.ui-state-default .ui-icon { background-image: url(images/ui-icons_888888_256x240.png); }
-.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(images/ui-icons_454545_256x240.png); }
-.ui-state-active .ui-icon {background-image: url(images/ui-icons_454545_256x240.png); }
-.ui-state-highlight .ui-icon {background-image: url(images/ui-icons_2e83ff_256x240.png); }
-.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(images/ui-icons_cd0a0a_256x240.png); }
-
-/* positioning */
-.ui-icon-carat-1-n { background-position: 0 0; }
-.ui-icon-carat-1-ne { background-position: -16px 0; }
-.ui-icon-carat-1-e { background-position: -32px 0; }
-.ui-icon-carat-1-se { background-position: -48px 0; }
-.ui-icon-carat-1-s { background-position: -64px 0; }
-.ui-icon-carat-1-sw { background-position: -80px 0; }
-.ui-icon-carat-1-w { background-position: -96px 0; }
-.ui-icon-carat-1-nw { background-position: -112px 0; }
-.ui-icon-carat-2-n-s { background-position: -128px 0; }
-.ui-icon-carat-2-e-w { background-position: -144px 0; }
-.ui-icon-triangle-1-n { background-position: 0 -16px; }
-.ui-icon-triangle-1-ne { background-position: -16px -16px; }
-.ui-icon-triangle-1-e { background-position: -32px -16px; }
-.ui-icon-triangle-1-se { background-position: -48px -16px; }
-.ui-icon-triangle-1-s { background-position: -64px -16px; }
-.ui-icon-triangle-1-sw { background-position: -80px -16px; }
-.ui-icon-triangle-1-w { background-position: -96px -16px; }
-.ui-icon-triangle-1-nw { background-position: -112px -16px; }
-.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
-.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
-.ui-icon-arrow-1-n { background-position: 0 -32px; }
-.ui-icon-arrow-1-ne { background-position: -16px -32px; }
-.ui-icon-arrow-1-e { background-position: -32px -32px; }
-.ui-icon-arrow-1-se { background-position: -48px -32px; }
-.ui-icon-arrow-1-s { background-position: -64px -32px; }
-.ui-icon-arrow-1-sw { background-position: -80px -32px; }
-.ui-icon-arrow-1-w { background-position: -96px -32px; }
-.ui-icon-arrow-1-nw { background-position: -112px -32px; }
-.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
-.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
-.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
-.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
-.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
-.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
-.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
-.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
-.ui-icon-arrowthick-1-n { background-position: 0 -48px; }
-.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
-.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
-.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
-.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
-.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
-.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
-.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
-.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
-.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
-.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
-.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
-.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
-.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
-.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
-.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
-.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
-.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
-.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
-.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
-.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
-.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
-.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
-.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
-.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
-.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
-.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
-.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
-.ui-icon-arrow-4 { background-position: 0 -80px; }
-.ui-icon-arrow-4-diag { background-position: -16px -80px; }
-.ui-icon-extlink { background-position: -32px -80px; }
-.ui-icon-newwin { background-position: -48px -80px; }
-.ui-icon-refresh { background-position: -64px -80px; }
-.ui-icon-shuffle { background-position: -80px -80px; }
-.ui-icon-transfer-e-w { background-position: -96px -80px; }
-.ui-icon-transferthick-e-w { background-position: -112px -80px; }
-.ui-icon-folder-collapsed { background-position: 0 -96px; }
-.ui-icon-folder-open { background-position: -16px -96px; }
-.ui-icon-document { background-position: -32px -96px; }
-.ui-icon-document-b { background-position: -48px -96px; }
-.ui-icon-note { background-position: -64px -96px; }
-.ui-icon-mail-closed { background-position: -80px -96px; }
-.ui-icon-mail-open { background-position: -96px -96px; }
-.ui-icon-suitcase { background-position: -112px -96px; }
-.ui-icon-comment { background-position: -128px -96px; }
-.ui-icon-person { background-position: -144px -96px; }
-.ui-icon-print { background-position: -160px -96px; }
-.ui-icon-trash { background-position: -176px -96px; }
-.ui-icon-locked { background-position: -192px -96px; }
-.ui-icon-unlocked { background-position: -208px -96px; }
-.ui-icon-bookmark { background-position: -224px -96px; }
-.ui-icon-tag { background-position: -240px -96px; }
-.ui-icon-home { background-position: 0 -112px; }
-.ui-icon-flag { background-position: -16px -112px; }
-.ui-icon-calendar { background-position: -32px -112px; }
-.ui-icon-cart { background-position: -48px -112px; }
-.ui-icon-pencil { background-position: -64px -112px; }
-.ui-icon-clock { background-position: -80px -112px; }
-.ui-icon-disk { background-position: -96px -112px; }
-.ui-icon-calculator { background-position: -112px -112px; }
-.ui-icon-zoomin { background-position: -128px -112px; }
-.ui-icon-zoomout { background-position: -144px -112px; }
-.ui-icon-search { background-position: -160px -112px; }
-.ui-icon-wrench { background-position: -176px -112px; }
-.ui-icon-gear { background-position: -192px -112px; }
-.ui-icon-heart { background-position: -208px -112px; }
-.ui-icon-star { background-position: -224px -112px; }
-.ui-icon-link { background-position: -240px -112px; }
-.ui-icon-cancel { background-position: 0 -128px; }
-.ui-icon-plus { background-position: -16px -128px; }
-.ui-icon-plusthick { background-position: -32px -128px; }
-.ui-icon-minus { background-position: -48px -128px; }
-.ui-icon-minusthick { background-position: -64px -128px; }
-.ui-icon-close { background-position: -80px -128px; }
-.ui-icon-closethick { background-position: -96px -128px; }
-.ui-icon-key { background-position: -112px -128px; }
-.ui-icon-lightbulb { background-position: -128px -128px; }
-.ui-icon-scissors { background-position: -144px -128px; }
-.ui-icon-clipboard { background-position: -160px -128px; }
-.ui-icon-copy { background-position: -176px -128px; }
-.ui-icon-contact { background-position: -192px -128px; }
-.ui-icon-image { background-position: -208px -128px; }
-.ui-icon-video { background-position: -224px -128px; }
-.ui-icon-script { background-position: -240px -128px; }
-.ui-icon-alert { background-position: 0 -144px; }
-.ui-icon-info { background-position: -16px -144px; }
-.ui-icon-notice { background-position: -32px -144px; }
-.ui-icon-help { background-position: -48px -144px; }
-.ui-icon-check { background-position: -64px -144px; }
-.ui-icon-bullet { background-position: -80px -144px; }
-.ui-icon-radio-off { background-position: -96px -144px; }
-.ui-icon-radio-on { background-position: -112px -144px; }
-.ui-icon-pin-w { background-position: -128px -144px; }
-.ui-icon-pin-s { background-position: -144px -144px; }
-.ui-icon-play { background-position: 0 -160px; }
-.ui-icon-pause { background-position: -16px -160px; }
-.ui-icon-seek-next { background-position: -32px -160px; }
-.ui-icon-seek-prev { background-position: -48px -160px; }
-.ui-icon-seek-end { background-position: -64px -160px; }
-.ui-icon-seek-first { background-position: -80px -160px; }
-.ui-icon-stop { background-position: -96px -160px; }
-.ui-icon-eject { background-position: -112px -160px; }
-.ui-icon-volume-off { background-position: -128px -160px; }
-.ui-icon-volume-on { background-position: -144px -160px; }
-.ui-icon-power { background-position: 0 -176px; }
-.ui-icon-signal-diag { background-position: -16px -176px; }
-.ui-icon-signal { background-position: -32px -176px; }
-.ui-icon-battery-0 { background-position: -48px -176px; }
-.ui-icon-battery-1 { background-position: -64px -176px; }
-.ui-icon-battery-2 { background-position: -80px -176px; }
-.ui-icon-battery-3 { background-position: -96px -176px; }
-.ui-icon-circle-plus { background-position: 0 -192px; }
-.ui-icon-circle-minus { background-position: -16px -192px; }
-.ui-icon-circle-close { background-position: -32px -192px; }
-.ui-icon-circle-triangle-e { background-position: -48px -192px; }
-.ui-icon-circle-triangle-s { background-position: -64px -192px; }
-.ui-icon-circle-triangle-w { background-position: -80px -192px; }
-.ui-icon-circle-triangle-n { background-position: -96px -192px; }
-.ui-icon-circle-arrow-e { background-position: -112px -192px; }
-.ui-icon-circle-arrow-s { background-position: -128px -192px; }
-.ui-icon-circle-arrow-w { background-position: -144px -192px; }
-.ui-icon-circle-arrow-n { background-position: -160px -192px; }
-.ui-icon-circle-zoomin { background-position: -176px -192px; }
-.ui-icon-circle-zoomout { background-position: -192px -192px; }
-.ui-icon-circle-check { background-position: -208px -192px; }
-.ui-icon-circlesmall-plus { background-position: 0 -208px; }
-.ui-icon-circlesmall-minus { background-position: -16px -208px; }
-.ui-icon-circlesmall-close { background-position: -32px -208px; }
-.ui-icon-squaresmall-plus { background-position: -48px -208px; }
-.ui-icon-squaresmall-minus { background-position: -64px -208px; }
-.ui-icon-squaresmall-close { background-position: -80px -208px; }
-.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
-.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
-.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
-.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
-.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
-.ui-icon-grip-diagonal-se { background-position: -80px -224px; }
-
-
-/* Misc visuals
-----------------------------------*/
-
-/* Corner radius */
-.ui-corner-tl { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; }
-.ui-corner-tr { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; }
-.ui-corner-bl { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; }
-.ui-corner-br { -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
-.ui-corner-top { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; }
-.ui-corner-bottom { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
-.ui-corner-right { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
-.ui-corner-left { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; }
-.ui-corner-all { -moz-border-radius: 4px; -webkit-border-radius: 4px; }
-
-/* Overlays */
-.ui-widget-overlay { background: #aaaaaa url(images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); }
-.ui-widget-shadow { margin: -8px 0 0 -8px; padding: 8px; background: #aaaaaa url(images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); -moz-border-radius: 8px; -webkit-border-radius: 8px; }/* Accordion
-----------------------------------*/
-.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; }
-.ui-accordion .ui-accordion-li-fix { display: inline; }
-.ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; }
-.ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em 2.2em; }
-.ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; }
-.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; }
-.ui-accordion .ui-accordion-content-active { display: block; }/* Datepicker
-----------------------------------*/
-.ui-datepicker { width: 17em; padding: .2em .2em 0; }
-.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; }
-.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; }
-.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }
-.ui-datepicker .ui-datepicker-prev { left:2px; }
-.ui-datepicker .ui-datepicker-next { right:2px; }
-.ui-datepicker .ui-datepicker-prev-hover { left:1px; }
-.ui-datepicker .ui-datepicker-next-hover { right:1px; }
-.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; }
-.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
-.ui-datepicker .ui-datepicker-title select { float:left; font-size:1em; margin:1px 0; }
-.ui-datepicker select.ui-datepicker-month-year {width: 100%;}
-.ui-datepicker select.ui-datepicker-month,
-.ui-datepicker select.ui-datepicker-year { width: 49%;}
-.ui-datepicker .ui-datepicker-title select.ui-datepicker-year { float: right; }
-.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }
-.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; }
-.ui-datepicker td { border: 0; padding: 1px; }
-.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }
-.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
-.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
-.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }
-
-/* with multiple calendars */
-.ui-datepicker.ui-datepicker-multi { width:auto; }
-.ui-datepicker-multi .ui-datepicker-group { float:left; }
-.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; }
-.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; }
-.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; }
-.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; }
-.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; }
-.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; }
-.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; }
-.ui-datepicker-row-break { clear:both; width:100%; }
-
-/* RTL support */
-.ui-datepicker-rtl { direction: rtl; }
-.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; }
-.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; }
-.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; }
-.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; }
-.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; }
-.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }
-.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; }
-.ui-datepicker-rtl .ui-datepicker-group { float:right; }
-.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
-.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
-
-/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
-.ui-datepicker-cover {
- display: none; /*sorry for IE5*/
- display/**/: block; /*sorry for IE5*/
- position: absolute; /*must have*/
- z-index: -1; /*must have*/
- filter: mask(); /*must have*/
- top: -4px; /*must have*/
- left: -4px; /*must have*/
- width: 200px; /*must have*/
- height: 200px; /*must have*/
-}/* Dialog
-----------------------------------*/
-.ui-dialog { position: relative; padding: .2em; width: 300px; }
-.ui-dialog .ui-dialog-titlebar { padding: .5em .3em .3em 1em; position: relative; }
-.ui-dialog .ui-dialog-title { float: left; margin: .1em 0 .2em; }
-.ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }
-.ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; }
-.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; }
-.ui-dialog .ui-dialog-content { border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; }
-.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; }
-.ui-dialog .ui-dialog-buttonpane button { float: right; margin: .5em .4em .5em 0; cursor: pointer; padding: .2em .6em .3em .6em; line-height: 1.4em; width:auto; overflow:visible; }
-.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }
-.ui-draggable .ui-dialog-titlebar { cursor: move; }
-
-/* Multiselect
-----------------------------------*/
-
-.ui-multiselect { margin:2px 0 30px 10px; border: solid 1px #bbb;}
-.ui-multiselect ul.selected { background: #fff; margin: 0; padding: 0; padding-top: 1px; overflow: auto; list-style: none; border: 0; float:left; position: relative; }
-.ui-multiselect ul.selected li { line-height: 20px; font-size: 11px; }
-.ui-multiselect ul.selected li a { color: #999; text-decoration: none; padding: 0 0 0 20px; display: block; float: left;}
-.ui-multiselect ul.available { padding: 0; padding-top: 1px; overflow: auto; background: #fff; margin: 0; list-style: none; border: 0; float:left; position: relative; border-left: 1px solid #bbb;}
-.ui-multiselect ul.available li { line-height: 20px; font-size: 11px;}
-.ui-multiselect ul.available li a { color: #999; text-decoration: none; padding: 0 0 0 20px; display: block; float: left;}
-.ui-state-default { border: none; position: relative; padding-left: 20px; border-bottom: 1px solid #ccc;}
-.ui-state-hover { border: none; border-bottom: 1px solid #ccc; }
-.ui-multiselect ul li span.ui-icon-arrowthick-2-n-s { position: absolute; left: 2px;}
-.ui-multiselect ul li a.action { position: absolute; right: 2px; top: 2px; }
-
-
-/* Progressbar
-----------------------------------*/
-.ui-progressbar { height:2em; text-align: left; }
-.ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; }
-/* Resizable
-----------------------------------*/
-.ui-resizable { position: relative;}
-.ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block;}
-.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; }
-.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0px; }
-.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0px; }
-.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0px; height: 100%; }
-.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0px; height: 100%; }
-.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; }
-.ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; }
-.ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; }
-.ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;}
-/* Slider
-----------------------------------*/
-.ui-slider { position: relative; text-align: left; }
-.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; }
-.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; }
-
-.ui-slider-horizontal { height: .8em; }
-.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; }
-.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }
-.ui-slider-horizontal .ui-slider-range-min { left: 0; }
-.ui-slider-horizontal .ui-slider-range-max { right: 0; }
-
-.ui-slider-vertical { width: .8em; height: 100px; }
-.ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; }
-.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; }
-.ui-slider-vertical .ui-slider-range-min { bottom: 0; }
-.ui-slider-vertical .ui-slider-range-max { top: 0; }
-/* Tabs
-----------------------------------*/
-.ui-tabs { padding: .2em; zoom: 1; }
-.ui-tabs .ui-tabs-nav { list-style: none; position: relative; padding: .2em .2em 0; }
-.ui-tabs .ui-tabs-nav li { position: relative; float: left; border-bottom-width: 0 !important; margin: 0 .2em -1px 0; padding: 0; }
-.ui-tabs .ui-tabs-nav li a { float: left; text-decoration: none; padding: .5em 1em; }
-.ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 1px; border-bottom-width: 0; }
-.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
-.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; }
-/* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
-.ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block; border-width: 0; background: none; }
-.ui-tabs .ui-tabs-hide { display: none !important; }
View
29 css/ui.multiselect.css
@@ -0,0 +1,29 @@
+/* Multiselect
+----------------------------------*/
+
+.ui-multiselect { margin:2px 0 30px 10px; border: solid 1px; font-size: 0.8em; }
+.ui-multiselect ul { -moz-user-select: none; }
+.ui-multiselect ul li { cursor: default; line-height: 20px; height: 20px; font-size: 11px; }
+.ui-multiselect ul li a { color: #999; text-decoration: none; padding: 0; display: block; float: left; cursor: pointer;}
+.ui-multiselect div.selected { padding: 0; margin: 0; border: 0; float:left; position: relative; }
+
+.ui-multiselect ul.selected { padding: 0; overflow: auto; background: #fff; margin: 0; list-style: none; border: 0; position: relative; width: 100%; }
+.ui-multiselect ul.selected li { }
+.ui-multiselect div.available { padding: 0; margin: 0; border: 0; float:left; position: relative; border-left: 1px solid; }
+.ui-multiselect ul.available { padding: 0; overflow: auto; background: #fff; margin: 0; list-style: none; border: 0; position: relative; width: 100%; }
+.ui-multiselect ul.available li { padding-left: 10px; }
+
+.ui-multiselect .ui-state-default { border: none; margin-bottom: 1px; position: relative; padding-left: 20px;}
+.ui-multiselect .ui-state-hover { border: none; }
+.ui-multiselect .ui-widget-header {border: none; font-size: 11px; margin-bottom: 1px;}
+
+.ui-multiselect .add-all { float: right; padding: 7px;}
+.ui-multiselect .remove-all { float: right; padding: 7px;}
+.ui-multiselect .search-form { float: left; padding: 4px;}
+.ui-multiselect .count { float: left; padding: 7px;}
+
+.ui-multiselect ul li span.ui-icon-arrowthick-2-n-s { position: absolute; left: 2px; }
+.ui-multiselect ul li a.action { position: absolute; right: 2px; top: 2px; }
+
+.ui-multiselect input.search { height: 14px; padding: 1px; opacity: 0.5; margin: 0; width: 100px; }
+.ui-multiselect input.waiting { color: #aaa; font-style: italic; }
View
137 index.html
@@ -3,17 +3,20 @@
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery UI Multiselect</title>
- <link type="text/css" href="css/smoothness/jquery-ui-1.7.1.custom.css" rel="stylesheet" />
+ <link type="text/css" rel="stylesheet" href="http://jqueryui.com/themes/base/ui.all.css" />
+ <link type="text/css" href="css/ui.multiselect.css" rel="stylesheet" />
+
<link type="text/css" href="css/page.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.7.1.custom.min.js"></script>
<script type="text/javascript" src="js/ui.multiselect.js"></script>
<script type="text/javascript">
- $(function(){
- // Multiselect
- $(".multiselect").multiselect({sortable: true});
- });
+ $(function(){
+ $(".multiselect").multiselect({sortable: true});
+ $('#switcher').themeswitcher();
+ });
</script>
+
</head>
<body>
<h1>jQuery UI Multiselect</h1>
@@ -27,19 +30,119 @@
<h1>Demo</h1>
- <h2>Choose your weapons</h2>
- <select id="weapons" class="multiselect" multiple="multiple" name="weapons[]">
- <option value="boomerang">Boomerang</option>
- <option value="medieval_knive">Medieval Knive</option>
- <option selected="selected" value="ninja_star">Ninja Star</option>
- <option value="dragon_blades">Dragon Blades</option>
- <option selected="selected" value="warrior_sword">Warrior Sword</option>
- <option value="machine_gun">Machine Gun</option>
- <option selected="selected" value="tomato">Tomato</option>
- <option value="axe">Axe</option>
- <option value="jedi_sword">Jedi Sword</option>
- </select>
+ <script type="text/javascript"
+ src="http://jqueryui.com/themeroller/themeswitchertool/">
+ </script>
+ <div id="switcher"></div>
+
+ <h2>Choose countries</h2>
+ <form action="index.html">
+ <select id="countries" class="multiselect" multiple="multiple" name="countries[]">
+ <option value="AFG">Afghanistan</option>
+ <option value="ALB">Albania</option>
+ <option value="DZA">Algeria</option>
+ <option value="AND">Andorra</option>
+ <option value="ARG">Argentina</option>
+ <option value="ARM">Armenia</option>
+ <option value="ABW">Aruba</option>
+ <option value="AUS">Australia</option>
+ <option value="AUT" selected="selected">Austria</option>
+
+ <option value="AZE">Azerbaijan</option>
+ <option value="BGD">Bangladesh</option>
+ <option value="BLR">Belarus</option>
+ <option value="BEL">Belgium</option>
+ <option value="BIH">Bosnia and Herzegovina</option>
+ <option value="BRA">Brazil</option>
+ <option value="BRN">Brunei</option>
+ <option value="BGR">Bulgaria</option>
+ <option value="CAN">Canada</option>
+
+ <option value="CHN">China</option>
+ <option value="COL">Colombia</option>
+ <option value="HRV">Croatia</option>
+ <option value="CYP">Cyprus</option>
+ <option value="CZE">Czech Republic</option>
+ <option value="DNK">Denmark</option>
+ <option value="EGY">Egypt</option>
+ <option value="EST">Estonia</option>
+ <option value="FIN">Finland</option>
+
+ <option value="FRA">France</option>
+ <option value="GEO">Georgia</option>
+ <option value="DEU" selected="selected">Germany</option>
+ <option value="GRC">Greece</option>
+ <option value="HKG">Hong Kong</option>
+ <option value="HUN">Hungary</option>
+ <option value="ISL">Iceland</option>
+ <option value="IND">India</option>
+ <option value="IDN">Indonesia</option>
+
+ <option value="IRN">Iran</option>
+ <option value="IRL">Ireland</option>
+ <option value="ISR">Israel</option>
+ <option value="ITA">Italy</option>
+ <option value="JPN">Japan</option>
+ <option value="JOR">Jordan</option>
+ <option value="KAZ">Kazakhstan</option>
+ <option value="KWT">Kuwait</option>
+ <option value="KGZ">Kyrgyzstan</option>
+
+ <option value="LVA">Latvia</option>
+ <option value="LBN">Lebanon</option>
+ <option value="LIE">Liechtenstein</option>
+ <option value="LTU">Lithuania</option>
+ <option value="LUX">Luxembourg</option>
+ <option value="MAC">Macau</option>
+ <option value="MKD">Macedonia</option>
+ <option value="MYS">Malaysia</option>
+ <option value="MLT">Malta</option>
+
+ <option value="MEX">Mexico</option>
+ <option value="MDA">Moldova</option>
+ <option value="MNG">Mongolia</option>
+ <option value="NLD" selected="selected">Netherlands</option>
+ <option value="NZL">New Zealand</option>
+ <option value="NGA">Nigeria</option>
+ <option value="NOR">Norway</option>
+ <option value="PER">Peru</option>
+ <option value="PHL">Philippines</option>
+
+ <option value="POL">Poland</option>
+ <option value="PRT">Portugal</option>
+ <option value="QAT">Qatar</option>
+ <option value="ROU">Romania</option>
+ <option value="RUS">Russia</option>
+ <option value="SMR">San Marino</option>
+ <option value="SAU">Saudi Arabia</option>
+ <option value="CSG">Serbia and Montenegro</option>
+ <option value="SGP">Singapore</option>
+
+ <option value="SVK">Slovakia</option>
+ <option value="SVN">Slovenia</option>
+ <option value="ZAF">South Africa</option>
+ <option value="KOR">South Korea</option>
+ <option value="ESP">Spain</option>
+ <option value="LKA">Sri Lanka</option>
+ <option value="SWE">Sweden</option>
+ <option value="CHE">Switzerland</option>
+ <option value="SYR">Syria</option>
+
+ <option value="TWN">Taiwan</option>
+ <option value="TJK">Tajikistan</option>
+ <option value="THA">Thailand</option>
+ <option value="TUR">Turkey</option>
+ <option value="TKM">Turkmenistan</option>
+ <option value="UKR">Ukraine</option>
+ <option value="ARE">United Arab Emirates</option>
+ <option value="GBR">United Kingdom</option>
+ <option value="USA" selected="selected">United States</option>
+ <option value="UZB">Uzbekistan</option>
+ <option value="VAT">Vatican City</option>
+ <option value="VNM">Vietnam</option>
+ </select>
+ </form>
<h1>Installation</h1>
<div id="installation">
View
328 js/ui.multiselect.js
@@ -1,29 +1,139 @@
/*
* jQuery UI Multiselect
*
- * Copyright (c) 2008 Michael Aufreiter (quasipartikel.at)
+ * Authors:
+ * Michael Aufreiter (quasipartikel.at)
+ * Yanick Rochon (yanick.rochon[at]gmail[dot]com)
+ *
* Dual licensed under the MIT (MIT-LICENSE.txt)
* and GPL (GPL-LICENSE.txt) licenses.
*
* http://www.quasipartikel.at/multiselect/
*
+ *
* Depends:
* ui.core.js
* ui.sortable.js
+ *
+ * Todo:
+ * use Element storage to avoid circular references
+ * $('selector').data()....
+ * Make batch actions faster
*/
+
+
+// qs_score - Quicksilver Score
+//
+// A port of the Quicksilver string ranking algorithm
+//
+// "hello world".score("axl") //=> 0.0
+// "hello world".score("ow") //=> 0.6
+// "hello world".score("hello world") //=> 1.0
+//
+// Tested in Firefox 2 and Safari 3
+//
+// The Quicksilver code is available here
+// http://code.google.com/p/blacktree-alchemy/
+// http://blacktree-alchemy.googlecode.com/svn/trunk/Crucible/Code/NSString+BLTRRanking.m
+//
+// The MIT License
+//
+// Copyright (c) 2008 Lachie Cox
+//
+// Permission is hereby granted, free of charge, to any person obtaining a copy
+// of this software and associated documentation files (the "Software"), to deal
+// in the Software without restriction, including without limitation the rights
+// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+// copies of the Software, and to permit persons to whom the Software is
+// furnished to do so, subject to the following conditions:
+//
+// The above copyright notice and this permission notice shall be included in
+// all copies or substantial portions of the Software.
+//
+// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+// THE SOFTWARE.
+
+
+String.prototype.score = function(abbreviation,offset) {
+ offset = offset || 0 // TODO: I think this is unused... remove
+
+ if(abbreviation.length == 0) return 0.9
+ if(abbreviation.length > this.length) return 0.0
+
+ for (var i = abbreviation.length; i > 0; i--) {
+ var sub_abbreviation = abbreviation.substring(0,i)
+ var index = this.indexOf(sub_abbreviation)
+
+
+ if(index < 0) continue;
+ if(index + abbreviation.length > this.length + offset) continue;
+
+ var next_string = this.substring(index+sub_abbreviation.length)
+ var next_abbreviation = null
+
+ if(i >= abbreviation.length)
+ next_abbreviation = ''
+ else
+ next_abbreviation = abbreviation.substring(i)
+
+ var remaining_score = next_string.score(next_abbreviation,offset+index)
+
+ if (remaining_score > 0) {
+ var score = this.length-next_string.length;
+
+ if(index != 0) {
+ var j = 0;
+
+ var c = this.charCodeAt(index-1)
+ if(c==32 || c == 9) {
+ for(var j=(index-2); j >= 0; j--) {
+ c = this.charCodeAt(j)
+ score -= ((c == 32 || c == 9) ? 1 : 0.15)
+ }
+
+ // XXX maybe not port this heuristic
+ //
+ // } else if ([[NSCharacterSet uppercaseLetterCharacterSet] characterIsMember:[self characterAtIndex:matchedRange.location]]) {
+ // for (j = matchedRange.location-1; j >= (int) searchRange.location; j--) {
+ // if ([[NSCharacterSet uppercaseLetterCharacterSet] characterIsMember:[self characterAtIndex:j]])
+ // score--;
+ // else
+ // score -= 0.15;
+ // }
+ } else {
+ score -= index
+ }
+ }
+
+ score += remaining_score * next_string.length
+ score /= this.length;
+ return score
+ }
+ }
+ return 0.0
+};
(function($) {
$.widget("ui.multiselect", {
_init: function() {
-
// hide this.element
this.element.hide();
this.id = this.element.attr("id");
- this.container = $('<div class="ui-multiselect ui-helper-clearfix"></div>').insertAfter(this.element);
- this.selectedList = $('<ul class="selected"></ul>').appendTo(this.container);
- this.availableList = $('<ul class="available"></ul>').appendTo(this.container);
+ this.container = $('<div class="ui-multiselect ui-helper-clearfix ui-widget"></div>').insertAfter(this.element);
+ this.count = 0; // number of currently selected options
+ this.selectedContainer = $('<div class="selected"></div>').appendTo(this.container);
+ this.availableContainer = $('<div class="available"></div>').appendTo(this.container);
+ this.selectedActions = $('<div class="actions ui-widget-header ui-helper-clearfix"><span class="count">0 items selected</span><a href="#" class="remove-all">Remove All</a></div>').appendTo(this.selectedContainer);
+ this.availableActions = $('<div class="actions ui-widget-header ui-helper-clearfix"><form method="get" class="search-form"><input type="text" class="search ui-widget-content ui-corner-all"/></form><a href="#" class="add-all">Add All</a></div>').appendTo(this.availableContainer);
+ this.selectedList = $('<ul class="selected"></ul>').bind('selectstart', function(){return false;}).appendTo(this.selectedContainer);
+ this.availableList = $('<ul class="available"></ul>').bind('selectstart', function(){return false;}).appendTo(this.availableContainer);
var that = this;
@@ -35,14 +145,20 @@ $.widget("ui.multiselect", {
this.selectedList.height(this.element.height());
this.availableList.height(this.element.height());
- this.populateLists();
+ if ( !this.options.animated ) {
+ this.options.show = 'show';
+ this.options.hide = 'hide';
+ }
+
+ // init lists
+ this._populateLists(this.element.find('option'));
// register events
- this.registerAddEvents(this.availableList.find('a.action'));
- this.registerRemoveEvents(this.selectedList.find('a.action'));
+ this._registerAddEvents(this.availableList.find('a.action'));
+ this._registerRemoveEvents(this.selectedList.find('a.action'));
+ // make selection sortable
if (this.options.sortable) {
- // make current selection sortable
$(this.selectedList).sortable({
containment: 'parent',
update: function(event, ui) {
@@ -53,100 +169,186 @@ $.widget("ui.multiselect", {
}
});
}
+
+ // set up livesearch
+ if (this.options.searchable) {
+ this.availableContainer.find('input.search')
+ .keyup(function() {
+ that._filter.apply(this, [that.availableList]);
+ }).keyup()
+ .parents('form').submit(function(){
+ return false;
+ });
+ }
+
+ // remove-all
+ $(".remove-all").click(function() {
+ that.selectedList.find('li').each(function() { that._setSelected($(this), false); });
+ that.count = 0;
+ that._updateCount();
+ return false;
+ });
+
+ // add-all
+ $(".add-all").click(function() {
+ that.availableList.find('li').each(function() { that._setSelected($(this), true); });
+ that.count = that.element.find('option').size();
+ that._updateCount();
+ return false;
+ });
},
destroy: function() {
this.element.show();
this.container.remove();
$.widget.prototype.destroy.apply(this, arguments);
},
- populateLists: function() {
+ _populateLists: function(options) {
this.selectedList.empty();
this.availableList.empty();
+ this.selectedList.children('*').each(function() { this.itemLink = null; }); // cleanup
var that = this;
- this.element.find('option').each(function(i) {
-
- var item = $('<li class="ui-state-default"> \
- <span class="ui-icon"/> \
- '+$(this).text()+'\
- <a href="#" class="action"><span class="ui-corner-all ui-icon"/></a> \
- </li>').appendTo(that.availableList);
-
- item.appendTo(this.selected ? that.selectedList : that.availableList);
-
- // store the index as a property
- item[0].optionLink = this;
- that.applyItemState(item[0]);
- });
-
+ var items = $(options.map(function(i) {
+ var item = that._getOptionNode(this).appendTo(this.selected ? that.selectedList : that.availableList).show();
+ if (this.selected) that.count += 1;
+ that._applyItemState(item);
+ item[0].idx = i;
+ return item[0];
+ }));
+
+ this._registerHoverEvents(this.container.find('li'));
- this.registerHoverEvents(this.container.find('li'));
+ // update count
+ this._updateCount();
},
- applyItemState: function(item) {
- if (item.optionLink.selected) {
- $(item).removeClass('ui-priority-secondary');
+ _updateCount: function() {
+ this.selectedContainer.find('span.count').text(this.count+" items selected");
+ },
+ _getOptionNode: function(option) {
+ var node = $('<li class="ui-state-default"> \
+ <span class="ui-icon"/> \
+ '+$(option).text()+'\
+ <a href="#" class="action"><span class="ui-corner-all ui-icon"/></a> \
+ </li>').hide();
+ node[0].optionLink = option;
+ return node;
+ },
+ _setSelected: function(item, selected) {
+ try {
+ item[0].optionLink.selected = selected;
+ } catch (e) {
+ /* @HACK: ignore - IE6 complaints for norhing as the attribute was indeed properly set! (yr - 2009-04-28) */
+ }
+
+ if ( selected ) {
+ // clone the item
+ var selectedItem = item.clone(); selectedItem[0].optionLink = item[0].optionLink; selectedItem[0].idx = item[0].idx;
+ item[this.options.hide](this.options.animated, function() { $(this).remove(); });
+ selectedItem.appendTo(this.selectedList).hide()[this.options.show](this.options.animated);
+
+ this._applyItemState(selectedItem);
+ this._registerHoverEvents(selectedItem);
+ this._registerRemoveEvents(selectedItem.find('a.action'));
+
+ } else {
+
+ // look for successor based on initial option index
+ var items = this.availableList.find('li');
+ var succ = null; var i = 0;
+ while (i<items.length) {
+ if ((i==0 && items[i].idx > item[0].idx) || ((items[i].idx > item[0].idx) && (items[i-1].idx < item[0].idx))) {
+ succ = items[i];
+ break;
+ }
+ i++;
+ }
+
+ // clone the item
+ var availableItem = item.clone(); availableItem[0].optionLink = item[0].optionLink; availableItem[0].idx = item[0].idx;
+ succ ? availableItem.insertBefore($(succ)) : availableItem.appendTo(this.availableList);
+ item[this.options.hide](this.options.animated, function() { $(this).remove(); });
+ availableItem.hide()[this.options.show](this.options.animated);
+
+ this._applyItemState(availableItem);
+ this._registerHoverEvents(availableItem);
+ this._registerAddEvents(availableItem.find('a.action'));
+ }
+ },
+ _applyItemState: function(item) {
+ if (item[0].optionLink.selected) {
+ // item.removeClass('ui-priority-secondary');
if (this.options.sortable)
- $(item).find('span:first').addClass('ui-icon-arrowthick-2-n-s').removeClass('ui-helper-hidden').addClass('ui-icon');
+ item.find('span:first').addClass('ui-icon-arrowthick-2-n-s').removeClass('ui-helper-hidden').addClass('ui-icon');
else
- $(item).find('span:first').removeClass('ui-icon-arrowthick-2-n-s').addClass('ui-helper-hidden').removeClass('ui-icon');
- $(item).find('a.action span').addClass('ui-icon-minus').removeClass('ui-icon-plus');
+ item.find('span:first').removeClass('ui-icon-arrowthick-2-n-s').addClass('ui-helper-hidden').removeClass('ui-icon');
+ item.find('a.action span').addClass('ui-icon-minus').removeClass('ui-icon-plus');
} else {
- $(item).addClass('ui-priority-secondary');
- $(item).find('span:first').removeClass('ui-icon-arrowthick-2-n-s').addClass('ui-helper-hidden').removeClass('ui-icon');
- $(item).find('a.action span').addClass('ui-icon-plus').removeClass('ui-icon-minus');
+ // item.addClass('ui-priority-secondary');
+ item.find('span:first').removeClass('ui-icon-arrowthick-2-n-s').addClass('ui-helper-hidden').removeClass('ui-icon');
+ item.find('a.action span').addClass('ui-icon-plus').removeClass('ui-icon-minus');
}
},
- registerHoverEvents: function(elements) {
- // extract this
- elements.removeClass('ui-state-hover');
+ // taken from John Resig's liveUpdate script
+ _filter: function(list) {
+ var rows = list.children('li'),
+ cache = rows.map(function(){
+ return this.innerHTML.toLowerCase();
+ });
+ var term = $.trim( $(this).val().toLowerCase() ), scores = [];
+
+ if ( !term ) {
+ rows.show();
+ } else {
+ rows.hide();
+
+ cache.each(function(i) {
+ var score = this.score(term);
+ if (score > 0) { scores.push([score, i]); }
+ });
+
+ $.each(scores.sort(function(a, b){return b[0] - a[0];}), function() {
+ $(rows[ this[1] ]).show();
+ });
+ }
+ },
+ _registerHoverEvents: function(elements) {
+ elements.removeClass('ui-state-hover');
elements.mouseover(function() {
$(this).addClass('ui-state-hover');
});
-
elements.mouseout(function() {
$(this).removeClass('ui-state-hover');
});
},
- registerAddEvents: function(elements) {
+ _registerAddEvents: function(elements) {
var that = this;
elements.click(function() {
- // select the corresponding option
- option = $(this).parent()[0].optionLink;
- option.selected = true;
- $(option).remove().appendTo(that.element);
-
- // move element to selectedList and reregister events
- var li = $(this).parent().remove().appendTo(that.selectedList);
- that.applyItemState(li[0]);
-
- that.registerRemoveEvents($(this));
- that.registerHoverEvents(li);
+ var item = that._setSelected($(this).parent(), true);
+ that.count += 1;
+ that._updateCount();
return false;
});
-
},
- registerRemoveEvents: function(elements) {
+ _registerRemoveEvents: function(elements) {
var that = this;
elements.click(function() {
-
- // deselect the corresponding option
- $(this).parent()[0].optionLink.selected = false;
- // move element to availableList and reregister events
- var li = $(this).parent().remove().appendTo(that.availableList);
- that.applyItemState(li[0]);
- that.registerAddEvents($(this));
- that.registerHoverEvents(li);
+ that._setSelected($(this).parent(), false);
+ that.count -= 1;
+ that._updateCount();
return false;
});
}
});
$.extend($.ui.multiselect, {
- getter: "value",
defaults: {
- sortable: false
+ sortable: true,
+ searchable: true,
+ animated: 'fast',
+ show: 'slideDown',
+ hide: 'slideUp'
}
});

0 comments on commit bb31dbb

Please sign in to comment.