Internetowy arkusz kalkulacyjny

Geneza projektu
Początkowo miała to być prosta aplikacja internetowa służąca do codziennego wprowadzania pewnych danych w kilkunastu oddziałach (biurach) firmy Konsalnet Konwój z możliwością oglądania i generowania raportów oraz zestawień dziennych oraz miesięcznych. Działo się to na początku 2007 roku, a firma bazowała wtedy na przesyłanych e-mailami codziennych raportach tworzonych w programie Microsoft Excel. Było to dość uciążliwe i mało wygodne, bo osoba nadzorująca w Centrali musiała każdego dnia wklejać do zestawienia zbiorczego poszczególne arkusze. Stąd też pomysł usprawnienia tego poprzez stworzenie stosownej aplikacji internetowej.

Kwestia ustalenia docelowego wyglądu formatki do wprowadzania danych przeciągała się w czasie aż w końcu pomysł został zawieszony (wtedy myślałem, że tylko na jakiś krótki czas). Ponieważ nie znałem oczekiwanego wyglądu części aplikacji służącej do wpisywania danych a miałem dużo wolnego czasu (zerwałem ze swoją ówczesną dziewczyną), to postanowiłem stworzyć coś w miarę uniwersalnego, co w łatwy sposób da się konfigurować dla konkretnych oczekiwań. Tworząc prawie każdą aplikacją internetową trzeba przygotowywać od nowa jej wygląd: położenie pól do wprowadzania danych wraz z ich opisem, kontrolę wprowadzanych danych oraz ich odpowiednie formatowanie, itp. Dodatkowo trzeba też zadbać o właściwe zapisywanie tych danych na serwerze przy ich przesłaniu przez taki formularz.

To wszystko spowodowało, że postanowiłem napisać coś na wzór i podobieństwo arkusza kalkulacyjnego Excel, tyle że działającego jako aplikacja internetowa w (każdej nowoczesnej) przeglądarce internetowej - i to niezależnie od używanego na danym komputerze systemu operacyjnego - oraz oczywiście niewymagającego obecności zainstalowanego pakietu Microsoft Office (ani programu Excel). Oczywiście zdawałem sobie sprawę z tego, że to jest dość poważne wyzwanie i przede mną bardzo dużo pracy. Wcześniej zetknąłem się pobieżnie z pakietem Google Docs Apps, ale wygląd arkusza kalkulacyjnego tego pakietu był bardzo toporny, a jego funkcjonalność mocno ograniczona.

Jako że nie miałem przez nikogo "odgórnie" określonego wyglądu i funkcjonalności mojej aplikacji, postanowiłem wzorować się jak to tylko możliwe na programie Microsoft Excel 2003 (wtedy - w połowie 2007 roku - nie było jeszcze na rynku pakietu MS Office 2007 ze słynną i kontrowersyjną "wstążką"). Zabrałem się zatem za analizowania wyglądu i zachowania się tego programu oraz do zbierania różnych materiałów związanych z wbudowanymi funkcjami Excela.

