// ============================================================
//  MapBiomas – Períodos de Urbanização (Coleção 10)
//  Asset: projects/mapbiomas-public/assets/brazil/lulc/
//         collection10/mapbiomas_brazil_collection10_urban_periods_v1
// ============================================================

// 1. Carrega o asset
var urbanPeriods = ee.Image(
  'projects/mapbiomas-public/assets/brazil/lulc/collection10/' +
  'mapbiomas_brazil_collection10_urban_periods_v1'
);

// 2. Inspeciona as bandas disponíveis (opcional – útil na primeira execução)
print('Bandas disponíveis:', urbanPeriods.bandNames());

// 3. Seleciona a banda de interesse
//    Ajuste o nome da banda caso necessário após inspecionar o print acima.
var banda = urbanPeriods.select('classification');

// 4. Paleta de cores e rótulos por período de urbanização
//    Baseado na legenda oficial do MapBiomas para períodos urbanos.
var palette = [
  '#bfbfbf',  // Antes de 1985
  '#c0afc8',  // 1986 – 1990
  '#a8a9db',  // 1991 – 1995
  '#9f8ed2',  // 1996 – 2000
  '#7d7ed3',  // 2001 – 2005
  '#7a6fc9',  // 2006 – 2010
  '#b05ea6',  // 2011 – 2015
  '#b73875',  // 2016 – 2020
  '#930000',  // 2021 – 2024
];

var labels = [
  'Antes de 1985',
  '1986 – 1990',
  '1991 – 1995',
  '1996 – 2000',
  '2001 – 2005',
  '2006 – 2010',
  '2011 – 2015',
  '2016 – 2020',
  '2021 – 2024',
];

// Valores correspondentes a cada período no raster
var values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

// 5. Parâmetros de visualização
var visParams = {
  min: 1,
  max: 9,
  palette: palette,
};

// 6. Adiciona a camada ao mapa
Map.addLayer(banda, visParams, 'Períodos de Urbanização – MapBiomas C10');

// 7. Centraliza o mapa no Brasil
Map.setCenter(-52, -14, 5);

// 8. Cria a legenda customizada
var legend = ui.Panel({
  style: {
    position: 'bottom-left',
    padding: '8px 12px',
    backgroundColor: 'white',
  },
});

// Título da legenda
legend.add(ui.Label({
  value: 'Períodos de Urbanização',
  style: {
    fontWeight: 'bold',
    fontSize: '13px',
    margin: '0 0 6px 0',
    padding: '0',
    color: '#333',
  },
}));

// Gera uma linha por período
values.forEach(function (val, i) {
  var colorBox = ui.Label({
    style: {
      backgroundColor: palette[i],
      padding: '8px',
      margin: '2px 6px 2px 0',
    },
  });

  var description = ui.Label({
    value: labels[i],
    style: { margin: '2px 0', fontSize: '12px', color: '#444' },
  });

  var row = ui.Panel({
    widgets: [colorBox, description],
    layout: ui.Panel.Layout.Flow('horizontal'),
    style: { margin: '0', padding: '0' },
  });

  legend.add(row);
});

// Adiciona legenda ao mapa
Map.add(legend);