ViCMS

Dziś ukończony został kolejny element układanki zwanej ViCMS.  Tym razem, oprócz tradycyjnych poprawek i aktualizacji używanych bibliotek, do testów dostępny jest moduł pozwalający na zarządzanie menu. Potrafi robić całkiem fajne rzeczy, ale zamiast rozpisywać się na ten temat, zachęcam do rzucenia okiem na poniższy filmik, który to pokazuje sposób działania składających się na niego funkcji.

Jeszcze tylko standardowe linki:

• Szczegółowa lista zmian
• ViCMS 3 alpha 2

Całkiem sporo jeszcze czasu musi upłynąć, aby ViCMS w wersji 3 funkcjonalnie dogonił 2.1, że nie wspomnę o przyjęciu zadowalającej mnie formy i osiągnięciu stanu, który można byłoby nazwać kompletnym. Zwrócę tylko uwagę na fakt, że modyfikacja tego systemu to rzecz, którą robię hobbystycznie, w wolnych chwilach, dla przyjemności – a więc i tempo prac nie jest zbyt intensywne. Nie mniej jednak – jeżeli ktoś chciałby być bardzo alternatywny i używać czegoś egzotycznego lub chciałby przejrzeć źródła w nadziei, że nauczy się nowych rzeczy, ew. chciałby ulepszyć system wprowadzając swoje własne modyfikacje – nie mam nic przeciwko (zwłaszcza, jeżeli później podzieliłby się swoimi wynikami ;)).

Dlatego też, pomimo, że jakiś czas temu pisałem o udostępnieniu źródeł ViCMS 3 w momencie osiągnięcia fazy beta – robię to już teraz. Jest gotowy, działający całkiem fajnie, spory fragment systemu – gdyby ktoś się uparł można nawet postawić w oparciu o niego stronę, choć mogłoby być to kłopotliwe ze względu na np. brak zarządzania menu i plikami (obrazki, dokumenty).

Co działa?

• Instalacja i aktualizacja
• Moduł aktualności – bez oceniania i komentowania, jest Atom i zagnieżdżone kategorie
• Moduł stron + możliwość podpięcia do / odpięcia z menu z poziomu szczegółów
• Zapis aktualności i stron bez publikacji / publikacja
• Zarządzanie użytkownikami (bez możliwości zmiany własnych danych :P)
• Możliwość filtrowania list (za wyjątkiem użytkowników)
• Określanie parametrów witryny, wybór kompozycji (stare skórki), zarządzanie modułami

Do uzupełniania w tym fragmencie pozostała możliwość dołączania stron do treści, zarządzania menu i przypominania hasła (nawet nie testowałem jak się zachowuje ta funkcja). A w dalszym etapie kolejne prace mające na celu wprowadzenie istniejącej już w ViCMS 2.1 funkcjonalności i jej poszerzanie.

Strony projektu w serwisie Bitbucket: https://bitbucket.org/varabi/vicms/

Znajduje się tam Mercurialowe repozytorium, z którego zawsze można będzie pobrać najnowszą wersję systemu. Dev jest gałęzią rozwojową, większe funkcje / moduły będą posiadały swoje własne, dołączane później do dev. Oficjalne wersje, późniejsze stabilne – gałąź default + odpowiedni tag.

W przypadku sugestii odnośnie działania systemu, odkrycia błędu w działaniu – informacje można dodawać do systemu śledzenia zgłoszeń również w tym serwisie, upewniając się wcześniej czy podobne już nie istnieje.

[box style=”shadow” ]

[/box]

ViCMS 3 alpha 1 – pobierz z serwisu Bitbucket

Korzystając z przymusowego dnia lenistwa, postanowiłem napisać o planach związanych z ViCMS. Plany są. Jak zwykle planów mam całą masę. Tylko czasu na realizację jakoś tak dziwnie mało.

ViCMS ma już swoje lata. Jako, że pierwsze wersje powstawały w czasach, kiedy to często jeszcze witryny były tworzone w oparciu o pliki zawierające mieszaninę HTML, CSS i JS (tu jest niewiele lepiej), a sam system zaprojektowany został w ujęciu strukturalnym – źródła nie wyglądają zbyt zachęcająco. Jest to trudny do pielęgnacji i rozbudowy kod. I kiedy z czymś takim zetknie się programista, który zagląda po jakimś czasie do swojego własnego dzieła, z przerażeniem stwierdza, że straszne rzeczy popełnił!

