primocode 8.42.1 → 9.0.0

package/studio/web/js/exportar.js

@@ -1,222 +0,0 @@
-/* ==========================================================================
-   exportar.js — transforma uma cena renderizada em PNG ou JPG.
-
-   Exportar.imagem(cenaEl, {largura, altura, escala, formato, nome})
-
-   Caminho: clona a cena → embute as imagens como data URI → empacota num
-   <foreignObject> de SVG com o CSS junto → desenha em canvas → baixa.
-   Sem biblioteca externa.
-   ========================================================================== */
-
-var Exportar = (function () {
-  "use strict";
-
-  var cssCache = null;
-
-  function css() {
-    if (cssCache) return Promise.resolve(cssCache);
-    return Promise.all([
-      fetch("/core.css").then(function (r) { return r.text(); }),
-      fetch("/render.css").then(function (r) { return r.text(); }),
-    ]).then(function (partes) {
-      cssCache = partes.join("\n");
-      return cssCache;
-    });
-  }
-
-  function paraDataURI(url) {
-    if (!url || /^data:/.test(url)) return Promise.resolve(url);
-    return fetch(url)
-      .then(function (r) { return r.blob(); })
-      .then(function (b) {
-        return new Promise(function (ok, falha) {
-          var l = new FileReader();
-          l.onload = function () { ok(l.result); };
-          l.onerror = falha;
-          l.readAsDataURL(b);
-        });
-      })
-      .catch(function () { return url; });
-  }
-
-  /* Toda imagem precisa virar data URI: dentro de um SVG carregado como
-     imagem, referência externa não é buscada. */
-  function embutirImagens(raiz) {
-    var tarefas = [];
-
-    Array.prototype.forEach.call(raiz.querySelectorAll("img"), function (img) {
-      tarefas.push(paraDataURI(img.getAttribute("src")).then(function (d) {
-        img.setAttribute("src", d);
-      }));
-    });
-
-    Array.prototype.forEach.call(raiz.querySelectorAll("*"), function (no) {
-      var bg = no.style && no.style.backgroundImage;
-      if (!bg || bg.indexOf("url(") < 0) return;
-      var m = bg.match(/url\(["']?([^"')]+)["']?\)/);
-      if (!m || /^data:/.test(m[1])) return;
-      tarefas.push(paraDataURI(m[1]).then(function (d) {
-        no.style.backgroundImage = 'url("' + d + '")';
-      }));
-    });
-
-    return Promise.all(tarefas);
-  }
-
-/* Copia para o clone o estado ATUAL de cada animação.
- *
- * Sem isto o vídeo exportado perde todo o movimento, e o erro é silencioso.
- * O XMLSerializer copia a MARCAÇÃO, não o instante: o SVG resultante mostra
- * o elemento no estado final da animação, sempre. Foi medido — aos 0,3 s de
- * um vídeo, o título já aparecia no lugar final, com a entrada inteira
- * perdida. O arquivo ficava tecnicamente perfeito e visualmente morto.
- *
- * A leitura vem do getComputedStyle do elemento VIVO, que reflete onde a
- * animação está agora, e entra como estilo inline no clone. Depois as
- * animações são desligadas no clone: o estado já está escrito, e deixá-las
- * ligadas faria o SVG recomeçar do zero por cima.
- *
- * Só três propriedades são copiadas — são as que as animações do estúdio
- * mexem (entrada, transição, chaves, Ken Burns, cubo 3D). Copiar o estilo
- * computado inteiro seria dezenas de vezes mais caro por quadro, e o resto
- * já vem das folhas embutidas no próprio SVG. */
-function assarAnimacoes(original, clone) {
-  var deLa = original.querySelectorAll("*");
-  var daCa = clone.querySelectorAll("*");
-  var n = Math.min(deLa.length, daCa.length);
-  for (var i = 0; i < n; i++) {
-    var cs = window.getComputedStyle(deLa[i]);
-    var alvo = daCa[i].style;
-    if (cs.transform && cs.transform !== "none") alvo.transform = cs.transform;
-    if (cs.opacity !== "" && cs.opacity !== "1") alvo.opacity = cs.opacity;
-    if (cs.filter && cs.filter !== "none") alvo.filter = cs.filter;
-    alvo.animation = "none";
-  }
-  // A raiz também: a TRANSIÇÃO de cena (zoom, deslizar, persiana) anima o
-  // transform dela. Quem chama zera esse transform para desfazer a escala de
-  // pré-visualização — e sem copiar de volta o valor animado, toda transição
-  // sumia do arquivo exportado.
-  var raiz = window.getComputedStyle(original);
-  if (raiz.transform && raiz.transform !== "none") clone.style.transform = raiz.transform;
-  if (raiz.opacity !== "" && raiz.opacity !== "1") clone.style.opacity = raiz.opacity;
-  if (raiz.filter && raiz.filter !== "none") clone.style.filter = raiz.filter;
-  clone.style.animation = "none";
-}
-
-/* Uma cena do DOM → uma <img> pronta para desenhar no canvas.
- *
- * Separado de `imagem()` porque o vídeo precisa disto CENTENAS de vezes, e
- * com a folha de CSS já buscada: refazer o fetch do core.css e do render.css
- * a cada quadro seria o gasto dominante.
- *
- * `congelar` põe as animações no estado final — é o que a exportação de PNG
- * quer. O vídeo passa false, porque o que ele quer é o retrato do instante. */
-/* `mascara` recebe o clone antes de virar SVG e pode esconder camadas. É como
-   a exportação de vídeo tira o fundo da cena que tem gravação do usuário: o
-   quadro do <video> é pintado à parte, no canvas, e o fundo do tema por cima
-   dele apagaria justamente a imagem que se quer mostrar. */
-function retrato(cenaEl, L, A, folha, congelar, mascara) {
-  var clone = cenaEl.cloneNode(true);
-  clone.style.transform = "none";
-  clone.style.position = "static";
-  clone.style.display = "block";
-  clone.style.width = L + "px";
-  clone.style.height = A + "px";
-  if (congelar) {
-    clone.classList.remove("animar");
-    Array.prototype.forEach.call(clone.querySelectorAll("*"), function (n) {
-      n.style.animation = "none";
-      n.style.opacity = n.style.opacity === "0" ? "1" : n.style.opacity;
-    });
-  } else {
-    assarAnimacoes(cenaEl, clone);
-  }
-  if (typeof mascara === "function") mascara(clone);
-  var caixa = document.createElement("div");
-  caixa.appendChild(clone);
-  return embutirImagens(caixa).then(function () {
-    var html = new XMLSerializer().serializeToString(clone);
-    var svg = '<svg xmlns="http://www.w3.org/2000/svg" width="' + L + '" height="' + A + '">' +
-      "<foreignObject width='100%' height='100%'>" +
-      '<div xmlns="http://www.w3.org/1999/xhtml">' +
-      "<style>" + folha.replace(/<\/style>/gi, "") + "</style>" +
-      html + "</div></foreignObject></svg>";
-    return new Promise(function (ok, falha) {
-      var img = new Image();
-      img.onload = function () { ok(img); };
-      img.onerror = function () { falha(new Error("não consegui montar a imagem")); };
-      img.src = "data:image/svg+xml;charset=utf-8," + encodeURIComponent(svg);
-    });
-  });
-}
-
-  function imagem(cenaEl, op) {
-    op = op || {};
-    var L = op.largura || cenaEl.offsetWidth || 1920;
-    var A = op.altura || cenaEl.offsetHeight || 1080;
-    var escala = op.escala || 2;
-    var formato = op.formato === "jpg" ? "image/jpeg" : "image/png";
-
-    var clone = cenaEl.cloneNode(true);
-    clone.classList.remove("animar");
-    clone.style.transform = "none";
-    clone.style.position = "static";
-    clone.style.width = L + "px";
-    clone.style.height = A + "px";
-    // animação parada no estado final, senão sai tudo transparente
-    Array.prototype.forEach.call(clone.querySelectorAll("*"), function (n) {
-      n.style.animation = "none";
-      n.style.opacity = n.style.opacity === "0" ? "1" : n.style.opacity;
-    });
-
-    var caixa = document.createElement("div");
-    caixa.appendChild(clone);
-
-    return embutirImagens(caixa)
-      .then(css)
-      .then(function (folha) {
-        var html = new XMLSerializer().serializeToString(clone);
-        var svg =
-          '<svg xmlns="http://www.w3.org/2000/svg" width="' + L + '" height="' + A + '">' +
-          "<foreignObject width='100%' height='100%'>" +
-          '<div xmlns="http://www.w3.org/1999/xhtml">' +
-          "<style>" + folha.replace(/<\/style>/gi, "") + "</style>" +
-          html +
-          "</div></foreignObject></svg>";
-
-        return new Promise(function (ok, falha) {
-          var img = new Image();
-          img.onload = function () { ok(img); };
-          img.onerror = function () { falha(new Error("não consegui montar a imagem")); };
-          img.src = "data:image/svg+xml;charset=utf-8," + encodeURIComponent(svg);
-        });
-      })
-      .then(function (img) {
-        var tela = document.createElement("canvas");
-        tela.width = L * escala;
-        tela.height = A * escala;
-        var c = tela.getContext("2d");
-        if (formato === "image/jpeg") {
-          c.fillStyle = "#ffffff";
-          c.fillRect(0, 0, tela.width, tela.height);
-        }
-        c.drawImage(img, 0, 0, tela.width, tela.height);
-        return new Promise(function (ok) {
-          tela.toBlob(function (b) { ok(b); }, formato, 0.94);
-        });
-      })
-      .then(function (blob) {
-        if (!blob) throw new Error("o navegador não gerou o arquivo");
-        var url = URL.createObjectURL(blob);
-        var a = document.createElement("a");
-        a.href = url;
-        a.download = (op.nome || "arte").replace(/[^\w\-]+/g, "-").toLowerCase() +
-                     (formato === "image/jpeg" ? ".jpg" : ".png");
-        a.click();
-        setTimeout(function () { URL.revokeObjectURL(url); }, 4000);
-        return true;
-      });
-  }
-
-  return { imagem: imagem, retrato: retrato, css: css, assarAnimacoes: assarAnimacoes };
-})();