Wielojęzyczność
Od początku planowałem, że aplikacja będzie wielojęzyczna, to znaczy będzie miała możliwość zmiany języka interfejsu użytkownika (menu, wbudowanych funkcji, itd.). Bazując na kilku wersjach językowych Excela 2003 przygotowałem kilkujęzyczne menu. W internecie znalazłem zestawienie nazw funkcji Excela w kilkunastu wersjach językowych. Po prawie 2-letniej przerwie w pracy nad aplikacją, w grudniu 2012 roku, wróciłem do sprawy przygotowania wielojęzycznych danych. Skorzystałem wtedy z dostępnych na stronie Microsoftu darmowych wersji testowych (60-dniowych) pakietu MS Office 2010. Było tam ponad 30 wersji językowych, ja skupiłem się na językach europejskich, których było dokładnie 22 (razem z polskim i angielskim). Pisząc makra, służące do "wyłuskania" potrzebnych mi danych, zauważyłem brak w tym zestawie języka rosyjskiego. Zacząłem szukać i okazało się, że aby mieć taką wersję językową Excela 2010, muszę do wersji angielskiej programu wgrać stosowny pakiet językowy (language pack). Pakiety te były do pobrania ze strony Microsoftu. Prócz rosyjskiego było też kilka innych języków (skorzystałem głównie ze wschodnioeuropejskich). Łącznie przygotowałem sobie 28 wersji językowych pakietu Microsoft Office 2010, z których przy pomocy makr wygenerowałem sobie potrzebne dane. Dzięki temu czas potrzebny na przygotowanie wszystkich tych danych znacząco się skrócił i zupełnie nie musiałem się przejmować tym, że nie znam większości tych języków i nie rozumiem, co oznaczają poszczególne słowa.
Dodatkowo potrzebowałem przygotować odpowiednią pozycję w menu, służącą do zmiany języka aplikacji. Zmiana miała następować "w locie" bez konieczności przerywania pracy aplikacji (po prostu stosowne dane językowe są pobierane z serwera i zastępują aktualną wersję językową interfejsu aplikacji). Takiego fajnego rozwiązania nie ma żaden arkusz kalkulacyjny. Chciałem by wybór każdego z 28 dostępnych nazw języków był opisany w bieżąco wybranym języku (tak jak i cała reszta menu). Tutaj też wykorzystałem materiały opublikowane w internecie - i tym razem skorzystałem ze stron Microsoftu - na stronach do pobrania Service Pack 1 dla MS Office 2010 był do wyboru język używanej wersji pakietu i przy pomocy kolejnego makra wyłuskałem potrzebne rzeczy (zobacz przygotowany wykaz).
Mając dostępnych 28 wersji językowych pakietu MS Office 2010, przygotowałem (przy pomocy kolejnego makra) listę nazw funkcji w każdym z dostępnych języków (sporo wersji ma zlokalizowane nazwy funkcji - tak jest np. w polskiej wersji językowej - ale są też języki, w których pozostawiono oryginalne, angielskojęzyczne nazwy). Dla zainteresowanych - można sobie pobrać przygotowaną przeze mnie listę tych funkcji (jest ich na razie 348).
Wkrótce na stronie zawierającej wersję demonstracyjną aplikacji będzie dostępne menu uwzględniające wszystkie 28 języków.
Ważną sprawą jest też kolejność leksykograficzna liter dla poszczególnych języków oraz dodatkowe sprawy związane z nazwami dni, miesięcy, waluty, itp., które są wykorzystywane w aplikacji. Wiele z tych danych wyłuskam z poszczególnych wersji językowych Office 2010, inne z ustawień językowych samego systemu Windows (dla poszczególnych krajów).

Funkcje
Kilka lat temu wyszukałem w internecie zestawienie wszystkich funkcji Excela, w dodatku w kilkunastu wersjach językowych. Po przerwie w pracach nad tym programem, skorzystałem z dostępnej na stronie producenta alfabetycznej listy funkcji programu Excel 2010 (lista ta jest też dostępna w wersji z podziałem na kategorie). Wykaz zawiera 415 funkcji.
Na początku zamierzam się skupić na zakodowaniu (w JavaScript) funkcji najczęściej używanych, a potem w miarę wolnego czasu będę dodawał kolejne. Na razie przygotowałem funkcję SUMA i dla niej przygotowałem uniwersalny kod obsługujący dowolną liczbę parametrów, przekazanych do danej funkcji (tak by w każdej funkcji nie trzeba było się tym zajmować z osobna). Jak to działa w praktyce, można zobaczyć tutaj.
Obecnie piszę kod rejestrujący wielojęzyczne nazwy funkcji wraz z przypisanym im kodem (działaniem), tak by można było się nimi posługiwać po wybraniu dowolnego możliwego języka aplikacji (definicje tych nazw funkcji będą pobierane na żądanie ze stosownego pliku XML).

