source: trunk/prototype/modules/mail/js/label.js @ 5563

Revision 5563, 18.4 KB checked in by thiago, 12 years ago (diff)

Ticket #2486 - modificado algumas traduções, e corrigido um bug da janela dos marcadores.
  • Property svn:executable set to *
Line 
1function configureLabel(event, ui){
2        var idmarkernow = $(this).find('[name="labelItemId"]').val();
3        winElement.find('.edit-label').val(idmarkernow);
4        winElement.find('.input-nome').val($(this).find("span").text());
5       
6        var colorpicker = winElement.find('.lebals-colorpicker');
7        colorpicker.find('input[name="backgroundColor"]').val(rgb2hex($(this).css("backgroundColor")))
8        .css("background-color", $(this).css("backgroundColor")).focus().end()
9        .find('input[name="fontColor"]').val(rgb2hex($(this).css("color"))).css("background-color", $(this).css("color")).focus().end()
10        .find('input[name="borderColor"]').val(rgb2hex($(this).css("border-left-color"))).css("background-color", $(this).css("border-left-color")).focus().end()
11        .find('.preview-label-outer').css({
12                'background-color':$(this).css("backgroundColor"),
13                'color':$(this).css("color"),
14                'border-color':$(this).css("border-left-color")
15        })             
16        winElement.find(".preview-label-inner").text($(this).text());
17}
18function editLabel(){   
19        var conteudoSpan = $(this).parent().find(".text-list").text();
20        var span = $(this).parent().find(".text-list");
21        $(this).parent().trigger('click').unbind('click', configureLabel).find("span.text-list")
22        .html('<input name="edit-value-list" class="edit-value-list" type="text" value="'+conteudoSpan+'">').find("input[name='edit-value-list']").keydown(function(event){
23                event.stopPropagation();
24                $("input.edit-value-list").keyup(function () {
25                        var value = $(this).val();
26                        winElement.find('.input-nome').val(value);
27                }).keyup();
28                if(event.keyCode == 13){
29                        $(span).html($(".label-list").find(".edit-value-list").val())
30                        .parent().find('.edit').removeClass("hidden").parents("li").click(configureLabel).trigger("click");
31                        winElement.find(".buttons .save-label").click(save_editLabel());       
32                        winElement.find(".buttons .save-label").trigger("click");
33                       
34                }else if( event.keyCode == 27){
35                        $(this).trigger("focusout");
36                }
37        }).focusout(function(){
38                $(span).html(conteudoSpan)
39                .parent().find('.edit').removeClass("hidden").parents("li").click(configureLabel);
40        }).focus();
41        $(this).addClass("hidden");
42}
43function deleteLabel(event){
44        var id = $(this).parents(".label-item").attr("class").match(/label-item-([\d]+[()a-zA-Z]*)/)[1];
45        confirmDelete(id);
46        event.stopImmediatePropagation();
47}
48function save_editLabel(){
49                $(".save-label").button("disable");
50                var labelEdited = {
51                        id : winElement.find(".edit-label").val(),
52                        uid: User.me.id,
53                        name : winElement.find('.input-nome').val(),
54                        backgroundColor : winElement.find("input[name='backgroundColor']").val(),
55                        fontColor : winElement.find("input[name='fontColor']").val(),
56                        borderColor : winElement.find("input[name='borderColor']").val()
57                }
58                var qtdLi = $(".label-list-container ul").find("li").not(".empty-item").length;
59                // salvar marcador
60                if(qtdLi > 0){
61                        $(".label-list-container .label-list li").each(function(){
62                                var regex_match_2 = $(this).attr("class").match(/label-item-([\d]+[()a-zA-Z]*)/);
63                               
64                                 if(regex_match_2 && regex_match_2[1] && regex_match_2[1] == labelEdited.id){
65                                   $(this).html("<input type='hidden' name='labelItemId' class='id-item-list' value='"+labelEdited.id+"'>"+"<span class='text-list'>"+labelEdited.name+"</span><div class='button close tiny' style='float: right'></div><div class='button edit tiny' style='float: right'></div>").css({
66                                        "background" : labelEdited.backgroundColor,
67                                        "color" : labelEdited.fontColor,
68                                        "border-color" : labelEdited.borderColor       
69                                   });
70                                 }     
71                        });
72                       
73                        $("#MyMarckersList .label-list li").each(function(){
74                                var regex_match_2 = $(this).attr("class").match(/label-item-([\d]+[()a-zA-Z]*)/);
75                               
76                                if(regex_match_2 && regex_match_2[1] && regex_match_2[1] == labelEdited.id){
77                                        $(this).html("<input type='hidden' name='labelItemId' class='id-item-list' value='"+labelEdited.id+"'>"+"<span>"+labelEdited.name+"</span>");
78                                        $(this).find(".square-color").css('background', labelEdited.backgroundColor);
79                                }       
80                        });
81                        DataLayer.put('label', labelEdited.id, labelEdited);
82                        DataLayer.commit(false, false, function(){
83                                $("#MyMarckersList")
84                                .html(
85                                        "<div class='my-labels'>" +
86                                                "<img src='../prototype/modules/mail/img/tag.png'/>" +
87                                                "<a class='title-my-labels' tabindex='0' role='button' aria-expanded='false' title='Meus marcadores'>Meus marcadores</a>" +
88                                               
89                                                "<span class='status-list-labels ui-icon ui-icon-triangle-1-s'></span>" +
90                                        "</div>"
91                                )
92                                .append(DataLayer.render("../prototype/modules/mail/templates/label_list.ejs", {labels:DataLayer.get('label', true)} ))
93                                .find("li.label-item").css({"background-color":"#ffffff", "border-color":"#CCCCCC", "color":"#444444"})
94                                .find(".square-color").css("display","").click(function(){
95                                        $(this).parent(".label-item").each(function(){
96                                                configureLabels({selectedItem: $(this).attr('class').match(/label-item-([\d]+[()a-zA-Z]*)/)[1]});
97                                                var id_label_item = $(this).attr('class').match(/label-item-([\d]+[()a-zA-Z]*)/)[1];
98                                                $(".label-list-container .label-list").find(".label-item-"+id_label_item).trigger("click");
99                                        });
100                                });
101                               
102                                $("#MyMarckersList a.title-my-labels").click(function() {
103                                        $("#MyMarckersList ul.label-list").toggleClass("hidden")
104                                        $('#MyMarckersList .status-list-labels').toggleClass("ui-icon-triangle-1-s");
105                                        $('#MyMarckersList .status-list-labels').toggleClass("ui-icon-triangle-1-n");
106                                 });
107         
108                               
109                                winElement.find(".insert-label").val("");
110                                $.Watermark.ShowAll();
111                                $(".label-list-container .label-list li").find('.button').button()
112                                        .filter('.edit').button({icons:{primary:'ui-icon-pencil'}, text:false}).end()
113                                        .filter('.close').button({icons:{primary:'ui-icon-close'}, text:false});
114                                winElement.find('.edit').unbind("click").click(editLabel);
115                               
116                                winElement.find('.close').click(deleteLabel);
117                        });
118                // criar marcador
119                } else {
120                  winElement.find(".add-label-button").click(function(){
121                        var nameLabel = winElement.find(".input-nome").val();
122                        if(nameLabel.length >= 2){
123                                new_label(nameLabel, false);                           
124                                winElement.find(".insert-label").val("");
125                                $.Watermark.ShowAll();                         
126                        } else {
127                                alert("Mínimo 2 caracteres");
128                        }
129                   });
130                }               
131                /**
132                * Atualiza menu remove o menu presente em cada mensagem listada em uma pasta
133                * e carrega novamente para que os dados sejam atualizados
134                */
135                $.contextMenu( 'destroy', ".table_box tbody tr");
136                loadMenu();
137               
138                $(".label-list-container .label-list").find(".label-item-"+labelEdited.id).trigger("click");
139
140}
141function colors_suggestions(){
142        return [
143                                {name:'Padrão', border:'#3366cc', font:'#ffffff', background:'#3366cc'},
144                                {name:'Coala', border:'#123456', font:'#ffffff', background:'#385c80'},
145                                {name:'Tomate', border:'#d5130b', font:'#111111', background:'#e36d76'},
146                                {name:'Limão', border:'#32ed21', font:'#1f3f1c', background:'#b2f1ac'},
147                                {name:'Alto contraste', border:'#000000', font:'#ffffff', background:'#222222'}
148                        ]               
149}
150function rgb2hex(rgb){
151 rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
152 return "#" +
153  ("0" + parseInt(rgb[1],10).toString(16)).slice(-2) +
154  ("0" + parseInt(rgb[2],10).toString(16)).slice(-2) +
155  ("0" + parseInt(rgb[3],10).toString(16)).slice(-2);
156}
157
158function confirmDelete(id){
159        $.Zebra_Dialog('<strong>Deseja excluir esse marcador?</strong>', {
160                'type':     'question',
161                'title':    'Atenção',
162                'buttons': ['Sim','Não'],       
163                'onClose':  function(caption) {
164                        if(caption == 'Sim'){
165                                delete_label(id);
166                        }
167                }
168        });     
169}                       
170function delete_label(id){
171        $(".label-list li").each(function () {
172                var regex_match = $(this).attr("class").match(/label-item-([\d]+[()a-zA-Z]*)/);
173                if (regex_match && regex_match[1] && regex_match[1] == id) {   
174                        $(this).remove();
175                }
176        });
177        DataLayer.remove('label', id);
178        DataLayer.commit();
179        winElement.find(".label-list li:first").trigger("click");
180       
181        if($(".label-list li").length == 0){
182                winElement.find(".label-list-container").html('<ul class="label-list"><li class="empty-item">'+get_lang("Label None")+'.</li></ul>');                   
183        }
184        var qtdLi = $(".label-list-container ul").find("li").not(".empty-item").length;
185        if (qtdLi == 0){
186                $(".my-labels").addClass("hidden");
187                $(".label-list-container ul").find(".empty-item").css("display","");
188                winElement.find(".buttons .save-label .ui-button-text").text('Criar');
189                $(".delete-label").button("disable");   
190                               
191                winElement.find('.input-nome').val("");
192                winElement.find(".preview-label-inner").text("");
193       
194                var colorpicker = winElement.find('.lebals-colorpicker');
195                colorpicker.find('input[name="backgroundColor"]').val("#ebebeb")
196                .css("background-color", "#ebebeb").focus().end()
197                .find('input[name="fontColor"]').val("#000000").css("background-color", "#000000").focus().end()
198                .find('input[name="borderColor"]').val("#000000").css("background-color", "#000000").focus().end()
199                .find('.preview-label-outer').css({
200                        'background-color':"#ebebeb",
201                        'color':"#000000",
202                        'border-color':"#000000"
203                });
204                $(".input-nome").keyup(function () {
205                        var value = $(this).val();
206                        winElement.find('.preview-label-inner').text(value);
207                }).keyup();                             
208        }               
209}
210function new_label(nameLabel, isNew){
211        var labelCreated = {
212                uid: User.me.id,
213                name : nameLabel,
214                backgroundColor : !!isNew ? '#ebebeb' : winElement.find("input[name='backgroundColor']").val(),
215                fontColor : !!isNew ? '#000000' : winElement.find("input[name='fontColor']").val(),
216                borderColor :!!isNew ? '#000000' : winElement.find("input[name='borderColor']").val()
217        }
218        DataLayer.put('label', labelCreated);
219       
220        $(".add-label-button").removeClass("ui-icon ui-icon-plus")
221        .html('<img alt="Carregando" title="Carregando" style="margin-left:10px;" src="../prototype/modules/mail/img/loader.gif" />');
222       
223        DataLayer.commit(false, false, function(){
224
225                labels = DataLayer.get('label',{criteria:{order: 'id'}}, true);
226                newLabel = {
227                        id: labels[labels.length - 1].id,
228                        name : labels[labels.length- 1].name,
229                        uid: User.me.id,
230                        bgColor : !!isNew ? '#ebebeb' : winElement.find("input[name='backgroundColor']").val(),
231                        fontColor : !!isNew ? '#000000' : winElement.find("input[name='fontColor']").val(),
232                        borderColor : !!isNew ? '#000000' : winElement.find("input[name='borderColor']").val()
233                };
234
235                $(".label-list-container ul").find(".empty-item").css("display","none");
236                $(".label-list-container ul")
237                .prepend(DataLayer.render("../prototype/modules/mail/templates/label_listitem.ejs", newLabel))
238                .find("li:first")
239                .fadeIn("slow").click(configureLabel);
240               
241                $("#MyMarckersList")
242                .html(
243                        "<div class='my-labels'>" +
244                                "<img src='../prototype/modules/mail/img/tag.png'/>" +
245                                "<a class='title-my-labels' tabindex='0' role='button' aria-expanded='false' title='"+get_lang("My Labels")+"'>"+get_lang("My Labels")+"</a>" +
246                               
247                                "<span class='status-list-labels ui-icon ui-icon-triangle-1-s'></span>" +
248                        "</div>"
249                )               
250                .append(DataLayer.render("../prototype/modules/mail/templates/label_list.ejs", {labels:DataLayer.get('label', true)} ))
251                .find("li.label-item").css({"background-color":"#ffffff", "border-color":"#CCCCCC", "color":"#444444"})
252                .find(".square-color").css("display","").click(function(){
253                        $(this).parent(".label-item").each(function(){
254                                configureLabels({selectedItem: $(this).attr('class').match(/label-item-([\d]+[()a-zA-Z]*)/)[1]});
255                        });
256                });
257                $("#MyMarckersList a.title-my-labels").click(function() {
258                        $("#MyMarckersList ul.label-list").toggleClass("hidden")
259                        $('#MyMarckersList .status-list-labels').toggleClass("ui-icon-triangle-1-s");
260                        $('#MyMarckersList .status-list-labels').toggleClass("ui-icon-triangle-1-n");
261                 });
262
263                $(".label-list-container .label-list li").not(".empty-item").click(function(){
264                        $(".label-list-container .label-list li").find("img").remove();
265                        $(".label-list-container .label-list li.label-item").removeClass("selected");
266                        $(this).prepend("<img src='../prototype/modules/mail/img/triangle.png' style='margin: 0 5px 0 -5px;'>");
267                        $(this).addClass("selected");
268                });
269               
270                $(".label-list-container .label-list li").find('.button').button()
271                .filter('.edit').button({icons:{primary:'ui-icon-pencil'}, text:false}).end()
272                .filter('.close').button({icons:{primary:'ui-icon-close'}, text:false});
273               
274                //posiciona para edição o label inserido                       
275                winElement.find("ul.label-list li:first").trigger("click");                     
276                winElement.find(".buttons .save-label .ui-button-text").text('Salvar');
277                $(".delete-label").button("enable");
278               
279                winElement.find('.edit').unbind("click").click(editLabel);                             
280                winElement.find('.close').click(deleteLabel);
281               
282                $(".my-labels").removeClass("hidden");
283               
284                $.contextMenu( 'destroy', ".table_box tbody tr");
285                loadMenu();
286               
287                $(".add-label-button").empty()
288                .addClass("ui-icon ui-icon-plus");
289        });
290
291}
292function init_label(data){
293
294        winElement = data.window;
295       
296        //TODO Mudar quando API abstrair atualizações no cache
297        DataLayer.remove('label',false);
298        labels = DataLayer.get('label',{criteria:{order: 'name'}});
299       
300        if(labels){
301                Label_List = winElement
302                .find(".label-list-container").html(DataLayer.render("../prototype/modules/mail/templates/label_list.ejs", {labels: labels}));
303               
304        }else{
305                //Exibe a mensagem informando o usuário de que não há nenhum marcador cadastrado.
306                Label_List = winElement
307                .find(".label-list-container").html('<ul class="label-list"><li class="empty-item">'+get_lang("Label None")+'.</li></ul>');
308               
309        }
310        Label_List.end()
311        .find('.button').button()
312        .filter('.edit').button({icons:{primary:'ui-icon-pencil'}, text:false}).end()
313        .filter('.close').button({icons:{primary:'ui-icon-close'}, text:false});       
314       
315        winElement.find('.edit').click(editLabel);
316        winElement.find('.close').click(deleteLabel);
317       
318        //marca 'd agua
319        winElement.find(".insert-label").Watermark(winElement.find(".insert-label").val());
320       
321        $("input.insert-label").keyup(function () {
322                $.Watermark.HideAll();
323                var value = $(this).val();
324                winElement.find('.input-nome').val(value);
325        }).keyup();
326       
327        if (!(labels)){
328                winElement.find(".buttons .save-label .ui-button-text").text('Criar');
329                $(".delete-label").button("disable");
330        }else{
331                winElement.find(".label-list li:first").addClass("selected").prepend("<img src='../prototype/modules/mail/img/triangle.png' style='margin: 0 5px 0 -5px;'>");
332        }
333        $(".save-label").button("disable");
334        /**
335        * seta a ação de click para os marcadores listados na tela
336        */
337        winElement.find(".label-list li").not(".empty-item").click(configureLabel);
338       
339        if (data.selectedItem)
340                winElement.find(".label-list li.label-item-"+data.selectedItem).trigger("click");
341        else
342                winElement.find(".label-list li:first").trigger("click");
343               
344        var dataColorPicker = {
345                colorsSuggestions: colors_suggestions()
346        };
347       
348        winElement.find('select.color-suggestions').change(function() {
349                $(".save-label").button("enable");
350                var colorpicker = winElement.find('.lebals-colorpicker');
351                var colors;
352                if(colors = dataColorPicker.colorsSuggestions[$(this).val()]) {
353                        colorpicker
354                        .find('input[name="fontColor"]').val(colors.font).focus().end()
355                        .find('input[name="backgroundColor"]').val(colors.background).focus().end()
356                        .find('input[name="borderColor"]').val(colors.border).focus().end()
357
358                        .find('.preview-label-outer').css({
359                                'background-color':dataColorPicker.colorsSuggestions[$(this).val()].background,
360                                'border-color':dataColorPicker.colorsSuggestions[$(this).val()].border,
361                                'color':dataColorPicker.colorsSuggestions[$(this).val()].font
362                        });
363                }                                       
364        });
365        var colorpickerPreviewChange = function(color) {
366                       
367                var pickedup = winElement.find('.colorwell-selected').val(color).css('background-color', color);
368
369                $(".save-label").button("enable");
370               
371                var colorpicker = winElement.find('.lebals-colorpicker');                       
372
373                if (pickedup.is('input[name="backgroundColor"]')) {
374                        colorpicker.find('.preview-label-outer').css('background-color',color);
375                } else if (pickedup.is('input[name="fontColor"]')) {
376                        colorpicker.find('.preview-label-outer').css('color',color);
377                } else if (pickedup.is('input[name="borderColor"]')) {
378                        colorpicker.find('.preview-label-outer').css('border-color',color);
379                }               
380        }
381               
382        var f = $.farbtastic(winElement.find('.colorpicker'), colorpickerPreviewChange);
383        var selected;
384                               
385        winElement.find('.colorwell').each(function () {
386                f.linkTo(this);
387        })
388        .focus(function() {
389                if (selected) {
390                        $(selected).removeClass('colorwell-selected');
391                }
392                $(selected = this).addClass('colorwell-selected');
393                f.linkTo(this, colorpickerPreviewChange);
394                f.linkTo(colorpickerPreviewChange);
395        });
396       
397        winElement.find(".add-label-button").click(function (event) {
398                $.Watermark.HideAll();
399                var nameLabel = winElement.find(".insert-label").val();
400                if(nameLabel.length >= 2){
401                        new_label(nameLabel, true);
402                        $.Watermark.ShowAll();
403                        winElement.find(".insert-label").val("");
404                        } else {
405                                alert("Mínimo 2 caracteres");
406                        }
407                event.stopImmediatePropagation();
408        });
409       
410        winElement.find('.insert-label').keydown(function(event, ui) {
411                if (event.keyCode == 13)
412                        winElement.find(".add-label-button").trigger('click');
413        });
414       
415        //excluir marcador {deve ser para o botão grande na janela de edição e nao o pequeno da lista}
416        winElement.find(".buttons .delete-label").click(function(event){
417                var id = winElement.find(".edit-label").val();
418                confirmDelete(id);
419                event.stopImmediatePropagation();
420        });
421       
422        $(".label-list-container .label-list li").not(".empty-item").click(function(){
423                $(".label-list-container .label-list li").find("img").remove();
424                $(".label-list-container .label-list li.label-item").removeClass("selected");
425                $(this).prepend("<img src='../prototype/modules/mail/img/triangle.png' style='margin: 0 5px 0 -5px;'>");
426                $(this).addClass("selected");
427        });
428               
429        //salvar/criar marcador
430        winElement.find(".buttons .save-label").click(save_editLabel());       
431        //desfazer marcador
432        winElement.find(".buttons .undo-label").click(function(event){
433                var edit = winElement.find(".edit-label").val();               
434                $(".label-list-container .label-list li").each(function(){
435                        var regex_match_3 = $(this).attr("class").match(/label-item-([\d]+[()a-zA-Z]*)/);
436                        if(regex_match_3 && regex_match_3[1] && regex_match_3[1] == edit){
437                                $(this).trigger("click");
438                        }
439                });
440        });
441       
442        //fechar
443        $(".button-close-window .close-window").click(function(){
444                $(".label-configure-win").dialog("close");
445        });     
446                       
447        $(".configure-label-content").find("input[type='text']").focus(function () {
448                $(this).keyup(function(){
449                        var value = $(this).val();
450                        if(value){
451                                $(".save-label").button("enable");     
452                        }else{
453                                $(".save-label").button("disable");     
454                        }
455                });
456        });     
457       
458        $(".input-nome").keyup(function () {
459                                var value = $(this).val();
460                                winElement.find('.preview-label-inner').text(value);
461        }).keyup();     
462}
463
464/**
465 * TODO:
466 * * Qunado excluir um marcador deve ser removido das mensagens sem que seja necessario atualizar o Expresso.
467 * *
468 */
Note: See TracBrowser for help on using the repository browser.