package/studio/web/js/ferramentas.js

@@ -1,108 +0,0 @@
-/* ==========================================================================
-   ferramentas.js — o que cada ferramenta oferece na interface.
-   ========================================================================== */
-
-// Os doze que o render.css define. A lista tinha seis: quatro temas existiam
-// no CSS, a IA podia usá-los, e o editor não os oferecia a ninguém.
-var TEMAS = ["meia-noite", "claro", "papel", "neon", "brasa", "floresta",
-  "retro", "oceano", "doce", "mono", "ambar", "grafite"];
-
-var PALETA = ["#ff5a36", "#ffb03a", "#f4e04d", "#2fbf7f", "#1f8fe0", "#8b5cf6",
-              "#f472b6", "#ffffff", "#9aa4b2", "#111318"];
-
-var FERR = {
-  prisma: {
-    nome: "Prisma", papel: "Apresentações", cor: "#FF5A36", icone: "tela", modelo: "cena",
-    layouts: ["capa", "titulo", "secao", "duas-colunas", "tres-colunas", "citacao",
-              "numeros", "imagem-direita", "imagem-esquerda", "centro", "livre"],
-    layoutPadrao: "titulo",
-    trilho: [
-      { k: "titulo", i: "titulo", r: "Título", novo: { tipo: "texto", papel: "titulo", texto: "Novo título" } },
-      { k: "texto", i: "texto", r: "Texto", novo: { tipo: "texto", papel: "corpo", texto: "Um parágrafo de apoio." } },
-      { k: "lista", i: "lista", r: "Lista", novo: { tipo: "lista", itens: ["Primeiro ponto", "Segundo ponto"] } },
-      { k: "cartoes", i: "cartao", r: "Cartões", novo: { tipo: "cartoes", itens: ["Título | descrição", "Título | descrição"] } },
-      { k: "numeros", i: "numero", r: "Números", novo: { tipo: "numeros", itens: ["3x | crescimento", "42% | margem"] } },
-      { k: "tabela", i: "tabela", r: "Tabela", novo: { tipo: "tabela", linhas: [["Coluna", "Coluna"], ["dado", "dado"]] } },
-      { k: "citacao", i: "citacao", r: "Citação", novo: { tipo: "citacao", texto: "Uma frase que fica.", autor: "Autor" } },
-      { k: "grafico", i: "grafico", r: "Gráfico", novo: { tipo: "grafico", grafico: "barras", dados: [["A", 30], ["B", 55], ["C", 40]] } },
-      { k: "imagem", i: "imagem", r: "Imagem", novo: { tipo: "imagem", src: "", ajuste: "cobrir" } },
-      { k: "icone", i: "icone", r: "Ícone", novo: { tipo: "icone", nome: "raio", tamanho: 120 } },
-      { k: "codigo", i: "codigo", r: "Código", novo: { tipo: "codigo", texto: "npm install" } },
-      { k: "forma", i: "quadrado", r: "Forma", novo: { tipo: "forma", forma: "retangulo", x: 200, y: 200, l: 400, a: 220, raio: 20 } },
-    ],
-  },
-
-  tela: {
-    nome: "Tela", papel: "Design gráfico", cor: "#8B5CF6", icone: "lapis", modelo: "cena",
-    layouts: ["livre", "centro", "capa"], layoutPadrao: "livre",
-    tamanhos: [["Post 1080", 1080, 1080], ["Story 1080x1920", 1080, 1920],
-               ["Capa 1920x1080", 1920, 1080], ["Banner 1600x600", 1600, 600]],
-    trilho: [
-      { k: "texto", i: "texto", r: "Texto", novo: { tipo: "texto", texto: "Texto", x: 120, y: 120, l: 700, a: 140, tamanho: 88, peso: 700 } },
-      { k: "quadrado", i: "quadrado", r: "Retângulo", novo: { tipo: "forma", forma: "retangulo", x: 160, y: 160, l: 420, a: 300, raio: 24 } },
-      { k: "circulo", i: "circulo", r: "Círculo", novo: { tipo: "forma", forma: "circulo", x: 200, y: 200, l: 320, a: 320 } },
-      { k: "triangulo", i: "triangulo", r: "Triângulo", novo: { tipo: "forma", forma: "triangulo", x: 200, y: 200, l: 320, a: 300 } },
-      { k: "linha", i: "linha", r: "Linha", novo: { tipo: "forma", forma: "linha", x: 160, y: 400, l: 620, a: 6, espessura: 6 } },
-      { k: "seta", i: "seta", r: "Seta", novo: { tipo: "forma", forma: "seta", x: 200, y: 400, l: 460, a: 60 } },
-      { k: "imagem", i: "imagem", r: "Imagem", novo: { tipo: "imagem", src: "", x: 120, y: 120, l: 620, a: 460 } },
-      { k: "icone", i: "icone", r: "Ícone", novo: { tipo: "icone", nome: "estrela", x: 300, y: 300, tamanho: 160 } },
-      { k: "grafico", i: "grafico", r: "Gráfico", novo: { tipo: "grafico", grafico: "rosca", x: 160, y: 200, l: 620, a: 460, dados: [["A", 40], ["B", 30], ["C", 30]] } },
-    ],
-  },
-
-  corte: {
-    nome: "Corte", papel: "Vídeo", cor: "#E0397A", icone: "video", modelo: "cena",
-    layouts: ["capa", "centro", "titulo", "citacao", "numeros", "imagem-direita", "livre"],
-    layoutPadrao: "capa", tempo: true,
-    trilho: [
-      { k: "titulo", i: "titulo", r: "Título", novo: { tipo: "texto", papel: "titulo", texto: "Título da cena" } },
-      { k: "texto", i: "texto", r: "Texto", novo: { tipo: "texto", papel: "apoio", texto: "Legenda da cena" } },
-      { k: "lista", i: "lista", r: "Lista", novo: { tipo: "lista", itens: ["Um", "Dois"], revelar: true } },
-      { k: "numeros", i: "numero", r: "Números", novo: { tipo: "numeros", itens: ["100% | atenção"] } },
-      { k: "imagem", i: "imagem", r: "Imagem", novo: { tipo: "imagem", src: "", ajuste: "cobrir" } },
-      { k: "icone", i: "icone", r: "Ícone", novo: { tipo: "icone", nome: "foguete", tamanho: 200 } },
-      { k: "forma", i: "quadrado", r: "Forma", novo: { tipo: "forma", forma: "retangulo", x: 200, y: 200, l: 400, a: 220, raio: 20 } },
-    ],
-  },
-
-  traco: {
-    nome: "Traço", papel: "Diagramas", cor: "#D9A21B", icone: "conector", modelo: "cena",
-    layouts: ["livre"], layoutPadrao: "livre",
-    trilho: [
-      { k: "no", i: "no", r: "Nó", novo: { tipo: "no", texto: "Etapa", x: 300, y: 300, l: 340, a: 150 } },
-      { k: "no-destaque", i: "circulo", r: "Nó destacado", novo: { tipo: "no", texto: "Chave", destaque: true, x: 300, y: 500, l: 340, a: 150 } },
-      { k: "conector", i: "conector", r: "Conector", novo: { tipo: "conector", de: "", para: "" } },
-      { k: "texto", i: "texto", r: "Texto", novo: { tipo: "texto", texto: "Anotação", x: 200, y: 120, l: 500, a: 90, tamanho: 32 } },
-      { k: "forma", i: "quadrado", r: "Área", novo: { tipo: "forma", forma: "retangulo", x: 160, y: 160, l: 700, a: 500, raio: 26, preenchimento: "rgba(255,255,255,.04)", borda: { cor: "var(--c-linha)", largura: 2 } } },
-      { k: "icone", i: "icone", r: "Ícone", novo: { tipo: "icone", nome: "engrenagem", x: 300, y: 300, tamanho: 120 } },
-    ],
-  },
-
-  prosa: {
-    nome: "Prosa", papel: "Documentos", cor: "#2E9E6B", icone: "livro", modelo: "documento",
-    trilho: [
-      { k: "titulo", i: "titulo", r: "Título", novo: { tipo: "titulo", texto: "Título" } },
-      { k: "secao", i: "texto", r: "Seção", novo: { tipo: "secao", texto: "Nova seção" } },
-      { k: "subsecao", i: "texto", r: "Subseção", novo: { tipo: "subsecao", texto: "Subseção" } },
-      { k: "paragrafo", i: "texto", r: "Parágrafo", novo: { tipo: "paragrafo", texto: "Escreva aqui." } },
-      { k: "lista", i: "lista", r: "Lista", novo: { tipo: "lista", itens: ["Item um", "Item dois"] } },
-      { k: "numerada", i: "numero", r: "Numerada", novo: { tipo: "numerada", itens: ["Primeiro", "Segundo"] } },
-      { k: "citacao", i: "citacao", r: "Citação", novo: { tipo: "citacao", texto: "Trecho citado.", autor: "Fonte" } },
-      { k: "tabela", i: "tabela", r: "Tabela", novo: { tipo: "tabela", linhas: [["Coluna", "Coluna"], ["dado", "dado"]] } },
-      { k: "codigo", i: "codigo", r: "Código", novo: { tipo: "codigo", texto: "console.log('oi')" } },
-      { k: "destaque", i: "cartao", r: "Destaque", novo: { tipo: "destaque", titulo: "Atenção", texto: "Ponto importante." } },
-      { k: "imagem", i: "imagem", r: "Imagem", novo: { tipo: "imagem", src: "", legenda: "" } },
-      { k: "divisor", i: "linha", r: "Divisor", novo: { tipo: "divisor" } },
-    ],
-  },
-
-  grade: {
-    nome: "Grade", papel: "Planilhas", cor: "#1F8FE0", icone: "tabela", modelo: "planilha",
-    trilho: [
-      { k: "linha", i: "mais", r: "Nova linha" },
-      { k: "coluna", i: "tabela", r: "Nova coluna" },
-      { k: "total", i: "numero", r: "Linha de total" },
-      { k: "grafico", i: "grafico", r: "Gráfico" },
-    ],
-  },
-};

