BLOGas.lt
Sukurk savo BLOGą Kitas atsitiktinis BLOGas

Pseudo GUID generavimas iš JavaScript

Parašė Sergejus | 2011-10-10 16:55

Rašant mobilią atsiliepimų aplikaciją Agile turui, man prisireikė klientų pusėje generuoti GUIDus. Kadangi JavaScript to nepaiko, ieškojau pseudo GIUD generavimo būdų. Iš kelių alternatyvų pasirinkau šią:

var guid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
	var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
	return v.toString(16);
});

O dabar užduotis jums, kas iš skaitytojų paaiškins pateikto kodo veikimo principą?

Rodyk draugams

Nuosavos JavaScript bibliotekos kūrimo karkasas

Parašė Sergejus | 2011-06-20 20:33

MIX11 konferencijos metu dalyvavau vienoje labai įdomioje sesijoje: Good JavaScript Habits for C# Developers. Pagrindinis dalykas kurį išsinešiau – kaip geriausiai rašyti savo JavaScript bibliotekas. Pasirodo, viskas pakankamai paprasta, tereikia pasinaudoti JavaScript kalbos gudrybėmis. Pavyzdžiui, norint realizuoti savo biblioteką SB su metodu say, užtektų panaudoti tokius griaučius:

<!doctype html>
<html>
<head>
    <title>JavaScript Scoping Demo</title>
    <script type="text/javascript">
        (function (global, undefined) {
            var sb = global.sb = {
                say: function (msg) {
                    alert(msg);
                    return false;
                }
            }
        } (this));
    </script>
</head>
<body>
    <script type="text/javascript">
        sb.say("sergejus.blogas.lt!");
    </script>
</body>
</html>

Aukščiau pateiktas karkasas užtikrina, kad niekas piktybiškai negalės pakeisti reikšmės undefined bei globaliai visada bus pasiekiama vardų sritis sb. Taip elegantiška ir paprasta!

Rodyk draugams

Paprastas būdas atvaizduoti Twitter pranešimus

Parašė Sergejus | 2010-08-31 14:03

Twitter pranešimų atvaizdavimas puslapiuose nėra naujas uždavinys. Egzistuoja bent keletas būdų kaip tai galima atlikti (įskaitant ir gatavus komponentus). Šiandien man prisireikė atvaizduoti su tam tikra hash žyme susijusius pranešimus ir padaryti tai norėjosi kuo paprasčiau (kad daugiau žmonių suprastų kas ir kaip yra daroma).

Pirmas dalykas kurį verta išnagrinėti – Twitter API dokumentaciją. Norint gauti su tam tikra hash žyme susijusius pranešimus, užtenka pasinaudoti metodu Search. Iš reikalingų metodo parametrų mums bus reikalingi keli:

  • callback – mūsų atveju tai bus anoniminė funkcija, todėl užrašas atrodys taip: callback=?
  • rpp – grąžinamų pranešimų skaičius
  • q – paieškos žymė, kur vietoje grotelių reikia rašyti %23, pvz., %23mvc (bus ieškoma #mvc)

Sakykime, mes turime tokį HTML kodą:

<div id="sidebar">
    <ul>
        <li>
            <h2>Info</h2>
            Blog: http://sergejus.blogas.lt </li>
        <li>
            <h2>Twitter</h2>
            <ul id="tweets">
            </ul>
        </li>
    </ul>
</div>

Norėdami į elementą tweets pakrauti Twitter pranešimus, aprašykime tokią JavaScript funciją:

function loadTweets(container, search) {
    var url = 'http://search.twitter.com/search.json?callback=?&rpp=10&q=' + search;
    $.getJSON(url, function (data) {
        var html = '';
        $.each(data.results, function (i, tweet) {
            html += '<li><a href="http://twitter.com/' + tweet.from_user + '">'
                 + tweet.from_user + '</a> ' + tweet.text + '</li>';
        });
        $(container).html(html);
    });
}

Kaip matyti, viskas labai paprasta:

  • kreipimąsi į Twitter API
  • gaunamas JavaScript objektas
  • suformuojamas LI elementas
  • galutinis HTML įrašomas į UL elementą

Svarbu tai, kad ši JavaScript funkcija gali ieškoti bet ką. Mūsų atveju loadTweets panaudojimas atrodytų taip:

<script type="text/javascript">
    $(document).ready(function () {
        loadTweets('#tweets', '%23pingy');
    });
</script>

Štai ir viskas – greitai, paprastai, suprantamai.

Rodyk draugams

ASP.NET MVC klaidų apdorojimas iš JavaScript

Parašė Sergejus | 2010-07-27 22:23

Šiais laikais praktiškai sunku įsivaizduoti Web aplikaciją, kuri nenaudotų Ajax technologijos. Vienas iš tradicinių Ajax panaudojimo pavyzdžių – asinchroninis duomenų pakrovimas (kuris su ASP.NET MVC ir jQuery tapo kaip niekada paprastas). Sakykime, mes turime kontrolerį Home:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult GetList()
    {
        throw new HttpException((int)HttpStatusCode.NotImplemented, "This method is not yet implemented");
    }
}

