Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.02.2013, 11:06
Аватар для dmitry111
Профессор
Отправить личное сообщение для dmitry111 Посмотреть профиль Найти все сообщения от dmitry111
 
Регистрация: 26.03.2012
Сообщений: 822

Что-то вроде MVC...
Работаю над плагином, хочу полностью отделить "представление" от "модели"

К плагину поступают необходимые данные DOM в виде объекта.
Происходит инициализация.

После взаимодействия пользователя с приложением - плагин меняет в имеющихся данных значения


При некоторых сценариях работы плагина должны появляться popup-сообщения.. Например, сообщение "Ваши данные отправлены на сервер" или "В корзине 5 товаров" и т.д.

Как лучше делать эти сообщения:

1. В плагине с помощью createElement - но тогда это будет уже влияние на структуру DOM!

2. Сделать в html несколько окон с display:none. При необходимости вносить изменения в них и отображать на клиенте - но это будет будет уже костыль, и программист, использующий плагин должен будет дописывать его к разметке

3. Сделать отдельных скрипт для создания этих сообщений?

4 ....



Вот живой пример: http://demo.hnoe.ru/7.html
При клике на цифру с товарами в корзине - должна отображаться информация о товарах, или при клике оформить заказ - окошко с данными. Как это грамотно реализовать?

Последний раз редактировалось dmitry111, 15.02.2013 в 11:17.
Ответить с цитированием
  #2 (permalink)  
Старый 15.02.2013, 13:00
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

Даю подсказку триггеры и data binding!

Последний раз редактировалось monolithed, 16.02.2013 в 12:07.
Ответить с цитированием
  #3 (permalink)  
Старый 15.02.2013, 19:36
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

не уверен что правильно понял что ты хочешь.
пример отделения данных

<!DOCTYPE HTML>
<html>
  <head> </head>
  <body>
    <button id="add"> добавить товар </button>
    <div id="cart"> </div>
    <script>
 	    store=function(){
        	this.data=[];
        	this.event={};    
        };
      
		store.prototype={
          
          fire:function(name,options){
              for (item in this.event[name]) this.event[name][item](options);
          }, 
            
          on:function(name,fun){
			  if (typeof this.event[name]=="undefined") this.event[name]=[];
              this.event[name].push(fun);	
          },
            
          add:function(data){
              this.data.push(data);          
              this.fire('change');	
          },
            
          get:function(){
              //бла бла
          },
            
          each:function(fun){
              var data=this.data,
                  i=0,
                  len=this.data.length;
              for(;i<len;i++){
                  fun(data[i],i,this)
              }          
          }            
		}	
        
        
        //контролёр
        function test(){
          // заполняем данными
			var m=new store(),
                el=document.getElementById('add'),
                cart=document.getElementById('cart');
          
            el.addEventListener('click',function(){
          		m.add({price:100,name:"хреновина"});
            });                            
        
          
          
			m.on('change',function(){
              var sum=0,text="";
              
              m.each(function(e){             	
                sum+=e.price;            
                text+=e.name+" за "+ e.price+"$<br/>";
              })          
                                          
              if (sum>500) text=text+"вы золотой покупатель"
              else if (sum>300) text=text+"вы серебрянный покупатель";
              cart.innerHTML=text;
          	})           
        };
      
        test();

      
    </script>

  </body>
</html>
__________________
Лучше калымить в гандурасе чем гандурасить на колыме

Последний раз редактировалось DjDiablo, 15.02.2013 в 20:36.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Открытие div блока при первом визите на сайт Nushaba Общие вопросы Javascript 28 20.12.2013 19:24
Мой собственный башорг в скайпе))) devote Оффтопик 81 02.10.2012 23:56
Что такое "шаблоны"? jsuse Серверные языки и технологии 5 11.07.2012 07:22
Разбираем AjaxOOP eai Общие вопросы Javascript 41 04.11.2010 22:37
Браузер доказывает что не видит функцию SleepWalker Общие вопросы Javascript 7 17.06.2009 22:14