Jakiś czas temu doszedłem do wniosku, że rozbudowa programu w obecnej postaci nie ma najmniejszego sensu. Mało elastyczne rozwiązania nie pozwalają na szybkie wprowadzanie poprawek czy łatwe rozszerzanie istniejącej funkcjonalności. Postanowiłem wtedy, że jak mnie najdzie chęć podłubania w wolnych chwilach w PHP, będę sobie ViCMSa przebudowywał.

Założenia były proste:

• Bezpieczeństwo – m.in. poprzez zmianę sposobu obsługi połączeń z bazą danych, wykonywania zapytań (przy okazji porządek z samą bazą). Jest to system ogólnie dostępny, powinien więc jak najbardziej minimalizować prawdopodobieństwo powstania ewentualnego bałaganu.
• Jasna, określona struktura – oddzielenie logiki przetwarzania danych, dostępu do bazy, prezentacji – MVC – z czego wynikałaby łatwość późniejszej rozbudowy i pielęgnacji
• Jakość, przejrzystość kodu, prostota i uniwersalność – na pewno żadnego powielania, fragment raz napisany powinien być po prostu możliwy do używania w wielu miejscach, gdzie będzie to konieczne (np. stronicowanie)
• Zachowanie obecnej funkcjonalności, zwiększając wygodę użytkowania (mniejsza liczba koniecznych kliknięć, przeładowań stron, żeby tylko zobaczyć komunikat itp.)

I tak zgodnie z założeniami, wolnymi krokami postępuje refaktoring.

Jedną z ciekawszych rzeczy, które pojawiły się przy jego okazji po stronie administracyjnej są warstwy i chmurki. Będą one stanowiły sposób prezentacji komunikatów.

• Warstwy (wyjeżdżające z prawej strony „nad ekranem”, blokujące ekran) – pojawiają się zanim nastąpi jakaś akcja. Otoczone czerwoną ramką – informują o błędach, najczęściej braku lub nieprawidłowości danych. Otoczone ramką pomarańczową mogą zawierać formularze i oczekiwać na wprowadzenie informacji – wpisanie czegoś lub wybór opcji.
• Chmurki – pojawiają się w prawym górnym rogu i zawierają krótką informację o tym czy akcja została wykonana poprawnie czy też nie.

Poniżej zamieszczam filmik prezentujący odświeżoną część administracyjną nowego ViCMSa oraz działanie warstw i chmurek. Całkiem możliwe, że sam layout ulegnie jeszcze zmianie.

Więcej informacji będzie pojawiało się w miarę postępów prac.

Wymyśliłem sobie, że będę to robił w każde święta. A co!

Chciałem, aby ta wersja tylko i wyłącznie wprowadzała poprawki. Miała być najbardziej dopracowana pod względem działania istniejących już elementów ze wszystkich wersji, które pojawiły się do tej pory. Mam nadzieję, że się udało, bo od teraz będę już tylko psuł.

Z listą zmian można zapoznać się tam, gdzie zwykle.

Ponadto dokumentacja użytkownika została w końcu uzupełniona, można więc sobie poczytać trochę i pooglądać obrazki umieszczone na stronach poświęconych funkcjom ViCMS.

Pozostaje mi tylko życzyć wszystkim Wesołych Świąt!

Dziś wyjątkowa aktualizacja ViCMS. Po pierwsze – świąteczna.  Po drugie – dodanych zostało kilka rzeczy usprawniających działanie systemu i poprawiających błędy. Jest też trochę nowości, a są to:

• Zagnieżdżone kategorie aktualności – Pozwalają na lepsze grupowanie wpisów. Numerek w nawiasie obok nazwy mówi teraz o liczbie aktualności danej kategorii, a także wszystkich kategorii podrzędnych. Ponadto nazwa kategorii znajduje się teraz w stopce każdego wpisu, skąd informacja o dalszym ciągu tekstu (o ile taki istnieje) przeniesiona została na koniec treści pierwszej jego części. Będzie także umieszczana na końcu skrótów wiadomości w kanale informacyjnym.
• Panele – Mogą zawierać dowolną treść, formatowaną identycznie jak sam wpis. Widoczne są na pasku bocznym. Mogą być wyświetlane poniżej menu witryny – na samym dole, powyżej – na samej górze, lub tylko na górze strony głównej witryny.

Działanie tych funkcji przedstawia poniższy film. Był on tworzony w trakcie pisania programu – widać na nim drobny błąd, który został później wyeliminowany. Film zawiera też paskudną reklamę. 