Ir turime puslapį Index.aspx:

<!DOCTYPE>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>ASP.NET MVC serverinių klaidų apdorojimas iš JavaScript</title>
    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.1.js"></script>
</head>
<body>
    <div id="list_content"></div>
</body>
<script type="text/javascript">
    $.ajax({
        url: '/Home/GetList',
        cache: false,
        success: function (data) {
            $('#list_content').html(data);
        }
    });
</script>
</html>

Kaip matyti iš pateikto kodo, pasikrauna tuščias puslapis, kuris bando į DIV elementą asinchroniškai pakrauti duomenis kviečiant kontrolerio Home metodą GetList (kuris pas mus išmeta klaidą). Kaip teisingai pagauti ir apdoroti serverio klaidas iš JavaScript?

Pirma reikia papildyti mūsų kontrolerį perrašant metodą OnException (šią logiką aš dažniausiai iškeliu į bazinį kontrolerį):

protected override void OnException(ExceptionContext filterContext)
{
    if (filterContext.HttpContext.Request.IsAjaxRequest())
    {
        var statusCode = filterContext.Exception is HttpException ?
                        (filterContext.Exception as HttpException).GetHttpCode() :
                        (int)HttpStatusCode.InternalServerError;
        filterContext.HttpContext.Response.StatusCode = statusCode;
        filterContext.Result = new JsonResult
        {
            JsonRequestBehavior = JsonRequestBehavior.AllowGet,
            Data = new
            {
                filterContext.Exception.Message,
                filterContext.Exception.StackTrace,
                Url = filterContext.HttpContext.Request.RawUrl
            }
        };
        filterContext.ExceptionHandled = true;
    }
}

Išnagrinėkime kas yra daroma. Pirma patikrinama ar klaida kilo asinchroninio kreipinio metu. Jeigu taip – patikrinama ar tai HTTP klaida ir jeigu ne, suteikiamas HTTP501 (Internal Server Error) klaidos kodas. Galiausiai yra sudaromas JSON atsakymas, kuriame yra talpinama visa su klaida susijusi informacija (galima papildyti pagal poreikį). Tokiu būdu, vykdant asinchroninį kreipinį, kurio metu serveryje įvyksta klaida, mes gauname klaidos JSON objektą. Beliko šį objektą apdoroti HTML pusėje, tam papildysime jQuery ajax metodą:

<script type="text/javascript">
    $.ajax({
        url: '/Home/GetList',
        cache: false,
        success: function (data) {
            $('#list_content').html(data);
        },
        error: function (response) {
            var ex = $.parseJSON(response.responseText);
            alert("HTTP" + response.status + ": " + ex.Message);
        }
    });
</script>

Įvykus klaidai serverio pusėje, mes gauname klaidos JSON objektą (objekto response savybė responseText), kuriuo toliau galime operuoti apdorojant klaidą.

Tiek mano patirties iš ASP.NET MVC klaidų apdorojimo iš JavaScript. O kokius dar “triukus” jus taikote JavaScript klaidų apdorojimui?

Rodyk draugams

Automatinė jQuery IntelliSense failo registracija

Parašė Sergejus | 2008-11-08 13:26

Su jQuery intellisense failo atsiradimu daugeliui nepatiko faktas, kad šalia pačios bibliotekos reikėdavo užregistruoti ir IntelliSense failą, kurį tekdavo ištrinti prieš pat publikuojant web aplikaciją.



Microsoft išleido Visual Studio pataisą, kuri automatiškai ieško registruotos bibliotekos IntelliSense failo. Tarkime mes turime biblioteka Biblioteka.js, Visual Studio ieškos IntelliSense pirma:


  • Biblioteka-vsdoc.js faile, jeigu neras tada

  • Biblioteka.debug.js faile, jeigu neras tada

  • Biblioteka.js faile

Tokiu būdu galima naudotis IntelliSense pagalba išreikštinai neregistruojant IntelliSense failo!


Pataisą galite parsisiųsti iš čia.

Rodyk draugams

Oficialus jQuery intellisense failas

Parašė Sergejus | 2008-10-28 21:07

Aš jau rašiau, kad nuo šiol Microsoft oficialiai palaiko jQuery JavaScript biblioteką, o dabar jau ir oficialiai išleistas jQuery intellisense failas.


P.S.


Asmeniškai aš susidūriau su problema, kad jQuery atsisako tvarkingai veikti kai naudojamas Master Page ir nuoroda į jQuery intellisense failą įtraukiama po nuorodos į patį jQuery. Po tam tikro derinimo radau išeitį - reikia pirmą įtraukti nuorodą į intellisense failą, o tik paskui į jQuery. Tikiuosi sutaupysite laiko ;)

Rodyk draugams