package/studio/web/js/icones.js

@@ -1,120 +0,0 @@
-/* ==========================================================================
-   icones.js — biblioteca de ícones em SVG, sem dependência externa.
-   Traço de 24x24, herda a cor do texto. Usada na interface e nos documentos.
-   ========================================================================== */
-
-var ICONES = {
-  /* interface */
-  cursor: "M4 3l7 17 2.5-6.5L20 11z",
-  texto: "M5 6V4h14v2M12 4v16M9 20h6",
-  titulo: "M5 5v14M13 5v14M5 12h8M17 9h3v10M17 9l3-2",
-  lista: "M8 6h12M8 12h12M8 18h12M4 6h.01M4 12h.01M4 18h.01",
-  quadrado: "M4 4h16v16H4z",
-  circulo: "M12 3a9 9 0 100 18 9 9 0 000-18z",
-  triangulo: "M12 4l9 16H3z",
-  linha: "M4 20L20 4",
-  seta: "M4 12h15M14 6l6 6-6 6",
-  imagem: "M3 5h18v14H3zM3 15l5-5 4 4 3-3 6 6",
-  icone: "M12 3l2.6 5.6 6.1.8-4.5 4.2 1.2 6.1L12 16.8 6.6 19.7l1.2-6.1L3.3 9.4l6.1-.8z",
-  grafico: "M4 20V10M10 20V4M16 20v-7M22 20H2",
-  cartao: "M3 5h8v6H3zM13 5h8v6h-8zM3 13h8v6H3zM13 13h8v6h-8z",
-  numero: "M6 20V8l-2 1M12 20V4M18 20v-6l-2 1",
-  tabela: "M3 5h18v14H3zM3 10h18M9 10v9M15 10v9",
-  codigo: "M9 7l-5 5 5 5M15 7l5 5-5 5",
-  citacao: "M8 6c-2.5 0-4 2-4 4.5S5.5 15 8 15c0 3-2 4-2 4 5 0 8-3.5 8-9 0-2.5-2-4-3-4zM19 6c-2 0-3 1.5-3 4 0 5.5 3 9 8 9 0 0-2-1-2-4 2.5 0 4-2 4-4.5S21.5 6 19 6z",
-  no: "M5 8h14v8H5zM12 3v5M12 16v5",
-  conector: "M6 6a3 3 0 100 6 3 3 0 000-6zM18 12a3 3 0 100 6 3 3 0 000-6zM8.5 10.5L15.5 14",
-  video: "M3 6h13v12H3zM16 10l5-3v10l-5-3",
-  lapis: "M4 20l4-1 11-11-3-3L5 16z",
-  cor: "M12 3a9 9 0 000 18c1 0 2-.8 2-1.8 0-1.5-1.4-1.7-1.4-3 0-1 .8-1.7 1.8-1.7H16a5 5 0 005-5c0-3.6-4-6.5-9-6.5z",
-  camada: "M12 3l9 5-9 5-9-5zM3 13l9 5 9-5",
-  mais: "M12 5v14M5 12h14",
-  menos: "M5 12h14",
-  lixeira: "M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13",
-  duplicar: "M8 8h12v12H8zM4 16V4h12",
-  subir: "M12 19V5M6 11l6-6 6 6",
-  descer: "M12 5v14M6 13l6 6 6-6",
-  play: "M7 4l13 8-13 8z",
-  pausa: "M8 5h3v14H8zM13 5h3v14h-3z",
-  olho: "M2 12s4-7 10-7 10 7 10 7-4 7-10 7-10-7-10-7zM12 9a3 3 0 100 6 3 3 0 000-6z",
-  baixar: "M12 4v11M7 11l5 5 5-5M4 20h16",
-  tela: "M3 4h18v13H3zM8 21h8M12 17v4",
-  voltar: "M4 9h11a4 4 0 010 8h-6M4 9l4-4M4 9l4 4",
-  refazer: "M20 9H9a4 4 0 000 8h6M20 9l-4-4M20 9l-4 4",
-  fechar: "M6 6l12 12M18 6L6 18",
-  check: "M4 12l5 5L20 6",
-  livro: "M4 5h7a2 2 0 012 2v12a2 2 0 00-2-2H4zM20 5h-7a2 2 0 00-2 2v12a2 2 0 012-2h7z",
-  raio2: "M13 2L4 14h6l-1 8 9-12h-6z",
-
-  /* conteúdo — para o elemento "icone" */
-  raio: "M13 2L4 14h6l-1 8 9-12h-6z",
-  alvo: "M12 3a9 9 0 100 18 9 9 0 000-18zM12 8a4 4 0 100 8 4 4 0 000-8zM12 11.5a.5.5 0 100 1 .5.5 0 000-1z",
-  foguete: "M12 3c4 2 6 6 6 10l-3 3H9l-3-3c0-4 2-8 6-10zM9 16l-3 5 4-2M15 16l3 5-4-2M12 9a1.5 1.5 0 100 3 1.5 1.5 0 000-3z",
-  escudo: "M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6z",
-  relogio: "M12 3a9 9 0 100 18 9 9 0 000-18zM12 7v5l3 2",
-  usuario: "M12 4a4 4 0 100 8 4 4 0 000-8zM4 21c0-4 3.5-6 8-6s8 2 8 6",
-  coracao: "M12 20S3 14 3 8.5A4.5 4.5 0 0112 6a4.5 4.5 0 019 2.5C21 14 12 20 12 20z",
-  estrela: "M12 3l2.6 5.6 6.1.8-4.5 4.2 1.2 6.1L12 16.8 6.6 19.7l1.2-6.1L3.3 9.4l6.1-.8z",
-  nuvem: "M7 18a4 4 0 010-8 5.5 5.5 0 0110.5 1.5A3.5 3.5 0 0117 18z",
-  engrenagem: "M12 9a3 3 0 100 6 3 3 0 000-6zM19 12l2-1.5-2-3.5-2.4.8a7 7 0 00-2-1.2L14 4h-4l-.6 2.6a7 7 0 00-2 1.2L5 7l-2 3.5L5 12l-2 1.5L5 17l2.4-.8a7 7 0 002 1.2L10 20h4l.6-2.6a7 7 0 002-1.2L19 17l2-3.5z",
-  lampada: "M9 18h6M10 21h4M12 3a6 6 0 00-4 10.5c.7.8 1 1.5 1 2.5h6c0-1 .3-1.7 1-2.5A6 6 0 0012 3z",
-  cadeado: "M5 11h14v10H5zM8 11V8a4 4 0 018 0v3",
-  casa: "M4 11l8-7 8 7v9h-5v-6h-6v6H4z",
-  email: "M3 6h18v12H3zM3 7l9 6 9-6",
-  telefone: "M6 3h4l2 5-2.5 1.5a12 12 0 005 5L16 12l5 2v4a2 2 0 01-2 2C11 20 4 13 4 5a2 2 0 012-2z",
-  camera: "M4 8h4l1.5-2h5L16 8h4v11H4zM12 10.5a3.5 3.5 0 100 7 3.5 3.5 0 000-7z",
-  fogo: "M12 3s5 4 5 9a5 5 0 01-10 0c0-2 1-3 1-3s.5 2 2 2c0-3 2-5 2-8z",
-  globo: "M12 3a9 9 0 100 18 9 9 0 000-18zM3 12h18M12 3c2.5 3 2.5 15 0 18M12 3c-2.5 3-2.5 15 0 18",
-  chave: "M14 4a5 5 0 015 5 5 5 0 01-6.5 4.8L11 16H9v2H7v2H3v-4l7.2-7.2A5 5 0 0114 4zM16 8a1 1 0 100 2 1 1 0 000-2z",
-  presente: "M3 11h18v9H3zM3 7h18v4H3zM12 7v13M12 7C10 3 6 4 7 7M12 7c2-4 6-3 5 0",
-  sino: "M12 3a6 6 0 00-6 6c0 5-2 6-2 6h16s-2-1-2-6a6 6 0 00-6-6zM10 19a2 2 0 004 0",
-  mapa: "M9 4L3 6v14l6-2 6 2 6-2V4l-6 2zM9 4v14M15 6v14",
-  dinheiro: "M12 4v16M15.5 8c0-1.4-1.6-2.2-3.5-2.2S8.5 6.7 8.5 8.3 10.4 10.5 12 11s3.5 1 3.5 2.7-1.6 2.5-3.5 2.5-3.5-.9-3.5-2.4",
-  crescimento: "M4 18l5-5 3 3 8-8M15 8h5v5",
-  pessoas: "M9 5a3.5 3.5 0 100 7 3.5 3.5 0 000-7zM2 20c0-3.5 3-5 7-5s7 1.5 7 5M17 6a3 3 0 110 6M18 20c0-2.5-.8-4-2-4.6",
-  balao: "M4 5h16v11H9l-5 4z",
-  pasta: "M3 6h6l2 3h10v10H3z",
-  play2: "M12 3a9 9 0 100 18 9 9 0 000-18zM10 8.5l6 3.5-6 3.5z",
-};
-
-function svgIcone(nome, cls) {
-  var d = ICONES[nome] || ICONES.circulo;
-  return '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" ' +
-         'stroke-linecap="round" stroke-linejoin="round"' + (cls ? ' class="' + cls + '"' : "") +
-         "><path d=\"" + d + '"/></svg>';
-}
-
-function nomesIcones() {
-  return Object.keys(ICONES);
-}
-
-/* O ícone que a IA DESENHA, quando o que ela precisa não está na lista.
- *
- *   "A IA irá desenvolver ícones."
- *
- * `caminho` é o path SVG numa caixa de 24×24 — uma string, ou uma lista de
- * strings (um traço por peça). Sai no MESMO traço dos ícones da casa (1.7,
- * cantos redondos, cor do texto), para o desenhado não destoar do pronto.
- *
- * Só entram os caracteres de path: letra de comando, número, espaço,
- * vírgula. Nada mais — isto vira innerHTML numa página nossa, e o documento
- * foi escrito por um modelo. Path inválido cai no círculo, que é o mesmo
- * destino de um nome que não existe: o erro fica visível e inofensivo. */
-// Começa em M/m: todo path de verdade abre com um moveto, e "42" sozinho
-// não é desenho nenhum.
-var CAMINHO_OK = /^[Mm][MmZzLlHhVvCcSsQqTtAa0-9\s,.\-+eE]*$/;
-
-function svgCaminho(caminho, op) {
-  op = op || {};
-  var lista = Array.isArray(caminho) ? caminho : [caminho];
-  var ds = lista.map(function (d) { return String(d == null ? "" : d).trim(); })
-    .filter(function (d) { return d && d.length <= 4000 && CAMINHO_OK.test(d); });
-  if (!ds.length) return svgIcone("circulo", op.cls);
-  var fill = op.preenchido ? "currentColor" : "none";
-  return '<svg viewBox="0 0 24 24" fill="' + fill + '" stroke="currentColor" stroke-width="' +
-         (Number(op.traco) > 0 ? Number(op.traco) : 1.7) + '" stroke-linecap="round" stroke-linejoin="round"' +
-         (op.cls ? ' class="' + op.cls + '"' : "") + ">" +
-         ds.map(function (d) { return '<path d="' + d + '"/>'; }).join("") + "</svg>";
-}
-
-if (typeof module !== "undefined" && module.exports) module.exports = { ICONES: ICONES, svgIcone: svgIcone, svgCaminho: svgCaminho, CAMINHO_OK: CAMINHO_OK };