Parsowanie formuł
Musiałem się też zająć analizą wprowadzanych formuł (fachowo nazywa się to parsowaniem). Akurat na II roku studiów (Informatyka na UW) był przedmiot z tym związany i bardzo mi on podpasował. Pisaliśmy tam m.in. prosty kompilator języka Pascal oraz maszynę wykonującą taki skompilowany do pseudokodu program. Na zaliczenie jednego z zadań, gdzie trzeba było napisać właśnie maszynę wykonującą program w pseudokodzie, prócz napisania wersji w Pascalu (bo wtedy w takim języku programowaliśmy), przygotowałem też zoptymalizowaną wersję w asemblerze, która jak się okazało w testach zaliczeniowych, działała ok. 10 razy szybciej. Ta dziedzina informatyki tak mnie zafascynowała, że planowałem napisać (w Pascalu na komputer IBM PC) kompilator asemblera MOS 6502 dla 8-bitowych komputerów Atari serii XL/XE a później także emulator samego komputera Atari 65XE. Wtedy te pomysły nie zostały zrealizowane, ale po latach napisałem w JavaScript emulator komputera Atari 65XE.
Analiza wyrażeń arytmetycznych zawierających wywołania funkcji nie jest prosta. Można ją przeprowadzić na różne sposoby. Ja się skupiłem na przetwarzaniu takiego wyrażenia od razu do postaci ONP (odwrotnej notacji polskiej), bo potem łatwo jest liczyć wartość tak trzymanego wyrażenia. Demonstrację działania wyliczania wartości wpisanego wyrażenia arytmetycznego (na razie jeszcze bez używania funkcji) możesz zobaczyć tutaj.

Wygląd aplikacji
Założeniem przy pisaniu tworzeniu było maksymalne upodobnienie jej do wyglądu Excela 2003 - nie chodziło mi o zrobienie kopii tego programu, ale o pokazanie, że w JavaScripcie można napisać tak zaawansowaną i przydatną aplikację. Jej wygląd mógł być dowolny i mogę go w każdej chwili zmienić, ale chciałem pokazać, że również da się zaimplementować go tak, by dla użytkownika sprawiał wrażenie, że ma przed sobą program Excel w przeglądarce (co spotęguje efekt). Aplikacja składa się z modułów, których wygląd i zachowanie można dowolnie zmieniać. Wykorzystałem menu rozwijane (takie jak w Excelu 2003), bo do takiej postaci menu jestem przyzwyczajony od lat i taki wygląd bardziej mi odpowiada. Wstążka, wprowadzona do Excela 2007, przez wielu została przyjęta negatywnie, ale najgorsze było to, że użytkownik został pozbawiony wyboru, z jakiej wersji interfejsu chce korzystać.
Drugim ważnym elementem interfejsu użytkownika są paski narzędziowe (występują one w Excelu 2003, ale nie ma już ich w nowszych wersjach programu). Bazując na Excelu 2003 przygotowałem dwa najpopularniejsze paski narzędziowe (Standardowy i Formatowanie), oczywiście nic nie stoi na przeszkodzie przygotować następne. Ich wygląd można zobaczyć w przygotowanym demie - na razie jeszcze ani menu, ani przyciski nie wykonują żadnej akcji (zajmę się tym później, jak napiszę potrzebny kod), ale są już przygotowane do działania w różnych wersjach językowych.
Menu zdefiniowane jest w pliku XML (osobnym dla każdej wersji językowej), dzięki czemu zmieniając lub tworząc nowy plik z menu, można bez ingerencji w kod aplikacji uzyskać nową/inną funkcjonalność. W pliku z menu zawarte są - poza samą nazwą każdej z opcji - dane o skrócie klawiszowym danej pozycji (u mnie wyróżnianej znakiem "~" poprzedzającym właściwą literę), skrócie bezpośrednio wywołującym dane polecenie oraz indeks ikonki dla danej pozycji menu.
Podobnie skonstruowane są paski narzędziowe - wszystkie one mają swoje definicje w jednym zbiorczym pliku XML (osobnym dla każdej wersji językowej) i zawierają dane analogiczne jak te związane menu. To bardzo ułatwia przygotowywanie dowolnych pasków narzędziowych - wszystkie informacje o nich znajdują się w tym jednym plik XML.

Jeśli chcesz zobaczyć, jak obecnie wygląda ta aplikacja, kliknij tutaj.
Ciekawostka: w tym menu działa (jako jedyna aktywna) funkcja zmiany języka (Narzędzia -> Język) - możesz to przetestować (na razie jest przygotowanych tylko kilka języków).

Powrót do strony z wykazem projektów

Valid HTML 4.01 TransitionalValid CSS