Autor Zpráva
Milan1236000
Profil
Ahoj,

trochu jsem se teď zasekl u toho, že se mi špatně přepočítávají buňky. Jde o to, že když zmáčknu SHIFT a začnu označovat, mělo by se zobrazovat, kolik čtverečků je vybraných v řádku a ve sloupci. Ono to celkem funguje, ale zlobí to v případě, kdy například označím plochu 2x3 a pak začnu ubírat - zůstává tam chybně ten původní počet. Myslím, že bude chyba u toho else if (dimension_x > 0), ale nedaří se mi to opravit.

Živá ukázka

Nemáte nějaký nápad?

Díky. :)
Kajman
Profil
Spíš to bude tím, že na odznačení má ten plugin jinou událost.
Milan1236000
Profil
Kajman:
Skvěle, díky za šťouchnutí, už to funguje správně. :)

Jen mám ještě dvě technické otázky.

<td> tag měl být velký 30px na výšku i na šířku, ale i tak, když nepočítám border (další 2px), tak mají stejně obě strany 32px - jak to?


Když mám nějakou větší tabulku (třeba 200x200 buněk), tak jQuery se při tom výběru celkem dost seká - a to mám procák Core i5. Hádám, že tohle asi nějak optimalizovat nejde, že? Pokud ano, jak? Sekalo by se to stejně, kdybych místo tabulky a buněk měl samé <div>y?

Díky.
Kajman
Profil
Milan1236000:
Pokud ano, jak?

for (var i = cell_count-1; i >= 0; i--) {
  for (var j = cell_count-1; j >= 0; j--) {
    var current_cell = $("td[data-index='["+ i +"," + j + "]']");

Proč procházíte třeba až 40000 buněk neefiktivním zaměrením, když ta událost Vám předá druhým parametrem objekt nově označené buňky?

Živá ukázka
Milan1236000
Profil
Ano, pravda, tohle je dost náročný žrout času. Aby to fungovalo tak, jak potřebuju, tak jsem to nechal, jak to je a jen jsem místo těch cyklů dal
        var $selected_cells = $("td.ui-selecting");
        var selected_cells_count = $selected_cells.length;
        var first_selected_cell_index = $selected_cells.first().data("index");
        var dimension_x, dimension_y, counter = 0;
        var $dimension = $("#dimension").find("span");

        $selected_cells.each(function (i, obj) {
            if ($(this).data("index")[0] === first_selected_cell_index[0]) {
                counter++;
            }
            else {
                return false;
            }
        });

        dimension_x = counter;
        dimension_y = Math.round(selected_cells_count / dimension_x);
a s ještě jednou optimalizací to podle stopek je celkově asi 2,7x rychlejší, takže aspoň toto stačí a když místo 200x200 bude jen 50x50, tak to bude i celkem svižné. Každopádně díky za řešení, třeba ho na něco využiju v budoucnu.

Proč neseděla šířka a výška už je mi jasné taky, takže ještě jednou moc díky. :)
Kajman
Profil
Když si stále hledáte označené buňky, tak kromě first si přece můžete zobnout i last a indexy v obou směrech odečíst - zase tam máte zbytečný cyklus.

Ono ještě zdržuje to, že tato událost je volána pro každou označenou/odznačenou buňku zvlášť, takže když máte vybráno např 20x20 a zvětšíte to na 21x21, tak se to zavolá 41 krát. Jestli to chcete optimalizovat, tak bych se být Vámi vykašlal na jqueryui a napsal si to v čistém javascriptu, jak potřebujete. Myslím, že u větších tabulek tam bude v rychlosti rozdíl několika řádů.
Milan1236000
Profil
Kajman:
No jasný, ono to jde úplně jednoduše podle koncového a počátečního indexu. Jak mi to mohlo uniknout... Díky. :)

Ano, napsat si vlastní čistý JS je taky řešení, ale v aplikaci se používá více funkcí jQuery, takže to bylo nejrychlejší řešení. :)
Milan1236000
Profil
Jde nějak udělat, aby šlo tuto tabulku posouvat kliknutím a tažením myší? Našel jsem JS řešení, které sice funguje, ale jen s celým oknem - Živá ukázka
Když odkomentuju styl nahoře a v JS místo proměnné $(window) dám svou proměnnou, ve kterém chci posouvat, hází to chybu a nefunguje to. Čím to je?

Díky.
lionel messi
Profil
Milan1236000:

Funkčný kód si nám už ukázal, ukáž, prosím, aj nefunkčný (moje znalosti JS/jQuery na radu bez kódu nestačia).
Milan1236000
Profil
lionel messi:
Sem jsem napsal, čeho chci docílit a co jsem zkoušel a nešlo to. Ukázku kódu jsem dal a nechal jsem tam tu funkční verzi, aby bylo z čeho vycházet.
Přiznám se, že teď nějak nerozumím.
_es
Profil
Milan1236000:
Přiznám se, že teď nějak nerozumím.
Když odkomentuju styl nahoře a v JS místo proměnné $(window) dám svou proměnnou, ve kterém chci posouvat, hází to chybu a nefunguje to. Čím to je?

Z čoho si má vyveštiť tvoj nefunkčný kód, akú to „hádže chybu“ a pod.?

Asi bude jednoduchšie nájsť si nejaké „hotovejšie“ riešenie s možnosťou presúvania častí stránky.
Kajman
Profil
Milan1236000:
No píšete, že to hází chybu, ale my nic nevidíme. Neukázal jste svůj výtvor, třeba tam byla jen malá chyba.

Na ten scrolovací element by mělo stačit změnit událost pro stlačení myši. V té chvíli je ale potřeba uložit i současný stav scrolování. Puštění a tažení je lepší nechat na okně, když se při posunování myší posune kurzor mimo element. A pokud by mělo být někdy na stránce víc objektů, je lepší to dělat přes třídu než přes id a při kliknutí na ten element si např. v tom přepínači uchvat chtěný element.
Rolování tažením - živá ukázka
_es
Profil
Aha, tak asi nešlo o posúvanie tabuľky, ale jej obsahu.
No ale ako bude pri takomto zlepšováku označovať bunky tabuľky?
Milan1236000
Profil
Kajman:
Páni, to je super řešení. Ještě jednou moc díky. :)

_es:
Jasný, už chápu, příště dám tedy jen nefunkční zkoušenou variantu.
Mám na stránce s touto tabulkou i lištu s výběrem módu, takže by mělo stačit u Kajmanova řešení do každého eventu dát podmínku pokud aktuální mód je ten, ve kterým by mělo jít tabulku takto posouvat.

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0