js/ajatus.elements.js

   1 /*
   2  * This file is part of
   3  *
   4  * Ajatus - Distributed CRM
   5  * @requires jQuery v1.2.1
   6  *
   7  * Copyright (c) 2007 Jerry Jalava <jerry.jalava@gmail.com>
   8  * Copyright (c) 2007 Nemein Oy <http://nemein.com>
   9  * Website: http://ajatus.info
  10  * Licensed under the GPL license
  11  * http://www.gnu.org/licenses/gpl.html
  12  *
  13  */
  14
  15 (function($){
  16     $.ajatus = $.ajatus || {};
  17     $.ajatus.elements = $.ajatus.elements || {};
  18
  19     /**
  20      * Ajatus Dialog
  21      */
  22     $.ajatus.elements.dialog = function(title, msg, opts)
  23     {
  24         $.ajatus.layout.styles.load($.ajatus.preferences.client.theme_url + 'css/jquery/plugins/jqModal.css');
  25         $.ajatus.layout.styles.load($.ajatus.preferences.client.theme_url + 'css/jquery/plugins/dialog/dialog.css');
  26
  27         this.holder = $('#dynamic-elements');
  28         this.options = {
  29             modal: true,
  30             overlay: 30,
  31             closable: true,
  32             dialog: {
  33                 width: 300,
  34                 height: 200,
  35                 nested: false
  36             }
  37         };
  38
  39         if (   typeof opts != 'undefined'
  40             && typeof opts.dialog != 'undefined')
  41         {
  42             this.options.dialog = $.extend({}, this.options.dialog, opts.dialog);
  43         }
  44
  45         this.id = this.create(title, msg, opts);
  46         return this;
  47     };
  48     $.extend($.ajatus.elements.dialog.prototype, {
  49         create: function(title, msg, options)
  50         {
  51             var closable = true;
  52             if (   typeof this.options.closable != 'undefined'
  53                 && this.options.closable == false)
  54             {
  55                 this.options.modal = false;
  56                 closable = false;
  57             }
  58
  59             var id = this._generate_id();
  60             var dialog = this._create_dialog_structure(id, closable);
  61
  62             if (typeof title != 'undefined') {
  63                 $('.jqmdTC',dialog).html(title);
  64             }
  65             if (typeof msg != 'undefined') {
  66                 $('.jqmdMSG',dialog).html(msg);
  67             }
  68
  69             this.holder.append(dialog);
  70
  71             var content_target = $('.jqmdMSG',dialog);
  72
  73             var options = $.extend({
  74                 target: content_target,
  75                 onHide: function(h) {
  76                     content_target.html('');
  77                     h.o.remove();
  78                     h.w.fadeOut(300);
  79                 }
  80             }, this.options, options);
  81
  82             $('#' + id).jqm(options);
  83
  84             return id;
  85         },
  86
  87         get_dialog: function() {
  88             return $('#' + this.id);
  89         },
  90
  91         get_content_holder: function() {
  92             return $('#' + this.id + ' .jqmdMSG');
  93         },
  94
  95         set_content: function(content) {
  96             $('#' + this.id + ' .jqmdMSG').html(content);
  97         },
  98
  99         append_content: function(content)
 100         {
 101             $('#' + this.id + ' .jqmdMSG').append(content);
 102         },
 103
 104         prepend_content: function(content)
 105         {
 106             $('#' + this.id + ' .jqmdMSG').prepend(content);
 107         },
 108
 109         open: function()
 110         {
 111             $('#' + this.id).jqmShow();
 112         },
 113
 114         close: function()
 115         {
 116             $('#' + this.id).jqmHide();
 117         },
 118
 119         destroy: function()
 120         {
 121             $('#' + this.id).jqmHide();
 122             $('#' + this.id).remove();
 123         },
 124
 125         _create_dialog_structure: function(id, closable)
 126         {
 127             var body = $('<div />')
 128             .attr('id', id)
 129             .addClass('jqmDialog')
 130             .hide()
 131             .css({width: this.options.dialog.width+"px", height: this.options.dialog.height+"px"});
 132
 133             if (this.options.dialog.nested) {
 134                 body.addClass('jqmdAbove');
 135             }
 136
 137             var frame = $('<div class="jqmdTL"><div class="jqmdTR"><div class="jqmdTC"></div></div></div><div class="jqmdBL"><div class="jqmdBR"><div class="jqmdBC"><div class="jqmdMSG"></div></div></div></div>');
 138
 139             $('.jqmdBC', frame).css({
 140                 height: this.options.dialog.height - 70 + "px"
 141             });
 142
 143             if (   typeof closable == 'undefined'
 144                 && closable)
 145             {
 146                 frame.append('<input type="image" src="' + $.ajatus.preferences.client.theme_url + 'css/jquery/plugins/dialog/close.gif" class="jqmdX jqmClose" />');
 147             }
 148
 149             body.html(frame);
 150
 151             return body;
 152         },
 153
 154         _generate_id: function()
 155         {
 156             return "ajatus_dialog_" + $.ajatus.utils.generate_id();
 157         }
 158     });
 159     /**
 160      * Ajatus Dialog ends
 161      */
 162
 163     $.ajatus.elements.messages = {
 164         msgs: [],
 165         watchers: [],
 166         holder: null
 167     };
 168     $.extend($.ajatus.elements.messages, {
 169         create: function(title, message, options)
 170         {
 171             if (typeof options == 'undefined') {
 172                 options = {
 173                     closable: true,
 174                     visible: 5
 175                 };
 176             }
 177             if (typeof options.type == 'undefined') {
 178                 options.type = 'notification';
 179             }
 180             if (typeof options.closable == 'undefined') {
 181                 options.closable = true;
 182             }
 183             options.holder = $.ajatus.elements.messages.holder;
 184             var msg = new $.ajatus.elements.message(title, message, options);
 185
 186             $.ajatus.elements.messages.msgs.push(msg);
 187
 188             if (   options.visible
 189                 && options.visible > 0)
 190             {
 191                 var watcher_opts = {
 192                     auto_start: true,
 193                     safety_runs: 0,
 194                     interval: 200,
 195                     timed: (options.visible * 1000)
 196                 };
 197                 var watcher = new $.ajatus.events.watcher(watcher_opts);
 198                 watcher.element.bind('on_stop', function(e, watcher_id){
 199                     msg.fade('out', true);
 200                 });
 201             }
 202
 203             return msg;
 204         },
 205         static: function(title, message, options)
 206         {
 207             var msg = new $.ajatus.elements.message(title, message, options);
 208             return msg;
 209         },
 210         remove: function(msg_id)
 211         {
 212             $.ajatus.elements.messages.msgs = $.grep($.ajatus.elements.messages.msgs, function(n,i){
 213                 if (n.id == msg_id) {
 214                     n.remove();
 215                     return false;
 216                 } else {
 217                     return true;
 218                 }
 219             });
 220         },
 221         clear: function()
 222         {
 223             $.ajatus.elements.messages.msgs = [];
 224             $.ajatus.elements.messages.holder.html('');
 225         },
 226         gen_id: function()
 227         {
 228             var date = new Date();
 229             var id = 'msg_' + date.getTime();
 230             return id;
 231         },
 232         set_holder: function(holder)
 233         {
 234             if (typeof holder == 'undefined') {
 235                 var holder = $('#system_messages', $.ajatus.application_element);
 236             }
 237             $.ajatus.elements.messages.holder = holder;
 238         }
 239     });
 240
 241     $.ajatus.elements.message = function(title, msg, options)
 242     {
 243         this.options = $.extend({
 244             auto_show: true,
 245             disappear: false,
 246             holder: false,
 247             closable: false,
 248             type: 'static'
 249         }, options || {});
 250         this.holder = this.options.holder;
 251         this.body_div = null;
 252
 253         if (! this.holder) {
 254             this.holder = $('<div />');
 255             this.holder.appendTo($.ajatus.application_content_area);
 256         }
 257
 258         this.id = this.create(title, msg);
 259         return this;
 260     };
 261     $.extend($.ajatus.elements.message.prototype, {
 262         create: function(title, msg) {
 263             var id = $.ajatus.elements.messages.gen_id();
 264             this.body_div = jQuery('<div class="ajatus_elements_message" />').attr({
 265                 id: id
 266             }).addClass(this.options.type).hide();
 267             this.body_div.appendTo(this.holder);
 268
 269             if (this.options.closable) {
 270                 var self = this;
 271                 var close_handle = jQuery('<div class="close_handle" />')
 272                 close_handle.appendTo(this.body_div)
 273                 close_handle.bind('click', function(){
 274                     self.fade('out', true);
 275                 });
 276             }
 277
 278             var title_item = jQuery('<h2 />').attr('class', 'title').html(title);
 279             title_item.appendTo(this.body_div);
 280
 281             var msg_item = jQuery('<div />').attr('class', 'message').html(msg);
 282             msg_item.appendTo(this.body_div);
 283
 284             if (this.options.auto_show) {
 285                 this.show();
 286             }
 287
 288             return id;
 289         },
 290         show: function() {
 291             this.fade('in');
 292             //this.body_div.show();
 293         },
 294         hide: function() {
 295             this.fade('out');
 296             //this.body_div.hide();
 297         },
 298         fade: function(direction, destroy) {
 299             var self = this;
 300             if (direction == 'out') {
 301                 this.body_div.fadeOut('slow', function(){
 302                     if (destroy) {
 303                         self.destroy();
 304                     }
 305                 });
 306             } else {
 307                 this.body_div.fadeIn('normal', function(){
 308                 });
 309             }
 310         },
 311         remove: function() {
 312             this.body_div.remove();
 313         },
 314         destroy: function() {
 315             $.ajatus.elements.messages.remove(this.id);
 316         },
 317         bind_in_content: function(action, selector, func) {
 318             $(selector, this.body_div).bind(action, func);
 319         }
 320     });
 321
 322 })(jQuery);