a_lot_of_dreams

galakhov


Фреймирование, импликация, идиоматизация, ...

...или почему страшно забыть то, что непросто запомнить...


iframe vs pop-up и другие решения при работе со сторонними сайтами
McCloud
galakhov
Как-то раз я тут пытался найти и проанализировать технологии и понять на что (более стабильное и твёрдое) можно было бы заменить поп-ап окна (с поддержкой большинства новых браузеров) при работе со сторонними сайтами?

Мой рисёрч выглядит довольно-таки сумбурно, но в нём имеется логика ;-)

iframe's url through a proxy / JSONP / Uframe:
http://www.ibm.com/developerworks/library/wa-aj-jsonp1/
http://blog.evermind.de/2011/08/04/cross-domain-ajax-posts-mit-jsonp-und-iframes/

MashupOS:
http://research.microsoft.com/en-us/um/people/helenw/papers/mashupos-hotos/index.html
http://research.microsoft.com/apps/dp/search.aspx?q=MashupOS&x=0&y=0#p=1&ps=36&so=1&sb=d&fr=&to=&fd=&td=&rt=&f=&a=&pn=MashupOS&pa=&pd

PostMessage:
https://github.com/ternarylabs/porthole/blob/master/README.md
http://www.slideshare.net/SlexAxton/breaking-the-cross-domain-barrier
http://benalman.com/code/projects/jquery-postmessage/examples/iframe/

Socket Connections:
https://github.com/oyvindkinsey/easyXDM/#readme
http://jquerymobile.com/demos/1.1.0/docs/pages/page-navmodel.html
http://dklab.ru/chicken/nablas/58.html
http://www.telerik.com/community/forums/aspnet-ajax/editor/document-domain-access-denied-in-ie-6.aspx
http://dev.ckeditor.com/changeset/3269
http://ejohn.org/blog/cross-window-messaging/
http://easyxdm.net/wp/ | http://alexsexton.com/thirdparty/#landing-slide

Flash:
https://forum.xaknet.org/showthread.php?s=55367c73dddd5a10b5ad31c9f654edad&t=21542

JavaScript:
http://nodejs.org/docs/v0.6.0/ | http://howtonode.org/websockets-socketio | http://www.youtube.com/watch?v=jo_B4LTHi3I // nodejs
https://github.com/nodejitsu/node-http-proxy | http://blog.nodejitsu.com/http-proxy-intro // node-http-proxy
http://stevehanov.ca/blog/index.php?id=109 | http://zwibbler.com/api.html
https://github.com/flowersinthesand/jquery-socket/blob/master/README.md // jQuery Stream (jquery lib with sockets)
http://blog.std.in/2010/07/08/nodejs-webworker-design/


Ещё была рассмотрена задача захватывать|копировать ссылку со стороннего сайта (после навигации и переключения страниц в нём внутри iframe'a) в клипбоард для дальнейшей её обработки:
http://stackoverflow.com/questions/1539641/copy-text-to-the-clients-clipboard-using-jquery
http://www.steamdev.com/zclip/#download
http://lab.pipwerks.com/javascript/cross-domain-iframes/index.html
http://pipwerks.com/2010/10/17/iframes-and-cross-domain-security-part-3/
http://project.mahemoff.com/jquery-iframe/
http://blog.kotowicz.net/2010/11/xss-track-how-to-quietly-track-whole.html
http://blog.kotowicz.net/2010/11/xss-track-got-ninja-stealth-skills.html
http://kotowicz.net/jquery-hijack/demo/demo.html
http://blog.whatwg.org/whats-next-in-html-episode-2-sandbox
http://www.dyn-web.com/tutorials/iframes/
http://www.dyn-web.com/tutorials/iframes/hidden.php
http://stackoverflow.com/questions/127040/copy-put-text-on-the-clipboard-with-firefox-safari-and-chrome


Но пока что достойного функционирующего варианта с простыми веб технологиями я не нашёл...
Ищем дальше или ждём пока кросс-доменные запросы каким-то образом начнут поддерживаться браузерами или появится какой-нибудь авто-бот, отслеживающий экшены производимые юзером + захватывающий и считывающий и записывающий в лог|хистори хотя бы некоторые данные.
Видел один sci-fi порт толи на asp толи ещё на чём-то, но он был не open source'ом и выглядел скорее как рендер движок для отображения страниц, нежели как что-то могущее передавать актуальное местоположение юзера на сайте родительскому окну...

Перерывая thecartpress (The Professional WordPress eCommerce Plugin)
a_lot_of_dreams
galakhov
Мдаааа... Вот раньше было время... Пишешь небольшой шопик саморучно на php и встраиваешь его в очередной сайтик|портальчег. В нём баааааагов и дыыыыыыыр... Но зато код свой, закрытый типа и попробуй ещё найди уязвимость! А сегодня?! Хых... OpenSource. Бери и юзай.

Мой выбор пал на нехилый такой плагин для wp, именуемый thecartpress'ом.
Немало время, конечно, понадобилось на вникание во внутренности и разрозненности этого плаг-ина, но если уж один раз стал хирургом...

Да и немало возможностей, собственно, дополнить сам плагин другими (написанными под него) плагинами: http://extend.thecartpress.com/
Модулей оплаты явно большой выбор + в т.ч. аж даже робокасса: http://extend.thecartpress.com/ecommerce-plugins/robokassa/

Коммьюнити у них там, действительно, неплохое И даже по-русски дают пообщаться.

Краудфанды сейчас важны и нужны! Один из проектов у них сейчас пытается развится на этой основе.

Кому интересно как я срал (и ещё пока сру) в их коммьюнити в кАмментах, вот ссыль на мой аккаунт.

Вопросы по плагину или разработке? Задавайте! ))

