Обява

**Tihomir(imageo)** · 28-08-12, 09:32

От: Разни въпроси към WEB-аджиите...

+1 за jQuery. Няма смисъл да се бориш да тестваш в 10 браузъра, приемаш, че jQuery го е направил вместо теб. То обикновено си пише в документацията му за кои браузъри се поддържа, ако ползваш нещо по-изчанчено. Но в 99% от случаите просто ползваш. А като понапреднеш малко, погледни и twitter bootstrap, но това наистина е за малко напреднали(css частта и темите). Идеята там е, че си пишеш маркъпа, а после просто сменяш цялата тема на сайта с подмяната на 1 css. Това спестява мнооого писане. А за диалог специално - виж в bootstrap, там е направено много добре. Изобщо комбинацията jQuery+bootstrap е много сполучлива. Ползваме го на много места, и наистина улеснява страшно много.

**sparkybg** · 28-08-12, 10:06

От: Разни въпроси към WEB-аджиите...

Първоначално публикуван от Tihomir(imageo) Преглед на мнение

+1 за jQuery.

Слава богу!

Не че не може иначе, ама що иначе! След снощното псуване даже му свикнах.

**Tihomir(imageo)** · 28-08-12, 10:10

От: Разни въпроси към WEB-аджиите...

Погледнато от шеговитата страна на нещата, преди дни попаднах на това:

http://www.vanilla-js.com/

Винаги може да не се ползват разните му библиотеки, но за да си е играл някой да ги прави - има и съответната причина. А тя обикновено е, че ако излезе нов браузър с по-добра поддръжка на нещо си, няма нужда да си пренаписваш скриптовете, само подменяш версията на библиотеката, която някой вече е подобрил/оптимизирал вместо теб ...

**sparkybg** · 28-08-12, 10:48

От: Разни въпроси към WEB-аджиите...

На това нещо не му хващам идеята. Като гледам дефинициите си е стандартен Javascript. Знам че е няколко пъти по-бързо така. Сам пробвах преди да се "счупя" за jquery-то.

Сега мъдря как да си "регистрирам" скриптове, намиращи се в partialview. Не знам дали ако си направя функция, дето да сканира partial view-то за "<script>" тагове, да ги събира на куп и да ги набутва в някой таг в <head> на страницата би станало....

Знам че мога да ги запиша във js файл, да си създам <script> таг в head-а, и да му посоча <src = еди кво си>, и тогава ще ги зареди, ама ми се ще да мога да си ги напиша в самото partial view и те да си вървят без да се грижа повече. Че ще станат доста файлове иначе. Много имам много partialview-та. Страницата поне малко ще прилича на обикновено приложение, и няма как да дефинирам всичко в главната страница, защото ще стане огромна. А тя вече, като набутам CSS-ите за jquery-ui-то, и самите билиотеки за jquery и jquery-ui върви към 300 килобайта, пък ми се ще да е максимално лекичка.

Разбирай - отварям диалог, чието съдържание е partial view, което гепвам от сървъра с get заявка и го набутвам в body-то на страницата. Вътре има и скриптове, ама така набутани, те не вървят. Значи, хващам ги през мой скрипт, набутвам ги в собствено namespace в script таг в head-а на страницата, отварям диалога, и като го затворя, освен че го махам от страницата тотално, махам му и скриптовете от head-а. Ако пък има няколко отворени диалози от един и същ вид, махам скриптовете само когато се затворят всичките. Вече се научих да отвярям произволен брой диалози, и те да не се бъркат помежду си, ама тия скриптове ме тормозат, ръиш ли...

**sparkybg** · 28-08-12, 13:20

От: Разни въпроси към WEB-аджиите...

Баси! КЪДЕ МИ Е СКРИПТА??????

Случка: Зареждам PartialView в jquery UI dialog. В самия Partialview има <script> таг с една функцийка вътре, просто за проба. Пускам, зарежда се, диалога излиза, скрипта се изпълнява (в случая при натискане на бутон). Давам "inspect element" да ми покаже сорса и.... в сорса скрипта го няма никъде, а продължава да се испълнява! Някой да има идея какво става?

Ето какво съдържа PartialView-то:

Код:

