Editar Nueva Obra: Movable Type

No tienes permiso para modificar esta página, por el siguiente motivo:

La acción que has solicitado está restringida a los usuarios del grupo: Usuarios.

Nombre:
Autor:
Coautores:
Ronda:
Imagen:	Si ya existe el archivo en la wiki escriba 'NombreDelArchivo.ext'. Subir archivo
Posición:	Calcular coordenadas utilizando la dirección
Lugar:
Ámbito Geográfico:
Desde:
Hasta:
Período:
Palabras Clave:
Oficios Relacionados:	Arquitectura Diseño Artes Plásticas
Área de Investigación:
Materialidad:
Dimensiones:
URL:
Descripción:
Documentos:	En caso de múltiples documentos, separar con ";"
Nota:	Arrasta el mouse para redimensionar y regenerar el sketch
Flickrset:	Corresponde al número o ID del set. Este número se encuentra dentro de la URL del set. Por seguridad Casiopea sólo acepta Flickrsets del Archivo Histórico JVA ➞ http://www.flickr.com/photos/archivo-escuela/sets

Texto libre:

{{#widget:P5|code=let myGraphics = []; let canvas; function setup() { const parentDiv = document.getElementById('p5'); const canvasHeight = constrain(parentDiv.offsetHeight, 500, 700); canvas = createCanvas(parentDiv.offsetWidth - 2, canvasHeight); canvas.parent(parentDiv); styleCanvas(); generateGrid(); } function styleCanvas() { const styles = { 'border': '1px solid #0001', 'border-radius': '2ex 2ex 0 2ex', 'box-shadow': 'inset 1px 1px 5px #0005, inset 10px 18px 22px #0003', 'background-color': 'rgb(242,241,237)', 'overflow': 'hidden', 'resize': 'both', 'position': 'relative' }; Object.entries(styles).forEach(([key, value]) => canvas.style(key, value)); } function generateGrid() { myGraphics = []; const offset = -max(width, height) / 10; const d = max(width, height) - offset * 2; const minD = d / 5; separateGrid(offset, offset, d, minD); } function windowResized() { regen(); } function mouseDragged() { regen(); } function regen() { resizeCanvas(document.getElementById('p5').offsetWidth - 2, mouseY); generateGrid(); } function separateGrid(x, y, d, minD) { const sepNum = int(random(1, 4)); const w = d / sepNum; for (let i = x; i < x + d - 1; i += w) { for (let j = y; j < y + d - 1; j += w) { if (random(100) < 95 && d > minD) { separateGrid(i, j, w, minD); } else if (i + w > 0 && i < width && j + w > 0 && j < height) { myGraphics.push(new MyGraphics(i, j, w, w, "Alegreya", 3)); } } } } function draw() { clear(); myGraphics.forEach(graphics => { graphics.update(); graphics.draw(); }); } class MyGraphics { constructor(x, y, width, height, font, changeInterval) { this.x = x; this.y = y; this.width = width; this.height = height; this.font = font; this.changeInterval = changeInterval * 1000; this.lastChangeTime = this.calculateDelay(); this.initializeChars(); this.currentDirection = random(["T", "D", "L", "R"]); this.isSpecificLetter = false; this.col = random(1) < 0.05 ? color(219, 84, 0) : color(28, 21, 21); } calculateDelay() { const centerX = width / 2; const centerY = height / 2; const distance = dist(this.x + this.width / 2, this.y + this.height / 2, centerX, centerY); const maxDistance = dist(0, 0, centerX, centerY); return map(distance, 0, maxDistance, 0, this.changeInterval/10); } initializeChars() { this.firstChar = this.getRandomChar(); do { this.secondChar = this.getRandomChar(); } while (this.firstChar === this.secondChar); } getRandomChar() { const chars = "abcdefghijklmnñopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ¡!¿?(){}[]-.,-1234567890;"; return chars[Math.floor(random(chars.length))]; } update() { if (this.isSpecificLetter) return; const currentTime = millis(); const elapsedTime = currentTime - this.lastChangeTime; if (elapsedTime >= this.changeInterval) { this.changeText(); this.lastChangeTime = currentTime; } this.calculateOffset(elapsedTime); } changeText() { this.firstChar = this.secondChar; do { this.secondChar = this.getRandomChar(); } while (this.firstChar === this.secondChar); do { this.currentDirection = random(["T", "D", "L", "R"]); } while (this.currentDirection === this.lastDirection); this.lastDirection = this.currentDirection; } calculateOffset(elapsedTime) { const t = (elapsedTime % this.changeInterval) / this.changeInterval; const progress = constrain(t, 0, 0.5) * 2; const eased = this.easeInQuad(progress); this.offsetX = 0; this.offsetY = 0; switch (this.currentDirection) { case "T": this.offsetY = -eased * this.height; break; case "D": this.offsetY = eased * this.height; break; case "L": this.offsetX = -eased * this.width; break; case "R": this.offsetX = eased * this.width; break; } } easeInQuad(x) { return x * x; } draw() { push(); translate(this.x, this.y); this.setupDrawingContext(); this.drawText(); pop(); } setupDrawingContext() { blendMode(MULTIPLY); rectMode(CORNER); noStroke(); fill(255, 100); rect(0, 0, this.width, this.height); drawingContext.clip(); textFont(this.font); textSize(this.width); textAlign(CENTER, CENTER); fill(this.col); } drawText() { if (this.isSpecificLetter) { text(this.firstChar, this.width / 2, this.height / 2); return; } const x1 = this.width / 2 + this.offsetX; const y1 = this.height / 2 + this.offsetY; let x2 = x1, y2 = y1; switch (this.currentDirection) { case "T": y2 += this.height; break; case "D": y2 -= this.height; break; case "L": x2 += this.width; break; case "R": x2 -= this.width; break; } text(this.firstChar, x1, y1); text(this.secondChar, x2, y2); } setLetter(letter) { this.firstChar = letter; this.isSpecificLetter = true; } } }} <div style='text-align:center'>↕︎</div>

Resumen:

Esta es una edición menor

Vigilar esta página

Cancelar