Ponadto:

• Panele stron – Zasada działania jest identyczna, jak w przypadku paneli ogólnych, dotyczą jednak tylko konkretnej strony. Tworzone są przy dodawaniu lub edycji strony i mogą pełnić rolę dodatkowego dla niej menu.
• Opcjonalny przycisk „+1” poniżej aktualności pozwalający na rekomendowanie treści wpisów w serwisie Google+.
• Ulepszone funkcje odpowiedzialne za formatowanie i sprawdzanie poprawności zagnieżdżenia znaczników BBcode, dzięki czemu wykrywana jest większa ilość błędów, a jednocześnie zwiększona została elastyczność poprzez umożliwienie stosowania dowolnej kolejności zagnieżdżeń w ramach dopuszczalnej w danym momencie.

• Dokumenty generowane przez system są teraz zgodne z HTML5, który zastąpił poprzednio używany standard opisu – XHTML 1.0 Transitional. Dzięki temu możliwe było m.in. zrezygnowanie z negocjowania typu zawartości lub osadzania obiektów flash z użyciem SWFObject, aby zapewnić zgodność i poprawne wyświetlanie w przeglądarkach z grupy Internet Explorer. Poziom użycia nowych elementów języka znaczników HTML5 jest znikomy z powodu śladowej ich obsługi przez IE8. Starsze wersje oraz przeglądarki z włączonym widokiem zgodności będą na samej górze wyświetlały komunikat o możliwości niepoprawnej prezentacji strony.
• Wymienione emotikony i zwiększona ich ilość.
• Nowa, trzecia już skórka w paczce. Blue dostosowuje się do szerokości okna przeglądarki, nie ładuje także zbyt wielu elementów z plików graficznych. Założeniem było stworzenie „lekkiej” szaty graficznej, a więc zaokrąglone rogi nie działają w IE8 i starszych.

Co do błędów – niektóre z nich:

• Album nie był zapisywany w bazie, jeżeli szerokość wskazanego przy jego edycji lub tworzeniu zdjęcia była mniejsza niż wymagana szerokość miniaturki.
• Zapis długich treści (bliskich limitu długości) zawierających emotikony mógł powodować błąd – długość była sprawdzana przed, a nie po zamianie znaczników BBcode na HTML.
• Nie dało się dodać administratora z pełnymi uprawnieniami (super administratora).
• Grafika PNG na miniaturkach albumów i zdjęć w galerii traciła przezroczystość.
• Część administracyjna „wystawała poza ekran” w rozdzielczości 1024×768.
• Brakowało stronicowania na liście albumów w galerii oraz na liście zdjęć.

Korzystając z okazji – wszystkim odwiedzającym tę stronę chciałbym złożyć życzenia radosnych Świąt Bożego Narodzenia oraz uśmiechu i życzliwości na każdy dzień Nowego Roku.

Wyszukiwarka pozwalająca na znalezienie interesującej treści w obrębie witryny to funkcja, którą ViCMS posiada prawie od początku swojego istnienia. Była ona wtedy wykonana na szybko, jako prowizoryczna – proteza ostatecznej wersji. Zasada działania była tak prosta, że już prostsza być nie mogła. Przeszukiwała treść pod kątem wystąpienia danej frazy w sposób dosłowny (tak, jak została wprowadzona) – bez żadnej analizy. Jak powszechnie wiadomo, prowizorki są najtrwalsze – toteż działała w prawie niezmienny sposób po dziś dzień stając się najsłabszym elementem systemu.

Wyszukiwarka w takiej postaci nie spełniała swojej funkcji (była mało skuteczna) i nie mogłem już na nią patrzeć. Czas więc najwyższy było napisać ją bardziej porządnie. Nowy sposób przeszukiwania treści analizuje aktualności, strony i galerię pod kątem wystąpienia poszczególnych elementów frazy, sortując wyniki w grupach według trafności (procent zawartości frazy) i powtarzalności (taka prawie ilość wystąpień ;)). Ale gdyby ktoś jeszcze marudził – zawsze może zaznaczyć pole obok i zmusić silnik Google do wykonania brudnej roboty.

Pozostałe zmiany w wersji 2.0.12