package/studio/web/js/midia.js

@@ -1,157 +0,0 @@
-/* ==========================================================================
-   midia.js — biblioteca de arquivos do computador (imagem, áudio, vídeo).
-
-   Midia.escolher({ tipo: "imagem" | "audio" })  →  Promise<{url, nome, tipo}>
-   Aceita upload por botão ou arrastando o arquivo para dentro da janela.
-   ========================================================================== */
-
-var Midia = (function () {
-  "use strict";
-
-  var LIMITE_MB = 60;
-
-  function el(tag, cls, html) {
-    var n = document.createElement(tag);
-    if (cls) n.className = cls;
-    if (html != null) n.innerHTML = html;
-    return n;
-  }
-
-  function kb(bytes) {
-    return bytes > 1048576 ? (bytes / 1048576).toFixed(1) + " MB"
-                           : Math.max(1, Math.round(bytes / 1024)) + " KB";
-  }
-
-  function listar() {
-    return fetch("/api/midia").then(function (r) { return r.json(); });
-  }
-
-  /* Envia um File do computador para o servidor. */
-  function enviar(arquivo) {
-    if (arquivo.size > LIMITE_MB * 1048576) {
-      return Promise.reject(new Error("arquivo acima de " + LIMITE_MB + " MB"));
-    }
-    return new Promise(function (ok, falha) {
-      var leitor = new FileReader();
-      leitor.onerror = function () { falha(new Error("não consegui ler o arquivo")); };
-      leitor.onload = function () {
-        fetch("/api/midia", {
-          method: "POST",
-          headers: { "Content-Type": "application/json" },
-          body: JSON.stringify({ nome: arquivo.name, dados: leitor.result }),
-        }).then(function (r) { return r.json(); })
-          .then(function (m) { m.erro ? falha(new Error(m.erro)) : ok(m); })
-          .catch(falha);
-      };
-      leitor.readAsDataURL(arquivo);
-    });
-  }
-
-  function apagar(nome) {
-    return fetch("/api/midia/" + encodeURIComponent(nome), { method: "DELETE" });
-  }
-
-  /* ------------------------------------------------------------- modal -- */
-
-  function escolher(op) {
-    op = op || {};
-    var tipo = op.tipo || "imagem";
-
-    return new Promise(function (resolver) {
-      var folha = el("div", "folha midia on");
-      folha.innerHTML =
-        '<div class="caixa">' +
-        '<div class="midia-topo">' +
-        "<h3>" + (tipo === "audio" ? "Áudio do computador" : "Imagens") + "</h3>" +
-        '<div style="flex:1"></div>' +
-        '<button class="btn" data-x="fechar">Fechar</button>' +
-        '<button class="btn primo" data-x="subir">Escolher arquivo</button>' +
-        "</div>" +
-        '<div class="solta" data-x="solta">Arraste um arquivo aqui — ou clique em ' +
-        "<b>Escolher arquivo</b>. Até " + LIMITE_MB + " MB.</div>" +
-        '<div class="midia-grade" data-x="grade"></div>' +
-        "</div>";
-      document.body.appendChild(folha);
-
-      var entrada = el("input");
-      entrada.type = "file";
-      entrada.accept = tipo === "audio" ? "audio/*" : "image/*";
-      entrada.style.display = "none";
-      folha.appendChild(entrada);
-
-      var grade = folha.querySelector('[data-x="grade"]');
-      var solta = folha.querySelector('[data-x="solta"]');
-
-      function fechar(resultado) {
-        folha.remove();
-        document.removeEventListener("dragover", pegaArrasto);
-        document.removeEventListener("drop", pegaSolta);
-        resolver(resultado || null);
-      }
-
-      function desenhar() {
-        grade.innerHTML = '<div class="vazio-midia">carregando…</div>';
-        listar().then(function (lista) {
-          var itens = lista.filter(function (m) { return m.tipo === tipo; });
-          if (!itens.length) {
-            grade.innerHTML = '<div class="vazio-midia">Nada aqui ainda. ' +
-              (tipo === "audio" ? "Suba uma música que você já tem no computador."
-                                : "Suba uma imagem para começar.") + "</div>";
-            return;
-          }
-          grade.innerHTML = "";
-          itens.forEach(function (m) {
-            var c = el("div", "midia-item");
-            c.innerHTML = (tipo === "audio"
-              ? '<div class="mini-audio">' + svgIcone("play2") + "</div>"
-              : '<div class="mini-img" style="background-image:url(\'' + m.url + '\')"></div>') +
-              '<div class="mini-nome" title="' + m.nome + '">' + m.nome + "</div>" +
-              '<div class="mini-meta">' + kb(m.bytes) + "</div>" +
-              '<button class="mini-x" title="Apagar">×</button>';
-            c.onclick = function (ev) {
-              if (ev.target.classList.contains("mini-x")) {
-                ev.stopPropagation();
-                apagar(m.nome).then(desenhar);
-                return;
-              }
-              fechar(m);
-            };
-            grade.appendChild(c);
-          });
-        });
-      }
-
-      function subir(arquivo) {
-        if (!arquivo) return;
-        solta.textContent = "enviando " + arquivo.name + "…";
-        enviar(arquivo).then(function (m) {
-          solta.textContent = "pronto: " + m.nome;
-          if (op.direto) return fechar(m);
-          desenhar();
-        }).catch(function (e) {
-          solta.textContent = "erro: " + e.message;
-        });
-      }
-
-      folha.addEventListener("click", function (ev) {
-        var acao = (ev.target.dataset || {}).x;
-        if (acao === "fechar" || ev.target === folha) fechar(null);
-        if (acao === "subir" || acao === "solta") entrada.click();
-      });
-      entrada.onchange = function () { subir(entrada.files[0]); };
-
-      function pegaArrasto(ev) { ev.preventDefault(); solta.classList.add("ativo"); }
-      function pegaSolta(ev) {
-        ev.preventDefault();
-        solta.classList.remove("ativo");
-        subir(ev.dataTransfer.files[0]);
-      }
-      document.addEventListener("dragover", pegaArrasto);
-      document.addEventListener("drop", pegaSolta);
-
-      desenhar();
-    });
-  }
-
-  return { escolher: escolher, enviar: enviar, listar: listar, apagar: apagar };
-})();