<commit_before>import THREE from 'three';
import 'three/examples/js/postprocessing/EffectComposer';
import 'three/examples/js/postprocessing/MaskPass';
import 'three/examples/js/postprocessing/ShaderPass';
import 'three/examples/js/postprocessing/RenderPass';
import 'three/examples/js/shaders/CopyShader';
import Stats from 'stats.js';
import dat from 'dat-gui';
import shaders from './shaders/fragment';
import vertexShaders from './shaders/vertex';
import textures from './textures';
import './styles/styles.less';

document.addEventListener('DOMContentLoaded', () => {
  const gui = new dat.GUI();
  const stats = new Stats();
  const container = document.createElement('div');
  const renderer = new THREE.WebGLRenderer();
  const composer = new THREE.EffectComposer(renderer);
  const scene = new THREE.Scene();
  let mesh;
  const shaderPasses = [];
  const guiModel = {
    shader1: null,
    shader2: null,
    shader3: null,
    param: new THREE.Vector3(1.0, 1.0, 0.0),
    shaders: ['none'],
    textures: textures,
    numberOfPasses: 1
  };

  container.classList.add('container');
  document.body.appendChild(container);
  const width = container.clientWidth;
  const height = container.clientHeight;
  const camera = new THREE.OrthographicCamera(
    width / -2,
    width / 2,
    height / 2,
    height / -2,
    1,
    100
  );

  function setupScene(textureId) {
    scene.remove(mesh);
    const textureLoader = new THREE.TextureLoader();
    textureLoader.load('/textures/' + textureId, texture => {
      const plane = new THREE.PlaneGeometry(width, height);
      const shaderMaterial = new THREE.MeshBasicMaterial({
        map: texture
      });

      mesh = new THREE.Mesh(plane, shaderMaterial);
      scene.add(camera);
      scene.add(mesh);
    });
  }

  function refreshShaderPasses() {
    let shaderPass;

    composer.passes.splice(0, composer.passes.length);
    shaderPass = new THREE.RenderPass(scene, camera);
    composer.addPass(shaderPass);

    for (let i = 0; i < shaderPasses.length; i++) {
      if (!shaderPasses[i]) {
        continue;
      }

      for (let j = 0; j < guiModel.numberOfPasses; j++) {
        shaderPass = new THREE.ShaderPass(shaderPasses[i]);
        composer.addPass(shaderPass);
      }
    }

    shaderPass.renderToScreen = true;
  }

  function initGui() {
    [1, 2, 3].forEach((number) => {
      gui.add(guiModel, 'shader' + number, guiModel.shaders)
        .onChange(shaderName => {
          shaderPasses[number] = shaders[shaderName];
          refreshShaderPasses();
        });
    });

    gui.add(guiModel, 'textures', guiModel.textures).onChange(textureId => {
      setupScene(textureId);
    });

    gui.add(guiModel, 'numberOfPasses', 1, 5).step(1).onChange(refreshShaderPasses);
    gui.add(guiModel.param, 'x', -2, 2).onChange(refreshShaderPasses);
    gui.add(guiModel.param, 'y', -2, 2).onChange(refreshShaderPasses);
    gui.add(guiModel.param, 'z', 0, 5).step(1).onChange(refreshShaderPasses);

    stats.setMode(0);
    stats.domElement.classList.add('stats');
    container.appendChild(stats.domElement);
  }

  function loadShaders() {
    shaders.forEach((shader) => {
      guiModel.shaders.push(shader.key);
      shaders[shader.key] = createTHREEShader(
        vertexShaders[0].code,
        shader.code
      );
    });
  }

  function calcTextureOffsets(width, height, size) {
    const deltaX = 1.0 / width;
    const deltaY = 1.0 / height;
    const distance = Math.floor(size / 2);
    const offsets = [];

    for (let i = -distance; i <= distance; i++) {
      for (let j = -distance; j <= distance; j++) {
        offsets.push(new THREE.Vector2(i * deltaX, j * deltaY));
      }
    }<commit_msg>Add default texture and shader<commit_after>import THREE from 'three';
import 'three/examples/js/postprocessing/EffectComposer';
import 'three/examples/js/postprocessing/MaskPass';
import 'three/examples/js/postprocessing/ShaderPass';
import 'three/examples/js/postprocessing/RenderPass';
import 'three/examples/js/shaders/CopyShader';
import Stats from 'stats.js';
import dat from 'dat-gui';
import shaders from './shaders/fragment';
import vertexShaders from './shaders/vertex';
import textures from './textures';
import './styles/styles.less';

document.addEventListener('DOMContentLoaded', () => {
  const gui = new dat.GUI();
  const stats = new Stats();
  const container = document.createElement('div');
  const renderer = new THREE.WebGLRenderer();
  const composer = new THREE.EffectComposer(renderer);
  const scene = new THREE.Scene();
  let mesh;
  const shaderPasses = [];
  const guiModel = {
    shader1: 'none',
    shader2: 'none',
    shader3: 'none',
    param: new THREE.Vector3(1.0, 1.0, 0.0),
    shaders: ['none'],
    texture: textures[0],
    textures: textures,
    numberOfPasses: 1
  };

  container.classList.add('container');
  document.body.appendChild(container);
  const width = container.clientWidth;
  const height = container.clientHeight;
  const camera = new THREE.OrthographicCamera(
    width / -2,
    width / 2,
    height / 2,
    height / -2,
    1,
    100
  );

  function setupScene(textureId) {
    scene.remove(mesh);
    const textureLoader = new THREE.TextureLoader();
    textureLoader.load('/textures/' + textureId, texture => {
      const plane = new THREE.PlaneGeometry(width, height);
      const shaderMaterial = new THREE.MeshBasicMaterial({
        map: texture
      });

      mesh = new THREE.Mesh(plane, shaderMaterial);
      scene.add(camera);
      scene.add(mesh);
    });
  }

  function refreshShaderPasses() {
    let shaderPass;

    composer.passes.splice(0, composer.passes.length);
    shaderPass = new THREE.RenderPass(scene, camera);
    composer.addPass(shaderPass);

    for (let i = 0; i < shaderPasses.length; i++) {
      if (!shaderPasses[i]) {
        continue;
      }

      for (let j = 0; j < guiModel.numberOfPasses; j++) {
        shaderPass = new THREE.ShaderPass(shaderPasses[i]);
        composer.addPass(shaderPass);
      }
    }

    shaderPass.renderToScreen = true;
  }

  function initGui() {
    [1, 2, 3].forEach((number) => {
      gui.add(guiModel, 'shader' + number, guiModel.shaders)
        .onChange(shaderName => {
          shaderPasses[number] = shaders[shaderName];
          refreshShaderPasses();
        });
    });

    gui.add(guiModel, 'texture', guiModel.textures).onChange(textureId => {
      setupScene(textureId);
    });

    gui.add(guiModel, 'numberOfPasses', 1, 5).step(1).onChange(refreshShaderPasses);
    gui.add(guiModel.param, 'x', -2, 2).onChange(refreshShaderPasses);
    gui.add(guiModel.param, 'y', -2, 2).onChange(refreshShaderPasses);
    gui.add(guiModel.param, 'z', 0, 5).step(1).onChange(refreshShaderPasses);

    stats.setMode(0);
    stats.domElement.classList.add('stats');
    container.appendChild(stats.domElement);
  }

  function loadShaders() {
    shaders.forEach((shader) => {
      guiModel.shaders.push(shader.key);
      shaders[shader.key] = createTHREEShader(
        vertexShaders[0].code,
        shader.code
      );
    });
    guiModel.shader1 = './passthrough.gs';
    shaderPasses[0] = shaders['./passthrough.gs'];
  }

  function calcTextureOffsets(width, height, size) {
    const deltaX = 1.0 / width;
    const deltaY = 1.0 / height;
    const distance = Math.floor(size / 2);
    const offsets = [];

    for (let i = -distance; i <= distance; i++) {
      for (let j = -distance; j <= distance; j++) {
        offsets.push(new THREE.Vector2(i * deltaX, j * deltaY));
      }
    }
{'fraction_non_alphanumeric': 0.14461497750727706, 'fraction_numerical': 0.011775602011114052, 'mean_word_length': 3.180862831858407, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 15, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '590481', 'n_tokens_mistral': 2527, 'n_tokens_neox': 2419, 'n_words': 504}