• Obrazki w treści stron i aktualności mogą być teraz również umieszczane po lewej lub po prawej stronie tekstu, który będzie je „opływał”. Służą do tego odpowiednio znaczniki img2 iimg3. Należy pamiętać, że sekcja taka musi być zamknięta za pomocą clear i /clear. W przeciwnym razie może zrobić się mały bałagan. Dlatego też funkcję zaznaczam jako „dla użytkowników zaawansowanych”.
• Skórki mogą posiadać teraz ikonkę w formacie PNG – plik icon.png. Oczywiście Internet Explorer starszy niż 9 ich nie obsługuje, więc załaduje sobie plik favicon.ico, o ile taki będzie znajdował się w folderze. Pozostałe przeglądarki, użyją tego pierwszego pliku. Zalety? Ładniej się prezentuje, kolor 32-bit, przezroczystość, w większej rozdzielczości (ponad 200×200) np. Opera używa jako miniaturki w SpeedDial, itp.
• Drobne poprawki w skórkach i aktualizatorze.

– Pobierz nową wersję –

Jeżeli nic dziwnego się nie przytrafi i będę miał znowu napad na dłubanie w PHP to kolejna wersja będzie już prawdopodobnie z serii 2.1 z czymś bardzo fajnym.

System zarządzania treścią, jak wskazuje nazwa, powinien przede wszystkim umożliwiać swobodne kształtowanie sposobu prezentacji tekstu. Brak kompletnego formatowania, w skład którego wchodzi kolorowanie tekstu, możliwość powiększania czy zmniejszania czcionki oraz wstawianie wykazów był wadą ViCMS. Był.

Co w nowej wersji?

• Możliwość tworzenia wykazów zawierających elementy uporządkowane (ponumerowane) lub nieuporządkowane (wypunktowane – jak ten mruga) Wygląd można sobie doprecyzować w pliku skórki używając klas – odpowiednio list1 i list2. Numeracja w pierwszym przypadku może zaczynać się od konkretnej wartości, jeśli znacznik rozpoczynający będzie miał postać np. list1=6. Listy mogą być zagnieżdżone.
• Kolorowanie tekstu. Na dzień dzisiejszy tylko przeglądarka Opera obsługuje input type color, więc w celu umożliwienia wybierania barwy użyty został komponent JSColor autorstwa Jana Odvárko (screen poniżej). Nie było sensu pisania czegoś od podstaw, skoro istnieje dobre i fajne rozwiązanie. Został więc włączony do systemu.

• Zmiana rozmiaru czcionki – za pomocą znacznika size=wartość. Nie ma do tego przycisku, bo raczej rzadko przychodzi potrzeba, żeby zmieniać określony w skórce rozmiar, ale opcja jest.
• Odtwarzacz filmów z YouTube można już przełączać w tryb pełnoekranowy bezpośrednio ze stron.
• Dla wygody na dole aktualności zostały dodane strzałki do nawigacji.

Oprócz tego poprawki błędów, które udało się zauważyć od ostatniej wersji:

• Nie dało się dołączyć stron do menu (zepsułem chyba w przedostatniej wersji mruga)
• Przy dodawaniu plików do stron i aktualności powrót z kategorii plików wyświetlał komunikat braku upoważnienia.
• Jeżeli istniały jakieś strony, a wyłączona została ich obsługa w obrębie całej witryny, zostawały one w menu górnym.
• Brak odstępu pomiędzy częściami aktualności (widoczną od razu i po kliknięciu na „czytaj dalej”) w podglądzie.
• Numerki w listingu kodu wyświetlały się brzydko przy większej liczbie linii niż 9.
• Tytuł i podtytuł witryny nie znajdowały się pomiędzy znacznikami h1 w przypadku, gdy menu było powyżej (na samej górze) – np. dla skórki infrared.

– Pobierz nową wersję –

Ostatnio pogoń za numerkami jest na topie, więc i ja nie będę sobie żałował.  Właściwie jedna zasadnicza zmiana – funkcja osadzania kodu w treści stron i aktualności. Żeby wpis nie był taki krótki to dołączę do niego Hello World w C++.

Fragmenty kodu umieszczać można pomiędzy znacznikami . Enter = nowa linia.

- Pobierz nową wersję -

Ps. Błędów najlepiej się szuka od niechcenia.

Update: Blok z kodem może źle się wyświetlać w przeglądarce Internet Explorer 8. Powodem jest microsoftowy wynalazek o nazwie tryb zgodności. Wystarczy go wyłączyć.

