Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.01.2012, 16:03
Аватар для Livanderiaamarum
Профессор
Отправить личное сообщение для Livanderiaamarum Посмотреть профиль Найти все сообщения от Livanderiaamarum
 
Регистрация: 10.12.2011
Сообщений: 290

Загрузчик картинок
Может кому пригодится) и сэкономит 15 минут)
Контейнер для картинок, в чем суть:
Принимает хэш с именами картинок и адресами, вторым аргументом принимает калбак по истечении загрузки всех картинок.
Получить картинку можно так image('имяКартинки')
Хранилище для всех картинок общее, и каблак общий.
Если добавить картинку с уже имеющимся именем, то она перезаписывается.

работает так:
image('текстура дерева', '/img/wood.jpg', function(){ alert('загрузилось!') })
var wood = image('текстура дерева')

или так:
image({'дерево' : '/img/wood.jpg',
'трава' : '/img/trava.jpg'},
function(){ alert('обе текстуры загрузились!') }
)


/**
 * Xранилище картинок
 * 
 * @memberOf images
 */
(function(functionName) {
	// контейнер с картинками
	var imagesContainer = {},
	// счетчик загружающихся картинок
	counter = 0,
	// требуется загрузить картинок
	length = 0,
	// калбак
	callback;

	/**
	 * Обработчик события загрузки картинок
	 */
	function onload() {
		// прибавить счетчик
		counter++
		log(imagesContainer)
		log('counter ' + counter)
		log('length ' + length)
		// если загружены все картинки вызвать калбак
		if (counter === length) {
			// обнулить счетчики
			counter = 0
			length = 0
			return callback && callback()
		}
	}

	/**
	 * Добавить картинку в хранилище
	 * 
	 * @param {String}
	 *            name имя картинки
	 * @param {String}
	 *            url адрес
	 */
	function add(name, url) {
		var img = new Image()
		img.src = url
		// при загрузке картинки
		img.onload = onload
		// засунуть в контейнер
		imagesContainer[name] = img
		// прибавить общую длину картинок
		length++
		return true
	}
	/**
	 * Интерфейс модуля
	 * 
	 * @module images
	 */
	window[functionName] = function(imagesHash, call) {

		// если передана одна строка
		if (arguments.length == 1 && typeof arguments[0] == 'string')
			return imagesContainer[imagesHash];

		// если передан обьект
		if (typeof arguments[0] == 'object') {
			// если вторым аргументом передан калбак
			if (typeof arguments[1] == 'function') {
				// то зафиксировать его
				callback = call
			}
			// добавить картинки
			for (i in imagesHash) {
				add(i, imagesHash[i])
			}
		}

		// если переданы 2 строки
		if (typeof arguments[0] == 'string', typeof arguments[1] == 'string') {
			// добавить картинку
			add(imagesHash, call)
			// если третьим аргументом передан калбак
			if (typeof arguments[2] == 'function') {
				// то зафиксировать его
				callback = arguments[2]
			}
		}
	}
})('image')//имя интерфейса
Ответить с цитированием
  #2 (permalink)  
Старый 15.01.2012, 17:21
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

действительно не понимаю, "зачем так сложно". обьясни, пожалуйста.

я бы сделал загрузчик картинок таким :
load( ['/img/wood.jpg', '/img/trava.jpg'], function(){ alert('обе текстуры загрузились!') });

function load(imgs, clb){
    var a = new Image(), // чтобы каждый раз не создавать объект.
         i = 0;                 
    while(i in imgs) a.src = imgs[ i++ ]; // загружаем в кеш картинки
    clb && clb(); // ну  это ты знаешь :)
};
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Slider с подгрузкой картинок Forpost jQuery 0 02.12.2011 13:03
поочередное открытие картинок Dr.Livsi jQuery 10 31.07.2011 19:11
Загрузчик изображений. Fluid jQuery 3 28.06.2011 14:17
Слайдер не отрабатывает несколько картинок SinX Элементы интерфейса 1 15.05.2011 22:28
Java ScrollTo. Скрол картинок на java. Надо подправить. vdm Ваши сайты и скрипты 1 28.10.2009 20:46