// WWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWW // Javascript file for project: SD Core (JS) // Project URL: any URL / projects // Module: «Forms» - модуль для вывода форм на сайте // Author: Zerohold // Site author script: www.sd-company.su // Date create: August 2008 year // Date last change: July 2011 year // WWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWWW function sdo_form() { // системные свойства this.div_control_id='';// контейнер div ID куда будет выводиться информаци, иначе в body this.name_='form1';// название формы this.top=0;// отрисовка по Y this.left=0;// отрвка по X this.width=300;// ширина окна по умолчанию this.height=300;// высота окна по умолчанию this.html='';// информации в контексте this.path_images='/images/form/';// путь изображениям this.shadow_size=10;// размер тени у формы this.shadow_color='#000';// цвет тени у формы this.overload=1;// 1 - затемнение под формой this.overload_opacity=0.5;// уровень прозрачности this.overflow='auto';// содержание на форме можно будет проматываться автоматически если оно выходит за пределы формы this.z_index=1000;// уровень слоя this.status=0;// 1 - окно открыто this.modal=1;// 1 - окно является модальным this.center=1;// 1 - автоматическое выравнивание формы по центру браузерного окна this.url_submit='';// ссылка при положительном результате this.form_close_code='';// код, который будет выполняться после закрытия формы, при отмене this.form_sender_code='';// код, который будет выполняться после закрытия формы, при положительном исходе this.form_data='/';// ссылка для получение json данных, для построения формы this.form_data_params={}; // заголовок this.caption= { visible:1, title:'Заголовок формы',// текст в заголовке rem:'',// комментарий к заголовку формы icon:'',// ссылка на файл иконки url_icon:'',// ссылка на картинку с иконкой 16x16 url_help:'',// ссылка вызвающая помощь height:36,// высота заголовка buttons: { close_: 1, config: 0, help: 0} }; // основной контекст this.content= { background_color:'#FFFFFF' }; // параметры панели для кнопок this.panel_buttons= { visible: 0, height:40, background_color:'rgb(192,192,192)', buttons: [ { title: 'Отмена', url: 'close' }, { title: 'OK', url: 'sender' } ] } // события // _____________________________________________________________________________ this.form_data_load=function(_params) // Выполняет: отображение нужных элементов согласно полученных данных { return; }// /form_data_load // _____________________________________________________________________________ this.form_close=function() // Выполняет: закрытые формы { var sd='sd_form_'+this.name_; $('#'+sd).remove();// убираем указанный объект if (this.form_close_code!='')// если требуется выполнить какой либо код после закрытия формы { eval(this.form_close_code); } return; }// /form_close // _____________________________________________________________________________ this.form_sender=function() // Выполняет: отправка данных у формы { var sd='sd_form_'+this.name_; $('#'+sd).remove();// убираем указанный объект if (this.form_sender_code!='')// если требуется выполнить какой либо код после закрытия формы { eval(this.form_sender_code); } return; }// /form_sender // _____________________________________________________________________________ this.show=function() // Выполняет: вызов формы { // ! если указан контейнер куда писать, то пишем в него // создаем холст на котором все и будем рисовать var self=this; var sd='sd_form_'+this.name_; var d=(this.div_control_id!='')?this.div_control_id:'body'; if ($('#'+sd).length==0) { $(d).append('
'); }// если такого объекта не существует то создаем его, иначе пишем туда же // главный холст куда и будут выводиться все данные var j_form=$('#'+sd); j_form.html();// обнуляем содержание на случай, если на форме, что либо уже было var body_width=$(document).width();// определение ширины всего документа (html страницы) var body_height=$(document).height();// определение высоты всего документа (html страницы) var screen_height=$(window).height();// определение высоты видимой части сайта var scroll_top=$(document).scrollTop();// определение текущей позиции прокрутки на странице // если требуется затемнение if (this.overload) { j_form.append('
');// главный холст куда и будут выводиться все данные $('#'+sd+'_main_border').css({ 'position':'absolute', 'z-index': (this.z_index+5), 'top':(t-4)+'px', 'left':(l-4)+'px', 'width':(this.width)+'px', 'height':(this.height)+'px' }); j_main=$('#'+sd+'_main'); j_main.hide();// скрываем форму на время модификаций j_main.css({ 'position':'absolute', 'z-index': (this.z_index+7), 'top':'4px', 'left':'4px', 'width':this.width+'px', 'height':this.height+'px' }); if (this.shadow_size>0) { $('#'+sd+'_main_border').css({'box-shadow': '0px 0px '+this.shadow_size+'px '+this.shadow_color }); } j_main.append('
');// заголовок формы j_main.append('
');// основной контент, куда будет выводится j_main.append('
');// основной контент, куда будет выводится // j_caption=$('#'+sd+'_caption'); // обработка заголовка if (this.caption.visible==1)// если заголовок видимый { j_caption.css({'height': this.caption.height+'px'}); // иконка формы if (this.caption.icon!='') { j_caption.append('
'); j_icon=$('#'+sd+'_icon'); // f=(this.caption.icon!='')?this.caption.icon:this.path_images+'icon_none.png';// файла иконки j_icon.append('Иконка'); } // заголовок j_caption.append('
');// рисуем кнопку закрытия $('#'+sd+'_caption_text').html(this.caption.title);// текст заголовка $('#'+sd+'_caption_text').css({'height': this.caption.height+'px', 'line-height': this.caption.height+'px' }); // формируем кнопки в заголовке if (this.caption.buttons.close_)// если требуется кнопка закрыть { j_caption.append('
');// рисуем кнопку закрытия j_btn_close=$('#'+sd+'_button_close');// сокращение j_btn_close.css({ 'position': 'absolute', 'backgroundImage': 'url('+this.path_images+'button_close.png)', 'z-index':1, 'width': this.caption.height+'px', 'height': this.caption.height+'px', 'left':(this.width-this.caption.height)+'px' }); j_btn_close.click(function(){ self.form_close(); }); } // резервируем кнопку для процессинга j_caption.append('
');// рисуем кнопку закрытия j_processing=$('#'+sd+'_processing');// сокращение // добавить в sdmage - обработку ID тэга j_processing.css({ 'position': 'absolute', 'z-index':'1', 'top': '0px', 'left': (this.width-40)+'px' }); } // панель кнопок panel_buttons_height=0;// высота панели с кнопками if(this.panel_buttons.visible)// если панель для кнопок требуется показывать { j_panel_buttons=$('#'+sd+'_panel_buttons'); j_panel_buttons.css({ 'background-color': this.panel_buttons.background_color, 'height': this.panel_buttons.height, 'top': (j_main.height()-this.panel_buttons.height) }); // отображаем кнопки _obj_a=this.panel_buttons.buttons; s='
'; s+=''; for (var key in _obj_a)// пройтись по всем кнопкам, если таковые имеются { if (typeof(_obj_a[key])=='object')// если свойство не является объектом, то { // непосредственное рисование кнопки s+=''; } } s+='
'; s+=''; s+=''; s+=''; s+=''; s+=''; // зеркало s+=''; s+=''; s+=''; s+=''; s+=''; s+='
'; s+='
'+_obj_a[key].title+'
'; s+='
'; s+='
'; s+='
'; j_panel_buttons.append(s); for (var key in _obj_a)// пройтись по всем кнопкам, если таковые имеются { if (typeof(_obj_a[key])=='object')// если свойство не является объектом, то { // вешаем обработчики if (_obj_a[key].url=='cancel') { $('#'+sd+'_button_'+key).click(function(){ this.form_close(); }); } if (_obj_a[key].url=='ok') { $('#'+sd+'_button_'+key).click(function(){ this.form_sender(); }); } if ((_obj_a[key].url!='ok')&&(_obj_a[key].url!='cancel'))// если не отмена и не ok нажата, то { // ссылка по указанному адресу } } } panel_buttons_height=j_panel_buttons.height(); } // основной контейнер для данных j_content=$('#'+sd+'_content'); h=sdf_pti(j_main.height())-sdf_pti(panel_buttons_height)-sdf_pti(j_caption.css('height')); j_content.css({ 'height': h+'px', 'top': j_caption.css('height'), 'overflow': this.overflow, 'background-color': this.content.background_color }); sdf_form_content(this.name_,this.html); // j_content.html(this.html);// Вносим данные в контект блок j_main.fadeIn(500); // var info=sd_ajax(this.form_data,this.form_data_params); // this.form_data_load(info);// отображение загруженных данных this.status=1; return; }// /show // _____________________________________________________________________________ this.content_set=function(_content) // Выполняет: изменение содержания формы { $('#sd_form_'+this.name_+'_content').html('
'+_content+'
');// пишем данные в форму return;// возвращаемся назад }// /content_set // _____________________________________________________________________________ }// /sdo_form // _____________________________________________________________________________ function sdf_form(_params) // Выполняет: вызова формы { var obj=new sdo_form(); obj.show(_params); }// /sdf_form // _____________________________________________________________________________ function sdf_form_content(_name,_content) // Выполняет: изменение содержания формы { var name_='sd_form_'+_name+'_content';// узнаем куда будем писать информацию $('#'+name_).html('
'+_content+'
');// пишем данные в форму return;// возвращаемся назад }// /sdf_form_content // _____________________________________________________________________________ function sdf_form_processing(_name,_mode) // Выполняет: true - показывает, что форма работает { var name_='sd_form_'+_name+'_processing';// узнаем куда будем писать информацию if (_mode) { $('#'+name_).html('');// пишем данные в форму } else { $('#'+name_).html('');// пишем данные в форму } return; }// /sdf_form_processing // _____________________________________________________________________________ // HELP // - должен быть подключен файл стилей (CSS) sd_form.css