From 6c263c8c02ccf6a7fd9c51b1d8c303594f9ee6ac Mon Sep 17 00:00:00 2001
From: coderaiser <3n3m1@ukr.net>
Date: Wed, 6 Jun 2012 18:47:17 +0000
Subject: [PATCH] cloud commander full*

---
 client.js    | 978 +++++++++++++++++++++++++++++++++++++++++++++++++++
 cloudfunc.js | 511 +++++++++++++++++++++++++++
 index.html   |  59 ++++
 minify.js    |  81 +++++
 reset.css    | 115 ++++++
 server.js    | 562 +++++++++++++++++++++++++++++
 style.css    | 316 +++++++++++++++++
 7 files changed, 2622 insertions(+)
 create mode 100644 client.js
 create mode 100644 cloudfunc.js
 create mode 100644 index.html
 create mode 100644 minify.js
 create mode 100644 reset.css
 create mode 100644 server.js
 create mode 100644 style.css

diff --git a/client.js b/client.js
new file mode 100644
index 00000000..f052ff42
--- /dev/null
+++ b/client.js
@@ -0,0 +1,978 @@
+/* Функция которая возвратит обьект CloudCommander
+ * @window - обьект window
+ * @document - обьект document
+ * @CloudFunc - обьект содержащий общий функционал
+ *              клиентский и серверный
+ */
+//var CloudCommander=(function(window,document){
+
+var document,window;
+
+var CloudCommander=(function(){
+"use strict";
+
+/* если функции console.log нет - создаём заглушку */
+
+var console;
+if(!window)window={console:{log:function(pParam){return pParam;}}};
+else if(window && !window.console){
+    console={
+        'log':function(param){
+            return param;
+        }
+    };
+}else console=window.console;
+
+/*
+    window.jQuery || document.write('<script src="jquery.min.js"><\/script>');
+*/
+
+/* Клиентский обьект, содержащий функциональную часть*/
+var CloudClient={        
+    /* Конструктор CloudClient, который
+    * выполняет весь функционал по
+    * инициализации
+    */
+    init                    :function(){},
+    
+    keyBinding              :function(){},/* функция нажатий обработки клавишь */
+    keyBinded               :false,/* оброботка нажатий клавишь установлена*/
+    _loadDir                 :function(){},
+    /* 
+     * Функция привязываеться ко всем ссылкам и
+     *  загружает содержимое каталогов
+     */
+     /* Обьект для работы с кэшем */
+     Cashe                  :{},
+     
+     /* ПРИВАТНЫЕ ФУНКЦИИ */
+     /* функция загружает json-данные о файловой системе */
+     _ajaxLoad              :function(){},
+     /* Функция генерирует JSON из html-таблицы файлов */
+     _getJSONfromFileTable  :function(){},
+     /* функция меняет ссыки на ajax-овые */
+     _changeLinks           :function(){},     
+     /* ОБЬЕКТЫ */
+     /* обьект, который содержит функции для отображения картинок*/
+     _images                :{},     
+     /* КОНСТАНТЫ*/
+     /* название css-класа текущего файла*/
+     CURRENT_FILE           :'current-file'
+};
+
+/* 
+ * Обьект для работы с кэшем
+ * в него будут включены функции для
+ * работы с LocalStorage, webdb,
+ * idexed db etc.
+ */
+CloudClient.Cache={
+    _allowed     :true,     /* приватный переключатель возможности работы с кэшем */
+     /* функция проверяет возможно ли работать с кэшем каким-либо образом */
+    isAllowed   :function(){},
+    /* Тип кэша, который доступен*/
+    type        :{},
+    /* Функция устанавливает кэш, если выбранный вид поддерживаеться браузером*/
+    set         :function(){},
+    /* Функция достаёт кэш, если выбранный вид поддерживаеться браузером*/
+    get         :function(){},
+    /* функция чистит весь кэш для всех каталогов*/
+    clear       :function(){}
+};
+
+/* Обьект, который содержит
+ * функции для отображения
+ * картинок
+ */
+CloudClient._images={
+    /* Функция создаёт картинку загрузки*/
+    loading     :function(){   
+        var e=document.createElement('span');
+    e.className='icon loading';
+    e.id='loading-image';
+    return e;
+},
+
+    /* Функция создаёт картинку ошибки загрузки*/
+    error       :function(){
+        var e=document.createElement('span');    
+        e.className='icon error';
+        e.id='error-image';
+        return e;
+    }
+};
+
+/* функция проверяет поддерживаеться ли localStorage */
+CloudClient.Cache.isAllowed=(function(){
+    if(window.localStorage && 
+        localStorage.setItem &&
+        localStorage.getItem){
+        CloudClient.Cache._allowed=true;
+    }else
+        {
+            CloudClient.Cache._allowed=false;
+            /* загружаем PolyFill для localStorage,
+             * если он не поддерживаеться браузером
+             * https://gist.github.com/350433 
+             */
+            CloudClient.jsload('https://raw.github.com/gist/350433/c9d3834ace63e5f5d7c8e1f6e3e2874d477cb9c1/gistfile1.js',
+                function(){CloudClient.Cache._allowed=true;
+            });
+        }
+});
+ /* если доступен localStorage и
+  * в нём есть нужная нам директория -
+  * записываем данные в него
+  */
+CloudClient.Cache.set=(function(pName, pData){
+    if(CloudClient.Cache._allowed && pName && pData){
+        localStorage.setItem(pName,pData);
+    }
+});
+/* Если доступен Cache принимаем из него данные*/
+CloudClient.Cache.get=(function(pName){
+    if(CloudClient.Cache._allowed  && pName){
+        return localStorage.getItem(pName);
+    }
+    else return null;
+});
+/* Функция очищает кэш*/
+CloudClient.Cache.clear=(function(){
+    if(CloudClient.Cache._allowed){
+        localStorage.clear();
+    }
+});
+
+
+/* функция обработки нажатий клавишь */
+CloudClient.keyBinding=(function(){   
+    var key_event=function(event){            
+            /* 
+             * Делаем допущение что перезагружать Cloud Commander
+             * посетителям не придёться, в любом случае, параметр
+             * должен быть опциональным и должна быть возможность
+             * его отключить. В любом случае, кроме хакеров и 
+             * разработчиков (при чём сомнительно, что хакерам
+             * это пригодиться), функция перезагрузки никому не
+             * нужна, поскольку загружать весь дополнительный
+             * контент снова (js,css) в готовой версии нет
+             * необходимости.
+             *
+             */             
+            //console.log(event.keyCode);
+            var lCurrentFile;
+            /* если клавиши можно обрабатывать*/
+            if(CloudClient.keyBinded){
+                /* если нажали таб:
+                 * переносим курсор на
+                 * правую панель, если
+                 * мы были на левой и
+                 * наоборот
+                 */
+                if(event.keyCode===9){
+                    console.log('Tab pressed');
+                    try{
+                        lCurrentFile=document.getElementsByClassName(CloudClient.CURRENT_FILE)[0];
+                    }catch(error){console.log(error);}
+                }                
+                /* навигация по таблице файлов*/
+                /* если нажали клавишу вверх*/
+                else if(event.keyCode===38){
+                    /* получаем выдленный файл*/
+                    lCurrentFile=document.getElementsByClassName(CloudClient.CURRENT_FILE);
+                    /* если ненайдены выделенные файлы - выходим*/
+                    if(lCurrentFile.length===0)return;
+                    lCurrentFile=lCurrentFile[0];
+                    /* если это строка существет и
+                     * если она не заголовок
+                     * файловой таблицы
+                     */
+                    if(lCurrentFile.previousSibling && 
+                       lCurrentFile.previousSibling.className!=='fm_header' ){
+                        /* убираем выделение с текущего элемента */
+                        lCurrentFile.className='';
+                        /* и выделяем предыдущую строку*/
+                        lCurrentFile.previousSibling.className=CloudClient.CURRENT_FILE;
+                        event.preventDefault();
+                    }
+                }
+                /* если нажали клавишу в низ*/
+                else if(event.keyCode===40){
+                    /* получаем выдленный файл*/
+                    lCurrentFile=document.getElementsByClassName(CloudClient.CURRENT_FILE);                
+                    /* если ненайдены выделенные файлы - выходим*/
+                    if(lCurrentFile.length===0)return;
+                    lCurrentFile=lCurrentFile[0];
+                    /* если это не последняя строка */
+                    if(lCurrentFile.nextSibling){
+                        /* убираем с него выделение */
+                        lCurrentFile.className='';
+                        /* выделяем следующую строку*/
+                        lCurrentFile.nextSibling.className=CloudClient.CURRENT_FILE;
+                        event.preventDefault();
+                    }
+                }
+                /* если нажали клавишу page up или Home
+                 * переходим к самому верхнему
+                 * элементу
+                 */
+                else if(/*event.keyCode===33 ||*/ event.keyCode===36){
+                        lCurrentFile=document.getElementsByClassName(CloudClient.CURRENT_FILE)[0];
+                        /* убираем выделение с текущего файла*/
+                        lCurrentFile.className='';
+                        /* получаем первый элемент*/
+                        lCurrentFile.parentElement.firstElementChild
+                        /* пропускаем путь и заголовки столбиков*/
+                            .nextElementSibling.nextElementSibling
+                            /* выделяем верхий файл */
+                            .className=CloudClient.CURRENT_FILE;
+                }
+                /* если нажали клавишу page down или End
+                 * выделяем последний элемент
+                 */
+                else if(/*event.keyCode===34 ||*/ event.keyCode===35){
+                        lCurrentFile=document.getElementsByClassName(CloudClient.CURRENT_FILE)[0];
+                        /* снимаем выделение с текущего файла*/
+                        lCurrentFile.className='';
+                        /* выделяем самый нижний файл */
+                        lCurrentFile.parentElement.lastElementChild.className=CloudClient.CURRENT_FILE;
+                }
+                /* если нажали Enter - открываем папку*/
+                else if(event.keyCode===13){
+                    lCurrentFile=document.getElementsByClassName(CloudClient.CURRENT_FILE);
+                    /* если ненайдены выделенные файлы - выходим*/
+                    if(!lCurrentFile.length)return;
+                    lCurrentFile=lCurrentFile[0];
+                    /* из него достаём спан с именем файла*/
+                    var lName=lCurrentFile.getElementsByClassName('name');
+                    /* если нету (что вряд ли) - выходим*/
+                    if(!lName)return false;
+                    /* достаём все ссылки*/
+                    var lATag=lName[0].getElementsByTagName('a');
+                    /* если нету - выходим */
+                    if(!lATag)return false;
+                    /* получаем ссылку на каталог,
+                     * что на уровень выше
+                     */
+                    /* получаем имя каталога в котором находимся*/
+                    var lHref;
+                    try{
+                        lHref=lCurrentFile.parentElement.getElementsByClassName('path')[0].innerText;
+                    }catch(error){console.log('error');}
+                    lHref=CloudFunc.removeLastSlash(lHref);
+                    var lSubstr=lHref.substr(lHref,lHref.lastIndexOf('/'));
+                    lHref=lHref.replace(lSubstr+'/','');
+                    
+                    /* вызываем ajaxload привязанный через changelinks
+                     * пробулем нажать на ссылку, если не получиться
+                     * (opera, ie), вызываем событие onclick,
+                     * которое пока не прописано у файлов
+                     */
+                     
+                     if(lCurrentFile.onclick)lCurrentFile.onclick(true);
+                     else try{
+                         lATag[0].click();                                                
+                     }
+                     catch(error){
+                         console.log(error);
+                     }
+                }
+                /* если нажали <ctr>+r */
+                else if(event.keyCode===82 &&
+                    event.ctrlKey){
+                    console.log('<ctrl>+r pressed');
+                    console.log('reloading page...');
+                    console.log('press <alt>+q to remove all key-handlers');
+                                    
+                    /* обновляем страницу, */                
+                    /* Загружаем содержимое каталога
+                     * при этом данные берём всегда из
+                     * сервера, а не из кэша
+                     * (обновляем кэш)
+                     */
+                    /* Программно нажимаем на кнопку перезагрузки 
+                     * содержимого каталога
+                     */
+                    var lRefreshIcon=document.getElementsByClassName(CloudFunc.REFRESHICON);
+                    if(lRefreshIcon)lRefreshIcon=lRefreshIcon[0];
+                    if(lRefreshIcon){
+                        /* находим файл который сейчас выделен */
+                         lCurrentFile=document.getElementsByClassName(CloudClient.CURRENT_FILE);
+                         if(lCurrentFile.length>0)lCurrentFile=lCurrentFile[0];
+                         /* получаем название файла*/
+                         var lSelectedName=lCurrentFile.getElementsByTagName('a')[0].innerText;
+                         /* если нашли элемент нажимаем него
+                          * а если не можем - нажимаем на 
+                          * ссылку, на которую повешен eventHandler
+                          * onclick
+                          */
+                        if(lRefreshIcon.click)lRefreshIcon.parentElement.click();
+                        else lRefreshIcon.parentElement.onclick();
+                        
+                        /* перебираем файлы левой панели
+                         * в поисках подсвеченого файла
+                         */
+                        var lLeft=document.getElementById('left');
+                        if(lLeft){
+                            /* перебираем все файлы в панели */
+                            var lLi=lLeft.getElementsByTagName('li');
+                            lCurrentFile.className='';
+                            /* начинаем с 2-ух, по скольку
+                             * 0 - это путь
+                             * 1 - это заголовок файловой таблицы
+                             */
+                            for(var i=2;i<lLi.length;i++){
+                                var lName=lLi[i].getElementsByTagName('a')[0].innerText;
+                                if(lSelectedName.length===lName.length &&
+                                    !lSelectedName.indexOf(lName)){
+                                        lLi[i].className=CloudClient.CURRENT_FILE;
+                                        break;
+                                }
+                            }                            
+                        }
+                                    
+                        event.preventDefault();//запрет на дальнейшее действие
+                    }
+                }
+                /* если нажали <ctrl>+d чистим кэш */
+                else if(event.keyCode===68 &&
+                    event.ctrlKey){
+                        console.log('<ctrl>+d pressed');
+                        console.log('clearing cache...');
+                        console.log('press <alt>+q to remove all key-handlers');
+    
+                        var lClearCache=document.getElementById('clear-cache');
+                        if(lClearCache && lClearCache.onclick)lClearCache.onclick();
+                        
+                        event.preventDefault();//запрет на дальнейшее действие
+                }
+                /* если нажали <alt>+q 
+                 * убираем все обработчики
+                 * нажатий клавиш
+                 */             
+                else if(event.keyCode===81 &&
+                    event.altKey){
+                        //document.removeEventListener('keydown', key_event,false);
+                        console.log('<alt>+q pressed');
+                        console.log('<ctrl>+r reload key-handerl - removed');
+                        console.log('<ctrl>+s clear cache key-handler - removed');
+                        console.log('press <alt>+s to to set them');
+                        
+                        /* обработчик нажатий клавиш снят*/
+                        CloudClient.keyBinded=false;
+                }
+            }
+            /* если нажали <alt>+s 
+             * устанавливаем все обработчики
+             * нажатий клавиш
+             */             
+            else if(event.keyCode===83 &&
+                event.altKey){
+                    /*
+                        document.addEventListener('keydown', key_event,false);
+                    */
+                    /* обрабатываем нажатия на клавиши*/
+                    CloudClient.keyBinded=true;
+                    
+                    console.log('<alt>+s pressed');
+                    console.log('<ctrl>+r reload key-handerl - set');
+                    console.log('<ctrl>+s clear cache key-handler - set');
+                    console.log('press <alt>+q to remove them');
+            }            
+            
+         return false;
+    };
+    /* добавляем обработчик клавишь */
+    if(document.addEventListener)
+        document.addEventListener('keydown', key_event,false);
+    else document.onkeypress=key_event;
+    /* клавиши назначены*/
+    CloudClient.keyBinded=true;
+});
+
+
+/* 
+ * Функция привязываеться ко всем ссылкам и
+ *  загружает содержимое каталогов
+ */
+CloudClient._loadDir=(function(pLink,pNeedRefresh){
+    /* @pElem - элемент, 
+     * для которого нужно
+     * выполнить загрузку
+     */
+        return function(){
+            /* показываем гиф загрузки возле пути папки сверху*/
+            LoadingImage.className='icon loading';/* показываем загрузку*/
+            ErrorImage.className='icon error hidden';/* прячем ошибку */
+            /* если элемент задан -
+             * работаем с ним
+             */
+             /* если мы попали сюда с таблицы файлов*/
+            try{
+                this.firstChild.nextSibling.appendChild(LoadingImage);
+            }catch(error){
+                /* если <ctrl>+<r>
+                 * кнопка обновления
+                 */
+                try{this.firstChild.parentElement.appendChild(LoadingImage);}
+                catch(error){console.log(error);}
+                }
+            
+            var lCurrentFile=document.getElementsByClassName(CloudClient.CURRENT_FILE);
+            /* получаем имя каталога в котором находимся*/ 
+            var lHref;
+            try{
+                lHref=lCurrentFile[0].parentElement.getElementsByClassName('path')[0].innerText;
+            }catch(error){console.log('error');}
+            
+            lHref=CloudFunc.removeLastSlash(lHref);
+            var lSubstr=lHref.substr(lHref,lHref.lastIndexOf('/'));
+            lHref=lHref.replace(lSubstr+'/','');
+                                     
+            /* загружаем содержимое каталога*/
+            CloudClient._ajaxLoad(pLink, pNeedRefresh);
+            
+            /* получаем все элементы выделенной папки*/
+            /* при этом, если мы нажали обновить
+             * или <Ctrl>+R - ссылок мы ненайдём
+             * и заходить не будем
+             */
+            var lA=this.getElementsByTagName('a');
+            /* если нажали на ссылку на верхний каталог*/
+            if(lA.length>0 && lA[0].innerText==='..' &&
+                lHref!=='/'){
+            /* функция устанавливает курсор на каталог
+            * с которого мы пришли, если мы поднялись
+            * в верх по файловой структуре
+            */              
+                CloudClient._currentToParent(lHref);
+            }
+            
+            /* что бы не переходить по ссылкам
+             * а грузить всё ajax'ом,
+             * возвращаем false на событие
+             * onclick
+             */                         
+            return false;
+            };
+    });
+    
+/* Функция устанавливает текущим файлом, тот
+ * на который кликнули единожды
+ */
+CloudClient._setCurrent=(function(){
+        /*
+         * @pFromEnter - если мы сюда попали 
+         * из события нажатия на энтер - 
+         * вызоветься _loadDir
+         */
+        return function(pFromEnter){
+            var lCurrentFile=document.getElementsByClassName(CloudClient.CURRENT_FILE);
+            if(lCurrentFile && lCurrentFile.length > 0){
+                /* если мы находимся не на 
+                 * пути и не на заголовках
+                 */
+                if(this.className!=='path' && 
+                    this.className!=='fm_header'){
+                        
+                    lCurrentFile[0].className='';
+                    /* устанавливаем курсор на файл,
+                    * на который нажали */
+                }
+            }
+            this.className=CloudClient.CURRENT_FILE;
+            
+                /*
+                    console.log('Error. Can\'t find current file.'+
+                    ' (CloudClient._setCurrent)');                                                 
+                */
+             /* если мы попали сюда с энтера*/
+             if(pFromEnter===true){
+                this.ondblclick(this);               
+             }/* если мы попали сюда от клика мышки */
+             else{pFromEnter.returnValue=false;}
+                                       
+            /* что бы не переходить по ссылкам
+             * а грузить всё ajax'ом,
+             * возвращаем false на событие
+             * onclick
+             */
+            return false;
+        };
+    });
+    
+/* функция устанавливает курсор на каталог
+ * с которого мы пришли, если мы поднялись
+ * в верх по файловой структуре
+ * @pDirName - имя каталога с которого мы пришли
+ */
+CloudClient._currentToParent = (function(pDirName){                                              
+    /* опредиляем в какой мы панели:
+    * правой или левой
+    */
+    var lCurrentFile=document.getElementsByClassName(CloudClient.CURRENT_FILE);
+    var lPanel;
+    try{
+        lPanel=lCurrentFile[0].parentElement.id;
+    }catch(error){console.log("Current file not found\n"+error);}
+    /* убираем слэш с имени каталога*/
+    pDirName=pDirName.replace('/','');
+    /* ищем файл с таким именем*/
+    lPanel=document.getElementById(lPanel);
+    if(!lPanel)return;
+    
+    var lLi=lPanel.getElementsByTagName('li');
+    for(var i=0;i<lLi.length;i++){
+        var lA=lLi[i].getElementsByTagName('a');
+        if(lA.length && lA[0].innerText===pDirName){
+            /* если уже выделен какой-то файл, снимаем
+             * выделение
+             */
+            lCurrentFile=lPanel.getElementsByClassName(CloudClient.CURRENT_FILE);
+            if(lCurrentFile.length>0)lCurrentFile[0].className='';
+            
+            lLi[i].className=CloudClient.CURRENT_FILE;
+        }
+    }
+}); 
+  
+/* глобальные переменные */
+var LoadingImage;
+var ErrorImage;
+
+var $;
+var CloudFunc;
+/* Конструктор CloudClient, который
+ * выполняет весь функционал по
+ * инициализации
+ */
+CloudClient.init=(function()
+{    
+    /* меняем title 
+     * если js включен - имена папок отображать необязательно...
+     * а может и обязательно при переходе, можно будет это сделать
+     */
+    var lTitle=document.getElementsByTagName('title');
+    if(lTitle.length>0)lTitle[0].innerText='Cloud Commander';
+    
+    /* загружаем jquery: */
+    CloudClient.jsload('//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js',function(){
+        /* сохраняем переменную jQuery себе в область видимости */
+        $=window.jQuery;
+        window.jQuery || CloudClient.jsload('jquery.min.js',
+            function(){
+               $=window.jQuery;
+            });
+    });
+    
+        /* загружаем общие функции для клиента и сервера*/
+        CloudClient.jsload('/cloudfunc.js',function(){
+        /* берём из обьекта window общий с сервером функционал */
+        CloudFunc=window.CloudFunc;
+            
+        /* меняем ссылки на ajax'овые*/
+        CloudClient._changeLinks(CloudFunc.LEFTPANEL);
+        CloudClient._changeLinks(CloudFunc.RIGHTPANEL);
+                
+        /* устанавливаем переменную доступности кэша*/
+        CloudClient.Cache.isAllowed();    
+        /* Устанавливаем кэш корневого каталога */    
+        if(!CloudClient.Cache.get('/'))CloudClient.Cache.set('/',CloudClient._getJSONfromFileTable());  
+        }
+    );                
+    
+    LoadingImage=CloudClient._images.loading();
+    /* загружаем иконку загрузки возле кнопки обновления дерева каталогов*/        
+    try{
+        document.getElementsByClassName('path')[0].getElementsByTagName('a')[0].appendChild(LoadingImage);
+        LoadingImage.className+=' hidden'; /* прячем её */
+    }catch(error){console.log(error);}
+    ErrorImage=CloudClient._images.error();      
+    
+    /* устанавливаем размер высоты таблицы файлов
+     * исходя из размеров разрешения экрана
+     */ 
+     
+    /* формируем и округляем высоту экрана
+     * при разрешениии 1024x1280:
+     * 658 -> 700
+     */                            
+    
+    var lHeight=window.screen.height - (window.screen.height/3).toFixed();
+    lHeight=(lHeight/100).toFixed()*100;
+     
+    var lFm=document.getElementById('fm');
+    if(lFm)lFm.style.cssText='height:' +
+        lHeight +
+        'px';        
+        
+    /* выделяем строку с первым файлом */
+    var lFmHeader=document.getElementsByClassName('fm_header');
+    if(lFmHeader && lFmHeader[0].nextSibling)
+        lFmHeader[0].nextSibling.className=CloudClient.CURRENT_FILE;
+    
+    /* показываем элементы, которые будут работать только, если есть js */
+    var lFM=document.getElementById('fm');
+    if(lFM)lFm.className='localstorage';
+    
+    /* если есть js - показываем правую панель*/
+    var lRight=document.getElementById('right');
+    if(lRight)lRight.className=lRight.className.replace('hidden','');
+    
+    //var lLeft=document.getElementById('left');
+    //lLeft.style.cssText='width:50%';
+    CloudClient.cssSet({id:'show_2panels',
+        element:document.head,
+        inner:'#left{width:50%;}'
+    });        
+});
+
+/* функция меняет ссыки на ajax-овые */
+CloudClient._changeLinks = function(pPanelID)
+{
+    /* назначаем кнопку очистить кэш и показываем её*/
+    var lClearcache=document.getElementById('clear-cache');
+    if(lClearcache)lClearcache.onclick=CloudClient.Cache.clear;    
+    
+    /* меняем ссылки на ajax-запросы */
+    var lPanel=document.getElementById(pPanelID);
+    var a=lPanel.getElementsByTagName('a');
+    
+      /* Если нажмут на кнопку перезагрузить страниц - её нужно будет обязательно
+     * перезагрузить
+     */
+    /* номер ссылки очистки кэша*/
+    //var lCLEARICON=0;
+    /* номер ссылки иконки обновления страницы */
+    var lREFRESHICON=0;
+        
+     /* путь в ссылке, который говорит
+      * что js отключен
+      */
+    var lNoJS_s = CloudFunc.NOJS; 
+    var lFS_s   = CloudFunc.FS;
+    
+    for(var i=0;i<a.length;i++)
+    {
+        //if(i===2){/*ставим рамку на первый с верху файл*/
+        //       a[i].parentElement.parentElement.className='current-file';
+        //    }
+        /* если ссылка на папку, а не файл */
+        if(a[i].target!='_blank')
+        {
+            /* убираем адрес хоста*/
+                var link='/'+a[i].href.replace(document.location.href,'');
+            /* убираем значения, которые говорят,
+             * об отсутствии js
+             */
+         
+            if(link.indexOf(lNoJS_s)===lFS_s.length){
+                link=link.replace(lNoJS_s,'');
+            }            
+            /* ставим загрузку гифа на клик*/
+            if(i===lREFRESHICON)
+                a[i].onclick=CloudClient._loadDir(link,true);
+            /* если мы попали на кнопку обновления структуры каталогов */
+            /*
+                if(a[i].className && a[i].className===CloudFunc.REFRESHICON)
+            */
+            /* устанавливаем обработчики на строку на одинарное и
+             * двойное нажатие на левую кнопку мышки
+             */
+            else{
+                try{
+                    a[i].parentElement.parentElement.onclick=CloudClient._setCurrent();
+                    a[i].parentElement.parentElement.ondblclick=CloudClient._loadDir(link);
+                }catch(error){console.log(error);}
+            }
+        }
+    }
+};
+
+/*
+ * Функция загружает json-данные о Файловой Системе
+ * через ajax-запрос.
+ * @path - каталог для чтения
+ * @pNeedRefresh - необходимость обновить данные о каталоге
+ */
+CloudClient._ajaxLoad=function(path, pNeedRefresh)
+{                           
+        /* Отображаем красивые пути */        
+        var lPath=path;
+        var lFS_s=CloudFunc.FS;
+        if(lPath.indexOf(lFS_s)===0){
+            lPath=lPath.replace(lFS_s,'');
+            if(lPath==='')lPath='/';
+        }
+        console.log ('reading dir: "'+lPath+'";');
+        
+         /* если доступен localStorage и
+         * в нём есть нужная нам директория -
+         * читаем данные с него и
+         * выходим
+         * если стоит поле обязательной перезагрузки - 
+         * перезагружаемся
+         */
+         
+         /* опредиляем в какой мы панели:
+          * правой или левой
+          */
+         var lPanel;
+         try{
+            lPanel=document.getElementsByClassName(CloudClient.CURRENT_FILE)[0].parentElement.id;
+         }catch(error){console.log("Current file not found\n"+error);}
+         
+        if(pNeedRefresh===undefined && lPanel){
+            var lJSON=CloudClient.Cache.get(lPath);
+            if (lJSON!==null){
+                /* переводим из текста в JSON */
+                if(window && !window.JSON){
+                    try{
+                        lJSON=eval('('+lJSON+')');
+                    }catch(err){
+                        console.log(err);
+                    }
+                }else lJSON=JSON.parse(lJSON);
+                CloudClient._createFileTable(lPanel,lJSON);
+                CloudClient._changeLinks(lPanel);
+                return;
+            }
+        }
+        
+        /* ######################## */
+        try{
+            $.ajax({
+                url: path,
+                error: function(jqXHR, textStatus, errorThrown){
+                    console.log(textStatus+' : '+errorThrown);
+                    var lLoading=document.getElementById('loading-image');
+                    ErrorImage.className='icon error';
+                    ErrorImage.title=errorThrown;
+                    lLoading.parentElement.appendChild(ErrorImage);
+                    lLoading.className='hidden';
+                    //document.getElementsByClassName('path')[0].appendChild(ErrorImage);
+                                        
+                },
+                success:function(data, textStatus, jqXHR){                                            
+                    /* если такой папки (или файла) нет
+                     * прячем загрузку и показываем ошибку
+                     */
+                    /* для совместимости с firefox меняем data
+                     * на jqXHR, он воспринимает data к Document
+                     * когда возвращаеться ошибка, о том, что
+                     * нет файла или нет доступа
+                     */
+                     
+                     var lLoading;
+                    if(!jqXHR.responseText.indexOf('Error:')){
+                        /* если файла не существует*/
+                        if(!jqXHR.responseText.indexOf('Error: ENOENT, ')){
+                            ErrorImage.title=jqXHR.responseText.replace('Error: ENOENT, n','N');
+                        }
+                        /* если не хватает прав для чтения файла*/
+                        else if(!jqXHR.responseText.indexOf('Error: EACCES,')){
+                            ErrorImage.title=jqXHR.responseText.replace('Error: EACCES, p','P');
+                        }
+                            ErrorImage.className='icon error';                                
+                            lLoading=document.getElementById('loading-image');
+                            lLoading.parentElement.appendChild(ErrorImage);
+                            lLoading.className='hidden';
+                            
+                            return;
+                    }                        
+                    CloudClient._createFileTable(lPanel,data);
+                    CloudClient._changeLinks(lPanel);
+                                                                
+                    /* Сохраняем структуру каталогов в localStorage,
+                     * если он поддерживаеться браузером
+                     */
+                    /* переводим таблицу файлов в строку, для
+                    * сохранения в localStorage
+                    */
+                    var lJSON_s=JSON.stringify(data);
+                    console.log(lJSON_s.length);
+                    
+                    /* если размер данных не очень бошьой
+                    * сохраняем их в кэше
+                    */
+                    if(lJSON_s.length<50000)
+                        CloudClient.Cache.set(lPath,lJSON_s);                        
+                }
+            });
+        }catch(err){console.log(err);}
+};
+
+/*
+ * Функция строит файловую таблицу
+ * @pEleme - родительский элемент
+ * @pJSON  - данные о файлах
+ */
+CloudClient._createFileTable = function(pElem,pJSON)
+{    
+    var lElem=document.getElementById(pElem);
+    /* говорим построителю,
+     * что бы он в нужный момент
+     * выделил строку с первым файлом
+     */
+    
+    /* очищаем панель */
+    var i = lElem.childNodes.length;
+    while(i--){
+        lElem.removeChild(lElem.lastChild);
+    }
+    /* заполняем панель новыми элементами */
+    
+    lElem.innerHTML=CloudFunc.buildFromJSON(pJSON,true);
+};
+
+/* 
+ * Функция создаёт элемент и
+ * загружает файл с src.
+ * @pName       - название тэга
+ * @pSrc        - путь к файлу
+ * @pFunc       - функци
+ * @pStyle      - стиль
+ * @pId         - id
+ * @pElement    - элемент, дочерним которо будет этот
+ */
+CloudClient._anyload = function(pName,pSrc,pFunc,pStyle,pId,pElement)
+{     
+    //если скрипт еще не загружен
+    /* убираем путь к файлу, оставляя только название файла */
+    var lID;
+    if(pId===undefined){
+        lID=pSrc.replace(pSrc.substr(pSrc,pSrc.lastIndexOf('/')+1),'');
+        /* убираем точку*/
+        lID=lID.replace('.','_');
+    }else lID=pId;
+    if(!document.getElementById(lID))
+    {
+        var element = document.createElement(pName);
+        element.src = pSrc;
+        element.id=lID;
+        if(arguments.length>=3){
+            element.onload=pFunc;
+            if(arguments.length>=4){
+                element.style.cssText=pStyle;
+            }
+        }        
+        //document.body
+        pElement.appendChild(element);    
+        return element;//'elem '+src+' loaded';
+    }
+    /* если js-файл уже загружен 
+     * запускаем функцию onload
+     */
+    else if(pFunc){
+        try{
+            pFunc();
+        }catch(error){console.log(error);}
+    }
+};
+
+/* Функция загружает js-файл */
+CloudClient.jsload = function(pSrc,pFunc,pStyle,pId)
+{
+    CloudClient._anyload('script',pSrc,pFunc,pStyle,pId,document.body);
+};
+/* Функция создаёт елемент style и записывает туда стили 
+ * @pParams_o - структура параметров, заполняеться таким
+ * образом: {src: ' ',func: '', id: '', element: '', inner: ''}
+ * все параметры опциональны
+ */
+CloudClient.cssSet = function(pParams_o){
+    var lElem=CloudClient._anyload('style',
+        pParams_o.src,
+        pParams_o.func,
+        pParams_o.style,
+        pParams_o.id,
+        pParams_o.element?pParams_o.element:document.body);
+    lElem.innerText=pParams_o.inner;
+};
+
+/* 
+ * Функция генерирует JSON из html-таблицы файлов 
+ */
+/* 
+ * Используеться при первом заходе в корень
+ */
+CloudClient._getJSONfromFileTable=function()
+{
+    var lLeft=document.getElementById('left');
+    
+    
+    //var lPath=document.getElementById('path').innerText;
+    var lPath=document.getElementsByClassName('path')[0].innerText;
+    var lFileTable=[{path:lPath,size:'dir'}];
+    var lLI=lLeft.getElementsByTagName('li');
+    
+    var j=1;/* счётчик реальных файлов */
+    var i=1;/* счётчик элементов файлов в DOM */
+    /* Если путь отличный от корневного
+     * второй элемент li - это ссылка на верхний
+     * каталог '..'
+     */
+    i=2;/* пропускам Path и Header*/
+
+    
+    for(;i<lLI.length;i++)
+    {
+        var lIsDir=lLI[i].getElementsByClassName('mini-icon')[0]
+        .className.replace('mini-icon ','')==='directory'?true:false;
+        
+        var lName=lLI[i].getElementsByClassName('name')[0].innerText;
+        /* если это папка - выводим слово dir вместо размера*/
+        var lSize=lIsDir?'dir':lLI[i].getElementsByClassName('size')[0].innerText;
+        var lMode=lLI[i].getElementsByClassName('mode')[0].innerText;
+        /* переводим права доступа в цыфровой вид
+         * для хранения в localStorage
+         */
+        lMode=CloudFunc.convertPermissionsToNumberic(lMode);
+        
+        lFileTable[j++]={
+            name:lName,
+            size:lSize,
+            mode:lMode
+        };
+    }
+    return JSON.stringify(lFileTable);
+};
+
+
+   /* если нет функции поиска по класам,
+     * а её нет в IE,
+     * - используем jquery
+     * при необходимости
+     * можна заменить на любой другой код
+     */ 
+ if(!document.getElementsByClassName){
+     CloudClient.jsload('//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js',function(){
+        /* сохраняем переменную jQuery себе в область видимости */
+        document.getElementsByClassName=function(pClassName){
+            return $('.'+pClassName)[0];
+        };
+        $=window.jQuery;
+        window.jQuery || CloudClient.jsload('jquery.min.js',
+            function(){
+               $=window.jQuery;
+               document.getElementsByClassName=function(pClassName){
+                    return $('.'+pClassName)[0];
+                };
+            });
+        });
+}
+
+return CloudClient;
+});//(this,this.document);
+try{
+    var Commander;
+    window.onload=function(){
+        'use strict';
+        Commander=new CloudCommander();
+        /* базовая инициализация*/
+        Commander.init();
+        /* привязываем клавиши к функциям */
+        Commander.keyBinding();
+    };
+}
+catch(err){}
\ No newline at end of file
diff --git a/cloudfunc.js b/cloudfunc.js
new file mode 100644
index 00000000..635016f7
--- /dev/null
+++ b/cloudfunc.js
@@ -0,0 +1,511 @@
+/* Модуль, содержащий функции, которые будут работать 
+ * и на клиенте и на сервере 
+ * 
+ * Привала названий:
+ * varName     - имя функции
+ * lVarName    - имя локальной переменной
+ * pVarName    - имя параметра
+ * fVarName    - имя функции созданной внутри функции
+ * VARNAME     - имя константы
+ *
+ * Типы переменных:
+ * varNameS - строка
+ * varNameN - число
+ * varNameO - обьект
+ * varNameM - массив
+ */
+
+var CloudFunc={
+    /* Путь с которым мы сейчас работаем */
+    Path    :'',
+    /* КОНСТАНТЫ (общие для клиента и сервера)*/
+    /* название программы */
+    NAME    :'Cloud Commander',
+    /* если в ссылке будет эта строка - 
+     * в браузере js отключен
+     */
+    NOJS        : '/no-js',
+    FS          : '/c/f/s',
+    /* название css-класа кнопки обновления файловой структуры*/
+    REFRESHICON : 'refresh-icon',
+    /* id панелей с файлами */
+    LEFTPANEL   : 'left',
+    RIGHTPANEL  : 'right'
+};
+
+/*
+ * Функция убирает последний слеш,
+ * если он - последний символ строки
+ */
+CloudFunc.removeLastSlash = function(pPath){
+    if(typeof pPath==='string')
+        return (pPath.lastIndexOf('/')===pPath.length-1)?
+            pPath.substr(pPath, pPath.length-1):pPath;
+    else return pPath;
+}; 
+/*
+ * Функция меняет код символа пробела на пробел
+ * в переданной строке
+ * @pPath - строка
+ */
+CloudFunc.replaceSpaces = function(pPath){
+    if(pPath.indexOf('%20')>0){
+        do{
+            pPath=pPath.replace('%20',' ');
+        }while(pPath.indexOf('%20')>0);
+    }
+    return pPath;
+};
+
+/* Функция возвращает заголовок веб страницы */
+CloudFunc.setTitle = function(){
+    
+    return CloudFunc.Path===''?CloudFunc.NAME:
+        CloudFunc.Path +
+        ' - ' + 
+        CloudFunc.NAME;
+};
+/* Функция переводит права из цыфрового вида в символьный 
+ * @pPerm_s - строка с правами доступа
+ * к файлу в 8-миричной системе
+ */
+CloudFunc.convertPermissionsToSymbolic= function(pPerm_s){
+    /*
+        S_IRUSR   0000400   protection: readable by owner
+        S_IWUSR   0000200   writable by owner
+        S_IXUSR   0000100   executable by owner
+        S_IRGRP   0000040   readable by group
+        S_IWGRP   0000020   writable by group
+        S_IXGRP   0000010   executable by group
+        S_IROTH   0000004   readable by all
+        S_IWOTH   0000002   writable by all
+        S_IXOTH   0000001   executable by all
+    */
+    if(pPerm_s===undefined) return;
+    
+    /* тип файла */
+    var lType=pPerm_s.charAt(0);
+    
+    switch (lType-0) {
+        case 1: /* обычный файл */
+            lType='-';
+            break;
+        case 2: /* байт-ориентированное (символьное) устройство*/
+            lType='c';
+            break;
+        case 4: /* каталог */
+            lType='d';
+            break;            
+        default:
+            lType='-';
+    }
+    
+    /* оставляем последние 3 символа*/
+    pPerm_s=pPerm_s.length>5?pPerm_s.substr(3):pPerm_s.substr(2);        
+    
+    /* Рекомендации гугла советуют вместо string[3]
+     * использовать string.charAt(3)
+     */
+/*    
+    http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml?showone=Standards_features#Standards_features
+    
+    Always preferred over non-standards featuresFor
+    maximum portability and compatibility, always 
+    prefer standards features over non-standards 
+    features (e.g., string.charAt(3) over string[3]
+    and element access with DOM functions instead
+    of using an application-specific shorthand).
+*/
+    /* Переводим в двоичную систему */
+    var lOwner=(pPerm_s[0]-0).toString(2);
+    var lGroup=(pPerm_s[1]-0).toString(2);
+    var lAll  =(pPerm_s[2]-0).toString(2);
+    /*
+        console.log(lOwner+' '+lGroup+' '+lAll);
+    */
+    /* переводим в символьную систему*/
+    var lPermissions=//lType+' '+
+                     (lOwner[0]-0>0?'r':'-')+
+                     (lOwner[1]-0>0?'w':'-')+
+                     (lOwner[2]-0>0?'x':'-')+
+                     ' '                    +
+                     (lGroup[0]-0>0?'r':'-')+
+                     (lGroup[1]-0>0?'w':'-')+
+                     (lGroup[2]-0>0?'x':'-')+
+                     ' '                    +
+                     (lAll[0]-0>0?'r':'-')+
+                     (lAll[1]-0>0?'w':'-')+
+                     (lAll[2]-0>0?'x':'-');
+    /*
+        console.log(lPermissions);
+    */
+    return lPermissions;
+}
+
+/* Функция конвертирует права доступа к файлам из символьного вида
+ * в цыфровой
+ */
+CloudFunc.convertPermissionsToNumberic= function(pPerm_s){
+    /* если передана правильная строка, конвертированная
+     * функциец convertPermissionsToSymbolic
+     */     
+    if(!pPerm_s || pPerm_s.length!==11)return pPerm_s;
+    
+    var lOwner= (pPerm_s[0]==='r'?4:0) +
+                (pPerm_s[1]==='w'?2:0) +
+                (pPerm_s[2]==='x'?1:0);
+    var lGroup= (pPerm_s[4]==='r'?4:0) +
+                (pPerm_s[5]==='w'?2:0) +
+                (pPerm_s[6]==='x'?1:0);
+    var lAll  = (pPerm_s[8]==='r'?4:0) +
+                (pPerm_s[9]==='w'?2:0) +
+                (pPerm_s[10]==='x'?1:0);
+    /* добавляем 2 цыфры до 5 */
+    return '00'+lOwner+lGroup+lAll;
+}
+/* Функция получает короткие размеры
+ * конвертируя байт в килобайты, мегабойты,
+ * гигайбайты и терабайты
+ * @pSize - размер в байтах
+ */
+CloudFunc.getShortedSize=function(pSize){
+    /* Константі размеров, что используются
+     * внутри функции
+     */
+    var l1BMAX=1024;
+    var l1KBMAX=1048576;
+    var l1MBMAX=1073741824;
+    var l1GBMAX=1099511627776;
+    var l1TBMAX=1125899906842624;
+    
+    var lShorted;
+    
+    if(pSize<l1BMAX)lShorted=pSize+'b';
+    else if(pSize<l1KBMAX)lShorted=(pSize/l1BMAX) .toFixed(2)+'kb'
+    else if(pSize<l1MBMAX)lShorted=(pSize/l1KBMAX).toFixed(2)+'mb'
+    else if(pSize<l1GBMAX)lShorted=(pSize/l1MBMAX).toFixed(2)+'gb'
+    else if(pSize<l1TBMAX)lShorted=(pSize/l1GBMAX).toFixed(2)+'tb'
+    return lShorted;
+}
+
+/* Функция парсит uid и имена пользователей
+ * из переданного в строке вычитаного файла /etc/passwd
+ * и возвращает массив обьектов имён и uid пользователей
+ * @pPasswd_s - строка, в которой находиться файл /etc/passwd
+ */
+CloudFunc.getUserUIDsAndNames=function(pPasswd_s){
+    var lUsers={name:'',uid:''};
+    var lUsersData=[];
+    var i=0;
+    do{
+        /* получаем первую строку */        
+        var lLine=pPasswd_s.substr(pPasswd_s,pPasswd_s.indexOf('\n')+1);
+        if(lLine){
+        /* удаляем первую строку из /etc/passwd*/
+        pPasswd_s=pPasswd_s.replace(lLine,'');
+        /* получаем первое слово строки */
+        var lName=lLine.substr(lLine,lLine.indexOf(':'));
+        lLine=lLine.replace(lName+':x:','');
+        /* получаем uid*/
+        var lUID=lLine.substr(lLine,lLine.indexOf(':'));
+        if((lUID-0).toString()!=='NaN'){
+            lUsers.name=lName;
+            lUsers.uid=lUID;
+            lUsersData[i++]=lUsers;
+            console.log('uid='+lUID+' name='+lName);
+        }
+        }
+    }while(pPasswd_s!=='');
+    
+    return lUsersData;
+}
+/* Функция получает адреса каждого каталога в пути
+ * возвращаеться массив каталогов
+ * @url -  адрес каталога
+ */
+CloudFunc._getDirPath=function(url)
+{
+    var folders=new Array();
+    var i=0;
+    do{
+        folders[i++]=url; url=url.substr(url,url.lastIndexOf('/'));
+    }while(url!='');
+    
+    /* сохраяем адрес предыдущего каталога */
+    /*
+        if(i>2){
+            if(folders[0].lastIndexOf('/')===folders[0].length)
+                LPrevDir=folders[1];
+            else LPrevDir=folders[2];
+        }else LPrevDir='/';
+    */
+    /* ################################### */
+        
+    /* Формируем ссылки на каждый каталог в пути */
+    var lHref='<a class=links href=';
+    var lTitle=' title=';
+    var _l='>';
+    var lHrefEnd='</a>';
+    
+    var lHtmlPath;
+    /* путь в ссылке, который говорит
+     * что js отключен
+     */
+    var lNoJS_s=CloudFunc.NOJS;
+    var lFS_s=CloudFunc.FS;
+    /* корневой каталог */
+    lHtmlPath=lHref+lFS_s+lNoJS_s+lTitle+'"/"'+_l+'/'+lHrefEnd;
+    for(i=folders.length-1;i>0;i--)
+    {
+        var lUrl=folders[i];
+        var lShortName=lUrl.replace(lUrl.substr(lUrl,lUrl.lastIndexOf('/')+1),'');        
+        if(i!=1)
+        {
+            lHtmlPath+=lHref+lFS_s+lNoJS_s+lUrl+lTitle+lUrl+_l+lShortName+lHrefEnd+'/';            
+        }
+        else
+            lHtmlPath+=lShortName+'/';
+    }
+    /* *** */
+    return lHtmlPath;    
+}
+
+/*
+ * Функция ищет в имени файла расширение
+ * и если находит возвращает true
+ * @pName - получает имя файла
+ * @pExt - расширение
+ */
+CloudFunc.checkExtension=function(pName,pExt)
+{
+    /* если длина имени больше
+     * длинны расширения - 
+     * имеет смысл продолжать
+     */
+    if(pName.length>pExt.length){
+        var lLength=pName.length;           /* длина имени*/
+        var lExtNum=pName.lastIndexOf(pExt);/* последнее вхождение расширения*/
+        var lExtSub=lLength-lExtNum;        /* длина расширения*/
+        /* если pExt - расширение pName */
+        if(lExtSub===pExt.length)
+            return true;
+        else
+            return false;
+    }
+    else return false;
+}
+
+/*
+ * Функция формирует заголовки столбиков
+ * @pFileTableTitles - массив названий столбиков
+ */
+CloudFunc._getFileTableHeader=function(pFileTableTitles)
+{
+    var lHeader='<li class=fm_header>';
+    lHeader+='<span class=mini-icon></span>';
+    for(var i=0;i<pFileTableTitles.length;i++)
+    {
+        var lStr=pFileTableTitles[i];
+        lHeader+='<span class='+lStr+'>'+
+                    lStr+
+                '</span>';
+    }
+    lHeader+='</li>';
+    
+    return lHeader;
+}
+
+/*
+ * Функция строит таблицу файлв из JSON-информации о файлах
+ * @pJSON           - информация о файлах 
+ * @pKeyBinded      - если клавиши назначены, выделяем верхний файл
+ * [{path:'путь',size:'dir'},
+ * {name:'имя',size:'размер',mode:'права доступа'}]
+ */
+CloudFunc.buildFromJSON=function(pJSON,pKeyBinded)
+{
+    var files;
+    /*
+     * если пропарсить стандартными
+     * функциями нельзя - 
+     * пробуем eval,
+     */
+    /* 
+     * Если мы на клиенте и нет JSON -
+     * через eval парсим.
+     * Если-же мы на сервере,
+     * или на клиенте всё есть
+     * парсим стандарным методом
+     */
+    
+    /* По скольку мы прописали заголовок application/json
+     * нет необходимости его конвертировать,
+     * но она есть, если мы вытягиваем данные из
+     * localStorage
+     */
+     /*
+            if(typeof pJSON==='string'){
+                if(window && !window.JSON){
+                    try{
+                        files=eval('('+pJSON+')');
+                    }catch(err){
+                        console.log(err);
+                    }
+                }
+                else files=JSON.parse(pJSON);
+            }else 
+    */
+        files=pJSON;
+     /* сохраняем путь каталога в котором мы сейчас находимся*/
+    var lPath=files[0].path;
+    
+    /* сохраняем путь */
+    CloudFunc.Path=lPath;
+    
+    /* 
+     * Строим путь каталога в котором мы находимся
+     * со всеми подкаталогами
+     */    
+    var lHtmlPath=CloudFunc._getDirPath(lPath);
+            
+    /* Убираем последний слэш
+     * с пути для кнопки обновить страницу
+     * если он есть
+     */
+    var lRefreshPath=CloudFunc.removeLastSlash(lPath);
+    
+    /* путь в ссылке, который говорит
+     * что js отключен
+     */
+    var lNoJS_s=CloudFunc.NOJS;
+    var lFS_s=CloudFunc.FS;
+    
+    var lFileTable='<li class=path>'+
+        '<span class="path_icon clear-cache" id=clear-cache title="clear cache (Ctrl+D)"></span>'+
+        '<a href="'+lFS_s+lNoJS_s+lRefreshPath+'">'+
+            '<span class="path_icon ' + CloudFunc.REFRESHICON + '"' +
+                ' title="refresh (Ctrl+R)">'                  +
+            '</span>'+
+        '</a>'+
+        '<span>'+lHtmlPath+'</span>'+
+        '</li>';
+    
+    var fileTableTitles=['name','size','owner','mode'];
+    lFileTable+=CloudFunc._getFileTableHeader(fileTableTitles);
+    /* Если мы не в корне */
+    if(lPath!=='/'){    
+        /* ссылка на верхний каталог*/        
+        var lDotDot;                        
+        /* убираем последний слеш и каталог в котором мы сейчас находимся*/
+        lDotDot=lPath.substr(lPath,lPath.lastIndexOf('/'));
+        lDotDot=lDotDot.substr(lDotDot,lDotDot.lastIndexOf('/'));
+        /* Если предыдущий каталог корневой */
+        if(lDotDot==='')lDotDot='/';
+        
+        /* Сохраняем путь к каталогу верхнего уровня*/
+        lFileTable += '<li class=current-file>'+
+                                '<span class="mini-icon directory">' +
+                                '</span>'                            +
+                                '<span class=name>'                  +
+                                    '<a href="'+lFS_s+lNoJS_s        +
+                                    lDotDot                          +
+                                    '">'+"..</a>"                    +
+                                '</span>'                            +                                
+                                '<span class=size>&lt;dir&gt;</span>'+
+                                '<span class=owner>.</span>'         +
+                                '<span class=mode></span>'           +
+                                '</li>';        
+    }
+    var lLength=files.length;
+    
+    for(var i=1;i<lLength;i++){    
+        lFileTable +='<li class>';
+        lFileTable += '<span class="mini-icon ';
+        /* если папка - выводим другую иконку */
+        lFileTable += (files[i].size==='dir'?
+                        'directory':'text-file')                    +
+                        '">';
+        lFileTable +='</span>';
+        lFileTable +='<span class=name>'                            +
+                        '<a href="'+lFS_s+lNoJS_s                      +
+                        lPath+files[i].name                         +
+                        '"'                                         +
+                        /* открываем файлы */
+                        /*в новой вкладке  */
+                      (files[i].size==='dir'?'': ' target="_blank"')+                      
+                        /* если длина имени файла больше 16 символов
+                         * отрезаем лишнее, оставляя лишь 16,
+                         * и добавляем две точки и тайтл
+                         */
+                        (files[i].name.length>16?
+                        ' title="'+files[i].name+'">'                +
+                        files[i].name.substr(
+                            files[i].name,16)+
+                        '..':'>'+files[i].name)                      +
+                        "</a>"                                       +
+                    '</span>';
+        /* если папка - не выводим размер */
+        lFileTable +='<span class=size>'                             +
+                        (files[i].size==='dir'?
+                            '&lt;dir&gt;':
+                            /* если это файл - получаем
+                             * короткий размер
+                             */
+                            CloudFunc.getShortedSize(
+                            files[i].size));
+        lFileTable +='</span>'                                       +
+                        '<span class=owner>'                         +
+                        (!files[i].uid?'root':files[i].uid)          +
+                        '</span>'                                    +
+                        '<span class=mode>'                          +
+                        /* конвертируем названия разрешений
+                         * из числового формата в буквенный
+                         * при этом корневой каталог не трогаем
+                         * по скольку в нём и так всё уже
+                         * установлено еще на сервере
+                         */
+                        (//lPath==='/'?files[i].mode:
+                        CloudFunc.convertPermissionsToSymbolic(files[i].mode)) +
+                        '</span>';
+        lFileTable +='</li>';            
+    }
+    
+    /* если клавиши назначены и
+     * мы в корневом каталоге и
+     * верхний файл еще не выделен -
+     * выделяем верхний файл
+     */
+    if(pKeyBinded && lPath==='/'&&
+        lFileTable.indexOf('<li class=current-file>')<0){
+            lFileTable=lFileTable.replace('<li class>','<li class=current-file>');
+    }
+
+    
+    
+    return lFileTable;
+}
+
+/*
+ * Если мы на стороне сервера -
+ * прописываем экспортируемые функции
+ */
+try{
+    if(exports){
+        /* экспортируемые функции */        
+        exports.checkExtension      = CloudFunc.checkExtension;
+        exports.buildFromJSON       = CloudFunc.buildFromJSON;
+        exports.replaceSpaces       = CloudFunc.replaceSpaces;        
+        exports.setTitle            = CloudFunc.setTitle;
+        exports.convertPermissions  = CloudFunc.convertPermissions;
+        exports.getUserUIDsAndNames = CloudFunc.getUserUIDsAndNames;
+        
+        /* константы*/
+        exports.Name                = CloudFunc.NAME;
+        exports.NOJS                = CloudFunc.NOJS;
+        exports.FS                  =CloudFunc.FS;
+        
+        console.log('cloudfunc.js loaded...');
+    }
+}catch(err){
+        /* если мы на клиенте */
+}
\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 00000000..f304772f
--- /dev/null
+++ b/index.html
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8">
+        <!-- moblie first design -->
+        <meta content="width=device-width,initial-scale=1" name="viewport" />
+        <title>Cloud Commander</title>
+        
+        <!--
+        <link rel="stylesheet" type="text/css" href="http://dl.dropbox.com/u/74212301/mnemonia/css/reset.css">
+                <link rel="stylesheet" type="text/css" href="http://rastacoding.kodingen.com/online/header/css/button.css">
+        -->
+        <link rel="stylesheet" href="/reset.css">
+        <link rel="stylesheet" href="/style.css">        
+        <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Droid+Sans+Mono">        
+        <!--
+                <script async src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
+        <script async src=http://dl.dropbox.com/u/74212301/mnemonia/js/prefixfree.min.js></script>                
+        <script async src="//modernizr.com/downloads/modernizr-2.5.3.js"></script>
+                    <script async src="http://dl.dropbox.com/u/78163899/mnemonia/js/css3-mediaqueries.js"></script>
+                    <script async src="dist/html5shiv.js"></script>
+        -->
+        <!--[if lt IE 9]>
+        <![endif]-->        
+    </head>
+    <body>
+    <!--
+        <input placeholder=bin style="width:100%;position:relative;top:-1px">
+    -->
+    <!--
+        http://gtmetrix.com/reports/cloudcmd.cloudfoundry.com/b8hQTONq
+    -->
+    <a class="yellow hidden">Cloud Commander</a>
+    <ul class="menu hidden">
+        <li>
+            <!-- http://css-tricks.com/examples/IconFont/ -->
+            <a href=settings onclick="return false;">
+                <span class="menu_icon settings hidden"></span>
+            </a>
+            <a href=refresh onclick="return false;">
+                <span class="menu_icon refresh" id=refresh></span>
+            </a>
+        </li>
+    </ul>
+    <div id=fm class=no-js>
+    </div>
+    <div id=keyspanel class=hidden>
+    <button>F1 - help</button>
+    <button>F2 - rename</button>
+    <button>F3 - view</button>
+    <button>F4 - edit</button>
+    <button>F5 - copy</button>
+    <button>F6 - move</button>
+    <button>F7 - make dir</button>
+    <button>F8 - remove</button>
+    </div>
+    <script src=/client.js></script>
+    </body>
+</html>
\ No newline at end of file
diff --git a/minify.js b/minify.js
new file mode 100644
index 00000000..3b8b8abd
--- /dev/null
+++ b/minify.js
@@ -0,0 +1,81 @@
+/* Модуль сжатия js-скриптов*/
+/*
+    https://github.com/GoalSmashers/clean-css
+*/
+exports.jsScripts=jsScripts;
+
+function jsScripts(){
+    'use strict';    
+    
+    /* подключаем модуль uglify-js
+     * если его нет - дальнейшая 
+     * работа модуля не имеет смысла
+     */
+    try{
+        var jsp = require("uglify-js").parser;
+        var pro = require("uglify-js").uglify;
+    }catch(error){
+        return console.log('ERROR. error loading minificatoin js\n' +
+            'to use minification you need to install uglify-js\n'   +
+                'npm install uglify-js\n'                           +
+                'https://github.com/mishoo/UglifyJS\n'              +
+                error);
+    }
+    
+    var fs = require('fs');
+    
+    /* Константы */
+    var CLIENT_JS='client.js';
+    var CLOUDFUNC_JS='cloudfunc.js';
+    
+    console.log('reading file ' + CLIENT_JS+'...');
+    fs.readFile(CLIENT_JS,fileReaded(CLIENT_JS));
+    
+    console.log('reading file ' + CLOUDFUNC_JS+'...');
+    fs.readFile(CLOUDFUNC_JS,fileReaded(CLOUDFUNC_JS));
+    
+    /* Функция создаёт асинхроную версию 
+     * для чтения файла
+     * @pFileName - имя считываемого файла
+     */
+    function fileReaded(pFileName){
+        return function(error,data){
+            /* функция в которую мы попадаем,
+             * если данные считались
+             */
+            var dataReaded=function(){
+                console.log('file ' + pFileName + ' readed');
+                
+                /*********************************/
+                /* сжимаем код через uglify-js */
+                var orig_code = data.toString();
+                var ast = jsp.parse(orig_code); // parse code and get the initial AST
+                ast = pro.ast_mangle(ast); // get a new AST with mangled names
+                ast = pro.ast_squeeze(ast); // get an AST with compression optimizations
+                var final_code = pro.gen_code(ast); // compressed code here
+                /*********************************/
+                
+                var minFileName=pFileName.replace('.js','.min.js');
+                /* если мы сжимаем client.js -
+                 * меняем строку cloudfunc.js на
+                 * cloudfunc.min.js и выводим сообщение
+                 * если другой файл - ничего не деалем
+                 */
+                (pFileName===CLIENT_JS)?
+                    console.log('file name of '+CLOUDFUNC_JS+' in '+CLIENT_JS+' changed. size:',
+                        (final_code=final_code.replace(CLOUDFUNC_JS,
+                            CLOUDFUNC_JS.replace('.js',
+                                '.min.js'))).length):
+                    '';
+                var fileWrited=function(error){
+                    console.log(error?error:('file '+minFileName+' writed...'));
+                };
+                
+                /* записываем сжатый js-скрипт*/
+                fs.writeFile(minFileName, final_code, fileWrited);
+            };
+            
+            error?console.log(error):dataReaded();
+        };
+    }
+};
\ No newline at end of file
diff --git a/reset.css b/reset.css
new file mode 100644
index 00000000..4dd740d9
--- /dev/null
+++ b/reset.css
@@ -0,0 +1,115 @@
+/*
+ * HTML5 Boilerplate
+ *
+ * What follows is the result of much research on cross-browser styling.
+ * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
+ * Kroc Camen, and the H5BP dev community and team.
+ *
+ * Detailed information about this CSS: h5bp.com/css
+ *
+ * ==|== normalize ==========================================================
+ */
+
+
+/* =============================================================================
+   HTML5 display definitions
+   ========================================================================== */
+
+/*
+article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
+audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
+audio:not([controls]) { display: none; }
+[hidden] { display: none; }
+*/
+
+/* =============================================================================
+   Base
+   ========================================================================== */
+
+/*
+ * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
+ * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
+ */
+
+html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-family: sans-serif; color: #222;}
+body { margin: 0; font-size: 1em; line-height: 1.4; }
+
+/*
+ * Remove text-shadow in selection highlight: h5bp.com/i
+ * These selection declarations have to be separate
+ * Also: hot pink! (or customize the background color to match your design)
+ */
+/*
+::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
+    ::selection { background: #fe57a1; color: #fff; text-shadow: none; }
+*/
+::selection { text-shadow: none; opacity: 0;}
+
+
+/* =============================================================================
+   Links
+   ========================================================================== */
+
+a {text-decoration:none; color: #00e; }
+a:visited { color: #551a8b; }
+a:hover { color: #06e; }
+a:focus { outline: thin dotted; }
+
+/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
+a:hover, a:active { outline: 0; }
+
+ul{ margin: 1em 0; padding: 0 0 0 40px; }
+
+/*
+ * 1. Display hand cursor for clickable form elements
+ * 2. Allow styling of clickable form elements in iOS
+ * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
+ */
+
+
+/* =============================================================================
+   Chrome Frame Prompt
+   ========================================================================== */
+
+.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }
+
+
+/* ==|== non-semantic helper classes ========================================
+   Please define your styles before this section.
+   ========================================================================== */
+
+/* For image replacement */
+.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
+.ir br { display: none; }
+
+/* Hide from both screenreaders and browsers: h5bp.com/u */
+.hidden { display: none !important; visibility: hidden; }
+
+/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
+.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
+
+/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
+.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
+
+/* Hide visually and from screenreaders, but maintain layout */
+.invisible { visibility: hidden; }
+
+/* Contain floats: h5bp.com/q */
+.clearfix:before, .clearfix:after { content: ""; display: table; }
+.clearfix:after { clear: both; }
+.clearfix { *zoom: 1; }
+
+
+
+/* ==|== print styles =======================================================
+   Print styles.
+   Inlined to avoid required HTTP connection: h5bp.com/r
+   ========================================================================== */
+
+@media print {
+  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
+  a, a:visited { text-decoration: underline; }
+  a[href]:after { content: " (" attr(href) ")"; } 
+  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
+  @page { margin: 0.5cm; }
+}
\ No newline at end of file
diff --git a/server.js b/server.js
new file mode 100644
index 00000000..15883734
--- /dev/null
+++ b/server.js
@@ -0,0 +1,562 @@
+"use strict";
+
+/* Обьект содержащий все функции и переменные 
+ * серверной части Cloud Commander'а
+ */
+var CloudServer={
+    /* функция, которая генерирует заголовки
+     * файлов, отправляемые сервером клиенту
+     */
+    generateHeaders :function(){},
+    /* функция высылает
+     * данные клиенту
+     */
+    sendResponse        :function(){},
+    /* Структура содержащая функции,
+     * и переменные, в которых
+     * говориться о поддерживаемых
+     * браузером технологиях
+     */
+    BrowserSuport   :{},
+     /* Обьект для работы с кэшем */
+    Cashe                   :{},
+    /* Обьект через который
+     * выполняеться сжатие
+     * скриптов и стилей
+     */
+    Minify                  :{},
+    /* Асоциативный масив обьектов для
+     * работы с ответами сервера
+     * высылаемыми на запрос о файле и
+     * хранащий информацию в виде
+     * Responces[name]=responce;
+     */
+    Responses               :{},
+    
+    /* ПЕРЕМЕННЫЕ */
+    /* Поддержка браузером JS*/
+    NoJS            :true,
+    /* обьект содержит данные
+     * о необходимости сжатия
+     * данных и скриптов
+     */
+    Minimize        :{
+        scriptSize:false,
+        styleSize:false
+    },
+    /* Поддержка gzip-сжатия
+     * браузером
+     */
+    Gzip            :undefined,
+    
+    /* КОНСТАНТЫ */
+    /* index.html */
+    INDEX           :'index.html'
+};
+
+/* 
+ * Обьект для работы с кэшем
+ * аналог клиентского обьекта
+ * с тем отличием, что в нём
+ * будут храниться серверные
+ * данные, такие как файлы
+ * отдаваемые клиенту
+ * (файлы проэкта по большому
+ * счёту, для ускорения
+ * первичной загрузки)
+ */
+CloudServer.Cache={
+    _allowed            :true,     /* приватный переключатель возможности работы с кэшем */
+    /* данные в которых храняться файлы 
+     * в формате <поле> : <значение>
+     * _data[name]=pData;
+     * одному имени соответствуют 
+     * одни данные
+     */
+    _data               :{},
+    
+    /* функция говорит можно ли работать с кэшем */
+    isAllowed           :(function(){
+        return CloudServer.Cache._allowed;
+        }),
+    /* функция устанавливает возможность работать с кэшем */
+    setAllowed          :(function(pAllowed){
+       CloudServer.Cache._allowed=pAllowed;
+    }),
+    /* Если доступен кэш
+     * сохраняем в него данные
+     */
+    set                  :(function(pName, pData){
+        if(CloudServer.Cache._allowed && pName && pData){
+           CloudServer.Cache._data[pName]=pData;
+        }
+    }),
+    /* Если доступен Cache принимаем из него данные*/
+    get                 :(function(pName){
+        if(CloudServer.Cache._allowed && pName){
+            return CloudServer.Cache._data[pName];
+        }
+        else return null;
+    }),
+    
+    /* Функция очищает кэш*/
+    clear               :(function(){
+        if(CloudServer.Cache._allowed){
+            CloudServer.Cache._data={};
+        }
+    })
+};
+
+/* Обьект для сжатия скриптов и стилей
+ */
+CloudServer.Minify={
+    scripts : function(){
+        if(CloudServer.Minimize.scriptSize){
+            var lMinify      = require('./minify');
+            lMinify.jsScripts();
+        }
+    }
+};
+
+//var DirContent;
+var LeftDir='/';
+var RightDir=LeftDir;
+//var LPrevDir;
+//var RPrevDir;
+
+var Fs      = require('fs');    /* модуль для работы с файловой системой*/
+var Path    = require('path');   /* модуль для работы с путями*/
+var Zlib    = require('zlib');  /* модуль для сжатия данных gzip-ом*/
+var CloudFunc=CloudServer.Minimize.scripts?/* если стоит минификация*/
+        require('./cloudfunc.min'):/* добавляем сжатый - иначе обычный */
+        require('./cloudfunc'); /* модуль с функциями */
+
+
+/* конструктор*/
+CloudServer.init=(function(){
+    /* Переменная в которой храниться кэш*/
+    CloudServer.Cache.setAllowed(false);
+    CloudServer.Minimize.scriptSize=false;
+    /* Если нужно минимизируем скрипты */
+    CloudServer.Minify.scripts();
+});
+
+
+/* создаём сервер на порту 31337*/
+CloudServer.start=function()
+{
+    CloudServer.init();
+    
+    var http = require('http');    
+    http.createServer(CloudServer._controller).listen(process.env.PORT ||
+        process.env.VCAP_APP_PORT /* cloudfoundry */      ||
+        31337,
+        '0.0.0.0' || '127.0.0.1');
+    console.log('Cloud Commander server running at http://127.0.0.1:'+
+        (process.env.PORT===undefined?31337:process.env.PORT));
+};
+
+
+/* Функция создаёт заголовки файлов
+ * в зависимости от расширения файла
+ * перед отправкой их клиенту
+ * @pName - имя файла
+ * @pGzip - данные сжаты gzip'ом
+ */
+CloudServer.generateHeaders = function(pName, pGzip){
+    var lType='';
+    /* высылаем заголовок в зависимости от типа файла */
+    /* если расширение у файла css -
+     * загружаем стили
+     */
+    if(CloudFunc.checkExtension(pName,'css'))
+        lType='text/css';
+    /* загружаем js */
+    else if(CloudFunc.checkExtension(pName,'js'))
+        lType='text/javascript';
+    /* загружаем картинки*/
+    else if(CloudFunc.checkExtension(pName,'png'))
+        lType='img/png';
+    /* загружаем json*/
+    else if(CloudFunc.checkExtension(pName,'json'))
+        lType='application/json';
+    else if(CloudFunc.checkExtension(pName,'html'))
+        lType='text/html';
+    /* если это неизвестный тип файла - 
+     * высылаем его просто как текст
+     */
+    else lType='text/plain';
+        
+    return {
+        'Content-Type': lType+'; charset=UTF-8',
+        'cache-control': 'max-age='+(31337*21),
+        'last-modified': new Date().toString(),
+        'content-encoding': pGzip?'gzip':'',
+        /* https://developers.google.com/speed/docs/best-practices/caching?hl=ru#LeverageProxyCaching */
+        'Vary': 'Accept-Encoding'
+    };
+};
+
+/*
+ * Главная функция, через которую проихсодит
+ * взаимодействие обмен данными с клиентом
+ * @req - запрос клиента (Request)
+ * @res - ответ сервера (Response)
+ */
+CloudServer._controller=function(pReq, pRes)
+{
+    /* Читаем содержимое папки,
+        переданное в url
+    */
+    var url = require("url");
+    var pathname = url.parse(pReq.url).pathname;
+    console.log('pathname: '+pathname);
+    
+     /* получаем поддерживаемые браузером кодировки*/
+     var lAcceptEncoding = pReq.headers['accept-encoding'];
+    /* запоминаем поддерживает ли браузер
+     * gzip-сжатие при первом заходе на сайт
+     */ 
+    if (lAcceptEncoding && 
+        lAcceptEncoding.match(/\bgzip\b/)){
+        CloudServer.Gzip=true;
+    }else 
+        CloudServer.Gzip=false;
+    /* путь в ссылке, который говорит
+     * что js отключен
+     */
+    var lNoJS_s=CloudFunc.NOJS;
+    var lFS_s=CloudFunc.FS;
+    
+    if(pathname!=='/favicon.ico')
+    {    
+        console.log("request for " + pathname + " received...");
+        var lName;
+                        
+        /* если в пути нет информации ни о ФС,
+         * ни об отсутствии js,
+         * ни о том, что это корневой
+         * каталог - загружаем файлы проэкта
+         */
+         console.log(lFS_s+pathname);
+        if(pathname.indexOf(lFS_s)<0 &&
+            pathname.indexOf(lNoJS_s)<0 &&
+            pathname!=='/'){
+            /* если имена файлов проекта - загружаем их*/  
+            /* убираем слеш и читаем файл с текущец директории*/
+            lName=Path.basename(pathname);
+            console.log('reading '+lName);
+            /* сохраняем указатель на responce и имя */
+            CloudServer.Responses[lName]=pRes;
+            
+            /* Берём значение из кэша
+             * сжатый файл - если gzip-поддерживаеться браузером
+             * не сжатый - в обратном случае
+             */
+            var lFileData=CloudServer.Cache.get(CloudServer.Gzip?(lName+'_gzip'):lName);
+
+            var lReadFileFunc_f=CloudServer.getReadFileFunc(lName);
+            /* если там что-то есть передаём данные в функцию
+             * readFile
+             */
+            if(lFileData){
+                console.log('readed from cache');
+                /* передаём данные с кэша,
+                 * если gzip включен - сжатые
+                 * в обратном случае - несжатые
+                 */
+                lReadFileFunc_f(undefined,lFileData,true);
+            }
+            else Fs.readFile(lName,lReadFileFunc_f);
+            
+        }else{/* если мы имеем дело с файловой системой*/
+            /* если путь не начинаеться с no-js - значит 
+             * js включен
+             */
+            /* убираем пометку cloud, без которой c9.io
+             * не работает поскольку путь из двух слешей
+             * (/fs/no-js/) - очень короткий, нужно
+             * длиннее
+             */
+            
+            if(pathname.indexOf(lNoJS_s)!=lFS_s.length && pathname!='/'){
+                CloudServer.NoJS=false;
+            }else pathname=pathname.replace(lNoJS_s,'');
+            
+            /* убираем индекс файловой системы */
+            if(pathname.indexOf(lFS_s)===0){
+                pathname=pathname.replace(lFS_s,'');
+                /* если посетитель только зашел на сайт
+                 * no-js будет пустым, как и fs
+                 */                       
+            /* если в пути нету fs - посетитель только зашел на сайт
+             * загружаем его полностью.
+             */
+            }else CloudServer.NoJS=true;
+            /* если в итоге путь пустой
+             * делаем его корневым
+             */                         
+            if(pathname==='')pathname='/';
+            
+            RightDir=pathname;
+            LeftDir=pathname;               
+            //DirContent=fs.readdirSync(LeftDir);
+            
+            /* если встретиться пробел - 
+             * меня код символа пробела на пробел
+             */
+            
+            LeftDir=CloudFunc.replaceSpaces(LeftDir);
+            RightDir=CloudFunc.replaceSpaces(RightDir);
+            
+            /* Проверяем с папкой ли мы имеем дело */
+            
+            /* читаем сновные данные о файле */
+            var lStat;
+            try{
+                lStat=Fs.statSync(LeftDir);
+            }catch(error){
+                console.log(error);
+                CloudServer.Responses[LeftDir]=pRes;
+                CloudServer.sendResponse('OK',error.toString(),LeftDir);
+            }
+            /* если это каталог - 
+             * читаем его содержимое
+             */
+            try{    
+                /*
+                 * сохраним указатель на response
+                 */            
+                CloudServer.Responses[CloudServer.INDEX]=pRes;
+                if(lStat.isDirectory())                    
+                    Fs.readdir(LeftDir,CloudServer._readDir);                
+                /* отдаём файл */
+                else if(lStat.isFile()){
+                    CloudServer.Responses[LeftDir]=pRes;
+                    Fs.readFile(LeftDir,CloudServer.getReadFileFunc(LeftDir));
+                    console.log('reading file: '+LeftDir);
+                }
+            }catch(error){console.log(error);}
+        }
+    }
+};
+
+/* Функция читает ссылку или выводит информацию об ошибке*/
+CloudServer._readDir=function (pError, pFiles)
+{
+    if(!pError)
+    {
+        /* данные о файлах в формате JSON*/
+        var lJSON=[];
+        var lJSONFile={};
+        /* Если мы не в корне добавляем слеш к будующим ссылкам */       
+       if(LeftDir!='/')
+        {
+            RightDir+='/';
+            LeftDir+='/';
+        }
+        //DirContent=
+        pFiles=pFiles.sort();
+                
+        lJSON[0]={path:LeftDir,size:'dir'};
+        var fReturnFalse=function returnFalse(){return false;};        
+        for(var i=0;i<pFiles.length;i++)
+        {
+            /* Получаем информацию о файле*/
+            var lStats;
+            try{
+                lStats=Fs.statSync(RightDir+pFiles[i]);
+            }catch(err){
+                console.log(err);
+                lStats={
+                    'mode':undefined,
+                    'size':undefined,
+                    'isDirectory':fReturnFalse
+                };
+            }
+            /*
+             *Переводим права доступа в 8-ричную систему
+             */
+            var lMode=(lStats.mode-0).toString(8);            
+                        
+            /* Если папка - выводим пиктограмму папки */
+            if(lStats.isDirectory())
+            {                
+                lJSONFile={'name':pFiles[i],'size':'dir','uid':lStats.uid,'mode':lMode};
+                lJSON[i+1]=lJSONFile;            
+            }
+            /* В противоположном случае - файла */
+            else
+            {
+                lJSONFile={'name':pFiles[i],'uid':lStats.uid,'size':lStats.size,'mode':lMode};
+                lJSON[i+1]=lJSONFile;
+            }
+        }
+        
+        /* заголовок ответа сервера */        
+        var lHeader;        
+        var lList;
+        /* если js недоступен */
+        /* если javascript отключен вылылаем html-код
+         * и прописываем соответствующие заголовки
+         */
+        if(CloudServer.NoJS){
+            var lPanel=CloudFunc.buildFromJSON(lJSON);
+            lList='<ul id=left class=panel>';
+            lList+=lPanel;
+            lList+='</ul>';
+            
+            lList+='<ul id=right class="panel hidden">';
+            lList+=lPanel;
+            lList+='</ul>';
+            try{
+                var lIndex;
+                /* пробуем достать данные из кэша
+                 * с жатием или без, взависимости
+                 * от настроек
+                 */
+                var lFileData=CloudServer.Cache.get(CloudServer.INDEX);
+                /* если их нет там - вычитываем из файла*/
+                if(!lFileData){
+                    lIndex=Fs.readFileSync(CloudServer.INDEX);
+                    /* и сохраняем в кэш */
+                    CloudServer.Cache.set(CloudServer.INDEX,lIndex);
+                }else lIndex=lFileData;
+                
+                /* если выбрана опция минифизировать скрпиты
+                 * меняем в index.html обычный client.js на
+                 * минифицированый
+                 */
+                CloudServer.Minimize.scriptSize?
+                    lIndex=lIndex.replace('client.js','client.min.js'):'';
+                
+                lIndex=lIndex.toString().replace('<div id=fm class=no-js>','<div id=fm class=no-js>'+lList);
+                /* меняем title */
+                lIndex=lIndex.replace('<title>Cloud Commander</title>',
+                    '<title>'+CloudFunc.setTitle()+'</title>');
+                /* отображаем панель быстрых клавишь */
+                lList=lIndex;
+                 /* если браузер поддерживает gzip-сжатие*/
+                lHeader=CloudServer.generateHeaders('text/html',CloudServer.Gzip);
+            }catch(error){console.log(error);}
+        }else{
+            /* в обычном режиме(когда js включен
+             * высылаем json-структуру файлов
+             * с соответствующими заголовками
+             */
+            lList=JSON.stringify(lJSON);
+            lHeader=CloudServer.generateHeaders('application/json',CloudServer.Gzip);
+        }
+        /* если браузер поддерживает gzip-сжатие - сжимаем данные*/                
+        if(CloudServer.Gzip){
+            Zlib.gzip(lList,CloudServer.getGzipDataFunc(lHeader,CloudServer.INDEX));
+        }
+        /* если не поддерживаеться - отсылаем данные без сжатия*/
+        else
+            CloudServer.sendResponse(lHeader,lList,CloudServer.INDEX);
+    }
+    else
+    {
+        console.log(pError);
+        CloudServer.sendResponse('OK',pError.toString());
+    }
+};
+
+/* Функция генерирует функция считывания файла
+ * таким образом, что бы у нас было 
+ * имя считываемого файла
+ * @pName - полное имя файла
+ */
+CloudServer.getReadFileFunc = function(pName){
+/*
+ * @pError  - ошибка
+ * @pData   - данные
+ * @pFromFile - прочитано с файла bool
+ */    
+    var lReadFile=function(pError,pData,pFromCache_b){
+        if (!pError){
+            console.log('file ' + pName + ' readed');
+            
+            /* берём из кэша данные файла
+             * если их нет в кэше - 
+             * сохраняем
+             */            
+            if(!pFromCache_b && CloudServer.Cache.isAllowed)
+                CloudServer.Cache.set(pName,pData);
+            /* если кэш есть
+             * сохраняем его в переменную
+             * которая до этого будет пустая
+             * по скольку мы будем вызывать этот метод
+             * сами, ведь файл уже вычитан
+             */
+            
+            var lHeader=CloudServer.generateHeaders(pName,CloudServer.Gzip);
+            /* если браузер поддерживает gzip-сжатие - сжимаем данные*/
+            if(CloudServer.Gzip &&!pFromCache_b){
+                /* сжимаем содержимое */
+                Zlib.gzip(pData,CloudServer.getGzipDataFunc(lHeader,pName));                
+            }
+            else{
+                /* высылаем несжатые данные */
+                CloudServer.sendResponse(lHeader,pData,pName);
+            }
+        }
+        else
+        {
+            console.log(pError.path);
+            if(pError.path!='passwd.json')
+            {
+                console.log(pError);
+                CloudServer.sendResponse('OK',pError.toString());
+            }else{
+                CloudServer.sendResponse('OK','passwd.json');
+            }            
+        }
+    };
+    return lReadFile;
+};
+
+/* Функция получает сжатые данные
+ * @pHeader - заголовок файла
+ */
+CloudServer.getGzipDataFunc=function(pHeader,pName){
+    return function(error,pResult){
+                    if(!error){
+                        /* отправляем сжатые данные
+                         * вместе с заголовком
+                         */                            
+                         /* если установлена работа с кэшем
+                          * сохраняем сжатые данные
+                          */
+                        if(CloudServer.Cache.isAllowed){
+                            /* устанавливаем кєш */
+                            console.log(pName+' gziped');
+                            CloudServer.Cache.set(pName+'_gzip',pResult);
+                        }
+                        CloudServer.sendResponse(pHeader,pResult,pName);                        
+                    }
+                    else{
+                        console.log(error);
+                        CloudServer.sendResponse(pHeader,error);
+                    }
+    };
+};
+/* Функция высылает ответ серверу 
+ * @pHead       - заголовок
+ * @pData       - данные
+ * @pName       - имя отсылаемого файла
+ */
+CloudServer.sendResponse = function(pHead, pData,pName){
+    /* если у нас есть указатель на responce
+     * для соответствующего файла - 
+     * высылаем его
+     */
+    var lResponse=CloudServer.Responses[pName];
+    if(lResponse){
+        lResponse.writeHead(200,pHead);
+        lResponse.end(pData);
+        console.log(pName+' sended');
+    }
+};
+
+CloudServer.start();
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 00000000..28a49a52
--- /dev/null
+++ b/style.css
@@ -0,0 +1,316 @@
+/*
+@import url(//fonts.googleapis.com/css?family=Droid+Sans+Mono);
+*/
+
+/* Foundation Icons General Enclosed */
+@font-face {
+    font-family: 'FoundationIconsGeneralEnclosed';
+    src: url('//dl.dropbox.com/u/78163899/mnemonia/fonts/foundation-icons-general-enclosed.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+
+}    
+/* символьный шрифт от гитхаба*/
+@font-face {
+  font-family: 'Octicons Regular';
+  font-style: normal;
+  font-weight: normal;
+  src: local('Octicons Regular'), url('//dl.dropbox.com/u/78163899/mnemonia/fonts/octicons-regular-webfont.woff') format('woff');
+}
+  body{
+      font:16px "Droid Sans Mono";
+  }
+  /* убираем элементы, 
+   * которые будут работать только, 
+   * если есть js
+   */
+  .no-js .refresh-icon{
+      display:none;
+  }
+  
+  .menu{
+      font: 16px 'Octicons Regular';
+      margin-bottom: 0;
+  }
+  
+  .path_icon{
+      font-family:'FoundationIconsGeneralEnclosed';
+      font-size:30px;
+      color: #46A4C3;/*#55BF3F; green*/
+      text-shadow:black 0 2px 1px;
+      /* размер иконки и позиция на png-файле*/
+      width: 15px;
+      height: 15px;
+      display: inline-block;
+      position: relative;
+      top: 3px;
+      left: -4px;
+  }
+  .path_icon:hover{
+      /*
+          color:#45D827;
+      */
+      cursor:pointer;
+  }
+  .path_icon:active{
+      text-shadow:black 0 0 1px;
+      position: relative;
+      top: 4px;
+  } 
+  .icon{
+      font-family: 'Octicons Regular';
+      font-size:16px;
+      width:16px;
+      height:16px;
+      display:inline-block;
+      margin-left:0.5%;
+  }
+    .error::before{
+        content:'\f026';
+        cursor:default;
+        color:rgb(222, 41, 41);
+        position: relative;
+        top: -3px;
+    }
+  .loading{
+      background:url(//dl.dropbox.com/u/74212301/mnemonia/images/icons/spinner.gif);
+      position:relative;
+      top:1px;
+  }
+  .error:hover{
+      color:rgba(222, 41, 41, 0.81);
+  }
+  .refresh-icon{
+      background:url(//dl.dropbox.com/u/78163899/mnemonia/images/icons/panel_refresh.png) no-repeat;
+  }
+  .refresh-icon:active{
+      /*background-position-y: -15px;*/
+    background:url(//dl.dropbox.com/u/78163899/mnemonia/images/icons/panel_refresh.png) 0 -15px no-repeat;
+  }
+  .clear-cache{
+      background:url(//dl.dropbox.com/u/78163899/mnemonia/images/icons/console_clear.png)  -4px -4px no-repeat;
+      margin-right: 6px;
+      margin-left: 7px;
+  }
+  .clear-cache:active{
+      /*
+          background-position-y: -25px;
+      */
+      top:5px;
+  }            
+      
+  .settings:before{
+      content:'k';
+  }            
+  .links{
+      color:red;                
+      }
+      
+    .mini-icon {
+        float: left;        
+        height: 16px;
+        left: -5px;
+        margin-left: 6px;  
+        position: relative;
+        top: 2px;
+        width: 16px;
+      /* отступ перед картинкой 
+       * для нормального отображения
+       * рамки
+       */
+    }
+  /* freeupex */
+  .directory{
+      /*list-style-image*/
+      background-image:url('//dl.dropbox.com/u/74212301/mnemonia/images/icons/dir.png');
+      background-repeat: no-repeat;
+      background-position: 0 0;
+  }
+  .text-file{
+      /*list-style-image*/
+      background-image:url('//dl.dropbox.com/u/74212301/mnemonia/images/icons/txt.png');
+      background-repeat: no-repeat;
+      background-position: 0 0;
+  }
+  #fm{
+      height:90%;                
+      overflow-y: scroll;
+  }
+  .fm_header{
+      font-weight: bold;
+  }
+  #path{
+      margin-left:1.5%;                
+  }
+  #left{
+      float:left;
+      width:90%;
+  }
+  /* фон файла, на котором курсор*/
+    .current-file{
+        border: 2px solid rgba(49, 123, 249, .40);
+    }
+    .selected-file{
+        background-color: rgba(49, 123, 249, .40);
+        color:white;
+    }
+  #right{
+      float:right;
+  }
+  .panel{
+      display: table;
+      width:50%;
+  }
+  #keyspanel{
+      text-align: center;
+  }
+  /* информация о файлах и папках*/
+  .name{
+      float: left;
+      width: 37%;
+  }
+  .size{
+      float:left;
+      width:16%;
+      /* Ставим выравнивание,
+       * что бы размер был в
+       * одной ровной колонке
+       */
+      text-align: right;
+      /* Ставим отступ, что бы
+       * size не налазил на uid
+       * (owner)
+       */
+      margin-right: 27px;
+  }
+  .owner{
+  }
+  .mode{
+      float: right;
+      width: 25%;
+  }
+  
+  ul,li{list-style-type:none;}
+  button{
+      width:10%;
+  }
+  a{
+      text-decoration:none;                                
+  }
+  a:hover, a:active { cursor:pointer;outline: 0; color: #06e; }
+  a:focus { outline: thin dotted; }      
+
+/* Если размер окна очень маленький
+ * располагаем имя и атрибуты файла
+ * друг-под-другом
+*/
+/* responsive design */
+@media only screen and (max-width: 600px){
+    #left{
+        width:90% !important;
+    }
+    .panel >li{
+        margin:10px;
+    }
+    /* если правая панель не помещаеться - прячем её */
+    #right{
+        display:none;
+    }
+    /* текущий файл под курсором */
+.current-file{
+        background-color: rgba(49, 123, 249, .40);
+        color:white;
+    }
+    /* делаем иконки под курсом белыми*/
+.current-file > .mini-icon{
+        color:white;
+    }
+.current-file > .text-file::before{
+        color:white;
+    }
+    
+/* меняем иконки на шрифтовые*/
+   .mini-icon {
+        font: 60px 'Octicons Regular';
+        width: 40%;
+        height: 0;
+        margin-left: 0;
+        float: right;
+        position: relative;
+        top: -17px;
+        
+        color: rgba(246, 224, 124, 0.56);
+    }
+    .directory::before{
+        content: '\f216';
+    }
+     .text-file::before{
+        color: rgba(26, 224, 124, 0.56);
+        content: '\f211';
+    }
+    .text-file{
+        background-image:none;
+    }
+    
+    
+
+    /* убираем заголовок*/
+    .fm_header{
+        display:none;
+    }        
+    .mode,.size,.owner{
+        /* располагаем элементы 
+         * один под другим
+         */
+        display: table;
+        float: none;
+        width: 0;
+        
+        text-align: left;
+    }
+    /* выводим заголовки рядом с полями */
+    .name::before{
+        content: 'name:';
+        font-weight: bold;
+        font-size: 13px;
+    }
+    .mode::before{
+        content: 'mode:';
+        font-weight: bold;
+        font-size: 13px;
+    }
+    .size::before{
+        content: 'size:';
+        font-weight: bold;
+        font-size: 13px;
+    }
+    .owner::before{
+        content: 'owner:';
+        font-weight: bold;
+        font-size: 13px;
+    }
+    
+    .name{
+        float: none;
+        width:100%;
+        font-size: 18px;
+    }
+}
+@media only screen and (min-width: 601px) and (max-width: 767px){
+    #left{        
+        width:90% !important;
+    }
+    #right{
+        display:none;
+    }
+}
+
+@media only screen and (min-width:767px) and (max-width: 1060px){
+    #left{        
+        width:90% !important;
+    }
+    /* если правая панель не помещаеться - прячем её */
+    #right{
+        display:none;
+    }
+}            
\ No newline at end of file