<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Блог Вована &#187; javascript</title>
	<atom:link href="http://blog.vovana.com/cat/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.vovana.com</link>
	<description></description>
	<lastBuildDate>Mon, 22 Nov 2010 10:31:31 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1</generator>
		<item>
		<title>Greasemonkey скрипт для Dirty.ru</title>
		<link>http://blog.vovana.com/ne-pridumal-kuda/greasemonkey-skript-dlya-dirtyru/</link>
		<comments>http://blog.vovana.com/ne-pridumal-kuda/greasemonkey-skript-dlya-dirtyru/#comments</comments>
		<pubDate>Thu, 06 Nov 2008 12:36:54 +0000</pubDate>
		<dc:creator>vovan</dc:creator>
				<category><![CDATA[javascript]]></category>
		<category><![CDATA[Разное]]></category>
		<category><![CDATA[firefox]]></category>
		<category><![CDATA[greasemonkey]]></category>
		<category><![CDATA[javascritp]]></category>
		<category><![CDATA[script]]></category>
		<category><![CDATA[скрипт]]></category>

		<guid isPermaLink="false">http://blog.vovana.com/?p=120</guid>
		<description><![CDATA[Когда-то давно не dirty.ru проскакивал простенький скрипт: он добавлял для ссылок с википедии, ливжорнала и т.д. лого сайта перед ссылкой.  Мне это показалось тогда не достаточно удобным: когда в посте несколько ссылок подряд, например, на youtube ролики, то получается каша. И вот недавно я написал свою реализацию скрипта: в постах и комментариях, при наведении на [...]]]></description>
			<content:encoded><![CDATA[<p>Когда-то давно не dirty.ru проскакивал простенький скрипт: он добавлял для ссылок с википедии, ливжорнала и т.д. лого сайта перед ссылкой.  Мне это показалось тогда не достаточно удобным: когда в посте несколько ссылок подряд, например, на youtube ролики, то получается каша.</p>
<p>И вот недавно я написал свою реализацию скрипта: в постах и комментариях, при наведении на ссылку мышкой, появляется лого сайта (favicon), если оно есть.<span id="more-120"></span></p>
<p>Результат будет приблизительно таким:</p>
<p><a href="http://blog.vovana.com/wp-content/uploads/2008/11/dirtyicosuser.jpg"><img class="alignnone size-full wp-image-123" style="border: 1px solid gray" title="dirtyicosuser" src="http://blog.vovana.com/wp-content/uploads/2008/11/dirtyicosuser.jpg" alt="" width="319" height="160" /></a></p>
<p>Не сложный код скрипта:</p>
<pre lang="php" lineno="1">	var url_reg = new RegExp(/(http:\/\/.*?)\/.*/);

	elements = document.getElementsByTagName('div');

	for (i=0;i<elements.length;i++) {

		if (elements[i].className=='dt') {

			aelements = elements[i].getElementsByTagName("a");
			for (j=0;j<aelements.length;j++) {
				if (!aelements[j].getAttribute("href").match("comments")) {
					ico_src=aelements[j].getAttribute("href").match(url_reg)[1];

					aelements[j].setAttribute("onMouseOver",'this.setAttribute("style","padding-top: 16px;background-image:url('+ico_src+'/favicon.ico);background-repeat:no-repeat")');
					aelements[j].setAttribute("onMouseOut",'this.setAttribute("style","background:none")');
				}
			}

		}
	}</pre>
<p>Установить готовый скрипт можно отсюда: <a href="http://userscripts.org/scripts/show/36620" target="_blank">dirty.icos</a>. Для работы необходимо предварительно установить <a href="https://addons.mozilla.org/ru/firefox/addon/748" target="_blank">Greasemonkey</a>.</p>
<p>Работает, естественно, только на сайте <a href="http://dirty.ru">dirty.ru</a> и только в firefox <img src='http://blog.vovana.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' />  (Хотя есть еще попытка реализации greasemonkey для opera, но я не проверял)</p>
<p><b>update:</b> сообщили что скрипт работает и для lepra.ru</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.vovana.com/ne-pridumal-kuda/greasemonkey-skript-dlya-dirtyru/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Загрузка произвольного количества файлов на сервер</title>
		<link>http://blog.vovana.com/telezka-s/zagruzka-proizvolnogo-kolichesva-fajlov-na-server/</link>
		<comments>http://blog.vovana.com/telezka-s/zagruzka-proizvolnogo-kolichesva-fajlov-na-server/#comments</comments>
		<pubDate>Wed, 06 Feb 2008 12:05:48 +0000</pubDate>
		<dc:creator>vovan</dc:creator>
				<category><![CDATA[javascript]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[Дележка опытом]]></category>
		<category><![CDATA[Разработка]]></category>
		<category><![CDATA[выбор файлов]]></category>
		<category><![CDATA[загрузка файлов]]></category>
		<category><![CDATA[пхп]]></category>
		<category><![CDATA[разрабока]]></category>
		<category><![CDATA[форма]]></category>

		<guid isPermaLink="false">http://blog.vovana.com/2008/02/06/100</guid>
		<description><![CDATA[Что я подразумеваю под загрузкой произвольного количества: пользователь выбирает сколько угодно файлов, нажимает кнопку &#8220;загрузить&#8221; и файлы загружаются на сервер и обрабатываются. Новые поля для выбора файлов создаются динамически. Шаг 1: Создаём форму &#60;form method=&#8221;POST&#8221; id=&#8221;upform&#8221; name=&#8221;upform&#8221; enctype=&#8221;multipart/form-data&#8221;&#62; &#60;input type=&#8221;file&#8221; size=&#8221;50&#8243; onchange=&#8221;addElement()&#8221; name=&#8221;first&#8221;&#62; &#60;/form&#62; &#60;input type=&#8221;button&#8221; value=&#8221;Загрузить&#8221; onclick=&#8221;upform.submit()&#8221;&#62; На форме у нас всего один элемент [...]]]></description>
			<content:encoded><![CDATA[<p>Что я подразумеваю под загрузкой произвольного количества: пользователь выбирает сколько угодно файлов, нажимает кнопку &#8220;загрузить&#8221; и файлы загружаются на сервер и обрабатываются. Новые поля для выбора файлов создаются динамически.</p>
<p><strong>Шаг 1: Создаём форму</strong></p>
<blockquote><p>&lt;form method=&#8221;POST&#8221; id=&#8221;upform&#8221; name=&#8221;upform&#8221; enctype=&#8221;multipart/form-data&#8221;&gt;<br />
&lt;input type=&#8221;file&#8221; size=&#8221;50&#8243; onchange=&#8221;addElement()&#8221; name=&#8221;first&#8221;&gt;<br />
&lt;/form&gt;</p>
<p>&lt;input type=&#8221;button&#8221; value=&#8221;Загрузить&#8221; onclick=&#8221;upform.submit()&#8221;&gt;</p></blockquote>
<blockquote></blockquote>
<p>На форме у нас всего один элемент для загрузки файлов под именем <em>first</em> и назначено событие на изменение(выбор) файла &#8211; <em>addElement()</em>. Кнопка загрузить стоит отдельно от формы, почему сделано именно так будет объяснено далее.</p>
<p><strong>Шаг 2: Создаем javascript функцию динамического добавления нового поля для файла </strong></p>
<blockquote><p>&lt;script&gt;<br />
function addElement() {<br />
var uf = document.getElementById(&#8216;upform&#8217;);</p>
<p>// Создаём новое поле для выбора файла<br />
var newFile = document.createElement(&#8216;input&#8217;);</p>
<p>var fileIdName = &#8216;myFile&#8217;+Math.random(); //Случайное имя</p>
<p>newFile.setAttribute(&#8216;id&#8217;,fileIdName);<br />
newFile.setAttribute(&#8216;name&#8217;,fileIdName);<br />
newFile.setAttribute(&#8216;type&#8217;,'file&#8217;);<br />
newFile.setAttribute(&#8216;size&#8217;,&#8217;50&#8242;);</p>
<p>// при выборе файла данное поле тоже должно добавлять еще одно поле<br />
newFile.setAttribute(&#8216;onChange&#8217;,'addElement()&#8217;);<br />
newFile.onchange = addElement;</p>
<p>uf.appendChild(newFile); // добавляем поле к форме, поле добавится в конец формы, потому мы ранее<br />
// и вынесли кнопку &#8220;загрузить&#8221; за форму &#8211; логичнее она будет смотреться в конце<br />
}<br />
&lt;/script&gt;</p></blockquote>
<p><strong> Шаг 3: Обработка загруженных файлов на сервере</strong></p>
<p>Для обработки файлов на сервере вставляем следующий код:</p>
<blockquote><p>foreach ($_FILES as $file) {</p>
<p>// здесь стандартная обработка загруженных файлов, примеров в интернете полно<br />
// также здесь можно проверять, например, что это динамически добавлненное поле (у нас оно начинается с &#8220;myFile&#8221;)</p>
<p>}</p></blockquote>
<p>Рабочий пример можно посмотреть <a href="http://blog.vovana.com/scripts/multiselect_for_upload.html" target="_blank">здесь</a> (в примере опущено enctype=&#8221;multipart/form-data&#8221;).</p>
<p>Код написан для админки одного из сайтов фирмы Бош, он не идеален (например если два раза выбрать файл в первом поле, то будет два пустых поля), но это не сложно добавить самим <img src='http://blog.vovana.com/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' />  Гарантированно работает в <em>Firefox</em>, <em>IE</em>, <em>Opera</em>. Удачного кодинга!</p>
<p><strong>UPDATE:</strong> по просьбе выкладываю серверную часть загрузки файлов<span id="more-100"></span></p>
<p><strong>Шаг 3.1: </strong><strong>Обработка загруженных файлов на сервере (код)</strong></p>
<p>Вот приблизительный код(урезанный), который я использую. Имейте в виду что код используется строго в админке, по этому в паблик доступе с безопасностью могут быть проблемы <img src='http://blog.vovana.com/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<blockquote><p> $upload_path         = $_SERVER['DOCUMENT_ROOT'].&#8221;/uploads&#8221;;<br />
$valid_types         = array(<br />
&#8220;pdf&#8221;, &#8216;doc&#8217;, &#8216;txt&#8217;, &#8216;jpg&#8217;,'xls&#8217;,'gif&#8217;,'png&#8217;,'zip&#8217;,'rar&#8217;<br />
);<br />
$max_file_size        = &#8220;10000000&#8243;;</p>
<p>if (sizeof($_FILES)&gt;0) {<br />
$errors = array();</p>
<p>foreach ($_FILES as $file) {<br />
if (strlen($file["name"])&lt;=0)<br />
continue;<br />
if (is_uploaded_file($file['tmp_name'])) {<br />
$filename = $file['tmp_name'];<br />
$ext = substr($file['name'], 1 + strrpos($file['name'], &#8220;.&#8221;));<br />
$ext = strtolower($ext);<br />
$name = $file['name'];<br />
if (file_exists($upload_path.$name)) {<br />
$errors[$name] = &#8220;\nТакой файл уже существует&#8221;;<br />
} elseif (filesize($filename) &gt; $max_file_size) {<br />
$errors[$name] = &#8220;\nРазмер файла больше 10 мегабайт&#8221;;<br />
} elseif (!in_array($ext, $valid_types)) {<br />
$errors[$name] = &#8220;\nНе верный тип файла. &#8220;;<br />
} else {<br />
$size =$file['size'];<br />
if (@move_uploaded_file($filename, $upload_path.$name)) {<br />
// Здесь запись в базу, если необходимо<br />
} else {<br />
$errors[$name] = &#8220;\nОшибка перемещения файла. &#8220;;<br />
}</p>
<p>}<br />
} else {<br />
$errors[$name] = &#8220;\nНеобходимо выбрать правильный файл.&#8221;;<br />
}<br />
}<br />
}</p></blockquote>
<p>Небольшие комментарии:</p>
<ul>
<li>в  $errors падают ошибки загрузки файлов</li>
<li>в коде проверяются ТОЛЬКО расширения по списку ($valid_types), но не реальныйтип файла</li>
<li>и да &#8211; 10 мегабайт, не 10000000 байт, я в курсе <img src='http://blog.vovana.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://blog.vovana.com/telezka-s/zagruzka-proizvolnogo-kolichesva-fajlov-na-server/feed/</wfw:commentRss>
		<slash:comments>19</slash:comments>
		</item>
	</channel>
</rss>