Opera 12 / 2012 / CSS Hack
a_lot_of_dreams
galakhov
Обзор браузера: http://habrahabr.ru/company/opera/blog/145798/
Работающий css hack, чтоб применялось чисто к опере 12+: http://bolknote.ru/2012/06/29/~3675#11

В поисках кросспостера...
a_lot_of_dreams
galakhov
Подумал я тут, и понял, что чётко было бы уже, наконец, найти нормальный кросспостер: писать тут или в любом другом жж-аккаунте, а постится|расшаривается оно он-деманд на фб, плюсе, vk, etc.
Ну и ещё б прикольно было б сделать так, чтоб это был десктоп эпп, например.

На жж есть функция "share", но это же всё лишьнии клики т.е. потерянное время...

В жж есть клиет, но он только для жж: http://www.livejournal.com/download/


Итак ссылки|обзор (+киворды) на тему crossposter from livejournal а-ля кросспостер из жж:

ПЛАГИНЫ:
// это у кого свой блог + wp-post'ы в нём
http://wordpress.org/extend/plugins/lj-xp/ или http://code.google.com/p/ljxp/

// для drupal, видимо, тоже есть версия
http://drupal.org/project/ljxp

// "Добавляет функционал API сайта VKontakte.ru (vk.com) на ваш блог."
http://wordpress.org/extend/plugins/vkontakte-api/

http://www.pagepressapp.com/?hop=fbpageapps


ДЕСКТОП-ЭППЫ или программы-клиенты для того, чтоб постить сразу в livejournal, fb, vk, plus:
http://www.red-sweater.com/marsedit/ // нехилый вариант для мэк-юзеров (минус в том, что надо кракать и вновь понижать свою карму...)

// остальные клиенты для винды (и мака) в этом обзоре (2008-ой год)
http://www.smashingmagazine.com/2008/08/01/15-desktop-blogging-tools-reviewed/

// устаревший вариант, имхо
http://semagic.sourceforge.net // Semagic [только для|Client for] LiveJournal, Blogger, Wordpress


UPDATE:
Обнаружил возможность постить в жж из моего любимого evernote через мыло:
http://yvelious.livejournal.com/25451.html | http://ru-support.evernote.com/question/details/id/30313
А так как в fb & twitter из него и так можно было постить, то останавливаюсь пока на нём!


UPDATE 2:
Из posterous.com нельзя (больше?) кросспостить в жж... Мдя... Но можно на: "Facebook, Facebook Page, Twitter, LinkedIn, Blogger, Tumblr, Typepad, Wordpress, MovableType, Other blog".
Пишут, правда, что: In addition, we also support blogs from Tumblr, Blogger, and Livejournal that do not use the MetaWeblog protocol.
Но всевозможные клиенты прикручиваются на ура.
Короче, надо разобраться в end point'ах и тогда оно может заработать...

