• API Docs for Version:

    • APIs

    Show:

    Source\flexygo\Proyectos\FlexyGo\FlexyGo\js\flexygo\ui\wc\flx-schedulerview.js File

    1. //TOSDO_TS
    2. /**
    3.  * @namespace flexygo.ui.wc
    4.  */
    5. var flexygo;
    6. (function (flexygo) {
    7.     var ui;
    8.     (function (ui) {
    9.         var wc;
    10.         (function (wc) {
    11.             /**
    12.            * Library for the FlxSchedulerViewElement web component.
    13.            *
    14.            * @class FlxSchedulerViewElement
    15.            * @constructor
    16.            * @return {FlxSchedulerViewElement}
    17.            */
    18.             class FlxSchedulerViewElement extends HTMLElement {
    19.                 constructor() {
    20.                     super();
    21.                     /**
    22.                    * Set when component is attached to DOM
    23.                    * @property connected {boolean}
    24.                    */
    25.                     this.connected = false;
    26.                     this.moduleName = null;
    27.                     this.options = null;
    28.                     this.me = $(this);
    29.                     this.today = moment();
    30.                     this.additionalWhere = null;
    31.                 }
    32.                 /**
    33.                * Fires when element is attached to DOM
    34.                * @method connectedCallback
    35.                */
    36.                 connectedCallback() {
    37.                     let element = $(this);
    38.                     this.connected = true;
    39.                     this.moduleName = element.attr("modulename");
    40.                     this.data = element.attr('value');
    41.                     if (element.attr('manualInit') != 'true') {
    42.                         this.init();
    43.                     }
    44.                 }
    45.                 /**
    46.               * Array of observed attributes.
    47.               * @property observedAttributes {Array}
    48.               */
    49.                 static get observedAttributes() {
    50.                     return ['modulename', 'value'];
    51.                 }
    52.                 /**
    53.                * Fires when the attribute value of the element is changed.
    54.                * @method attributeChangedCallback
    55.                */
    56.                 attributeChangedCallback(attrName, oldVal, newVal) {
    57.                     if (!this.connected) {
    58.                         return;
    59.                     }
    60.                     if (attrName.toLowerCase() == 'modulename' && newVal && newVal != '') {
    61.                         this.moduleName = newVal;
    62.                         if (this.moduleName) {
    63.                             this.refresh();
    64.                         }
    65.                     }
    66.                     if (attrName.toLowerCase() == 'value' && newVal && newVal != '') {
    67.                         this.data = newVal;
    68.                         if (this.data) {
    69.                             this.refresh();
    70.                         }
    71.                     }
    72.                 }
    73.                 refresh() {
    74.                     if ($(this).attr('manualInit') != 'true') {
    75.                         let ctx = this;
    76.                         ctx.render('.schedulerView');
    77.                     }
    78.                 }
    79.                 init() {
    80.                     let ctx = this;
    81.                     let me = $(this);
    82.                     me.removeAttr('manualInit');
    83.                     ctx.me.append('<div class="schedulerView" ></div>');
    84.                     let parentModule = me.closest('flx-module');
    85.                     let wcModule = parentModule[0];
    86.                     if (parentModule && wcModule) {
    87.                         wcModule.moduleLoaded(this);
    88.                     }
    89.                     ctx.render('.schedulerView');
    90.                 }
    91.                 render(selector) {
    92.                     let ctx = this;
    93.                     ctx.me.el = $(ctx).find(selector)[0];
    94.                     ctx.me.current = moment().date(1);
    95.                     ctx.me.current.locale(flexygo.profiles.langKey.toLowerCase().slice(0, 2));
    96.                     ctx.changeEvents(ctx.additionalWhere); //Recoger eventos
    97.                 }
    98.                 changeEvents(additionalWhere) {
    99.                     let ctx = this;
    100.                     let me = $(this);
    101.                     let datepicker = new Date(ctx.me.current);
    102.                     let date = new Date(ctx.me.current.date(1));
    103.                     let start = ctx.formatDate(date, '' + (date.getMonth() + 1), '01', date.getFullYear());
    104.                     let end = '';
    105.                     let dp1 = me.find('#datepicker');
    106.                     dp1.datepicker("setDate", (datepicker.getMonth() + 1) + '/' + datepicker.getDate() + '/' + datepicker.getFullYear());
    107.                     if (date.getMonth() + 1 == 12) {
    108.                         end = ctx.formatDate(date, '01', '01', date.getFullYear() + 1);
    109.                     }
    110.                     else {
    111.                         end = ctx.formatDate(date, '' + (date.getMonth() + 2), '01', date.getFullYear());
    112.                     }
    113.                     let paramsConfig = {
    114.                         ModuleName: ctx.moduleName
    115.                     };
    116.                     flexygo.ajax.post('~/api/SchedulerView', 'GetSchedulerConfig', paramsConfig, (response) => {
    117.                         if (response) {
    118.                             ctx.me.conf = response;
    119.                             let params = {
    120.                                 ObjName: me.attr('objectname'),
    121.                                 ObjectWhere: me.attr('objectwhere'),
    122.                                 ModuleName: ctx.moduleName,
    123.                                 Start: start,
    124.                                 End: end,
    125.                                 AdditionalWhere: additionalWhere,
    126.                                 SchedulerConfig: response
    127.                             };
    128.                             flexygo.ajax.post('~/api/SchedulerView', 'GetSchedulerViewConfig', params, (response) => {
    129.                                 if (response) {
    130.                                     ctx.me.events = response;
    131.                                     ctx.draw();
    132.                                     var current = document.querySelector('.today');
    133.                                     if (current) {
    134.                                         window.setTimeout(function () {
    135.                                             ctx.openDay(current);
    136.                                         }, 500);
    137.                                     }
    138.                                 }
    139.                             });
    140.                         }
    141.                     });
    142.                 }
    143.                 draw() {
    144.                     let ctx = this;
    145.                     let me = $(this);
    146.                     //Create Header
    147.                     ctx.drawHeader();
    148.                     //Draw Month
    149.                     ctx.drawMonth();
    150.                     //Draw Legend
    151.                     //ctx.drawLegend();
    152.                     //Datepicker
    153.                     $('.h1-datepicker').append('<div class="col-6 col-m-12"><div id="datepicker" style="display:none;position:absolute;z-index: 2;" class="cute-calendar"></div></div>');
    154.                     let dp1 = me.find('#datepicker');
    155.                     $('.h1-datepicker').click(function () {
    156.                         dp1.show();
    157.                     });
    158.                     dp1.datepicker({
    159.                         onSelect: function (dateText, inst) {
    160.                             dp1.hide();
    161.                             var date = new Date(dateText);
    162.                             ctx.me.current = moment(date);
    163.                             ctx.me.current.locale(flexygo.profiles.langKey.toLowerCase().slice(0, 2));
    164.                             ctx.changeEvents(ctx.additionalWhere);
    165.                         }, firstDay: 1
    166.                     });
    167.                     $('#mainContent').on('scroll', function () {
    168.                         dp1.hide();
    169.                     });
    170.                     $(document).mouseup(function (e) {
    171.                         if (!dp1.is(e.target) && dp1.has(e.target).length === 0) {
    172.                             dp1.hide();
    173.                         }
    174.                     });
    175.                 }
    176.                 drawHeader() {
    177.                     let ctx = this;
    178.                     if (!ctx.me.header) {
    179.                         //Create the header elements
    180.                         ctx.me.header = ctx.createElement('div', 'header', '', '');
    181.                         $(ctx.me.header).addClass('header');
    182.                         ctx.me.datepicker = ctx.createElement('div', 'h1-datepicker', '', '');
    183.                         ctx.me.title = ctx.createElement('h1', '', '', '');
    184.                         var right = ctx.createElement('div', 'right', '', '');
    185.                         $(right).click(function () {
    186.                             ctx.nextMonth();
    187.                         });
    188.                         var left = ctx.createElement('div', 'left', '', '');
    189.                         $(left).click(function () {
    190.                             ctx.prevMonth();
    191.                         });
    192.                         //Append the Elements
    193.                         $(ctx.me.datepicker).append(ctx.me.title);
    194.                         $(ctx.me.header).append(ctx.me.datepicker);
    195.                         $(ctx.me.header).append(right);
    196.                         $(ctx.me.header).append(left);
    197.                         $(ctx.me.el).append(ctx.me.header);
    198.                     }
    199.                     $(ctx.me.title).html(ctx.me.current.format('MMMM YYYY'));
    200.                 }
    201.                 drawMonth() {
    202.                     let ctx = this;
    203.                     let me = $(this);
    204.                     ctx.me.events.forEach(function (ev) {
    205.                         ev.date = moment(ev.Date);
    206.                         ev.eventName = flexygo.utils.parser.recursiveCompile(ev.Row, ev.eventName);
    207.                     });
    208.                     if (ctx.me.month) {
    209.                         ctx.me.oldMonth = ctx.me.month;
    210.                         $(ctx.me.oldMonth).addClass('month out ' + (ctx.me.next ? 'next' : 'prev'));
    211.                         $(ctx.me.oldMonth).on('webkitAnimationEnd', function () {
    212.                             $(ctx.me.oldMonth).remove();
    213.                             ctx.me.month = ctx.createElement('div', 'month', '', '');
    214.                             ctx.backFill();
    215.                             ctx.currentMonth();
    216.                             ctx.fowardFill();
    217.                             $(ctx.me.el).append(ctx.me.month);
    218.                             window.setTimeout(function () {
    219.                                 $(ctx.me.month).addClass('month in ' + (ctx.me.next ? 'next' : 'prev'));
    220.                                 me.find('.month').not('.in').remove();
    221.                             }, 16);
    222.                         });
    223.                     }
    224.                     else {
    225.                         ctx.me.month = ctx.createElement('div', 'month', '', '');
    226.                         $(ctx.me.el).append(ctx.me.month);
    227.                         ctx.backFill();
    228.                         ctx.currentMonth();
    229.                         ctx.fowardFill();
    230.                         $(ctx.me.month).addClass('month new');
    231.                     }
    232.                 }
    233.                 createElement(tagName, className, innerText, backgroundColor) {
    234.                     var ele = document.createElement(tagName);
    235.                     if (className) {
    236.                         $(ele).addClass(className);
    237.                     }
    238.                     if (innerText) {
    239.                         $(ele).text(innerText);
    240.                     }
    241.                     if (backgroundColor) {
    242.                         $(ele).css("background-color", backgroundColor);
    243.                     }
    244.                     return ele;
    245.                 }
    246.                 backFill() {
    247.                     let ctx = this;
    248.                     var clone = ctx.me.current.clone();
    249.                     var dayOfWeek = clone.day();
    250.                     if (!dayOfWeek) {
    251.                         dayOfWeek = 6;
    252.                     }
    253.                     clone.subtract('days', dayOfWeek + 1);
    254.                     for (var i = dayOfWeek; i > 0; i--) {
    255.                         ctx.drawDay(clone.add('days', 1));
    256.                     }
    257.                 }
    258.                 getWeek(day) {
    259.                     let ctx = this;
    260.                     if (day.day() === 1) {
    261.                         ctx.me.week = ctx.createElement('div', 'week', '', '');
    262.                         $(ctx.me.month).append(ctx.me.week);
    263.                     }
    264.                 }
    265.                 fowardFill() {
    266.                     let ctx = this;
    267.                     var clone = ctx.me.current.clone().add('months', 1).subtract('days', 1);
    268.                     var dayOfWeek = clone.day();
    269.                     if (dayOfWeek > 6) {
    270.                         return;
    271.                     }
    272.                     for (var i = dayOfWeek; i <= 6; i++) {
    273.                         ctx.drawDay(clone.add('days', 1));
    274.                     }
    275.                 }
    276.                 currentMonth() {
    277.                     let ctx = this;
    278.                     var clone = ctx.me.current.clone();
    279.                     while (clone.month() === ctx.me.current.month()) {
    280.                         ctx.drawDay(clone);
    281.                         clone.add('days', 1);
    282.                     }
    283.                 }
    284.                 drawDay(day) {
    285.                     let ctx = this;
    286.                     ctx.getWeek(day);
    287.                     //Outer Day
    288.                     var outer = ctx.createElement('div', ctx.getDayClass(day), '', '');
    289.                     //var outer = ctx.createElement('div', 'day', '');
    290.                     $(outer).attr('currentdate', day.format('YYYYMMDD'));
    291.                     if ($(outer).attr("class") != 'day other') {
    292.                         $(outer).click(function () {
    293.                             ctx.openDay(this);
    294.                             let ev = {
    295.                                 class: "module",
    296.                                 type: "selected",
    297.                                 sender: ctx,
    298.                                 masterIdentity: $(this).attr('currentdate'),
    299.                                 detailIdentity: null
    300.                             };
    301.                             flexygo.events.trigger(ev);
    302.                         });
    303.                     }
    304.                     else {
    305.                         $(outer).click(function () {
    306.                             let ev = {
    307.                                 class: "module",
    308.                                 type: "selected",
    309.                                 sender: ctx,
    310.                                 masterIdentity: $(this).attr('currentdate'),
    311.                                 detailIdentity: null
    312.                             };
    313.                             flexygo.events.trigger(ev);
    314.                         });
    315.                     }
    316.                     //Day Name
    317.                     var name = ctx.createElement('div', 'day-name', day.format('ddd'), '');
    318.                     //Day Number
    319.                     var number = ctx.createElement('div', 'day-number', day.format('DD'), '');
    320.                     //Events
    321.                     var events = ctx.createElement('div', 'day-events', '', '');
    322.                     ctx.drawEvents(day, events);
    323.                     $(outer).append(name);
    324.                     $(outer).append(number);
    325.                     $(outer).append(events);
    326.                     $(ctx.me.week).append(outer);
    327.                 }
    328.                 drawEvents(day, element) {
    329.                     let ctx = this;
    330.                     if (day.month() === ctx.me.current.month()) {
    331.                         var todaysEvents = ctx.me.events.reduce(function (memo, ev) {
    332.                             if (ev.date.isSame(day, 'day')) {
    333.                                 memo.push(ev);
    334.                             }
    335.                             return memo;
    336.                         }, []);
    337.                         todaysEvents.forEach(function (ev) {
    338.                             var evSpan = ctx.createElement('span', '', '', ev.color);
    339.                             $(element).append(evSpan);
    340.                         });
    341.                     }
    342.                 }
    343.                 getDayClass(day) {
    344.                     let ctx = this;
    345.                     var classes;
    346.                     classes = ['day'];
    347.                     if (day.month() !== ctx.me.current.month()) {
    348.                         classes.push('other');
    349.                     }
    350.                     else if (ctx.today.isSame(day, 'day')) {
    351.                         classes.push('today');
    352.                     }
    353.                     return classes.join(' ');
    354.                 }
    355.                 openDay(el) {
    356.                     let ctx = this;
    357.                     var defaultDate = $(el).attr('currentdate');
    358.                     var details, arrow;
    359.                     var dayNumber = +$(el).find('.day-number').text();
    360.                     var day = ctx.me.current.clone().date(dayNumber);
    361.                     var currentOpened = $(document).find('.details')[0];
    362.                     //Check to see if there is an open detais box on the current row
    363.                     if (currentOpened && $(currentOpened).parent()[0] === $(el).parent()[0]) {
    364.                         details = currentOpened;
    365.                         arrow = $(document).find('.arrow')[0];
    366.                     }
    367.                     else {
    368.                         //Close the open events on differnt week row
    369.                         //currentOpened && currentOpened.parentNode.removeChild(currentOpened);
    370.                         if (currentOpened) {
    371.                             $(currentOpened).on('webkitAnimationEnd', function () {
    372.                                 $(currentOpened).remove();
    373.                             });
    374.                             $(currentOpened).on('oanimationend', function () {
    375.                                 $(currentOpened).remove();
    376.                             });
    377.                             $(currentOpened).on('msAnimationEnd', function () {
    378.                                 $(currentOpened).remove();
    379.                             });
    380.                             $(currentOpened).on('animationend', function () {
    381.                                 $(currentOpened).remove();
    382.                             });
    383.                             $(currentOpened).addClass('details out');
    384.                         }
    385.                         //Create the Details Container
    386.                         details = ctx.createElement('div', 'details in', '', '');
    387.                         //Create the arrow
    388.                         arrow = ctx.createElement('div', 'arrow', '', '');
    389.                         //Create the event wrapper
    390.                         $(details).append(arrow);
    391.                         $(el).parent().append(details);
    392.                     }
    393.                     var todaysEvents = ctx.me.events.reduce(function (memo, ev) {
    394.                         if (ev.date.isSame(day, 'day')) {
    395.                             memo.push(ev);
    396.                         }
    397.                         return memo;
    398.                     }, []);
    399.                     ctx.renderEvents(todaysEvents, details, defaultDate);
    400.                     var arrowWidth = (50 * $(el).width() / 100) + 7;
    401.                     $(arrow).css("left", $(el).offset().left - $(el).parent().offset().left + arrowWidth + 'px');
    402.                 }
    403.                 renderEvents(events, ele, defaultDate) {
    404.                     let ctx = this;
    405.                     //Remove any events in the current details element
    406.                     var currentWrapper = ele.querySelector('.events');
    407.                     var wrapper = ctx.createElement('div', 'events in' + (currentWrapper ? ' new' : ''), '', '');
    408.                     var addNew = ctx.createElement('i', 'clickable padding-right-l addnew icon-15x flx-icon icon-add-icon txt-notify', '', '');
    409.                     $(addNew).click(function () {
    410.                         if (ctx.me.conf.length > 1) {
    411.                             let myButtons = new Object();
    412.                             let buttons = '';
    413.                             for (var i = 0; i < ctx.me.conf.length; i++) {
    414.                                 myButtons[ctx.me.conf[i].ObjectName] = {
    415.                                     ObjectName: ctx.me.conf[i].ObjectName,
    416.                                     StartDateField: ctx.me.conf[i].StartDateField,
    417.                                     Icon: ctx.me.conf[i].Icon,
    418.                                     Target: ctx.me.conf[i].Target
    419.                                 };
    420.                                 if (ctx.me.conf[i].CanInsert) {
    421.                                     buttons += '<a style="padding: 0.7em;margin-right: 3%;margin-bottom: 3%;" class="btn btn-default bg-outstanding modalButton"><i style="margin-right:4px;" class="' + ctx.me.conf[i].Icon + '"></i>' + ctx.me.conf[i].ObjectName + '</a>';
    422.                                 }
    423.                             }
    424.                             if (buttons != '') {
    425.                                 $.sweetModal({
    426.                                     title: flexygo.localization.translate('flxscheduler.chooseobjects'),
    427.                                     content: '<div>' + buttons + '</div>',
    428.                                     theme: $.sweetModal.THEME_MIXED,
    429.                                     width: '31%'
    430.                                 });
    431.                                 $(".modalButton").click(function () {
    432.                                     let object = myButtons[this.text];
    433.                                     let defaults = {};
    434.                                     defaults[ctx.me.conf[0].StartDateField] = defaultDate.substring(0, 4) + '-' + defaultDate.substring(4, 6) + '-' + defaultDate.substring(6, 8);
    435.                                     flexygo.nav.openPage('edit', object.ObjectName, null, JSON.stringify(defaults), object.Target, false, $(this));
    436.                                     $('.sweet-modal-overlay').remove();
    437.                                 });
    438.                             }
    439.                         }
    440.                         else {
    441.                             if (ctx.me.conf[0].CanInsert) {
    442.                                 let defaults = {};
    443.                                 defaults[ctx.me.conf[0].StartDateField] = defaultDate.substring(0, 4) + '-' + defaultDate.substring(4, 6) + '-' + defaultDate.substring(6, 8);
    444.                                 flexygo.nav.openPage('edit', ctx.me.conf[0].ObjectName, null, JSON.stringify(defaults), ctx.me.conf[0].Target, false, $(this));
    445.                             }
    446.                         }
    447.                     });
    448.                     $(wrapper).append(addNew);
    449.                     events.forEach(function (ev) {
    450.                         var div = ctx.createElement('div', 'event', '', '');
    451.                         var square = ctx.createElement('div', 'event-category ', '', ev.color);
    452.                         var span = $('<span />').html(ev.eventName)[0];
    453.                         if (ev.pageType == "edit" && ev.canEdit) {
    454.                             $(div).click(function () {
    455.                                 flexygo.nav.openPage(ev.pageType, ev.calendar, ctx.getObjectWhere(ev.table, ev.key, ev.id), null, ev.target, false, $(this));
    456.                             });
    457.                         }
    458.                         if (ev.pageType == "view" && ev.canView) {
    459.                             $(div).click(function () {
    460.                                 flexygo.nav.openPage(ev.pageType, ev.calendar, ctx.getObjectWhere(ev.table, ev.key, ev.id), null, ev.target, false, $(this));
    461.                             });
    462.                         }
    463.                         $(div).append(square);
    464.                         $(div).append(span);
    465.                         $(wrapper).append(div);
    466.                     });
    467.                     if (!events.length) {
    468.                         var div = ctx.createElement('div', 'event empty', '', '');
    469.                         var span = ctx.createElement('span', '', 'No Events', '');
    470.                         $(div).append(span);
    471.                         $(wrapper).append(div);
    472.                     }
    473.                     if (currentWrapper) {
    474.                         $(currentWrapper).addClass('events out');
    475.                         $(currentWrapper).on('webkitAnimationEnd', function () {
    476.                             $(currentWrapper).remove();
    477.                             $(ele).append(wrapper);
    478.                         });
    479.                         $(currentWrapper).on('oanimationend', function () {
    480.                             $(currentWrapper).remove();
    481.                             $(ele).append(wrapper);
    482.                         });
    483.                         $(currentWrapper).on('msAnimationEnd', function () {
    484.                             $(currentWrapper).remove();
    485.                             $(ele).append(wrapper);
    486.                         });
    487.                         $(currentWrapper).on('animationend', function () {
    488.                             $(currentWrapper).remove();
    489.                             $(ele).append(wrapper);
    490.                         });
    491.                     }
    492.                     else {
    493.                         $(ele).append(wrapper);
    494.                     }
    495.                 }
    496.                 drawLegend() {
    497.                     let ctx = this;
    498.                     var legend = ctx.createElement('div', 'legend', '', '');
    499.                     ctx.me.events.map(function (e) {
    500.                         return e.calendar + '|' + e.color;
    501.                     }).reduce(function (memo, e) {
    502.                         if (memo.indexOf(e) === -1) {
    503.                             memo.push(e);
    504.                         }
    505.                         return memo;
    506.                     }, []).forEach(function (e) {
    507.                         var parts = e.split('|');
    508.                         var entry = ctx.createElement('span', 'entry', parts[0], '');
    509.                         var evSpan = ctx.createElement('span', 'colorLegend', '', parts[1]);
    510.                         $(entry).prepend(evSpan);
    511.                         $(legend).append(entry);
    512.                     });
    513.                     $(ctx.me.el).append(legend);
    514.                 }
    515.                 getObjectWhere(table, key, id) {
    516.                     let where = "";
    517.                     let last = 0;
    518.                     for (var i = 0; i < key.length; i++) {
    519.                         where += table + "." + key[i] + " = \'" + id[i] + "\'";
    520.                         if (++last < key.length) {
    521.                             where += " and ";
    522.                         }
    523.                     }
    524.                     return where;
    525.                 }
    526.                 nextMonth() {
    527.                     let ctx = this;
    528.                     ctx.me.current.add('months', 1);
    529.                     ctx.me.next = true;
    530.                     ctx.changeEvents(ctx.additionalWhere);
    531.                 }
    532.                 prevMonth() {
    533.                     let ctx = this;
    534.                     ctx.me.current.subtract('months', 1);
    535.                     ctx.me.next = false;
    536.                     ctx.changeEvents(ctx.additionalWhere);
    537.                 }
    538.                 formatDate(date, month, day, year) {
    539.                     if (month.length < 2)
    540.                         month = '0' + month;
    541.                     if (day.length < 2)
    542.                         day = '0' + day;
    543.                     return [year, month, day].join('');
    544.                 }
    545.                 translate(str) {
    546.                     return flexygo.localization.translate(str);
    547.                 }
    548.                 startLoading() {
    549.                     if ($(this).parents('flx-module').length > 0) {
    550.                         $(this).parents('flx-module')[0].startLoading();
    551.                     }
    552.                 }
    553.                 stopLoading() {
    554.                     if ($(this).parents('flx-module').length > 0) {
    555.                         $(this).parents('flx-module')[0].stopLoading();
    556.                     }
    557.                 }
    558.             }
    559.             wc.FlxSchedulerViewElement = FlxSchedulerViewElement;
    560.         })(wc = ui.wc || (ui.wc = {}));
    561.     })(ui = flexygo.ui || (flexygo.ui = {}));
    562. })(flexygo || (flexygo = {}));
    563. window.customElements.define('flx-schedulerview', flexygo.ui.wc.FlxSchedulerViewElement);
    564. //# sourceMappingURL=flx-schedulerview.js.map
    565.