Search Results

Search found 29575 results on 1183 pages for 'dynamic javascript'.

Page 772/1183 | < Previous Page | 768 769 770 771 772 773 774 775 776 777 778 779  | Next Page >

  • Mac - Flash file not loaded in independent flash player

    - by Mugdha
    Hi, I am working on an independent application to play flash files on Mac. I have already done the same for Linux, and it works flawlessly but on mac for some reason flash is not drawing to my window. It is not throwing any kind of error too. I am using Flash player 10, that would mean that I am using the Core Graphics drawing model. I am able to send mouse events to flash and wrote a sample plugin to check if there was a problem in the context that I was sending, but my sample plugin draws properly to the window. I am getting a call for NPN_InvalidateRect twice and as a response I send an update Event back to flash. I drew a dummy rectangle to check that my context is correct. I have flipped the context to make the origin as top left corner. On doing right click on the debug version of the flash player it shows the following message: "Movie not loaded..." Can anyone give me any idea why is the content not being drawn? I would really appreciate the help, as I have been struggling with it for more than a month now. Here is a small log of the interaction that I have with flash: NPN_UserAgent Called NPN_GetValue Called with variable NPNVWindowNPObject; return NULL NPN_GetValue Called with variable NPNVWindowNPObject; return NULL NPN_GetValue Called with variable NPNVSupportsWindowless; return true NPN_SetValue Called for Variable - NPPVpluginTransparentBool; return true NPN_GetValue Called with variable NPNVsupportsCoreGraphicsBool; return true NPN_SetValue Called for Variable - NPNVpluginDrawingModel NPP_SetWindow (CoreGraphics): 0, window=0xebaa90, context=0xe4c930, window.x:0 window.y:22 window.width:480 window.height:270 NPP_HandleEvent(activateEvent) accepted:0 isActive: 1 NPP_HandleEvent(updateEvt) accepted: 1 NPN_UserAgent Called NPN_GetURLNotify Called with URL - javascript:top.location+"flashplugin_unique" NPN_GetValue Called with variable NPNVWindowNPObject; return NULL NPP_NewStream URL=/Users/mjain/Desktop/clock.swf MIME=application/x-shockwave-flash error=0 NPP_WriteReady responseURL=/Users/mjain/Desktop/clock.swf bytes=268435455 NPN_InvalidateRect Called NPP_Write responseURL=/Users/mjain/Desktop/clock.swf bytes=9925 total-delivered=9925/9925 NPP_WriteReady responseURL=/Users/mjain/Desktop/clock.swf bytes=268435455 NPP_DestroyStream responseURL=/Users/mjain/Desktop/clock.swf error=0 NPP_HandleEvent(updateEvt) accepted: 1 NPN_InvalidateRect Called NPP_HandleEvent(updateEvt) accepted: 1 NPP_NewStream URL=javascript:top.location+"flashplugin_unique" MIME=text/plain error=0 NPP_WriteReady responseURL=javascript:top.location+"flashplugin_unique" bytes=16000 NPN_UserAgent Called NPP_Write responseURL=javascript:top.location+"flashplugin_unique" bytes=52 total-delivered=52/52 NPP_WriteReady responseURL=javascript:top.location+"flashplugin_unique" bytes=16000 NPP_DestroyStream responseURL=javascript:top.location+"flashplugin_unique" error=0 NPP_URLNotify responseURL=javascript:top.location+"flashplugin_unique" reason=0 Thanks Mugdha.

    Read the article

  • PHP Echo a large block of text

    - by Thomas
    Im new to PHP and I can't figure out what the rules are for using the echo function. For example, if I need to echo a large block of css/js, do I need to add echo to each line of text or is there a way to echo a large block of code with a single echo? When I try to echo a big block of code like this one, I get an error: if (is_single()) { echo '<link type="text/css" rel="stylesheet" href="http://jotform.com/css/styles/form.css"/><style type="text/css"> .form-label{ width:150px !important; } .form-label-left{ width:150px !important; } .form-line{ padding:10px; } .form-label-right{ width:150px !important; } body, html{ margin:0; padding:0; background:false; } .form-all{ margin:0px auto; padding-top:20px; width:650px !important; color:Black; font-family:Verdana; font-size:12px; } </style> <link href="http://jotform.com/css/calendarview.css" rel="stylesheet" type="text/css" /> <script src="http://jotform.com/js/prototype.js" type="text/javascript"></script> <script src="http://jotform.com/js/protoplus.js" type="text/javascript"></script> <script src="http://jotform.com/js/protoplus-ui.js" type="text/javascript"></script> <script src="http://jotform.com/js/jotform.js?v3" type="text/javascript"></script> <script src="http://jotform.com/js/location.js" type="text/javascript"></script> <script src="http://jotform.com/js/calendarview.js" type="text/javascript"></script> <script type="text/javascript"> JotForm.init(function(){ $('input_6').hint('ex: [email protected]'); }); </script>'; }else { } Is there a better way to echo large blocks of code without a lot of work (adding echo to each line for example)?

    Read the article

  • Generating custom-form documents from base-form plus XML?

    - by KlaymenDK
    Hi all, this is my first stack overflow, and it's a complex one. Sorry. My task is to generate custom documents from a basic template plus some XML without having a custom form design element for each case. Here's the whole picture: We are building a Lotus Notes (client, not web) application for world-wide application access control; the scope is something like 400.000 users being able to request access to any of 1000+ applications. Each application needs its own request form -- different number of approvers, various info required, that sort of thing. We simply can't have a thousand forms in a database (one per application), and anyway their maintenance really needs to be pushed from the developers to the application owners. So instead of custom forms, we'd like to create a generic "template" form that stores a block of basic fields, but then allows application owners to define another block of fields dynamically -- "I want a mandatory plain-text field named 'Name' here, and then a date field named 'Due' here that must be later than today's date, and then ...". I hope this makes sense (if not, think of it as a generic questionnaire application). I pretty much have the structure in place for designing the dynamic fields (form builder GUI - XML-encoded data - pre-rendered DXL for injecting into a form), including mark-up for field types, value options, and rudimentary field validation instructions. My problem is generating a document with this dynamic content injected at the proper location (without needing a custom form design element for each case). Doing the dynamic content via HTML is out. The Notes client web rendering is simply way too poor, and it would be quite a challenge to implement things like field validation instructions, date selectors, and name look-ups. DXL, on the other hand, would allow us to use native Notes fields and code. As a tech demo, I've managed to implement a custom form generator that injects the pre-rendered DXL for the dynamic content into a base form; but as I said, we don't want a ton of custom form design elements. I've tried to implement a way to create a document with the "store form in document" flag set, but once I've created the document from the base form, I can't get DXL access to the stored form design, and so I can't inject my dynamic content. I know this is not something Notes was ever intended to do. Has anyone ever tried something like it (and gotten away with it)? Thanks for reading this far. With a boatload of thanks in advance, Jan Gundtofte-Bruun

    Read the article

  • Can't get jQuery AutoComplete to work with External JSON

    - by rockinthesixstring
    I'm working on an ASP.NET app where I'm in need of jQuery AutoComplete. Currently there is nothing happening when I type data into the txt63 input box (and before you flame me for using a name like txt63, I know, I know... but it's not my call :D ). Here's my javascript code <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js" type="text/javascript"></script> <script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.1.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script> <script language="javascript" type="text/javascript"> var theSource = '../RegionsAutoComplete.axd?PID=<%= hidden62.value %>' $(function () { $('#<%= txt63.ClientID %>').autocomplete({ source: theSource, minLength: 2, select: function (event, ui) { $('#<%= hidden63.ClientID %>').val(ui.item.id); } }); }); and here is my HTTP Handler Namespace BT.Handlers Public Class RegionsAutoComplete : Implements IHttpHandler Public ReadOnly Property IsReusable() As Boolean Implements System.Web.IHttpHandler.IsReusable Get Return False End Get End Property Public Sub ProcessRequest(ByVal context As System.Web.HttpContext) Implements System.Web.IHttpHandler.ProcessRequest 'the page contenttype is plain text context.Response.ContentType = "application/json" context.Response.ContentEncoding = Encoding.UTF8 'set page caching context.Response.Cache.SetExpires(DateTime.Now.AddHours(24)) context.Response.Cache.SetCacheability(HttpCacheability.Public) context.Response.Cache.SetSlidingExpiration(True) context.Response.Cache.VaryByParams("PID") = True Try ' use the RegionsDataContext Using RegionDC As New DAL.RegionsDataContext ' query the database based on the querysting PID Dim q = (From r In RegionDC.bt_Regions _ Where r.PID = context.Request.QueryString("PID") _ Select r.Region, r.ID) ' now we loop through the array ' and write out the ressults Dim sb As New StringBuilder sb.Append("{") For Each item In q sb.Append("""" & item.Region & """: """ & item.ID & """,") Next sb.Append("}") context.Response.Write(sb.ToString) End Using Catch ex As Exception HealthMonitor.Log(ex, False, "This error occurred while populating the autocomplete handler") End Try End Sub End Class End Namespace The rest of my ASPX page has the appropriate controls as I had this working with the old version of the jQuery library. I'm trying to get it working with the new one because I heard that the "dev" CDN was going to be obsolete. Any help or direction will be greatly appreciated.

    Read the article

  • jquery in ajax loaded content

    - by Kim Gysen
    My application is supposed to be a single page application and I have the following code that works fine: home.php: <div id="container"> </div> accordion.php: //Click functions: load content $('#parents').click(function(){ //Load parent in container $('#container').load('http://www.blabla.com/entities/parents/parents.php'); }); parents.php: <div class="entity_wrapper"> Some divs and selectors </div> <script type="text/javascript"> $(document).ready(function(){ //Some jQuery / javascript }); </script> So the content loads fine, while the scripts dynamically loaded execute fine as well. I apply this system repetitively and it continues to work smoothly. I've seen that there are a lot of frameworks available on SPA's (such as backbone.js) but I don't understand why I need them if this works fine. From the backbone.js website: When working on a web application that involves a lot of JavaScript, one of the first things you learn is to stop tying your data to the DOM. It's all too easy to create JavaScript applications that end up as tangled piles of jQuery selectors and callbacks, all trying frantically to keep data in sync between the HTML UI, your JavaScript logic, and the database on your server. For rich client-side applications, a more structured approach is often helpful. Well, I totally don't have the feeling that I'm going through the stuff they mention. Adding the javascript per page works really well for me. They are html containers with clear scope and the javascript is just related to that part. More over, the front end doesn't do that much, most of the logic is managed based on Ajax calls to external PHP scripts. Sometimes the js can be a bit more extended for some functionalities, but all just loads as smooth in less than a second. If you think that this is bad coding, please tell me why I cannot do this and more importantly, what is the alternative I should apply. At the moment, I really don't see a reason on why I would change this approach as it just works too well. I'm kinda stuck on this question because it just worries me sick as it seems to easy to be true. Why would people go through hard times if it would be as easy as this...

    Read the article

  • Jquery draggable + toggleClass problem..

    - by vrynxzent
    the problem here is that the toggleClass position top:0px; left:0px will not trigger.. only the width and height and background-color will activate.. it will work if i will not drag the div(draggable).. if i start to drag the element, the toggled class positioning will not effect.. i dont know if there's such a function in jquery to help this.. <html> <head> <title></title> <script type="text/javascript" src="jquery-1.4.2.js"></script> <script type="text/javascript" src="jquery.ui.core.js"></script> <script type="text/javascript" src="jquery.ui.widget.js"></script> <script type="text/javascript" src="jquery.ui.mouse.js"></script> <script type="text/javascript" src="jquery.ui.resizable.js"></script> <script type="text/javascript" src="jquery.ui.draggable.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#x").draggable().dblclick(function(){ $(this).toggleClass("hi"); }); }); </script> <style> .hello { background:red; width:200px; height:200px; position:relative; top:100px; left:100px; } .hi { background:yellow; position:relative; width:300px; height:300px; top:0px; left:0px; } </style> </head> <body> <div id="x" class="hello"> </div> </body> </html>

    Read the article

  • How to create a new WCF/MVC/jQuery application from scratch

    - by pjohnson
    As a corporate developer by trade, I don't get much opportunity to create from-the-ground-up web sites; usually it's tweaks, fixes, and new functionality to existing sites. And with hobby sites, I often don't find the challenges I run into with enterprise systems; usually it's starting from Visual Studio's boilerplate project and adding whatever functionality I want to play around with, rarely deploying outside my own machine. So my experience creating a new enterprise-level site was a bit dated, and the technologies to do so have come a long way, and are much more ready to go out of the box. My intention with this post isn't so much to provide any groundbreaking insights, but to just tie together a lot of information in one place to make it easy to create a new site from scratch. Architecture One site I created earlier this year had an MVC 3 front end and a WCF 4-driven service layer. Using Visual Studio 2010, these project types are easy enough to add to a new solution. I created a third Class Library project to store common functionality the front end and services layers both needed to access, for example, the DataContract classes that the front end uses to call services in the service layer. By keeping DataContract classes in a separate project, I avoided the need for the front end to have an assembly/project reference directly to the services code, a bit cleaner and more flexible of an SOA implementation. Consuming the service Even by this point, VS has given you a lot. You have a working web site and a working service, neither of which do much but are great starting points. To wire up the front end and the services, I needed to create proxy classes and WCF client configuration information. I decided to use the SvcUtil.exe utility provided as part of the Windows SDK, which you should have installed if you installed VS. VS also provides an Add Service Reference command since the .NET 1.x ASMX days, which I've never really liked; it creates several .cs/.disco/etc. files, some of which contained hardcoded URL's, adding duplicate files (*1.cs, *2.cs, etc.) without doing a good job of cleaning up after itself. I've found SvcUtil much cleaner, as it outputs one C# file (containing several proxy classes) and a config file with settings, and it's easier to use to regenerate the proxy classes when the service changes, and to then maintain all your configuration in one place (your Web.config, instead of the Service Reference files). I provided it a reference to a copy of my common assembly so it doesn't try to recreate the data contract classes, had it use the type List<T> for collections, and modified the output files' names and .NET namespace, ending up with a command like: svcutil.exe /l:cs /o:MyService.cs /config:MyService.config /r:MySite.Common.dll /ct:System.Collections.Generic.List`1 /n:*,MySite.Web.ServiceProxies http://localhost:59999/MyService.svc I took the generated MyService.cs file and drop it in the web project, under a ServiceProxies folder, matching the namespace and keeping it separate from classes I coded manually. Integrating the config file took a little more work, but only needed to be done once as these settings didn't often change. A great thing Microsoft improved with WCF 4 is configuration; namely, you can use all the default settings and not have to specify them explicitly in your config file. Unfortunately, SvcUtil doesn't generate its config file this way. If you just copy & paste MyService.config's contents into your front end's Web.config, you'll copy a lot of settings you don't need, plus this will get unwieldy if you add more services in the future, each with its own custom binding. Really, as the only mandatory settings are the endpoint's ABC's (address, binding, and contract) you can get away with just this: <system.serviceModel>  <client>    <endpoint address="http://localhost:59999/MyService.svc" binding="wsHttpBinding" contract="MySite.Web.ServiceProxies.IMyService" />  </client></system.serviceModel> By default, the services project uses basicHttpBinding. As you can see, I switched it to wsHttpBinding, a more modern standard. Using something like netTcpBinding would probably be faster and more efficient since the client & service are both written in .NET, but it requires additional server setup and open ports, whereas switching to wsHttpBinding is much simpler. From an MVC controller action method, I instantiated the client, and invoked the method for my operation. As with any object that implements IDisposable, I wrapped it in C#'s using() statement, a tidy construct that ensures Dispose gets called no matter what, even if an exception occurs. Unfortunately there are problems with that, as WCF's ClientBase<TChannel> class doesn't implement Dispose according to Microsoft's own usage guidelines. I took an approach similar to Technology Toolbox's fix, except using partial classes instead of a wrapper class to extend the SvcUtil-generated proxy, making the fix more seamless from the controller's perspective, and theoretically, less code I have to change if and when Microsoft fixes this behavior. User interface The MVC 3 project template includes jQuery and some other common JavaScript libraries by default. I updated the ones I used to the latest versions using NuGet, available in VS via the Tools > Library Package Manager > Manage NuGet Packages for Solution... > Updates. I also used this dialog to remove packages I wasn't using. Given that it's smart enough to know the difference between the .js and .min.js files, I was hoping it would be smart enough to know which to include during build and publish operations, but this doesn't seem to be the case. I ended up using Cassette to perform the minification and bundling of my JavaScript and CSS files; ASP.NET 4.5 includes this functionality out of the box. The web client to web server link via jQuery was easy enough. In my JavaScript function, unobtrusively wired up to a button's click event, I called $.ajax, corresponding to an action method that returns a JsonResult, accomplished by passing my model class to the Controller.Json() method, which jQuery helpfully translates from JSON to a JavaScript object.$.ajax calls weren't perfectly straightforward. I tried using the simpler $.post method instead, but ran into trouble without specifying the contentType parameter, which $.post doesn't have. The url parameter is simple enough, though for flexibility in how the site is deployed, I used MVC's Url.Action method to get the URL, then sent this to JavaScript in a JavaScript string variable. If the request needed input data, I used the JSON.stringify function to convert a JavaScript object with the parameters into a JSON string, which MVC then parses into strongly-typed C# parameters. I also specified "json" for dataType, and "application/json; charset=utf-8" for contentType. For success and error, I provided my success and error handling functions, though success is a bit hairier. "Success" in this context indicates whether the HTTP request succeeds, not whether what you wanted the AJAX call to do on the web server was successful. For example, if you make an AJAX call to retrieve a piece of data, the success handler will be invoked for any 200 OK response, and the error handler will be invoked for failed requests, e.g. a 404 Not Found (if the server rejected the URL you provided in the url parameter) or 500 Internal Server Error (e.g. if your C# code threw an exception that wasn't caught). If an exception was caught and handled, or if the data requested wasn't found, this would likely go through the success handler, which would need to do further examination to verify it did in fact get back the data for which it asked. I discuss this more in the next section. Logging and exception handling At this point, I had a working application. If I ran into any errors or unexpected behavior, debugging was easy enough, but of course that's not an option on public web servers. Microsoft Enterprise Library 5.0 filled this gap nicely, with its Logging and Exception Handling functionality. First I installed Enterprise Library; NuGet as outlined above is probably the best way to do so. I needed a total of three assembly references--Microsoft.Practices.EnterpriseLibrary.ExceptionHandling, Microsoft.Practices.EnterpriseLibrary.ExceptionHandling.Logging, and Microsoft.Practices.EnterpriseLibrary.Logging. VS links with the handy Enterprise Library 5.0 Configuration Console, accessible by right-clicking your Web.config and choosing Edit Enterprise Library V5 Configuration. In this console, under Logging Settings, I set up a Rolling Flat File Trace Listener to write to log files but not let them get too large, using a Text Formatter with a simpler template than that provided by default. Logging to a different (or additional) destination is easy enough, but a flat file suited my needs. At this point, I verified it wrote as expected by calling the Microsoft.Practices.EnterpriseLibrary.Logging.Logger.Write method from my C# code. With those settings verified, I went on to wire up Exception Handling with Logging. Back in the EntLib Configuration Console, under Exception Handling, I used a LoggingExceptionHandler, setting its Logging Category to the category I already had configured in the Logging Settings. Then, from code (e.g. a controller's OnException method, or any action method's catch block), I called the Microsoft.Practices.EnterpriseLibrary.ExceptionHandling.ExceptionPolicy.HandleException method, providing the exception and the exception policy name I had configured in the Exception Handling Settings. Before I got this configured correctly, when I tried it out, nothing was logged. In working with .NET, I'm used to seeing an exception if something doesn't work or isn't set up correctly, but instead working with these EntLib modules reminds me more of JavaScript (before the "use strict" v5 days)--it just does nothing and leaves you to figure out why, I presume due in part to the listener pattern Microsoft followed with the Enterprise Library. First, I verified logging worked on its own. Then, verifying/correcting where each piece wires up to the next resolved my problem. Your C# code calls into the Exception Handling module, referencing the policy you pass the HandleException method; that policy's configuration contains a LoggingExceptionHandler that references a logCategory; that logCategory should be added in the loggingConfiguration's categorySources section; that category references a listener; that listener should be added in the loggingConfiguration's listeners section, which specifies the name of the log file. One final note on error handling, as the proper way to handle WCF and MVC errors is a whole other very lengthy discussion. For AJAX calls to MVC action methods, depending on your configuration, an exception thrown here will result in ASP.NET'S Yellow Screen Of Death being sent back as a response, which is at best unnecessarily and uselessly verbose, and at worst a security risk as the internals of your application are exposed to potential hackers. I mitigated this by overriding my controller's OnException method, passing the exception off to the Exception Handling module as above. I created an ErrorModel class with as few properties as possible (e.g. an Error string), sending as little information to the client as possible, to both maximize bandwidth and mitigate risk. I then return an ErrorModel in JSON format for AJAX requests: if (filterContext.HttpContext.Request.IsAjaxRequest()){    filterContext.Result = Json(new ErrorModel(...));    filterContext.ExceptionHandled = true;} My $.ajax calls from the browser get a valid 200 OK response and go into the success handler. Before assuming everything is OK, I check if it's an ErrorModel or a model containing what I requested. If it's an ErrorModel, or null, I pass it to my error handler. If the client needs to handle different errors differently, ErrorModel can contain a flag, error code, string, etc. to differentiate, but again, sending as little information back as possible is ideal. Summary As any experienced ASP.NET developer knows, this is a far cry from where ASP.NET started when I began working with it 11 years ago. WCF services are far more powerful than ASMX ones, MVC is in many ways cleaner and certainly more unit test-friendly than Web Forms (if you don't consider the code/markup commingling you're doing again), the Enterprise Library makes error handling and logging almost entirely configuration-driven, AJAX makes a responsive UI more feasible, and jQuery makes JavaScript coding much less painful. It doesn't take much work to get a functional, maintainable, flexible application, though having it actually do something useful is a whole other matter.

    Read the article

  • jQuery Templates - {Supported Tags}

    - by hajan
    I have started with Introduction to jQuery Templates, then jQuery Templates - tmpl(), template() and tmplItem() functions. In this blog we will see what supported tags are available in the jQuery Templates plugin.Template tags can be used inside template together in combination with HTML tags and plain text, which helps to iterate over JSON data. Up to now, there are several supported tags in jQuery Templates plugin: ${expr} or {{= expr}} {{each itemArray}} … {{/each}} {{if condition}} … {{else}} … {{/if}} {{html …}} {{tmpl …}} {{wrap …}} … {{/wrap}}   - ${expr} or {{= expr}} Is used for insertion of data values in the rendered template. It can evaluate fields, functions or expression. Example: <script id="attendeesTemplate" type="text/html">     <li> ${Name} {{= Surname}} </li>         </script> Either ${Name} or {{= Surname}} (with blank space between =<blankspace>Field) will work.   - {{each itemArray}} … {{/each}} each is everywhere the same "(for)each", used to loop over array or collection Example: <script id="attendeesTemplate" type="text/html">     <li>         ${Name} ${Surname}         {{if speaker}}             (<font color="red">speaks</font>)         {{else}}             (attendee)         {{/if}}                 {{each phones}}                             <br />             ${$index}: <em>${$value}</em>         {{/each}}             </li> </script> So, you see we can use ${$index} and ${$value} to get the current index and value while iterating over the item collection. Alternatively, you can add index,value on the following way: {{each(i,v) phones}}     <br />     ${i}: <em>${v}</em> {{/each}} Result would be: Here is complete working example that you can run and see the result: <html xmlns="http://www.w3.org/1999/xhtml" > <head id="Head1" runat="server">     <title>Nesting and Looping Example :: jQuery Templates</title>     <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.min.js" type="text/javascript"></script>     <script src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js" type="text/javascript"></script>     <script language="javascript" type="text/javascript">         $(function () {             var attendees = [                 { Name: "Hajan", Surname: "Selmani", speaker: true, phones:[070555555, 071888999, 071222333] },                 { Name: "Someone", Surname: "Surname", phones: [070555555, 071222333] },                 { Name: "Third", Surname: "Thirdsurname", phones: [070555555, 071888999, 071222333] },             ];             $("#attendeesTemplate").tmpl(attendees).appendTo("#attendeesList");         });     </script>     <script id="attendeesTemplate" type="text/html">         <li>             ${Name} ${Surname}             {{if speaker}}                 (<font color="red">speaks</font>)             {{else}}                 (attendee)             {{/if}}                     {{each(i,v) phones}}                 <br />                 ${i}: <em>${v}</em>             {{/each}}                 </li>     </script> </head> <body>     <ol id="attendeesList"></ol>     </body> </html>   - {{if condition}} … {{else}} … {{/if}} Standard if/else statement. Of course, you can use it without the {{else}} if you have such condition to check, however closing the {{/if}} tag is required. Example: {{if speaker}}     (<font color="red">speaks</font>) {{else}}     (attendee) {{/if}} You have this same code block in the above complete example showing the 'each' cycle ;).   - {{html …}} Is used for insertion of HTML markup strings in the rendered template. Evaluates the specified field on the current data item, or the specified JavaScript function or expression. Example: - without {{html …}} <script language="javascript" type="text/javascript">   $(function () {   var attendees = [             { Name: "Hajan", Surname: "Selmani", Info: "He <font color='red'>is the speaker of today's</font> session", speaker: true },         ];   $("#myTemplate").tmpl(attendees).appendTo("#speakers"); }); </script> <script id="myTemplate" type="text/html">     ${Name} ${Surname} <br />     ${Info} </script> Result: - with {{html …}} <script language="javascript" type="text/javascript">   $(function () {   var attendees = [             { Name: "Hajan", Surname: "Selmani", Info: "He <font color='red'>is the speaker of today's</font> session", speaker: true },         ];   $("#myTemplate").tmpl(attendees).appendTo("#speakers"); }); </script> <script id="myTemplate" type="text/html">     ${Name} ${Surname} <br />     {{html Info}} </script> Result:   - {{wrap …}} It’s used for composition and incorporation of wrapped HTML. It’s similar to {{tmpl}} Example: <script id="myTmpl" type="text/html">     <div id="personInfo">     <br />     ${Name} ${Surname}     {{wrap "#myWrapper"}}         <h2>${Info}</h2>         <div>             {{if speaker}}                 (speaker)             {{else}}                 (attendee)             {{/if}}         </div>     {{/wrap}}     </div> </script> <script id="myWrapper" type="text/html">     <table><tbody>         <tr>             {{each $item.html("div")}}                 <td>                     {{html $value}}                 </td>             {{/each}}         </tr>     </tbody></table> </script> All the HTMl content inside the {{wrap}} … {{/wrap}} is available to the $item.html(filter, textOnly) method. In our example, we have defined some standard template and created wrapper which calls the other template with id myWrapper. Then using $item.html(“div”) we find the div tag and render the html value (together with the div tag) inside the <td> … </td>. So, here inside td the <div> <speaker or attendee depending of the condition> </div>  will be rendered. The HTML output from this is:   - {{tmpl …}} Used for composition as template items Example: <script id="myTemplate" type="text/html">     <div id="bookItem">         <div id="bookCover">             {{tmpl "#bookCoverTemplate"}}         </div>         <div id="bookDetails">             <div id="book">                             ${title} - ${author}             </div>             <div id="price">$${price}</div>             <div id="Details">${pages} pgs. - ${year} year</div>         </div>     </div> </script> <script id="bookCoverTemplate" type="text/html">     <img src="${image}" alt="${title} Image" /> </script> In this example, using {{tmpl “#bookCoverTemplate”}} I’m calling another template inside the first template. In the other template I’ve created template for a book cover. The rendered HTML of this is: and   So we have seen example for each of the tags that are right now available in the jQuery Templates (beta) plugin which is created by Microsoft as a contribution to the open source jQuery Project. I hope this was useful blog post for you. Regards, HajanNEXT - jQuery Templates with ASP.NET MVC

    Read the article

  • Accessing Server-Side Data from Client Script: Using Ajax Web Services, Script References, and jQuery

    Today's websites commonly exchange information between the browser and the web server using Ajax techniques. In a nutshell, the browser executes JavaScript code typically in response to the page loading or some user action. This JavaScript makes an asynchronous HTTP request to the server. The server processes this request and, perhaps, returns data that the browser can then seamlessly integrate into the web page. Typically, the information exchanged between the browser and server is serialized into JSON, an open, text-based serialization format that is both human-readable and platform independent. Adding such targeted, lightweight Ajax capabilities to your ASP.NET website requires two steps: first, you must create some mechanism on the server that accepts requests from client-side script and returns a JSON payload in response; second, you need to write JavaScript in your ASP.NET page to make an HTTP request to this service you created and to work with the returned results. This article series examines a variety of techniques for implementing such scenarios. In Part 1 we used an ASP.NET page and the JavaScriptSerializer class to create a server-side service. This service was called from the browser using the free, open-source jQuery JavaScript library. This article continues our examination of techniques for implementing lightweight Ajax scenarios in an ASP.NET website. Specifically, it examines how to create ASP.NET Ajax Web Services on the server-side and how to use both the ASP.NET Ajax Library and jQuery to consume them from the client-side. Read on to learn more! Read More >

    Read the article

  • Metro: Promises

    - by Stephen.Walther
    The goal of this blog entry is to describe the Promise class in the WinJS library. You can use promises whenever you need to perform an asynchronous operation such as retrieving data from a remote website or a file from the file system. Promises are used extensively in the WinJS library. Asynchronous Programming Some code executes immediately, some code requires time to complete or might never complete at all. For example, retrieving the value of a local variable is an immediate operation. Retrieving data from a remote website takes longer or might not complete at all. When an operation might take a long time to complete, you should write your code so that it executes asynchronously. Instead of waiting for an operation to complete, you should start the operation and then do something else until you receive a signal that the operation is complete. An analogy. Some telephone customer service lines require you to wait on hold – listening to really bad music – until a customer service representative is available. This is synchronous programming and very wasteful of your time. Some newer customer service lines enable you to enter your telephone number so the customer service representative can call you back when a customer representative becomes available. This approach is much less wasteful of your time because you can do useful things while waiting for the callback. There are several patterns that you can use to write code which executes asynchronously. The most popular pattern in JavaScript is the callback pattern. When you call a function which might take a long time to return a result, you pass a callback function to the function. For example, the following code (which uses jQuery) includes a function named getFlickrPhotos which returns photos from the Flickr website which match a set of tags (such as “dog” and “funny”): function getFlickrPhotos(tags, callback) { $.getJSON( "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?", { tags: tags, tagmode: "all", format: "json" }, function (data) { if (callback) { callback(data.items); } } ); } getFlickrPhotos("funny, dogs", function(data) { $.each(data, function(index, item) { console.log(item); }); }); The getFlickr() function includes a callback parameter. When you call the getFlickr() function, you pass a function to the callback parameter which gets executed when the getFlicker() function finishes retrieving the list of photos from the Flickr web service. In the code above, the callback function simply iterates through the results and writes each result to the console. Using callbacks is a natural way to perform asynchronous programming with JavaScript. Instead of waiting for an operation to complete, sitting there and listening to really bad music, you can get a callback when the operation is complete. Using Promises The CommonJS website defines a promise like this (http://wiki.commonjs.org/wiki/Promises): “Promises provide a well-defined interface for interacting with an object that represents the result of an action that is performed asynchronously, and may or may not be finished at any given point in time. By utilizing a standard interface, different components can return promises for asynchronous actions and consumers can utilize the promises in a predictable manner.” A promise provides a standard pattern for specifying callbacks. In the WinJS library, when you create a promise, you can specify three callbacks: a complete callback, a failure callback, and a progress callback. Promises are used extensively in the WinJS library. The methods in the animation library, the control library, and the binding library all use promises. For example, the xhr() method included in the WinJS base library returns a promise. The xhr() method wraps calls to the standard XmlHttpRequest object in a promise. The following code illustrates how you can use the xhr() method to perform an Ajax request which retrieves a file named Photos.txt: var options = { url: "/data/photos.txt" }; WinJS.xhr(options).then( function (xmlHttpRequest) { console.log("success"); var data = JSON.parse(xmlHttpRequest.responseText); console.log(data); }, function(xmlHttpRequest) { console.log("fail"); }, function(xmlHttpRequest) { console.log("progress"); } ) The WinJS.xhr() method returns a promise. The Promise class includes a then() method which accepts three callback functions: a complete callback, an error callback, and a progress callback: Promise.then(completeCallback, errorCallback, progressCallback) In the code above, three anonymous functions are passed to the then() method. The three callbacks simply write a message to the JavaScript Console. The complete callback also dumps all of the data retrieved from the photos.txt file. Creating Promises You can create your own promises by creating a new instance of the Promise class. The constructor for the Promise class requires a function which accepts three parameters: a complete, error, and progress function parameter. For example, the code below illustrates how you can create a method named wait10Seconds() which returns a promise. The progress function is called every second and the complete function is not called until 10 seconds have passed: (function () { "use strict"; var app = WinJS.Application; function wait10Seconds() { return new WinJS.Promise(function (complete, error, progress) { var seconds = 0; var intervalId = window.setInterval(function () { seconds++; progress(seconds); if (seconds > 9) { window.clearInterval(intervalId); complete(); } }, 1000); }); } app.onactivated = function (eventObject) { if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) { wait10Seconds().then( function () { console.log("complete") }, function () { console.log("error") }, function (seconds) { console.log("progress:" + seconds) } ); } } app.start(); })(); All of the work happens in the constructor function for the promise. The window.setInterval() method is used to execute code every second. Every second, the progress() callback method is called. If more than 10 seconds have passed then the complete() callback method is called and the clearInterval() method is called. When you execute the code above, you can see the output in the Visual Studio JavaScript Console. Creating a Timeout Promise In the previous section, we created a custom Promise which uses the window.setInterval() method to complete the promise after 10 seconds. We really did not need to create a custom promise because the Promise class already includes a static method for returning promises which complete after a certain interval. The code below illustrates how you can use the timeout() method. The timeout() method returns a promise which completes after a certain number of milliseconds. WinJS.Promise.timeout(3000).then( function(){console.log("complete")}, function(){console.log("error")}, function(){console.log("progress")} ); In the code above, the Promise completes after 3 seconds (3000 milliseconds). The Promise returned by the timeout() method does not support progress events. Therefore, the only message written to the console is the message “complete” after 10 seconds. Canceling Promises Some promises, but not all, support cancellation. When you cancel a promise, the promise’s error callback is executed. For example, the following code uses the WinJS.xhr() method to perform an Ajax request. However, immediately after the Ajax request is made, the request is cancelled. // Specify Ajax request options var options = { url: "/data/photos.txt" }; // Make the Ajax request var request = WinJS.xhr(options).then( function (xmlHttpRequest) { console.log("success"); }, function (xmlHttpRequest) { console.log("fail"); }, function (xmlHttpRequest) { console.log("progress"); } ); // Cancel the Ajax request request.cancel(); When you run the code above, the message “fail” is written to the Visual Studio JavaScript Console. Composing Promises You can build promises out of other promises. In other words, you can compose promises. There are two static methods of the Promise class which you can use to compose promises: the join() method and the any() method. When you join promises, a promise is complete when all of the joined promises are complete. When you use the any() method, a promise is complete when any of the promises complete. The following code illustrates how to use the join() method. A new promise is created out of two timeout promises. The new promise does not complete until both of the timeout promises complete: WinJS.Promise.join([WinJS.Promise.timeout(1000), WinJS.Promise.timeout(5000)]) .then(function () { console.log("complete"); }); The message “complete” will not be written to the JavaScript Console until both promises passed to the join() method completes. The message won’t be written for 5 seconds (5,000 milliseconds). The any() method completes when any promise passed to the any() method completes: WinJS.Promise.any([WinJS.Promise.timeout(1000), WinJS.Promise.timeout(5000)]) .then(function () { console.log("complete"); }); The code above writes the message “complete” to the JavaScript Console after 1 second (1,000 milliseconds). The message is written to the JavaScript console immediately after the first promise completes and before the second promise completes. Summary The goal of this blog entry was to describe WinJS promises. First, we discussed how promises enable you to easily write code which performs asynchronous actions. You learned how to use a promise when performing an Ajax request. Next, we discussed how you can create your own promises. You learned how to create a new promise by creating a constructor function with complete, error, and progress parameters. Finally, you learned about several advanced methods of promises. You learned how to use the timeout() method to create promises which complete after an interval of time. You also learned how to cancel promises and compose promises from other promises.

    Read the article

  • Cisco ASA (Client VPN) to LAN - through second VPN to second LAN

    - by user50855
    We have 2 site that is linked by an IPSEC VPN to remote Cisco ASAs: Site 1 1.5Mb T1 Connection Cisco(1) 2841 Site 2 1.5Mb T1 Connection Cisco 2841 In addition: Site 1 has a 2nd WAN 3Mb bonded T1 Connection Cisco 5510 that connects to same LAN as Cisco(1) 2841. Basically, Remote Access (VPN) users connecting through Cisco ASA 5510 needs access to a service at the end of Site 2. This is due to the way the service is sold - Cisco 2841 routers are not under our management and it is setup to allow connection from local LAN VLAN 1 IP address 10.20.0.0/24. My idea is to have all traffic from Remote Users through Cisco ASA destined for Site 2 to go via the VPN between Site 1 and Site 2. The end result being all traffic that hits Site 2 has come via Site 1. I'm struggling to find a great deal of information on how this is setup. So, firstly, can anyone confirm that what I'm trying to achieve is possible? Secondly, can anyone help me to correct the configuration bellow or point me in the direction of an example of such a configuration? Many Thanks. interface Ethernet0/0 nameif outside security-level 0 ip address 7.7.7.19 255.255.255.240 interface Ethernet0/1 nameif inside security-level 100 ip address 10.20.0.249 255.255.255.0 object-group network group-inside-vpnclient description All inside networks accessible to vpn clients network-object 10.20.0.0 255.255.255.0 network-object 10.20.1.0 255.255.255.0 object-group network group-adp-network description ADP IP Address or network accessible to vpn clients network-object 207.207.207.173 255.255.255.255 access-list outside_access_in extended permit icmp any any echo-reply access-list outside_access_in extended permit icmp any any source-quench access-list outside_access_in extended permit icmp any any unreachable access-list outside_access_in extended permit icmp any any time-exceeded access-list outside_access_in extended permit tcp any host 7.7.7.20 eq smtp access-list outside_access_in extended permit tcp any host 7.7.7.20 eq https access-list outside_access_in extended permit tcp any host 7.7.7.20 eq pop3 access-list outside_access_in extended permit tcp any host 7.7.7.20 eq www access-list outside_access_in extended permit tcp any host 7.7.7.21 eq www access-list outside_access_in extended permit tcp any host 7.7.7.21 eq https access-list outside_access_in extended permit tcp any host 7.7.7.21 eq 5721 access-list acl-vpnclient extended permit ip object-group group-inside-vpnclient any access-list acl-vpnclient extended permit ip object-group group-inside-vpnclient object-group group-adp-network access-list acl-vpnclient extended permit ip object-group group-adp-network object-group group-inside-vpnclient access-list PinesFLVPNTunnel_splitTunnelAcl standard permit 10.20.0.0 255.255.255.0 access-list inside_nat0_outbound_1 extended permit ip 10.20.0.0 255.255.255.0 10.20.1.0 255.255.255.0 access-list inside_nat0_outbound_1 extended permit ip 10.20.0.0 255.255.255.0 host 207.207.207.173 access-list inside_nat0_outbound_1 extended permit ip 10.20.1.0 255.255.255.0 host 207.207.207.173 ip local pool VPNPool 10.20.1.100-10.20.1.200 mask 255.255.255.0 route outside 0.0.0.0 0.0.0.0 7.7.7.17 1 route inside 207.207.207.173 255.255.255.255 10.20.0.3 1 crypto ipsec transform-set ESP-3DES-SHA esp-3des esp-sha-hmac crypto ipsec security-association lifetime seconds 28800 crypto ipsec security-association lifetime kilobytes 4608000 crypto dynamic-map outside_dyn_map 20 set transform-set ESP-3DES-SHA crypto dynamic-map outside_dyn_map 20 set security-association lifetime seconds 288000 crypto dynamic-map outside_dyn_map 20 set security-association lifetime kilobytes 4608000 crypto dynamic-map outside_dyn_map 20 set reverse-route crypto map outside_map 20 ipsec-isakmp dynamic outside_dyn_map crypto map outside_map interface outside crypto map outside_dyn_map 20 match address acl-vpnclient crypto map outside_dyn_map 20 set security-association lifetime seconds 28800 crypto map outside_dyn_map 20 set security-association lifetime kilobytes 4608000 crypto isakmp identity address crypto isakmp enable outside crypto isakmp policy 20 authentication pre-share encryption 3des hash sha group 2 lifetime 86400 group-policy YeahRightflVPNTunnel internal group-policy YeahRightflVPNTunnel attributes wins-server value 10.20.0.9 dns-server value 10.20.0.9 vpn-tunnel-protocol IPSec password-storage disable pfs disable split-tunnel-policy tunnelspecified split-tunnel-network-list value acl-vpnclient default-domain value YeahRight.com group-policy YeahRightFLVPNTunnel internal group-policy YeahRightFLVPNTunnel attributes wins-server value 10.20.0.9 dns-server value 10.20.0.9 10.20.0.7 vpn-tunnel-protocol IPSec split-tunnel-policy tunnelspecified split-tunnel-network-list value YeahRightFLVPNTunnel_splitTunnelAcl default-domain value yeahright.com tunnel-group YeahRightFLVPN type remote-access tunnel-group YeahRightFLVPN general-attributes address-pool VPNPool tunnel-group YeahRightFLVPNTunnel type remote-access tunnel-group YeahRightFLVPNTunnel general-attributes address-pool VPNPool authentication-server-group WinRadius default-group-policy YeahRightFLVPNTunnel tunnel-group YeahRightFLVPNTunnel ipsec-attributes pre-shared-key *

    Read the article

  • C# 4.0: COM Interop Improvements

    - by Paulo Morgado
    Dynamic resolution as well as named and optional arguments greatly improve the experience of interoperating with COM APIs such as Office Automation Primary Interop Assemblies (PIAs). But, in order to alleviate even more COM Interop development, a few COM-specific features were also added to C# 4.0. Ommiting ref Because of a different programming model, many COM APIs contain a lot of reference parameters. These parameters are typically not meant to mutate a passed-in argument, but are simply another way of passing value parameters. Specifically for COM methods, the compiler allows to declare the method call passing the arguments by value and will automatically generate the necessary temporary variables to hold the values in order to pass them by reference and will discard their values after the call returns. From the point of view of the programmer, the arguments are being passed by value. This method call: object fileName = "Test.docx"; object missing = Missing.Value; document.SaveAs(ref fileName, ref missing, ref missing, ref missing, ref missing, ref missing, ref missing, ref missing, ref missing, ref missing, ref missing, ref missing, ref missing, ref missing, ref missing, ref missing); can now be written like this: document.SaveAs("Test.docx", Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value, Missing.Value); And because all parameters that are receiving the Missing.Value value have that value as its default value, the declaration of the method call can even be reduced to this: document.SaveAs("Test.docx"); Dynamic Import Many COM methods accept and return variant types, which are represented in the PIAs as object. In the vast majority of cases, a programmer calling these methods already knows the static type of a returned object form the context of the call, but has to explicitly perform a cast on the returned values to make use of that knowledge. These casts are so common that they constitute a major nuisance. To make the developer’s life easier, it is now possible to import the COM APIs in such a way that variants are instead represented using the type dynamic which means that COM signatures have now occurrences of dynamic instead of object. This means that members of a returned object can now be easily accessed or assigned into a strongly typed variable without having to cast. Instead of this code: ((Excel.Range)(excel.Cells[1, 1])).Value2 = "Hello World!"; this code can now be used: excel.Cells[1, 1] = "Hello World!"; And instead of this: Excel.Range range = (Excel.Range)(excel.Cells[1, 1]); this can be used: Excel.Range range = excel.Cells[1, 1]; Indexed And Default Properties A few COM interface features are still not available in C#. On the top of the list are indexed properties and default properties. As mentioned above, these will be possible if the COM interface is accessed dynamically, but will not be recognized by statically typed C# code. No PIAs – Type Equivalence And Type Embedding For assemblies indentified with PrimaryInteropAssemblyAttribute, the compiler will create equivalent types (interfaces, structs, enumerations and delegates) and embed them in the generated assembly. To reduce the final size of the generated assembly, only the used types and their used members will be generated and embedded. Although this makes development and deployment of applications using the COM components easier because there’s no need to deploy the PIAs, COM component developers are still required to build the PIAs.

    Read the article

  • The Evolution Of C#

    - by Paulo Morgado
    The first release of C# (C# 1.0) was all about building a new language for managed code that appealed, mostly, to C++ and Java programmers. The second release (C# 2.0) was mostly about adding what wasn’t time to built into the 1.0 release. The main feature for this release was Generics. The third release (C# 3.0) was all about reducing the impedance mismatch between general purpose programming languages and databases. To achieve this goal, several functional programming features were added to the language and LINQ was born. Going forward, new trends are showing up in the industry and modern programming languages need to be more: Declarative With imperative languages, although having the eye on the what, programs need to focus on the how. This leads to over specification of the solution to the problem in hand, making next to impossible to the execution engine to be smart about the execution of the program and optimize it to run it more efficiently (given the hardware available, for example). Declarative languages, on the other hand, focus only on the what and leave the how to the execution engine. LINQ made C# more declarative by using higher level constructs like orderby and group by that give the execution engine a much better chance of optimizing the execution (by parallelizing it, for example). Concurrent Concurrency is hard and needs to be thought about and it’s very hard to shoehorn it into a programming language. Parallel.For (from the parallel extensions) looks like a parallel for because enough expressiveness has been built into C# 3.0 to allow this without having to commit to specific language syntax. Dynamic There was been lots of debate on which ones are the better programming languages: static or dynamic. The fact is that both have good qualities and users of both types of languages want to have it all. All these trends require a paradigm switch. C# is, in many ways, already a multi-paradigm language. It’s still very object oriented (class oriented as some might say) but it can be argued that C# 3.0 has become a functional programming language because it has all the cornerstones of what a functional programming language needs. Moving forward, will have even more. Besides the influence of these trends, there was a decision of co-evolution of the C# and Visual Basic programming languages. Since its inception, there was been some effort to position C# and Visual Basic against each other and to try to explain what should be done with each language or what kind of programmers use one or the other. Each language should be chosen based on the past experience and familiarity of the developer/team/project/company and not by particular features. In the past, every time a feature was added to one language, the users of the other wanted that feature too. Going forward, when a feature is added to one language, the other will work hard to add the same feature. This doesn’t mean that XML literals will be added to C# (because almost the same can be achieved with LINQ To XML), but Visual Basic will have auto-implemented properties. Most of these features require or are built on top of features of the .NET Framework and, the focus for C# 4.0 was on dynamic programming. Not just dynamic types but being able to talk with anything that isn’t a .NET class. Also introduced in C# 4.0 is co-variance and contra-variance for generic interfaces and delegates. Stay tuned for more on the new C# 4.0 features.

    Read the article

  • Metro: Understanding Observables

    - by Stephen.Walther
    The goal of this blog entry is to describe how the Observer Pattern is implemented in the WinJS library. You learn how to create observable objects which trigger notifications automatically when their properties are changed. Observables enable you to keep your user interface and your application data in sync. For example, by taking advantage of observables, you can update your user interface automatically whenever the properties of a product change. Observables are the foundation of declarative binding in the WinJS library. The WinJS library is not the first JavaScript library to include support for observables. For example, both the KnockoutJS library and the Microsoft Ajax Library (now part of the Ajax Control Toolkit) support observables. Creating an Observable Imagine that I have created a product object like this: var product = { name: "Milk", description: "Something to drink", price: 12.33 }; Nothing very exciting about this product. It has three properties named name, description, and price. Now, imagine that I want to be notified automatically whenever any of these properties are changed. In that case, I can create an observable product from my product object like this: var observableProduct = WinJS.Binding.as(product); This line of code creates a new JavaScript object named observableProduct from the existing JavaScript object named product. This new object also has a name, description, and price property. However, unlike the properties of the original product object, the properties of the observable product object trigger notifications when the properties are changed. Each of the properties of the new observable product object has been changed into accessor properties which have both a getter and a setter. For example, the observable product price property looks something like this: price: { get: function () { return this.getProperty(“price”); } set: function (value) { this.setProperty(“price”, value); } } When you read the price property then the getProperty() method is called and when you set the price property then the setProperty() method is called. The getProperty() and setProperty() methods are methods of the observable product object. The observable product object supports the following methods and properties: · addProperty(name, value) – Adds a new property to an observable and notifies any listeners. · backingData – An object which represents the value of each property. · bind(name, action) – Enables you to execute a function when a property changes. · getProperty(name) – Returns the value of a property using the string name of the property. · notify(name, newValue, oldValue) – A private method which executes each function in the _listeners array. · removeProperty(name) – Removes a property and notifies any listeners. · setProperty(name, value) – Updates a property and notifies any listeners. · unbind(name, action) – Enables you to stop executing a function in response to a property change. · updateProperty(name, value) – Updates a property and notifies any listeners. So when you create an observable, you get a new object with the same properties as an existing object. However, when you modify the properties of an observable object, then you can notify any listeners of the observable that the value of a particular property has changed automatically. Imagine that you change the value of the price property like this: observableProduct.price = 2.99; In that case, the following sequence of events is triggered: 1. The price setter calls the setProperty(“price”, 2.99) method 2. The setProperty() method updates the value of the backingData.price property and calls the notify() method 3. The notify() method executes each function in the collection of listeners associated with the price property Creating Observable Listeners If you want to be notified when a property of an observable object is changed, then you need to register a listener. You register a listener by using the bind() method like this: (function () { "use strict"; var app = WinJS.Application; app.onactivated = function (eventObject) { if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) { // Simple product object var product = { name: "Milk", description: "Something to drink", price: 12.33 }; // Create observable product var observableProduct = WinJS.Binding.as(product); // Execute a function when price is changed observableProduct.bind("price", function (newValue) { console.log(newValue); }); // Change the price observableProduct.price = 2.99; } }; app.start(); })(); In the code above, the bind() method is used to associate the price property with a function. When the price property is changed, the function logs the new value of the price property to the Visual Studio JavaScript console. The price property is associated with the function using the following line of code: // Execute a function when price is changed observableProduct.bind("price", function (newValue) { console.log(newValue); }); Coalescing Notifications If you make multiple changes to a property – one change immediately following another – then separate notifications won’t be sent. Instead, any listeners are notified only once. The notifications are coalesced into a single notification. For example, in the following code, the product price property is updated three times. However, only one message is written to the JavaScript console. Only the last value assigned to the price property is written to the JavaScript Console window: // Simple product object var product = { name: "Milk", description: "Something to drink", price: 12.33 }; // Create observable product var observableProduct = WinJS.Binding.as(product); // Execute a function when price is changed observableProduct.bind("price", function (newValue) { console.log(newValue); }); // Change the price observableProduct.price = 3.99; observableProduct.price = 2.99; observableProduct.price = 1.99; Only the last value assigned to price, the value 1.99, appears in the console: If there is a time delay between changes to a property then changes result in different notifications. For example, the following code updates the price property every second: // Simple product object var product = { name: "Milk", description: "Something to drink", price: 12.33 }; // Create observable product var observableProduct = WinJS.Binding.as(product); // Execute a function when price is changed observableProduct.bind("price", function (newValue) { console.log(newValue); }); // Add 1 to price every second window.setInterval(function () { observableProduct.price += 1; }, 1000); In this case, separate notification messages are logged to the JavaScript Console window: If you need to prevent multiple notifications from being coalesced into one then you can take advantage of promises. I discussed WinJS promises in a previous blog entry: http://stephenwalther.com/blog/archive/2012/02/22/windows-web-applications-promises.aspx Because the updateProperty() method returns a promise, you can create different notifications for each change in a property by using the following code: // Change the price observableProduct.updateProperty("price", 3.99) .then(function () { observableProduct.updateProperty("price", 2.99) .then(function () { observableProduct.updateProperty("price", 1.99); }); }); In this case, even though the price is immediately changed from 3.99 to 2.99 to 1.99, separate notifications for each new value of the price property are sent. Bypassing Notifications Normally, if a property of an observable object has listeners and you change the property then the listeners are notified. However, there are certain situations in which you might want to bypass notification. In other words, you might need to change a property value silently without triggering any functions registered for notification. If you want to change a property without triggering notifications then you should change the property by using the backingData property. The following code illustrates how you can change the price property silently: // Simple product object var product = { name: "Milk", description: "Something to drink", price: 12.33 }; // Create observable product var observableProduct = WinJS.Binding.as(product); // Execute a function when price is changed observableProduct.bind("price", function (newValue) { console.log(newValue); }); // Change the price silently observableProduct.backingData.price = 5.99; console.log(observableProduct.price); // Writes 5.99 The price is changed to the value 5.99 by changing the value of backingData.price. Because the observableProduct.price property is not set directly, any listeners associated with the price property are not notified. When you change the value of a property by using the backingData property, the change in the property happens synchronously. However, when you change the value of an observable property directly, the change is always made asynchronously. Summary The goal of this blog entry was to describe observables. In particular, we discussed how to create observables from existing JavaScript objects and bind functions to observable properties. You also learned how notifications are coalesced (and ways to prevent this coalescing). Finally, we discussed how you can use the backingData property to update an observable property without triggering notifications. In the next blog entry, we’ll see how observables are used with declarative binding to display the values of properties in an HTML document.

    Read the article

  • HTML5 Form Validation

    - by Stephen.Walther
    The latest versions of Google Chrome (16+), Mozilla Firefox (8+), and Internet Explorer (10+) all support HTML5 client-side validation. It is time to take HTML5 validation seriously. The purpose of the blog post is to describe how you can take advantage of HTML5 client-side validation regardless of the type of application that you are building. You learn how to use the HTML5 validation attributes, how to perform custom validation using the JavaScript validation constraint API, and how to simulate HTML5 validation on older browsers by taking advantage of a jQuery plugin. Finally, we discuss the security issues related to using client-side validation. Using Client-Side Validation Attributes The HTML5 specification discusses several attributes which you can use with INPUT elements to perform client-side validation including the required, pattern, min, max, step, and maxlength attributes. For example, you use the required attribute to require a user to enter a value for an INPUT element. The following form demonstrates how you can make the firstName and lastName form fields required: <!DOCTYPE html> <html > <head> <title>Required Demo</title> </head> <body> <form> <label> First Name: <input required title="First Name is Required!" /> </label> <label> Last Name: <input required title="Last Name is Required!" /> </label> <button>Register</button> </form> </body> </html> If you attempt to submit this form without entering a value for firstName or lastName then you get the validation error message: Notice that the value of the title attribute is used to display the validation error message “First Name is Required!”. The title attribute does not work this way with the current version of Firefox. If you want to display a custom validation error message with Firefox then you need to include an x-moz-errormessage attribute like this: <input required title="First Name is Required!" x-moz-errormessage="First Name is Required!" /> The pattern attribute enables you to validate the value of an INPUT element against a regular expression. For example, the following form includes a social security number field which includes a pattern attribute: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Pattern</title> </head> <body> <form> <label> Social Security Number: <input required pattern="^\d{3}-\d{2}-\d{4}$" title="###-##-####" /> </label> <button>Register</button> </form> </body> </html> The regular expression in the form above requires the social security number to match the pattern ###-##-####: Notice that the input field includes both a pattern and a required validation attribute. If you don’t enter a value then the regular expression is never triggered. You need to include the required attribute to force a user to enter a value and cause the value to be validated against the regular expression. Custom Validation You can take advantage of the HTML5 constraint validation API to perform custom validation. You can perform any custom validation that you need. The only requirement is that you write a JavaScript function. For example, when booking a hotel room, you might want to validate that the Arrival Date is in the future instead of the past: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Constraint Validation API</title> </head> <body> <form> <label> Arrival Date: <input id="arrivalDate" type="date" required /> </label> <button>Submit Reservation</button> </form> <script type="text/javascript"> var arrivalDate = document.getElementById("arrivalDate"); arrivalDate.addEventListener("input", function() { var value = new Date(arrivalDate.value); if (value < new Date()) { arrivalDate.setCustomValidity("Arrival date must be after now!"); } else { arrivalDate.setCustomValidity(""); } }); </script> </body> </html> The form above contains an input field named arrivalDate. Entering a value into the arrivalDate field triggers the input event. The JavaScript code adds an event listener for the input event and checks whether the date entered is greater than the current date. If validation fails then the validation error message “Arrival date must be after now!” is assigned to the arrivalDate input field by calling the setCustomValidity() method of the validation constraint API. Otherwise, the validation error message is cleared by calling setCustomValidity() with an empty string. HTML5 Validation and Older Browsers But what about older browsers? For example, what about Apple Safari and versions of Microsoft Internet Explorer older than Internet Explorer 10? What the world really needs is a jQuery plugin which provides backwards compatibility for the HTML5 validation attributes. If a browser supports the HTML5 validation attributes then the plugin would do nothing. Otherwise, the plugin would add support for the attributes. Unfortunately, as far as I know, this plugin does not exist. I have not been able to find any plugin which supports both the required and pattern attributes for older browsers, but does not get in the way of these attributes in the case of newer browsers. There are several jQuery plugins which provide partial support for the HTML5 validation attributes including: · jQuery Validation — http://docs.jquery.com/Plugins/Validation · html5Form — http://www.matiasmancini.com.ar/jquery-plugin-ajax-form-validation-html5.html · h5Validate — http://ericleads.com/h5validate/ The jQuery Validation plugin – the most popular JavaScript validation library – supports the HTML5 required attribute, but it does not support the HTML5 pattern attribute. Likewise, the html5Form plugin does not support the pattern attribute. The h5Validate plugin provides the best support for the HTML5 validation attributes. The following page illustrates how this plugin supports both the required and pattern attributes: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>h5Validate</title> <style type="text/css"> .validationError { border: solid 2px red; } .validationValid { border: solid 2px green; } </style> </head> <body> <form id="customerForm"> <label> First Name: <input id="firstName" required /> </label> <label> Social Security Number: <input id="ssn" required pattern="^\d{3}-\d{2}-\d{4}$" title="Expected pattern is ###-##-####" /> </label> <input type="submit" /> </form> <script type="text/javascript" src="Scripts/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="Scripts/jquery.h5validate.js"></script> <script type="text/javascript"> // Enable h5Validate plugin $("#customerForm").h5Validate({ errorClass: "validationError", validClass: "validationValid" }); // Prevent form submission when errors $("#customerForm").submit(function (evt) { if ($("#customerForm").h5Validate("allValid") === false) { evt.preventDefault(); } }); </script> </body> </html> When an input field fails validation, the validationError CSS class is applied to the field and the field appears with a red border. When an input field passes validation, the validationValid CSS class is applied to the field and the field appears with a green border. From the perspective of HTML5 validation, the h5Validate plugin is the best of the plugins. It adds support for the required and pattern attributes to browsers which do not natively support these attributes such as IE9. However, this plugin does not include everything in my wish list for a perfect HTML5 validation plugin. Here’s my wish list for the perfect back compat HTML5 validation plugin: 1. The plugin would disable itself when used with a browser which natively supports HTML5 validation attributes. The plugin should not be too greedy – it should not handle validation when a browser could do the work itself. 2. The plugin should simulate the same user interface for displaying validation error messages as the user interface displayed by browsers which natively support HTML5 validation. Chrome, Firefox, and Internet Explorer all display validation errors in a popup. The perfect plugin would also display a popup. 3. Finally, the plugin would add support for the setCustomValidity() method and the other methods of the HTML5 validation constraint API. That way, you could implement custom validation in a standards compatible way and you would know that it worked across all browsers both old and new. Security It would be irresponsible of me to end this blog post without mentioning the issue of security. It is important to remember that any client-side validation — including HTML5 validation — can be bypassed. You should use client-side validation with the intention to create a better user experience. Client validation is great for providing a user with immediate feedback when the user is in the process of completing a form. However, client-side validation cannot prevent an evil hacker from submitting unexpected form data to your web server. You should always enforce your validation rules on the server. The only way to ensure that a required field has a value is to verify that the required field has a value on the server. The HTML5 required attribute does not guarantee anything. Summary The goal of this blog post was to describe the support for validation contained in the HTML5 standard. You learned how to use both the required and the pattern attributes in an HTML5 form. We also discussed how you can implement custom validation by taking advantage of the setCustomValidity() method. Finally, I discussed the available jQuery plugins for adding support for the HTM5 validation attributes to older browsers. Unfortunately, I am unaware of any jQuery plugin which provides a perfect solution to the problem of backwards compatibility.

    Read the article

  • Is this a secure solution for RESTful authentication?

    - by Chad Johnson
    I need to quickly implement a RESTful authentication system for my JavaScript application to use. I think I understand how it should work, but I just want to double check. Here's what I'm thinking -- what do you guys think? Database schema users id : integer first_name : varchar(50) last_name : varchar(50) password : varchar(32) (MD5 hashed) etc. user_authentications id : integer user_id : integer auth_token : varchar(32) (AES encrypted, with keys outside database) access_token : varchar(32) (AES encrypted, with keys outside database) active : boolean Steps The following happens over SSL. I'm using Sinatra for the API. JavaScript requests authentication via POST to /users/auth/token. The /users/auth/token API method generates an auth_token hash, creates a record in user_authentications, and returns auth_token. JavaScript hashes the user's password and then salts it with auth_token -- SHA(access_token + MD5(password)) POST the user's username and hashed+salted password to /users/auth/authenticate. The /users/auth/authenticate API method will verify that SHA(AES.decrypt(access_token) + user.password) == what was received via POST. The /users/auth/authenticate will generate, AES encrypt, store, and return an access token if verification is successful; otherwise, it will return 401 Unauthorized. For any future requests against the API, JavaScript will include access_token, and the API will find the user account based on that.

    Read the article

  • Using SharePoint PeoplePicker control in custom ASP.NET pages

    - by Jignesh Gangajaliya
    I was developing custom ASP.NET page for a SharePoint project, and the page uses SharePoint PeoplePicker control. I needed to manipulate the control on the client side based on the user inputs. PeoplePicker Picker is a complex control and the difficult bit is that it contains many controls on the page (use the page source viewer to see the HTML tags generated). So getting into the right bit is tricky and also the default JavaScript functions like, control.disabled; control.focus(); will not work with PeoplePicker control. After some trial and error I came up with the solution to manipulate the control using JavaScript.  Here I am posting the JavaScript code snippet to enable/disable the PeoplePicker Control: function ToggleDisabledPeoplePicker(element, isDisabled) {     try     {         element.disabled = isDisabled;     }            catch(exception)     {}            if ((element.childNodes) && (element.childNodes.length > 0))     {         for (var index = 0; index < element.childNodes.length; index++)         {             ToggleDisabledPeoplePicker(element.childNodes[index], isDisabled);         }     } } // to disable the control ToggleDisabledPeoplePicker(document.getElementById("<%=txtMRA.ClientID%>"), true); The script shown below can be used to set focus back to the PeoplePicker control from custom JavaScript validation function: var found = false;         function SetFocusToPeoplePicker(element) {     try     {         if (element.id.lastIndexOf("upLevelDiv") !=-1)         {             element.focus();             found = true;             return;         }     }             catch(exception)     {}             if ((element.childNodes) && (element.childNodes.length > 0))     {         for (var index = 0; index < element.childNodes.length; index++)         {             if (found)             {                 found = false;                 break;             }                      SetFocusToPeoplePicker(element.childNodes[index]);         }     } } - Jignesh

    Read the article

  • How to have other divs with a flash liquid layout that fits to the page?

    - by brybam
    Basically the majority of my content is flash based. I designed it using Flash Builder (Flex) and Its in a liquid layout, (everything is in percents) and if im JUST embedding the flash content it scales to the page fine, and i have the flash content set to have a padding of 50 px. I put a header div in fine with no problems, but I have 2 problems, the first being the footer div seems to cover up the buttom of the flash content in IE, but it looks just fine in chrome. How can I solve this? I'm using the stock embed code that Flex provides, I tried to edit the css style for the div which I think is #flashContent and give it a min width and min height but it didnt seem to work, actually anything I did to #flashContent didn't seem to do anything, maybe its not the div i need to be adding that attribute to... And my other problem is I dont even know where to start when it comes to placing a div thats 280width by 600height colum to the right side of the flash content. If i could specify a size for the flash content, and the float it left, and float the colum right, and clear it with the container div id be just fine....But remember the flash content is set to 100% Scale (well techically 100%x80% because it looked better that way). Does anyone know how I can start to deal with creating a more complex scaleable flash layouts that includes other divs? ALL WELL MAINTAINING IE SUPPORT? IE is ruining my life. Here's the code I'm using: (or if it will help you visualize what im trying to do here's the page where im working on setting this up http://apumpkinpatch.com/textmashnew/) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <title>TextMixup</title> <meta name="google" value="notranslate"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="css.css" rel="stylesheet" type="text/css" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> <script src="../appassets/scripts/jquery.titlealert.js"></script> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-19768131-2']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); function tabNotification() { $.titleAlert('New Message!', {interval:200,requireBlur:true,stopOnFocus:true}); } function joinNotification() { $.titleAlert('Joined Chat!', {interval:200,requireBlur:true,stopOnFocus:true}); } </script> <!-- BEGIN Browser History required section --> <link rel="stylesheet" type="text/css" href="history/history.css" /> <script type="text/javascript" src="history/history.js"></script> <!-- END Browser History required section --> <script type="text/javascript" src="swfobject.js"></script> <script type="text/javascript"> var swfVersionStr = "10.2.0"; var xiSwfUrlStr = "playerProductInstall.swf"; var flashvars = {}; var params = {}; params.quality = "high"; params.bgcolor = "#ffffff"; params.allowscriptaccess = "sameDomain"; params.allowfullscreen = "true"; var attributes = {}; attributes.id = "TextMixup"; attributes.name = "TextMixup"; attributes.align = "middle"; swfobject.embedSWF( "TextMixup.swf", "flashContent", "100%", "80%", swfVersionStr, xiSwfUrlStr, flashvars, params, attributes); swfobject.createCSS("#flashContent", "display:block;text-align:left;"); </script> </head> <body> <div id="homebar"><a href="http://apumpkinpatch.com"><img src="../appassets/images/logo/logoHor_130_30.png" alt="APumpkinPatch HOME" width="130" height="30" hspace="10" vspace="3" border="0"/></a> </div> <div id="topad"> <script type="text/javascript"><!-- google_ad_client = "pub-5824388356626461"; /* 728x90, textmash */ google_ad_slot = "1114351240"; google_ad_width = 728; google_ad_height = 90; //--> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </div> <div id="mainContainer"> <div id="flashContent"> <p> To view this page ensure that Adobe Flash Player version 10.2.0 or greater is installed. </p> <script type="text/javascript"> var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://"); document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='" + pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>" ); </script> </div> <noscript> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="80%" id="TextMixup"> <param name="movie" value="TextMixup.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="#ffffff" /> <param name="allowScriptAccess" value="sameDomain" /> <param name="allowFullScreen" value="true" /> <!--[if !IE]>--> <object type="application/x-shockwave-flash" data="TextMixup.swf" width="100%" height="80%"> <param name="quality" value="high" /> <param name="bgcolor" value="#ffffff" /> <param name="allowScriptAccess" value="sameDomain" /> <param name="allowFullScreen" value="true" /> <!--<![endif]--> <!--[if gte IE 6]>--> <p> Either scripts and active content are not permitted to run or Adobe Flash Player version 10.2.0 or greater is not installed. </p> <!--<![endif]--> <a href="http://www.adobe.com/go/getflashplayer"> <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" /> </a> <!--[if !IE]>--> </object> <!--<![endif]--> </object> </noscript> <div id="convosPreview">This is a div I would want to appear as a colum to the right of the flash content that can scale</div> <!---End mainContainer --> </div> <div id="footer"> <a href="../apps.html"><img src="../appassets/images/apps.png" hspace="5" vspace="5" alt="random chat app apumpkinpatch" width="228" height="40" border="0" /></a><a href="https://chrome.google.com/webstore/detail/hjmnobclpbhnjcpdnpdnkbgdkbfifbao?hl=en-US#"><img src="../appassets/images/chromeapp.png" alt="chrome app random video chat apumpkinpatch" width="115" height="40" vspace="5" border="0" /></a><br /><br /> <a href="http://spacebarup.com" target="_blank">©2011 Space Bar</a> | <a href="../tos.html">TOS & Privacy Policy</a> | <a href="../help.html">FAQ & Help</a> | <a href="../tips.html">Important online safety tips</a> | <a href="http://www.facebook.com/pages/APumpkinPatchcom/164279206963001?sk=app_2373072738" target="_blank">Discussion Boards</a><br /> <p>You must be at least 18 years of age to access this web site.<br />APumpkinPatch.com is not responsible for the actions of any visitors of this site.<br />APumpkinPatch.com does not endorse or claim ownership to any of the content that is broadcast through this site. </p><h2>A Pumpkin Patch is BRAND NEW and will be developed a lot over the next few months adding video chat games, chat rooms, and more! Check back often it's going to be a lot of fun!</h2> </div> </body> </html> myCSS: html, body { height:100%; } body { text-align:center; font-family: Helvetica, Arial, sans-serif; margin:0; padding:0; overflow:auto; text-align:center; background-color: #ffffff; } object:focus { outline:none; } #homebar { clear:both; text-align: left; width: 100%; height: 40px; background-color:#333333; color:#CCC; overflow:hidden; box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.65); -moz-box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.65); -webkit-box-shadow: 0px 0px 14px rgba(0, 0, 0, 0.65); margin-bottom: 10px; } #mainContainer { height:auto; width:auto; clear:both; } #flashContent { display:none; height:auto; float:left; min-height: 500px; min-width: 340px; } /**this is the div i want to appear as a column net to the scaleable flash content **/ #convosPreview { float:right; width:280px; height:600px; }

    Read the article

  • The lifecycle of "cool"

    - by Dori
    I've been thinking lately about how some programming projects/products become "cool," and in particular, how that trend can later reverse. Here are two examples that might better explain my context: Textmate Whenever someone asks about text editors on OS X, the answer on the SE sites is an automatic "Textmate!" But looked at objectively: Textmate 1.0 shipped October 2004 Textmate 1.5 shipped January 2006 Textmate 2 was announced February 2006 As of September 2010, the currently shipping version is 1.5.9 In all of 2010, there have been a total of three posts on the Textmate blog At what point (if ever) do Textmate fans start thinking about switching to another text editor? When it breaks after some future Apple update? When alpha geeks they respect start recommending something else? Or? jQuery Whenever a JavaScript-related question is asked on the SE sites, the knee-jerk response is "jQuery!" I've seen it happen even when the question itself only required a single line of JavaScript. Or when the question could be better answered by using CSS. Do the answerers understand they're suggesting a blowtorch to light a candle? That they're recommending adding 70K or so of code to do something trivial? Or is it a symptom of "When you have a hammer, everything looks like a nail"—that is, jQuery is all they know how to do, so that's their recommendation? And do they understand that while they may know jQuery well, that doesn't necessarily mean that they know JavaScript? Is there a way to explain that learning JavaScript would make them better jQuery programmers? My bigger-picture questions: Is this niche focus primarily a trait of programmers? How do you get programmers to not immediately jump to recommending their personal favorites? What can motivate programmers to review their initial selection criteria and possibly modify their choice? Your thoughts?

    Read the article

  • HTML5 game engine for a 2D or 2.5D RPG style "map walk"

    - by stargazer
    please help me to choose a HTML5 game engine or Javascript libraries I want to do the following in the game: when the game starts a part the huge map (full size of the map: about 7 screens) is shown. The map itself is completely designed in the editor mapeditor.org (or in some comparable editor - if you know a good alternative to mapeditor.org - let me know) and loaded at runtime or at design time. The game engine should support loading of isometric maps (well, in worst case only orthogonal maps will be sufficient) both "tile layer" and "object layer" from mapeditor.org should be supported. Scrolling/performance of this map should be fast enough. The map and the game should be either in 2D (orthogonal map) or in 2.5D (isometric map) The game engine should support movement of sprites with animation. Let say I have a sprite for "human" with animation sequences showing "walking" in 8 directions - it should be imported into game engine and should "walk" on the map without writing a lot of Javascript code. Automatic scrolling of the map the "human" nears the screen border. Collision detection, "solid" objects. The mapeditor.org supports properies on tiles. Let say I assign a "solid" property to some tiles in editor. It should be easy to check this "solid" property in the game engine and implement kind of "solid" behavior, so the animanted sprites do not walk through the walls. Collision detection - it should be easy to implement some custom functionality like "when sprite A is close to sprite B - call this function" Showing "dialogs" or popup windows on top of the map - should be easy to implement. Cross-browser audio support - (it is implemented quite well in construct 2 from scirra, so I'm looking for the comparable audio quality) The game itself is a king of RPG but without fighting scenes and without huge "inventory". The main character just walking on the map, discovers some things, there are dialogs and sounds. The functionality of this example from sprite.js http://batiste.dosimple.ch/sprite.js/tests/mapeditor/map_reader.html is very close to what I'm developing. But I'm not a Javascript guru (and a very lazy guy) and would like to write even less Javascript code as in the example...

    Read the article

  • Windows 8 Apps Unleashed Now in Bookstores!

    - by Stephen.Walther
    My book Windows 8 Apps with HTML5 and JavaScript Unleashed is now in bookstores! Learn how to create Metro apps Windows 8 apps with JavaScript. And the book is in color! All of the code listings and illustrations are in color. Why build Windows 8 apps? When you create a Windows 8 app, you can put your app in the Windows 8 Store. In other words, customers can buy your app directly from Windows. Think iPhone apps, but for a much larger market. In my book, I explain how you can create both game apps and simple productivity apps by creating Windows 8 apps with JavaScript. The book is a short read and I include plenty of code samples that have been tested against the final release of Windows 8. You can buy the book by going to your local Barnes & Noble bookstore or you can buy the book through Amazon by using the following link: It looks like the book is also available for the Kindle: Kindle: Windows 8 Apps with HTML5 and JavaScript Unleashed

    Read the article

  • Hiding the Flash Message After a Time Delay

    - by Madhan ayyasamy
    Hi Friends,The flash hash is a great way to provide feedback to your users.Here is a quick tip for hiding the flash message after a period of time if you don’t want to leave it lingering around.First, add this line to the head of your layout to ensure the prototype and script.aculo.us javascript libraries are loaded:Next, add the following to either your layout (recommended), your view templates or a partial depending on your needs. I usually add this to a partial and include the partial in my layouts. "flash", :id = flash_type % "text/javascript" do % setTimeout("new Effect.Fade('');", 10000); This will wrap the flash message in a div with class=‘flash’ and id=‘error’, ‘notice’ or ‘warn’ depending on the flash key specified.The value ‘10000’ is the time in milliseconds before the flash will disappear. In this case, 10 seconds.This function looks pretty good and little javascript stunts like this can help make your site feel more professional. It’s also worth bearing in mind though, not everybody can see well or read as quickly as others so this may not be suitable for every application.Update:As Mitchell has pointed out (see comments below), it may be better to set the flash_type as the div class rather than it’s id. If there is the possibility that you’ll be showing more than one flash message per page, setting the flash_type as the div id will result in your HTML/XHTML code becoming invalid because the unique intentifier will be used more than once per page.Here is a slightly more complex version of the method shown above that will hide all divs with class ‘flash’ after a time delay, achieving the same effect and also ensuring your code stays valid with more than one flash message! "flash #{flash_type}" % "text/javascript" do % setTimeout("$$('div.flash').each(function(flash){ flash.hide();})", 10000); In this example, the div id is not set at all. Instead, each flash div will have class “div” and also class of the type of flash message (“error”, “warning” etc.).Have a Great Day..:)

    Read the article

  • Save static version of a webpage to be available offline

    - by Tal Weiss
    Is there a way to save a webpage as static HTML, available for offline viewing, editing etc.? I want to remove all javascript files. Leave only HTML, CSS and images. For example, if this web page has a Facebook Like button, I want the image of the button to be part of the HTML as a regular image (and not be loaded as some Javascript code runs after I load the page). I'm trying to prepare a webpage for an offline demo. When I use the standard "save as HTML complete" like tools, all the Javascript is saved as well, and when viewed offline, all the dynamic content is blanks. Note- I don't expect the dynamic content to work, of course, with no Javascript. I just want the web page to LOOK as though it was just loaded from the interwebs. Thanks, Tal.

    Read the article

  • Windows 8 Apps Unleashed Now in Bookstores!

    - by Stephen.Walther
    My book Windows 8 Apps with HTML5 and JavaScript Unleashed is now in bookstores! Learn how to create Metro apps Windows 8 apps with JavaScript. And the book is in color! All of the code listings and illustrations are in color. Why build Windows 8 apps? When you create a Windows 8 app, you can put your app in the Windows 8 Store. In other words, customers can buy your app directly from Windows. Think iPhone apps, but for a much larger market. In my book, I explain how you can create both game apps and simple productivity apps by creating Windows 8 apps with JavaScript. The book is a short read and I include plenty of code samples that have been tested against the final release of Windows 8. You can buy the book by going to your local Barnes & Noble bookstore or you can buy the book through Amazon by using the following link: It looks like the book is also available for the Kindle: Kindle: Windows 8 Apps with HTML5 and JavaScript Unleashed

    Read the article

  • CodePlex Daily Summary for Thursday, June 07, 2012

    CodePlex Daily Summary for Thursday, June 07, 2012Popular Releases????SDK for .Net 2.0/3.5/4.0 (OAuth2.0+??V2?API): ??VS2008?.net2.0、3.5、4.0????????: ??Upload???“?????IComparer”??????,????????。 ???????.net????VS2010??,?????????。 ????VS2008?.net2.0/3.5?!??Entities???? ???????.net???N????? ??JSON.net??????????? ?.net4.0??API?????dynamic??class ???alpha??,???? ?????????????JSON.net????,??????。 VS2005???????,?????var???,??????????! ????.net4.0???????????????,?????????LINQ to Twitter: LINQ to Twitter Beta v2.0.26: Supports .NET 3.5, .NET 4.0, Silverlight 4.0, Windows Phone 7.1, Client Profile, and Windows 8. 100% Twitter API coverage. Also available via NuGet! Follow @JoeMayo.Python Tools for Visual Studio: 1.5 Beta 1: We’re pleased to announce the release of Python Tools for Visual Studio 1.5 Beta. Python Tools for Visual Studio (PTVS) is an open-source plug-in for Visual Studio which supports programming with the Python language. PTVS supports a broad range of features including: • Supports CPython, IronPython, Jython and PyPy • Python editor with advanced member, signature intellisense and refactoring • Code navigation: “Find all refs”, goto definition, and object browser • Local and remote debugging •...Circuit Diagram: Circuit Diagram 2.0 Beta 1: New in this release: Automatically flip components when placing Delete components using keyboard delete key Resize document Document properties window Print document Recent files list Confirm when exiting with unsaved changes Thumbnail previews in Windows Explorer for CDDX files Show shortcut keys in toolbox Highlight selected item in toolbox Zoom using mouse scroll wheel while holding down ctrl key Plugin support for: Custom export formats Custom import formats Open...Umbraco CMS: Umbraco CMS 5.2 Beta: The future of Umbracov5 represents the future architecture of Umbraco, so please be aware that while it's technically superior to v4 it's not yet on a par feature or performance-wise. What's new? For full details see our http://progress.umbraco.org task tracking page showing all items complete for 5.2. In a nutshellPackage Builder Starter Kits Dynamic Extension Methods Querying / IsHelpers Friendly alt template URLs Localization Various bug fixes / performance enhancements Gett...JayData - The cross-platform HTML5 data-management library for JavaScript: JayData 1.0.5: JayData is a unified data access library for JavaScript developers to query and update data from different sources like WebSQL, IndexedDB, OData, Facebook or YQL. See it in action in this 6 minutes video New features in JayData 1.0.5http://jaydata.org/blog/jaydata-1.0.5-is-here-with-authentication-support-and-more http://jaydata.org/blog/release-notes Sencha Touch 2 module (read-only)This module can be used to bind data retrieved by JayData to Sencha Touch 2 generated user interface. (exam...32feet.NET: 3.5: This version changes the 32feet.NET library (both desktop and NETCF) to use .NET Framework version 3.5. Previously we compiled for .NET v2.0. There are no code changes from our version 3.4. See the 3.4 release for more information. Changes due to compiling for .NET 3.5Applications should be changed to use NET/NETCF v3.5. Removal of class InTheHand.Net.Bluetooth.AsyncCompletedEventArgs, which we provided on NETCF. We now just use the standard .NET System.ComponentModel.AsyncCompletedEvent...DotNetNuke® Links: 06.02.01: Added new DNN 6.2.0 beta social feature "friends" BugfixesApplication Architecture Guidelines: Application Architecture Guidelines 3.0.7: 3.0.7Jolt Environment: Jolt v2 Stable: Many new features. Follow development here for more information: http://www.rune-server.org/runescape-development/rs-503-client-server/projects/298763-jolt-environment-v2.html Setup instructions in downloadSharePoint Euro 2012 - UEFA European Football Predictor: havivi.euro2012.wsp (1.5): New fetures:Multilingual Support Max users property in Standings Web Part Games time zone change (UTC +1) bug fix - Version 1.4 locking problem http://euro2012.codeplex.com/discussions/358262 bug fix - Field Title not found (v.1.3) German SP http://euro2012.codeplex.com/discussions/358189#post844228 Bug fix - Access is denied.for users with contribute rights Bug fix - Installing on non-English version of SharePoint Bug fix - Title Rules Installing SharePoint Euro 2012 PredictorSharePoint E...xNet: xNet 2.1.1: Release xNet 2.1.1Command Line Parser Library: 1.9.2.4 stable: This is the first stable of 1.9.* branch. Added tests for HelpText::AutoBuild. Fixed minor formatting error in HelpText::DefaultParsingErrorsHandler.myManga: myManga v1.0.0.4: ChangeLogUpdating from Previous Version: Extract contents of Release - myManga v1.0.0.4.zip to previous version's folder. Replaces: myManga.exe BakaBox.dll CoreMangaClasses.dll Manga.dll Plugins/MangaReader.manga.dll Plugins/MangaFox.manga.dll Plugins/MangaHere.manga.dll Plugins/MangaPanda.manga.dllMVVM Light Toolkit: V4RC (binaries only) including Windows 8 RP: This package contains all the latest DLLs for MVVM Light V4 RC. It includes the DLLs for Windows 8 Release Preview. An updated Nuget package is also available at http://nuget.org/packages/MvvmLightLibsPreviewExtAspNet: ExtAspNet v3.1.7: +2012-06-03 v3.1.7 -?????????BUG,??????RadioButtonList?,AJAX????????BUG(swtseaman、????)。 +?Grid?BoundField、HyperLinkField、LinkButtonField、WindowField??HtmlEncode?HtmlEncodeFormatString(TiDi)。 -HtmlEncode?HtmlEncodeFormatString??????true,??????HTML????????。 -??????Asp.Net??GridView?BoundField?????????。 -http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.boundfield.htmlencode -?Grid?HyperLinkField、WindowField??UrlEncode??,????URL??(???true)。 -?????????????,?????????????...LiveChat Starter Kit: LCSK v1.5.2: New features: Visitor location (City - Country) from geo-location Pass configuration via javascript for the chat box New visitor identification (no more using the IP address as visitor identification) To update from 1.5.1 Run the /src/1.5.2-sql-updates.txt SQL script to update your database tables. If you have it installed via NuGet, simply update your package and the file will be included so you can run the update script. New installation The easiest way to add LCSK to your app is by...Kendo UI ASP.NET Sample Applications: Sample Applications (2012-06-01): Sample application(s) demonstrating the use of Kendo UI in ASP.NET applications.Better Explorer: Better Explorer Beta 1: Finally, the first Beta is here! There were a lot of changes, including: Translations into 10 different languages (the translations are not complete and will be updated soon) Conditional Select new tools for managing archives Folder Tools tab new search bar and Search Tab new image editing tools update function many bug fixes, stability fixes, and memory leak fixes other new features as well! Please check it out and if there are any problems, let us know. :) Also, do not for...New ProjectsActiveAttributes: Create attributes that execute code when their target members are called.Blogger Access Library: This is a .NET library that make it easy to post your blog article to Blogger when you want to handle the blogger with .NET (C#, VB, F#...etc) code.cookie.js - Simple JavaScript Cookie Processor: Simple JavaScript Cookie ProcessorDeberPrueba: deber de tareaDNN User Redirect: Allows you to redirect users that are members of specific roles or groups to landing pages within your DotNetNuke website. This is perfect for scenarios such as the following: - redirect unauthenticated users to a Login page - redirect authenticated users to a Welcome page after successful login - redirect users to a page where they need to view/accept Terms of Service - redirect employees who are part of a specific department in your organization to a Departmental landing page When ...Evento-Pro: O Aplicativo contará com uma área de manutenção e cadastro das informações necessárias para seu funcionamento, bem como uma tela para visualização, criação/manutenção dos eventos.Exchange Mailbox Permission Reverse Lookup: Ever wondered a user in which mailboxes has full-access or send-as rights? One common strategy is to use groups to grant permissions on shared mailboxes, where querying the user which groups is member of would do the job. But in case you grant mailbox permissions directly to users (maybe because you are using the Exchange 2010 shared mailbox automapping feature), this tool can come quite handy.Find and Replace word in the sentences: This program used Java Development Kid 6.0 and i were using HighLighter class. It was completed code with source code and then everybody can use in everything. I use it for my assignment of NCC Education on IAD(International Advanced Diploma). GIMS: Graphical ImageMagick ScripterGoogleMaps .NET API: This is a wrapper to use the Google Maps API in a .NET windows application (WinForms and WPF). It works by using a browser control (either WinForms or WPF), and interacting with a JavaScript implementation of Google Maps.Grid.Mvc: Grid.Mvc - is a component that allows you easy construction of HTML tables for displaying, paging and sorting data from a collection of Model objects.HgReleaseNotesGen: A cmd line utility for automatically creating a Release Notes document from a Mercurial repository - currently used by StyleCop.HS FB: Fizz BuzzJaySvcUtil - generate JavaScript context from OData metadata: This tool generates client-side metadata for OData service endpoints, so OData services can be consumed from JavaScript using JayData. Visit http://jaydata.org for detailed documentation, example apps and tutorials. You can download JayData from the [url:JayData CodePlex project|http://jaydata.codeplex.com] Knockout Serializer: Knockout SerializerMarsExplorer: This is a personal projectMulti camera snapshot taker: **this c# winform project is based on DXSnap-2008 sample project ** A few days ago, someone told me that it was not possible to take 3 snapshots , from 3 different webcams , at the same time (e.g. this guy wanted to take snapshots of an item on 3 different axes (X,Y,Z) at the same time. so I 've tried to make it work..mvcEticaret: Ticaret sitesiPush Notification: Push Notification service sample using F# and Duplex NetTcpBinding Reproductor: ReproductorStudyMate: A Internet and mobile based website, where user can make and share Exam revision notes to read them from mobile, attempt objective type questions and chat between online users.SugarSync Folder Provider for DotNetNuke: The SugarSync Folder Provider for DotNetNuke allows you to have direct integration between your cloud-hosted files and the file system in your DotNetNuke website. In using this extension, you will be able to enjoy the management of files in a CMS with the power of cloud file hosting.The SharePoint 2010 Tag Cloud web part for blog web template: The SharePoint 2010 Tag Cloud web part for blog web templateTimeClearWinFreeTime: ?????????IT???????,????????????,????????????(??:?????,??????)。???????????????????????,???????????????,??????,????????,?????55?????Windows????,????????????。 ???????c#,Windows7 ???Windows???????????, Windows XP??????.Netframework3.5????. Netframework3.5????: http://msdn.microsoft.com/zh-cn/netframework/cc378097VoIP based Call Management System (VBCMS): This project intends to focus on new ways of providing road side assistance service and many more using VoIP based systemXaml FlowDocument to PDF Converter: Simple FlowDocument to PDF Converter with paging, header and footer

    Read the article

< Previous Page | 768 769 770 771 772 773 774 775 776 777 778 779  | Next Page >