Hi,
I have just tested [Bugtracker] ticket 2718 and I admit I find it very good! (especially the ratio "quick links" which automatically fills the min/max ratio).
On the UX side, I think we can deliver the feature "as is" for 2.5 but I believe a slider based interface might be more efficient.
What do you think?
Offline
that's visually much better :-)
does this involve there will be three filters (Widh, Height, Ratio) instead of two (Dimensions, Ratio) ?
or the two sliders can be in one filter... i'll try
Offline
mistic100 wrote:
that's visually much better :-)
Visually I agree, but also a better user experience as well. Of course, we can prefill the slider with the data of the photos. For example, if widths in piwigo_images.width are between 645 and 3888 pixels, that will automatically be our boundaries.
mistic100 wrote:
does this involve there will be three filters (Widh, Height, Ratio) instead of two (Dimensions, Ratio) ?
Actually I would say : only one filter "Dimensions and ratio" which displays 3 sliders.
Offline
That looks just great.
Offline
Wow awesome guys!
Offline
cool, already have a slider in jquery ui : http://jqueryui.com/slider/
Offline
rvelices wrote:
cool, already have a slider in jquery ui : http://jqueryui.com/slider/
Yes, this is the one I have used on another project recently (and from which I made the mockup)
Offline
Offline
Well done mistic100. I have to improve the CSS to have something more like my screenshot :-) (I'll do it)
Questions/remarks:
1) in my gallery, I have no panoramic ratio, so when I click on "Panoramas", the 2 sliders are on 1.64 (and I have no result) which is less than what was defined as panoramic previously (ie 2+). Shouldn't we deactivate the "panoramas" link if we know there are no such values?
2) Why do I have no result on ratio 1.64? After a quick read on the code, I thought it was a "real" value, so I wonder why it matches no photo
3) the bounds are defined by the values existing in the database, but why aren't the intermediate values? On my gallery, I have "Width : between 2592 and 3888 pixels", why can I select width 2593, 2594... while the only values in my database are 2592 and 3888? (all photos are coming from the same camera) On my other project, I have implemented the "only existing values" in the slider and I think it's more relevant, because any change in the slider truly affects the filtered result.
Offline
I don't see real difference with your screenshot but okay :)
1) yes this can be done
2) 1.64 is a "ceil", the real max ratio is perhaps 1.63456546..... (as the min ratio is a "floor")
3) how did you implement the "only existing values" ? I don't see this option on the Slider documentation
edit: I found this http://stackoverflow.com/a/857671 but I think this is becoming too much complicated, and I don't know how efficient is "SELECT DISTINCT width" on a very large table
edit2: right now I have no idea about how to force the slider positions as well as the input values (the solution at stackoverflow only force the value of the input)
Offline
I found this http://stackoverflow.com/a/967619
don't really know how it works but it works !
Offline
This is how I did:
function set_amount(amount_selector, min, max, values) { var min_value = values[min]; var max_value = values[max]; var label = ""; if (min != max) { label = "between " + min_value + " and " + max_value; } else { label = min_value; } jQuery(amount_selector).html(label); } var naissance_values = [-525,-495,-480,-445,-254,-185,-170,0,1165,1240,1345,1363,1420,1425,1431,1435,1455,1458,1465,1469,1474,1475,1492,1494,1495,1502,1517,1519,1528,1532,1533,1536,1541,1544,1547,1550,1558,1559,1561,1562,1564,1567,1568,1569,1570,1571,1572,1575,1576,1579,1580,1581,1583,1585,1586,1589,1590,1591,1592,1595,1596,1598,1600,1601,1602,1603,1604,1605,1606,1608,1609,1610,1611,1612,1613,1614,1616,1617,1618,1619,1620,1621,1622,1623,1625,1626,1627,1628,1630,1631,1634,1635,1638,1639,1640,1642,1644,1645,1647,1648,1650,1652,1653,1654,1655,1656,1657,1659,1661,1664,1668,1670,1672,1673,1674,1676,1680,1682,1683,1684,1685,1686,1688,1689,1692,1693,1694,1695,1697,1701,1702,1703,1705,1706,1707,1709,1710,1712,1713,1717,1719,1720,1721,1722,1723,1727,1728,1729,1732,1733,1734,1735,1737,1739,1740,1741,1742,1745,1746,1747,1748,1749,1750,1751,1752,1755,1756,1758,1759,1760,1761,1762,1763,1764,1766,1767,1769,1770,1771,1772,1773,1774,1775,1777,1778,1779,1780,1781,1783,1786,1787,1788,1790,1791,1792,1793,1794,1795,1796,1797,1798,1799,1800,1801,1802,1803,1804,1805,1806,1807,1808,1809,1810,1811,1812,1813,1814,1815,1816,1817,1818,1819,1820,1821,1822,1823,1824,1825,1826,1827,1828,1829,1830,1831,1832,1833,1834,1836,1837,1838,1839,1840,1841,1842,1844,1845,1846,1847,1848,1849,1850,1851,1852,1853,1854,1855,1856,1857,1858,1859,1860,1861,1862,1863,1864,1865,1866,1867,1868,1869,1870,1871,1872,1873,1874,1875,1876,1877,1878,1879,1880,1881,1882,1883,1884,1885,1886,1887,1888,1889,1890,1891,1892,1893,1894,1895,1896,1897,1898,1899,1900,1901,1902,1903,1904,1905,1906,1907,1908,1909,1910,1911,1912,1913,1914,1915,1916,1917,1918,1919,1920,1921,1922,1923,1924,1925,1926,1927,1928,1929,1930,1931,1932,1933,1934,1935,1936,1937,1938,1939,1940,1941,1942,1943,1944,1945,1946,1947,1948,1949,1950,1951,1952,1953,1954,1955,1956,1957,1958,1959,1960,1961,1962,1963,1964,1965,1966,1967,1968,1969,1970,1971,1972,1973,1974,1975,1976,1977,1978,1979,1980,1981,1982,1983,1984,1986,1994]; jQuery( "#slider-naissance" ).slider({ range: true, min: 0, max: naissance_values.length - 1 , values: [ 0, naissance_values.length - 1 ], slide: function( event, ui ) { set_amount("#amount-naissance", ui.values[0], ui.values[1], naissance_values); }, stop: function( event, ui ) { oTable.fnDraw(); } }); set_amount( "#amount-naissance", jQuery("#slider-naissance").slider("values", 0), jQuery("#slider-naissance").slider("values", 1), naissance_values );
Live example on http://mascarille.fr/index?/liste-auteurs click on "Rechercher" then on "Annee de naissance". I did not care about the scale on the slider (and I don't think it's necessary because you may lack of precision on small values if you have a few big values).
Here I have "many" possible values and there is no performance problem. This is not an image widths list and I think that in real life, a Piwigo gallery has much less distinct values.
A "select distinct width" will not take longer than a "select * from table where width between A and B". We have a numeric value, this is fast (faster than a string I think), I will make some benchmark if you want but I think there won't be any performance problem.
Offline
mistic100, I'm working on "only existing values"
Offline