@model OmegaWEB_MVC3.Models.ModalModel1
Hi,
This is my first modal form
//за това иде реч:
<script type="text/javascript">
    function Proba() {
        alert("PROBA!!!");
        alert("PROBA2");
    }
</script>
<button onclick="MyModal.Close(this)">Close</button>
<button onclick="Proba()">Proba</button>
@using (Html.BeginForm(null,null, FormMethod.Post, new { onsubmit = "{return MyModal.Submit(this)}" }))
{
    <div>
        <fieldset>
            <legend>Account Information</legend>


            <div class="editor-label">
                @Html.LabelFor(m => m.Field1)
            </div>
            <div class="editor-field">
                @Html.TextBoxFor(m => m.Field1)
            </div>


            <div class="editor-label">
                @Html.LabelFor(m => m.Field2)
            </div>
            <div class="editor-field">
                @Html.TextBoxFor(m => m.Field2)
            </div>


            <div class="editor-label">
                @Html.LabelFor(m => m.Field3)
            </div>
            <div class="editor-field">
                @Html.TextBoxFor(m => m.Field3)
            </div>


            <p>
                <input type="submit" value="Submit" />
            </p>            
        </fieldset>
    </div>
}

А ей-така го зареждам:

Код:

var MyModal = {    
    Open: function(vurl) {
        var xmlHttp = new XMLHttpRequest();
        xmlHttp.open("GET", vurl, false);
        xmlHttp.send(null);
        XMLHttpRequest
        with ($('<div></div>')) {
            html(xmlHttp.responseText);
            dialog({
                modal: false,
                title: "kljfkljdlkjdslfk",
                open: function () { },
                close: function () { $(this).remove(); }
            });
        }
    },

Пак да кажа - след зареждане и показване на диалога, скрипта отсъства от сорса на страницата, показана през "inspect element", обаче продължава да се изпълнява коректно. Та, КЪДЕ МИ Е СКРИПТА???

**sparkybg** · 28-08-12, 14:59

От: Разни въпроси към WEB-аджиите...

Горе долу се ориентирах. Хром и Опера (предполагаемо и IE9) го компилират и "inject"-ват. FireFox го пуска през "eval". Всичките го скриват, но само във FF може да се види като се отиде на скриптове и после на "eval".

Въпроса е, където и да го Inject-ват, трябва ли да го махам след това, и как. Същия въпрос и когато е през eval. Някой, нещо?

**sparkybg** · 28-08-12, 16:58

От: Разни въпроси към WEB-аджиите...

Въпроса е изяснен - qjuery-то автоматично минава всички скриптове през qjuery.globalEval(), и после ги маха от сорса. Просто различните браузери имат различен механизъм за това, и jquery-то ползва метод според браузъра.

**sparkybg** · 16-09-12, 21:44

От: Разни въпроси към WEB-аджиите...

Някой да се е борил със SVG в IE8? Гледам има разни библиотеки, ама се чудя коя да избера. Идеята е да мога да зареждам SVG файлове и да ги използвам като всяка друга картинка. Май друга опция освен SVG за векторна графика върху WEB страница няма. Всичко това е ОК, ама IE8 не поддъжа SVG, пък се налага да се поддържа. HTML5 canvas не върши работа, защото крайния резултат е bitmap, със всичките му недостатъци. Flash е "аут ъф куесчън".

Вашите 5 стинки?

ПП: И друго - част от диалозите зареждам динамично през xmlhttprequest, респонса от който слагам в новонаправен div, който пускам през $(бла-бла).dialog() (това е widget за диалози в jquery-ui). Само че, в диалозите трябва да има скриптове, съдържащи специфичните им локални функции. Правя го като си инициализирам неймспейс към диалога, който зареждам и там блъскам кода. самата функция "dialog" прекарва всички скриптове през glоbaleval(), а докато ги пуска има налична глобална променлива "thisdialog", та скрипта да знае към къде да се закачи като неймспейс.

Това хубаво, всичко работи, и лично аз не виждам проблем, ама половината web пищи колко гадно било динамичното зареждане на скриптове от сървъра и какви рискове криело. Какви са рисковете, щом работя през xmlhttprequest, който по дефиниция може да тегли данни само от сървъра, през който е изтетглена страницата, щото аз не се сещам? И още повече, какви са рисковете, ако всичко това минава през htpps??? В крайна сметка до колкото разбирам почти същото става и когато се теглят данни в JSON формат от сървъра, а пък това се ползва масово.

**Daniel** · 17-09-12, 07:27

Re: Разни въпроси към WEB-аджиите...

Flash е "аут ъф куесчън"

Обаче ти е единствената опция за да работи навсякъде.

**sparkybg** · 17-09-12, 09:28

От: Re: Разни въпроси към WEB-аджиите...

Първоначално публикуван от Daniel Преглед на мнение

Обаче ти е единствената опция за да работи навсякъде.

Да де, ама ще го има ли след 5 години, примерно?

Трябва ми да работи от IE8 нагоре. Да гоня надолу от това просто няма сми. И това БЕЗ да се инсталира нищо освен javascript библиотеки (което прави http://raphaeljs.com/ например). Това например работи и на IE8: http://raphaeljs.com/tiger.html , както и на всичко, с което съм го пробвал, с изключение на телефона ми.

ПП: Позачетох се... Това горното работи, разчитайки на SVG или VML. Ако броузъра не поддържа SVG, прави го през VML, което значи поддръжка на IE6+ и всичко друго, поддържащо SVG директно.

**Daniel** · 17-09-12, 10:20

Re: Разни въпроси към WEB-аджиите...

Ами ще го има флеша, а нищо не пречи да дадеш опции и за двата варианта, или който няма флеш svg или каквото ти хрумне.

**Tihomir(imageo)** · 17-09-12, 10:26

От: Разни въпроси към WEB-аджиите...

Нямам много опит с графика, но знам, че е зле работата с браузърите

Най-добре е да търсиш библиотека, която да поддържа SVG с fall-back към друга технология ако браузъра не поддържа. Един приятел дизайнер ми прати това:

https://github.com/Modernizr/Moderni...wser-Polyfills

Има разни идеи там.

Относно динамичното зареждане на JS - има добри и лоши страни. По принцип, е по-добре да си зареждаш предватително каквото може - основните скриптове за валидация. Предимството е, че като ги компресираш, и ги заредиш веднъж, след това те се кешират в браузъра, и повече не се зареждат. Тук има един трик - именуваш файла с някаква версия в името, и после даваш на web server-a да връща Expires header-а примерно 1 година напред, така се кешира при клиента еднократно. При промяна в скрипта - променяш и името(версията), и той се презарежда от клиента при следващо зареждане на страницата, и така след 1 година ще го иска пак.
Но това е полезно за сравнително статични скриптове, които се ползват на повечко страници. Ако имаш скриптове, които са валидни само за конкретна страница/форма - тогава може да се зарежда динамично, но все пак аз не бих го правил така. Обикновено в master page-a зареждаш основните скриптове, които са глобални. А във всяка вътрешна страница може да си зареждаш специфични за страницата скриптчета, и да си ги викаш когато трябва - примерно при отваряне на диалог може да си дефинираш :

var onDialogFunctions = Array();

function onDialog(page_or_form){
for (var i=0; i<onDialogFunctions.length;i++){
onDialogFunctions[i](page_or_form);
}
}

Така всяка страница/форма си дефинира какво да се вика при отваряне на диалог, и той си го вика през глобален скрипт... Така стават малко по-модулно нещата.

П.С. А това SVG не може ли да се замени с нещо друго? С каква точно цел се ползва? Дали няма по-добри алтернативи?

**sparkybg** · 17-09-12, 13:19

От: Разни въпроси към WEB-аджиите...

Първоначално публикуван от Tihomir(imageo) Преглед на мнение

П.С. А това SVG не може ли да се замени с нещо друго? С каква точно цел се ползва? Дали няма по-добри алтернативи?

Еми SVG-то е векторна графика - все едно правено с CorelDraw, или векторен PDF, или квото се сетиш още. Модерните браузери поддържат SVG, при това всичко, различно от IE го поддържа отдавна. Обаче IE7 и IE8 - не. Поддържат VML, което общо взето може същото, но дефинициите в самия HTML са тотално различни. Алтернатива без да се инсталира нищо няма. Явно ще се ползва Raphael. Има малко грижи с конвертирането от SVG към Javascript, ама си има конвертори за целта (които още не съм пробвал, но и до там ще стигнем).

А защо ми е - защото на сравнително прости векторни иконки кода е малко, а можеш да ги ползваш например да се скейлват като сложиш мишката върху тях, без да стават на квадрати. Като имаш хубав монитор и си си настроил броузера на 125-150%, пак всичко изглежда перфектно, вместо да се замазва и да става на ръбчета. Можеш дори да си направиш векторни бутони например, с доста по-богати ефекти от на css3 (който не се поддържа изцяло даже и от IE9) които на всичкото отгоре ще изглеждат еднакво навсякъде, от IE6 та до последните версии на браузърите.

...и т.н.

За диалозите, аз точно това правя, но по по-различен начин - права празен div, и в innerHTML-то му набутвам респонса, разбирай partial view-то, изпратено от сървъра. В него са си и скриптовете, и всичко останало. Като го пусна на jquery-ui dialog widget-а да го конструира, той директно eval-ва скриптовете. А скрипта в общи линии е един, например:

Код:

thisdialog.rootns = {

   parentdialog: thisdialog, //за да могат фунциите в тоя неймспейс да знаят кой е DOM елемента, за който се отнасят

   somefunction1: function() {
        alert("bla-bla1")
   },

   somefunction2: function() {
        alert("bla-bla2")
   },

   submit: function(form) {
       var that = this;
       if(myapp.validateform(form)) {
           thisdialog.dialog('close'); //затваря текущия диалог ако всичко с данните е наред
           return;
       }
       myapp.showduialog({url:"someurl", callback: function(){that.subdlgclose()} }); //отваря нов диалог при грешка
   },

   subdlgclose: function() { //callback при затваряне на диалога за грешка
         //do something
   }
   ....
}

По тоя начин не замърсявам глобалния неймспейс, а си дефинирам набор от функции в отделен неймспейс, който е вързан към div-а на диалога, който се показва, и съответно в момента, в който div-а отиде в небитието (ако диалога е динамичен, а не статично дефиниран в страницата), неймспейса си отива с него, без да се намесва където и да е. Ама дори div-а да си стои на страницата вовеки, той няма да пречи на нищо, щото си седи в неговиа си "гьол". По тоя начин мога да заредя и покажа едновременно колкото си искам диалози, и те ще са напълно самостоятелни, но съвсем спокойно мога да им дефинирам неймспейсовете да са със стандартно име, и съответно после при писането всички диалози да си имат "rootns" в div-а, който им е контейнер, и съответно да се обръщат към функциите в него по стандартен начин.

До колкото разбирам твоя подход прави същото, ама по малко по-различен начин. Другото е че мога да си дефинирам базов обект за диалозите, и после да променям или добавям функции към него, което пък ще ми спести доста писане, ако диалозите имат еднакви функции. Естествено вместо да правя това, общите функции мога да обявя глобално, но това ми отнема възможността всеки диалог да може да променя каквото му е кеф, без да се безпокои за останалите.

**persuader** · 18-09-12, 02:30

От: Разни въпроси към WEB-аджиите...

имай предвид че самия рафаел е доста бъгав нашия девелопер доста го псува и дописва някакви неща - ако имаш някакви въпроси ще го питам инак това ти е единствената алтернатива на флаша.

**Daniel** · 18-09-12, 06:15

Re: Разни въпроси към WEB-аджиите...

Като имаш хубав монитор и си си настроил броузера на 125-150%, пак всичко изглежда перфектно, вместо да се замазва и да става на ръбчета. Можеш дори да си направиш векторни бутони например, с доста по-богати ефекти от на css3 (който не се поддържа изцяло даже и от IE9) които на всичкото отгоре ще изглеждат еднакво навсякъде, от IE6 та до последните версии на браузърите.

Спарки мисля си, че ще получиш повече проблеми отколкото екстри, ако това искаш да го ползваш за дизайн не виждам никакъв смисъл. Ползвай си някое УИ за целта (не че то няма проблем).

Обява

Разни въпроси към WEB-аджиите...

Коментар

Коментар

Коментар

Коментар

Коментар

Коментар

Коментар

Коментар

Коментар

Коментар

Коментар

Коментар

Коментар

Коментар

Коментар

Активност за темата