Vertically repeat texture on side faces only - three.js

Question

I have a geometry of a cube that I need to texture,
In the top of the cube - need to be one image
And in each side of the cube - need to be a second image that vertically repeat based on the cube height
This is the texture:
This is what I need:
And this is what I have so far: three.js/texture1
Any ideas how to achieve what I need, but stay with one material and a few faces as possible?
Thanks.
My code:
function create_geometry() {
var geometry = new THREE.Geometry();
var w = 0.5;
var h = 1;
geometry.vertices.push(
new THREE.Vector3(w, h, w),
new THREE.Vector3(w, h, -w),
new THREE.Vector3(w, 0, w),
new THREE.Vector3(w, 0, -w),
new THREE.Vector3(-w, h, -w),
new THREE.Vector3(-w, h, w),
new THREE.Vector3(-w, 0, -w),
new THREE.Vector3(-w, 0, w)
);
geometry.faces.push(
// wall
new THREE.Face3(0, 2, 1),
new THREE.Face3(2, 3, 1),
// wall
new THREE.Face3(4, 6, 5),
new THREE.Face3(6, 7, 5),
// wall
new THREE.Face3(5, 7, 0),
new THREE.Face3(7, 2, 0),
// wall
new THREE.Face3(1, 3, 4),
new THREE.Face3(3, 6, 4),
//roof
new THREE.Face3(4, 5, 1),
new THREE.Face3(5, 0, 1),
);
geometry.computeFaceNormals();
geometry.faceVertexUvs[0] = [];
geometry.faces[0].materialIndex = 0;
geometry.faces[1].materialIndex = 0;
geometry.faces[2].materialIndex = 0;
geometry.faces[3].materialIndex = 0;
geometry.faces[4].materialIndex = 0;
geometry.faces[5].materialIndex = 0;
geometry.faces[6].materialIndex = 0;
geometry.faces[7].materialIndex = 0;
geometry.faces[8].materialIndex = 0;
geometry.faces[9].materialIndex = 0;
var roof = [
new THREE.Vector2(0.0,1.0),
new THREE.Vector2(0.0,0.5),
new THREE.Vector2(1.0,0.5),
new THREE.Vector2(1.0,1.0),
];
var wall = [
new THREE.Vector2(0.0,0.5),
new THREE.Vector2(0.0,0.0),
new THREE.Vector2(1.0,0.0),
new THREE.Vector2(1.0,0.5),
];
// wall
geometry.faceVertexUvs[0][0] = [ wall[0], wall[1], wall[3] ];
geometry.faceVertexUvs[0][1] = [ wall[1], wall[2], wall[3] ];
// wall
geometry.faceVertexUvs[0][2] = [ wall[0], wall[1], wall[3] ];
geometry.faceVertexUvs[0][3] = [ wall[1], wall[2], wall[3] ];
// wall
geometry.faceVertexUvs[0][4] = [ wall[0], wall[1], wall[3] ];
geometry.faceVertexUvs[0][5] = [ wall[1], wall[2], wall[3] ];
// wall
geometry.faceVertexUvs[0][6] = [ wall[0], wall[1], wall[3] ];
geometry.faceVertexUvs[0][7] = [ wall[1], wall[2], wall[3] ];
// roof
geometry.faceVertexUvs[0][8] = [ roof[0], roof[1], roof[3] ];
geometry.faceVertexUvs[0][9] = [ roof[1], roof[2], roof[3] ];
var matrix = new THREE.Matrix4();
//matrix.makeRotationX ( (270 * Math.PI)/180 );
geometry.applyMatrix( matrix );
geometry.uvsNeedUpdate = true;
return geometry;
}
var renderer = new THREE.WebGLRenderer({antialias:true});
renderer.setSize(800,800);
var container = document.getElementById("container");
container.appendChild(renderer.domElement);
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(45,800/800,1,1000);
camera.position.set(0,10,20);
scene.add(camera);
var controls = new THREE.TrackballControls( camera, renderer.domElement );
controls.minDistance = 15;
controls.maxDistance = 100;
var stats = new Stats();
container.appendChild( stats.dom );
var rendererStats = new THREEx.RendererStats();
rendererStats.domElement.style.position = 'absolute';
rendererStats.domElement.style.right = '0px';
rendererStats.domElement.style.top = '0px';
document.body.appendChild( rendererStats.domElement );
// plane
var plane = new THREE.Mesh(
new THREE.PlaneGeometry( 80, 80, 1 ),
new THREE.MeshBasicMaterial( {color: 0x333333, side: THREE.DoubleSide} )
);
plane.rotation.x = (90 * Math.PI)/180;
scene.add(plane);
//
var geometry = create_geometry();
var texture = new THREE.TextureLoader().load( "texture1.png" );
var material = new THREE.MeshBasicMaterial({ map:texture });
for(var i=0; i<10; i++) {
var cube = new THREE.Mesh( geometry, material );
cube.position.x = i*1.5 - 5*1.5;
//cube.position.y = Math.random()*80 - 40;
cube.scale.y = i + 1;
scene.add( cube );
}
function render() {
controls.update();
stats.update();
rendererStats.update(renderer);
renderer.render( scene, camera );
requestAnimationFrame( render );
}
render();