Search engine optimization czyli optymalizacja dla wyszukiwarek internetowych to główne zmiany w tej wersji. Po pierwsze – można ustawić teraz opis witryny i określić słowa kluczowe wypełniając odpowiednie pola w Ustawienia -> Parametry witryny. Dodane zostały także tagi nagłówków (h1, h2, h3) dla tytułów aktualności i stron, co także powinno wpłynąć na pozycjonowanie. Pełna lista zmian:

• Możliwość ustawienia opisu witryny oraz słów kluczowych dla wyszukiwarek internetowych.
• Optymalizacje związane z pozycjonowaniem witryn w wyszukiwarkach – tagi metadescription, keywords, znaczniki nagłówków h1 (tytuł, podtytuł), h2 (tytuły stron), h3 (tematy aktualności), h4 (nagłówki menu), zmienione wartości dla tagu title.
• Wbudowana wyszukiwarka sprawdza teraz także opisy i tytuły zdjęć, jeśli galeria jest włączona.

I kilka poprawek:

• Kiedy kliknięto Lubię to pod notką, Facebook brał nazwę witryny, nie tytuł danej aktualności.
• Nie dało się wyśrodkować dodawanego do strony/aktualności tekstu zawierającego odnośniki.
• Zwiększony limit długości treści stron do 15000 znaków, komentarzy do 1000 znaków. Programowe ograniczenie długości treści.
• Usunięty zbędny kod w podprogramie podglądu. Pozostałość po innej funkcji.

– Pobierz nową wersję –

Ps. Możliwe, że narobiłem komuś smaku screenem z funkcją osadzania kodu.  Okazało się, niestety, że system wykładał się w pewnych okolicznościach. Naprawa tego błędu wymaga przebudowania kilku rzeczy, a teraz nie bardzo będę miał na to czas. Postanowiłem więc wrzucić taką okrojoną wersję – praktycznie bez nowych funkcji – zawierającą jednak przetestowane poprawki i usprawnienia. Smacznego.

Pisałem ostatnio, że posprzątam bałagan z niezgodnościami, jak IE9 zdobędzie większą część rynku. Nie ma to jednak żadnego sensu. I tak pewnie będzie zepsuty.  Ale poważnie: Zakończone zostało wsparcie techniczne dla systemu Windows XP. Oznacza to, że przeglądarki IE9 pod ten system nie będzie. Mając na uwadze najnowsze statystyki – Windows XP używa ponad 60% ludzi w Polsce. Zanim więc IE9 uzyska popularność na tyle dużą, żeby wszystkie śmieci z kodu wyrzucić to ja już będę miał wnuki.  Trzeba było więc porobić kolejne obejścia problemów, które IE sprawia. Stąd grupa poprawek zgodności:

• Do systemu został włączony nowy niezależny komponent – SWFObject v2.2 – pozwalający na ładowanie elementów flash z poziomu JS. Dzięki temu udało się osadzić je zgodnie ze standardem.
• Osadzenie obiektu flash w panelu Blipa było niezgodne ze standardem XHTML 1.0 Transitional. A było, bo inaczej w IE nie działało.
• Dodany hack dla IE rozwiązujący problem przezroczystego tła iframe (allowtransparency) i niezgodności z XHTML 1.0 Transitional. A problem był, bo programistom IE się nie chciało inaczej zaimplementować, więc dodali sobie specjalny atrybut, bez którego nie działa, a który nie istnieje w żadnej specyfikacji.
• Mały fix stylowania dla Internet Explorera w obydwu oficjalnych skórkach.
• Brak Doctype przy podglądzie tworzonych treści/aktualności.
• Nie działał podgląd tworzonych stron/aktualności w Internet Explorerze. IE nie odróżnia nazwy atrybutu tagu od nazwy innego tagu.

I poprawki bezpieczeństwa:

• Obsługa błędów połączenia z bazą danych.
• Naprawiony błąd w przypadku braku argumentów i bezpośrednim wpisaniu adresu skryptu (wyszukiwanie/podgląd komentarzy/komentarze).
• Nowa funkcja odpowiedzialna za dołączanie stron / plików do aktualności / stron. Dane przesyłane inną metodą.
• Ograniczenie dostępu do listy plików i stron (używane przy dołączaniu) z zewnątrz.

Pobierz nową wersję

Przy okazji – wszystkim, którzy używają Internet Explorera (w szczególności tym, którzy nie będą mogli mieć IE9) – polecam zainstalowanie jakiejś normalnej (szybkiej, często aktualizowanej, wspierającej nowe technologie i zgodnej ze standardami) przeglądarki: Chrome, Opera, Firefox – do wyboru.