Ешё есть такое, чтоб напрямую: http://rss2lj.net
Для поклонников emacs: http://emacswiki.org/emacs/WebloggerMode
Есть ещё всякие скрипты: http://leksus.info/php-skript-avtomaticheskogo-postinga-v-livejournal-zhzh/, но с ними как-то не хочется возится, да и хочется онлайн-сервис и чтоб был автомат-автомат-автомат!


UPDATE 3
Нашёл?!
Источник мега!

Успехов!

О wmeste.de
a_lot_of_dreams
galakhov
Работу над проектом www.wmeste.de мы закончили в конце ноября.
Началом разработки можно считать ноябрь мясяц 2007-го года. В итоге потратили один год. Чистой работы (40 часов в неделю) в портале где-то 5-6 месяцев. Часть программиста составляет 65%, дизайнера 35%. Объем работы большой, опыт прямо пропорционален объему.

Публичного открытия так и не состоялось, потому как рекламы никакой не было. Внутреннее, да.
Намечается переезд на другой более быстрый сервер и с ним вместе прилив пользователей.

Ничего так идейка!
a_lot_of_dreams
galakhov
Dailymugshot.com
Tags:

lightbox, thickbox, GreyBox, slimbox
a_lot_of_dreams
galakhov


В процессе поиска что-то похожего на lightbox2, но не такого громоздкого и глючного я наткнулся на кучу вариантов.
Ими были:
GreyBox — больше подходит для портфолио стэндалоун галлерей;
slimbox — с таким же эффектом как и lightbox2, но легче по размеру;
fancyzoom — без эффекта затемнения, но, по моему мнению, с ещё более модным эффектом. Открывает только по одной фотке.
И другие клоны и вариации.

Мой выбор пал на ThickBox, т.к. используемая в нём аяксовая библиотека jQuery может быть переключена на модус jQuery.noConflict(), который даёт возможность использовать jQuery одновременно с prototype, scriptaculous и другими фрэймворками. Знак $, использующийся для вызова функций, заменяется на jsQuery. Возможно, что и в других библиотеках такое присутствует, но это однозначно большой плюс!

google map custom markers
a_lot_of_dreams
galakhov
Как реализовать сваи собственные маркеры в google map api?

К сожалению, после долгих поисков я не нашёл стандартных средств реализации.
Но нашлась неплохая альтернатива TLable.
Правда, разработка этого extension'a прекратилась, но сама основа хороша.
После некоторых дополнений маркеры приобрели желаемый вид.
Каждый маркер имеет свой собственный контейнер с картинкой и другой информацией о нём внутри.
Результат можно будет скоро увидеть на wmeste.de
Не пропустите начало бета-тестинга!



Прозрачные png в ie6 и выше
a_lot_of_dreams
galakhov
Приспичило сделать картинки (png) с тенями на ребристом фоне. А достаточного альфа-канала можно было добиться только с PNG-24. Я перепробовал много скриптов, но для background-image я не нашёл почти ничего. Кроме одного! В каком-то блоге фричный веб-дизайнер выложил захаканый css-behavior-скрипт, определяющий не только png-картинки в img-тэгах, но и png как фон (background-image) в css. Скрипт, конечно, не проходит css-валидацию, зато работает отменно!

CSS (png_fix.css):

* html img,
* html .png
{
position:relative;
behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
this.src = "transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
);
}


Подсоединять лучше с Conditional Comments для IE6 и выше:

<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="png_fix.css" />
<![endif]-->

Не забудьте, что для замены png в img-тэгах надо положить transparent.gif 1px*1px в корень сайта (или в прописанный/изменённый путь в этом bahavior'e). Для получения прозрачности для картинок, прописанных в background или background-image в самом css, этого делать не надо.
Нужно только присвоить/дописать class="png" для элемента, использующего png как фон.

Источник.
Tags: , ,

# IE Voodoo
a_lot_of_dreams
galakhov
Тема искажения страниц IE движком до сих пор остаётся актуальной. Неотображение прозрачности формата png, 3-пиксельный-баг, казусы с бокс-моделью (пэддинг/бордер) — всё это и многое другое выводит любого разработчика интернет-приложений из себя и заставляет искать другие пути решения проблемы.

А австралийка Chisa нашла универсальный способ бороться с этим. Она сшила Voodoo куклу иконки IE и советует всем кто отчаился втыкать в неё иголки ;)



Кто захочет, может сделать подобное на дому своими руками по этой инструкции!
Tags:

?

Log in