Custom Widgets-Touch Config - Printable Version

Code:
$(function() {

    $.i18n.add('mosaic.alarm_fire_alert', {"ru" :{ 

        ctitle:"Датчик задымления с оповещениями",

        alert: "Сработал датчик задымления"

    }}),

    

    Widget.alarm_fire_alert3 = Widget.extend({

        config : { 

            title : $.tr('mosaic.alarm_fire_alert.ctitle', 'Fire sensor with alerts'),

            fields : {

                title : {

                    datatype : "string",

                   title :  $.tr('mosaic.wtitle', 'Title')

                }   

            },

            objects : {

                object : {

                    datatype : 1, 

                    title : $.tr('mosaic.alarmobject', 'Alarm Status Object')

                }

            },

            settings : {}             

        },

        changeValue : function(name, value) { 

            if (value) { 

                alertShow(

                    $.tr('mosaic.alarm_fire_alert.alert', 'Smoke detector triggered'),

                    false, 

                    this,

                    "danger"

                )

            }

            return this.trigger("changed_value");

        }

    })



    WidgetView.alarm_fire_alert3 = WidgetView.extend({

         width : 2, 

         height : 2,   



         init : function() { 

            if($(window).width()<=800) {

               this.width=1;

               this.height=1; 

            }

            this.listenTo(this.model, "changed_value", this.changed_value);

         },

         changed_value : function() {

            if (this.model.getValue("object")) $(".widget", this.$el).addClass('widget_alarm');

            else  $(".widget", this.$el).removeClass('widget_alarm');

         },

         template: _.template(" \

             <div class=\"widget widget_protection w-protect widget-fire<%=(getValue('object') ? ' widget_alarm' : '')%>\"> \

                 <div class=\"widget-title widget-title_fire\"> \

                     <div class=\"txt\"><%=title() || ctitle()%></div> \

                 </div> \

                 <span class=\"indicator-protection\"> \

                     <span class=\"on\">on</span> \

                     <span class=\"alarm\">alarm</span> \

                 </span> \

            </div> \

        "),

         afterRender : function() { 

            var t = this;

            $(window).on('resize', function(){

                var w = $(window).width();

                if (t.width==2 && w<=800) t.size(1, 1);

                else if (t.width==1 && w>800) t.size(2, 2);

            });

         },

    })



})