Search Results

Search found 30884 results on 1236 pages for 'javascript module'.

Page 240/1236 | < Previous Page | 236 237 238 239 240 241 242 243 244 245 246 247  | Next Page >

  • Learning AngularJS by Example – The Customer Manager Application

    - by dwahlin
    I’m always tinkering around with different ideas and toward the beginning of 2013 decided to build a sample application using AngularJS that I call Customer Manager. It’s not exactly the most creative name or concept, but I wanted to build something that highlighted a lot of the different features offered by AngularJS and how they could be used together to build a full-featured app. One of the goals of the application was to ensure that it was approachable by people new to Angular since I’ve never found overly complex applications great for learning new concepts. The application initially started out small and was used in my AngularJS in 60-ish Minutes video on YouTube but has gradually had more and more features added to it and will continue to be enhanced over time. It’ll be used in a new “end-to-end” training course my company is working on for AngularjS as well as in some video courses that will be coming out. Here’s a quick look at what the application home page looks like: In this post I’m going to provide an overview about how the application is organized, back-end options that are available, and some of the features it demonstrates. I’ve already written about some of the features so if you’re interested check out the following posts: Building an AngularJS Modal Service Building a Custom AngularJS Unique Value Directive Using an AngularJS Factory to Interact with a RESTful Service Application Structure The structure of the application is shown to the right. The  homepage is index.html and is located at the root of the application folder. It defines where application views will be loaded using the ng-view directive and includes script references to AngularJS, AngularJS routing and animation scripts, plus a few others located in the Scripts folder and to custom application scripts located in the app folder. The app folder contains all of the key scripts used in the application. There are several techniques that can be used for organizing script files but after experimenting with several of them I decided that I prefer things in folders such as controllers, views, services, etc. Doing that helps me find things a lot faster and allows me to categorize files (such as controllers) by functionality. My recommendation is to go with whatever works best for you. Anyone who says, “You’re doing it wrong!” should be ignored. Contrary to what some people think, there is no “one right way” to organize scripts and other files. As long as the scripts make it down to the client properly (you’ll likely minify and concatenate them anyway to reduce bandwidth and minimize HTTP calls), the way you organize them is completely up to you. Here’s what I ended up doing for this application: Animation code for some custom animations is located in the animations folder. In addition to AngularJS animations (which are defined using CSS in Content/animations.css), it also animates the initial customer data load using a 3rd party script called GreenSock. Controllers are located in the controllers folder. Some of the controllers are placed in subfolders based upon the their functionality while others are placed at the root of the controllers folder since they’re more generic:   The directives folder contains the custom directives created for the application. The filters folder contains the custom filters created for the application that filter city/state and product information. The partials folder contains partial views. This includes things like modal dialogs used in the application. The services folder contains AngularJS factories and services used for various purposes in the application. Most of the scripts in this folder provide data functionality. The views folder contains the different views used in the application. Like the controllers folder, the views are organized into subfolders based on their functionality:   Back-End Services The Customer Manager application (grab it from Github) provides two different options on the back-end including ASP.NET Web API and Node.js. The ASP.NET Web API back-end uses Entity Framework for data access and stores data in SQL Server (LocalDb). The other option on the back-end is Node.js, Express, and MongoDB.   Using the ASP.NET Web API Back-End To run the application using ASP.NET Web API/SQL Server back-end open the .sln file at the root of the project in Visual Studio 2012 or higher (the free Express 2013 for Web version is fine). Press F5 and a browser will automatically launch and display the application. Using the Node.js Back-End To run the application using the Node.js/MongoDB back-end follow these steps: In the CustomerManager directory execute 'npm install' to install Express, MongoDB and Mongoose (package.json). Load sample data into MongoDB by performing the following steps: Execute 'mongod' to start the MongoDB daemon Navigate to the CustomerManager directory (the one that has initMongoCustData.js in it) then execute 'mongo' to start the MongoDB shell Enter the following in the mongo shell to load the seed files that handle seeding the database with initial data: use custmgr load("initMongoCustData.js") load("initMongoSettingsData.js") load("initMongoStateData.js") Start the Node/Express server by navigating to the CustomerManager/server directory and executing 'node app.js' View the application at http://localhost:3000 in your browser. Key Features The Customer Manager application certainly doesn’t cover every feature provided by AngularJS (as mentioned the intent was to keep it as simple as possible) but does provide insight into several key areas: Using factories and services as re-useable data services (see the app/services folder) Creating custom directives (see the app/directives folder) Custom paging (see app/views/customers/customers.html and app/controllers/customers/customersController.js) Custom filters (see app/filters) Showing custom modal dialogs with a re-useable service (see app/services/modalService.js) Making Ajax calls using a factory (see app/services/customersService.js) Using Breeze to retrieve and work with data (see app/services/customersBreezeService.js). Switch the application to use the Breeze factory by opening app/services.config.js and changing the useBreeze property to true. Intercepting HTTP requests to display a custom overlay during Ajax calls (see app/directives/wcOverlay.js) Custom animations using the GreenSock library (see app/animations/listAnimations.js) Creating custom AngularJS animations using CSS (see Content/animations.css) JavaScript patterns for defining controllers, services/factories, directives, filters, and more (see any JavaScript file in the app folder) Card View and List View display of data (see app/views/customers/customers.html and app/controllers/customers/customersController.js) Using AngularJS validation functionality (see app/views/customerEdit.html, app/controllers/customerEditController.js, and app/directives/wcUnique.js) More… Conclusion I’ll be enhancing the application even more over time and welcome contributions as well. Tony Quinn contributed the initial Node.js/MongoDB code which is very cool to have as a back-end option. Access the standard application here and a version that has custom routing in it here. Additional information about the custom routing can be found in this post.

    Read the article

  • How to ensure custom serverListener events fires before action events

    - by frank.nimphius
    Normal 0 false false false EN-US X-NONE X-NONE /* Style Definitions */ table.MsoNormalTable {mso-style-name:"Table Normal"; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-priority:99; mso-style-qformat:yes; mso-style-parent:""; mso-padding-alt:0in 5.4pt 0in 5.4pt; mso-para-margin:0in; mso-para-margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:10.0pt; font-family:"Times New Roman","serif";} Using JavaScript in ADF Faces you can queue custom events defined by an af:serverListener tag. If the custom event however is queued from an af:clientListener on a command component, then the command component's action and action listener methods fire before the queued custom event. If you have a use case, for example in combination with client side integration of 3rd party technologies like HTML, Applets or similar, then you want to change the order of execution. The way to change the execution order is to invoke the command item action from the client event method that handles the custom event propagated by the af:serverListener tag. The following four steps ensure your successful doing this 1.       Call cancel() on the event object passed to the client JavaScript function invoked by the af:clientListener tag 2.       Call the custom event as an immediate action by setting the last argument in the custom event call to true function invokeCustomEvent(evt){   evt.cancel();          var custEvent = new AdfCustomEvent(                         evt.getSource(),                         "mycustomevent",                                                                                                                    {message:"Hello World"},                         true);    custEvent.queue(); } 3.       When handling the custom event on the server, lookup the command item, for example a button, to queue its action event. This way you simulate a user clicking the button. Use the following code ActionEvent event = new ActionEvent(component); event.setPhaseId(PhaseId.INVOKE_APPLICATION); event.queue(); The component reference needs to be changed with the handle to the command item which action method you want to execute. 4.       If the command component has behavior tags, like af:fileDownloadActionListener, or af:setPropertyListener, defined, then these are also executed when the action event is queued. However, behavior tags, like the file download action listener, may require a full page refresh to be issued to work, in which case the custom event cannot be issued as a partial refresh. File download action tag: http://download.oracle.com/docs/cd/E17904_01/apirefs.1111/e12419/tagdoc/af_fileDownloadActionListener.html " Since file downloads must be processed with an ordinary request - not XMLHttp AJAX requests - this tag forces partialSubmit to be false on the parent component, if it supports that attribute." To issue a custom event as a non-partial submit, the previously shown sample code would need to be changed as shown below function invokeCustomEvent(evt){   evt.cancel();          var custEvent = new AdfCustomEvent(                         evt.getSource(),                         "mycustomevent",                                                                                                                    {message:"Hello World"},                         true);    custEvent.queue(false); } To learn more about custom events and the af:serverListener, please refer to the tag documentation: http://download.oracle.com/docs/cd/E17904_01/apirefs.1111/e12419/tagdoc/af_serverListener.html

    Read the article

  • Maven2 multi-module ejb 3.1 project - deployment error

    - by gerry
    The problem is taht I get the following error qhile deploying my project to Glassfish: java.lang.RuntimeException: Unable to load EJB module. DeploymentContext does not contain any EJB Check archive to ensure correct packaging But, let us start on how the project structure looks like in Maven2... I've build the following scenario: MultiModuleJavaEEProject - parent module - model --- packaged as jar - ejb1 ---- packaged as ebj - ejb2 ---- packaged as ebj - web ---- packaged as war So model, ejb1, ejb2 and web are children/modules of the parent MultiModuleJavaEEProject. _ejb1 depends on model. _ejb2 depends on ejb1. _web depends on ejb2. the pom's look like: _parent: <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"> <modelVersion>4.0.0</modelVersion> <groupId>org.dyndns.geraldhuber.testing</groupId> <artifactId>MultiModuleJavaEEProject</artifactId> <packaging>pom</packaging> <version>1.0</version> <name>MultiModuleJavaEEProject</name> <url>http://maven.apache.org</url> <modules> <module>model</module> <module>ejb1</module> <module>ejb2</module> <module>web</module> </modules> <dependencies> <dependency> <groupId>junit</groupId> <artifactId>junit</artifactId> <version>4.7</version> <scope>test</scope> </dependency> </dependencies> <build> <pluginManagement> <plugins> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-compiler-plugin</artifactId> <configuration> <source>1.6</source> <target>1.6</target> </configuration> </plugin> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-ejb-plugin</artifactId> <version>2.2</version> <configuration> <ejbVersion>3.1</ejbVersion> <jarName>${project.groupId}.${project.artifactId}-${project.version}</jarName> </configuration> </plugin> </plugins> </pluginManagement> </build> </project> _model: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"> <modelVersion>4.0.0</modelVersion> <parent> <groupId>testing</groupId> <artifactId>MultiModuleJavaEEProject</artifactId> <version>1.0</version> </parent> <artifactId>model</artifactId> <packaging>jar</packaging> <version>1.0</version> <name>model</name> <url>http://maven.apache.org</url> </project> _ejb1: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"> <modelVersion>4.0.0</modelVersion> <parent> <groupId>testing</groupId> <artifactId>MultiModuleJavaEEProject</artifactId> <version>1.0</version> </parent> <artifactId>ejb1</artifactId> <packaging>ejb</packaging> <version>1.0</version> <name>ejb1</name> <url>http://maven.apache.org</url> <dependencies> <dependency> <groupId>org.glassfish</groupId> <artifactId>javax.ejb</artifactId> <version>3.0</version> <scope>provided</scope> </dependency> <dependency> <groupId>testing</groupId> <artifactId>model</artifactId> <version>1.0</version> </dependency> </dependencies> </project> _ejb2: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"> <modelVersion>4.0.0</modelVersion> <parent> <groupId>testing</groupId> <artifactId>MultiModuleJavaEEProject</artifactId> <version>1.0</version> </parent> <artifactId>ejb2</artifactId> <packaging>ejb</packaging> <version>1.0</version> <name>ejb2</name> <url>http://maven.apache.org</url> <dependencies> <dependency> <groupId>org.glassfish</groupId> <artifactId>javax.ejb</artifactId> <version>3.0</version> <scope>provided</scope> </dependency> <dependency> <groupId>testing</groupId> <artifactId>ejb1</artifactId> <version>1.0</version> </dependency> </dependencies> </project> _web: <?xml version="1.0" encoding="UTF-8"?> <project xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd" xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> <modelVersion>4.0.0</modelVersion> <parent> <artifactId>MultiModuleJavaEEProject</artifactId> <groupId>testing</groupId> <version>1.0</version> </parent> <groupId>testing</groupId> <artifactId>web</artifactId> <version>1.0</version> <packaging>war</packaging> <name>web Maven Webapp</name> <url>http://maven.apache.org</url> <dependencies> <dependency> <groupId>javax.servlet</groupId> <artifactId>servlet-api</artifactId> <version>2.4</version> <scope>provided</scope> </dependency> <dependency> <groupId>org.glassfish</groupId> <artifactId>javax.ejb</artifactId> <version>3.0</version> <scope>provided</scope> </dependency> <dependency> <groupId>testing</groupId> <artifactId>ejb2</artifactId> <version>1.0</version> </dependency> </dependencies> <build> <plugins> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-war-plugin</artifactId> <version>2.0</version> <configuration> <archive> <manifest> <addClasspath>true</addClasspath> </manifest> </archive> </configuration> </plugin> </plugins> <finalName>web</finalName> </build> </project> And the model is just a simple Pojo: package testing.model; public class Data { private String data; public String getData() { return data; } public void setData(String data) { this.data = data; } } And the ejb1 contains only one STATELESS ejb. package testing.ejb1; import javax.ejb.Stateless; import testing.model.Data; @Stateless public class DataService { private Data data; public DataService(){ data = new Data(); data.setData("Hello World!"); } public String getDataText(){ return data.getData(); } } As well as the ejb2 is only a stateless ejb: package testing.ejb2; import javax.ejb.EJB; import javax.ejb.Stateless; import testing.ejb1.DataService; @Stateless public class Service { @EJB DataService service; public Service(){ } public String getText(){ return service.getDataText(); } } And the web module contains only a Servlet: package testing.web; import java.io.IOException; import java.io.PrintWriter; import javax.ejb.EJB; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import testing.ejb2.Service; public class SimpleServlet extends HttpServlet { @EJB Service service; public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { PrintWriter out = response.getWriter(); out.println( "SimpleServlet Executed" ); out.println( "Text: "+service.getText() ); out.flush(); out.close(); } } And the web.xml file in the web module looks like: <!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" "http://java.sun.com/dtd/web-app_2_3.dtd" > <web-app> <display-name>Archetype Created Web Application</display-name> <servlet> <servlet-name>simple</servlet-name> <servlet-class>testing.web.SimpleServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>simple</servlet-name> <url-pattern>/simple</url-pattern> </servlet-mapping> </web-app> So no further files are set up by me. There is no ejb-jar.xml in any ejb files, because I'm using EJB 3.1. So I think ejb-jar.xml descriptors are optional. I this right? But the problem is, the already mentioned error: java.lang.RuntimeException: Unable to load EJB module. DeploymentContext does not contain any EJB Check archive to ensure correct packaging Can anybody help?

    Read the article

  • Directory structure for a website (js/css/img folders)

    - by nightcoder
    For years I've been using the following directory structure for my websites: <root> ->js ->jquery.js ->tooltip.js ->someplugin.js ->css ->styles.css ->someplugin.css ->images -> all website images... it seemed perfectly fine to me until I began to use different 3rd-party components. For example, today I've downloaded a datetime picker javascript component that looks for its images in the same directory where its css file is located (css file contains urls like "url('calendar.png')"). So now I have 3 options: 1) put datepicker.css into my css directory and put its images along. I don't really like this option because I will have both css and image files inside the css directory and it is weird. Also I might meet files from different components with the same name, such as 2 different components, which link to background.png from their css files. I will have to fix those name collisions (by renaming one of the files and editing the corresponding file that contains the link). 2) put datepicker.css into my css directory, put its images into the images directory and edit datepicker.css to look for the images in the images directory. This option is ok but I have to spend some time to edit 3rd-party components to fit them to my site structure. Again, name collisions may occur here (as described in the previous option) and I will have to fix them. 3) put datepicker.js, datepicker.css and its images into a separate directory, let's say /3rdParty/datepicker/ and place the files as it was intended by the author (i.e., for example, /3rdParty/datepicker/css/datepicker.css, /3rdParty/datepicker/css/something.png, etc.). Now I begin to think that this option is the most correct. Experienced web developers, what do you recommend?

    Read the article

  • ASP.NET Connections Fall 2011 Slides and Code

    - by Stephen Walther
    Thanks everyone who came to my talks at ASP.NET Connections in Las Vegas!  There was a definite theme to my talks this year…taking advantage of JavaScript to build a rich presentation layer. I gave the following three talks: JsRender Templates – Originally, I was scheduled to give a talk on jQuery Templates.  However, jQuery Templates has been deprecated and JsRender is the new technology which replaces jQuery Templates. In the talk, I give plenty of code samples of using JsRender.  You can download the slides and code samples RIGHT HERE   HTML5 – In this talk, I focused on the features of HTML5 which are the most interesting to developers building database-driven Web applications. In particular, I discussed Web Sockets,  Web workers, Web Storage, Indexed DB, and the Offline Application Cache. All of these features are supported by Safari, Chrome, and Firefox today and they will be supported by Internet Explorer 10. You can download the slides and code samples RIGHT HERE   Ajax Control Toolkit – My company, Superexpert, is responsible for developing and maintaining the Ajax Control Toolkit. In this talk, I discuss all of the bug fixes and new features which the developers on the Superexpert team have added to the Ajax Control Toolkit over the previous six months. We also had a good discussion of the features which people want in future releases of the Ajax Control Toolkit. The slides and code samples for this talk can be downloaded RIGHT HERE   I had a great time in Las Vegas!  Good questions, friendly audience, and lots of opportunities for me to learn new things!      -- Stephen

    Read the article

  • OWB 11gR2 &ndash; Flexible and extensible

    - by David Allan
    The Oracle data integration extensibility capabilities are something I love, nothing more frustrating than a tool or platform that is very constraining. I think extensibility and flexibility are invaluable capabilities in the data integration arena. I liked Uli Bethke's posting on some extensibility capabilities with ODI (see Nesting ODI Substitution Method Calls here), he has some useful guidance on making customizations to existing KMs, nice to learn by example. I thought I'd illustrate the same capabilities with ODI's partner OWB for the OWB community. There is a whole new world of potential. The LKM/IKM/CKM/JKMs are the primary templates that are supported (plus the Oracle Target code template), so there is a lot of potential for customizing and extending the product in this release. Enough waffle... Diving in at the deep end from Uli's post, in OWB the table operator has a number of additional properties in OWB 11gR2 that let you annotate the column usage with ODI-like properties such as the slowly changing usage or for your own user-defined purpose as in Uli's post, below you see for the target table SALES_TARGET we can use the UD5 property which when assigned the code template (knowledge module) which has been modified with Uli's change we can do custom things such as creating indices - provides The code template used by the mapping has the additional step which is basically the code illustrated from Uli's posting just used directly, the ODI 10g substitution references also supported from within OWB's runtime. Now to see whether this does what we expect before we execute it, we can check out the generated code similar to how the traditional mapping generation and preview works, you do this by clicking on the 'Inspect Code' button on the execution units code template assignment. This then  creates another tab with prefix 'Code - <mapping name>' where the generated code is put, scrolling down we find the last step with the indices being created, looks good, so we are ready to deploy and execute. After executing the mapping we can then use the 'Audit Information' panel (select the mapping in the designer tree and click on View/Audit Information), this gives us a view of the execution where we can drill into the tasks that were executed and inspect both the template and the generated code that was executed and any potential errors. Reflecting back on earlier versions of OWB, these were the kinds of features that were always highly desirable, getting under the hood of the code generation and tweaking bit and pieces - fun and powerful stuff! We can step it up a bit here and explore some further ideas. The example below is a daisy-chained set of execution units where the intermediate table is a target of one unit and the source for another. We want that table to be a global temporary table, so can tweak the templates. Back to the copy of SQL Control Append (for demo purposes) we modify the create target table step to make the table a global temporary table, with the option of on commit preserve rows. You can get a feel for some of the customizations and changes possible, providing some great flexibility and extensibility for the data integration tools.

    Read the article

  • Isometric displaying two different images in different positions

    - by Canvas
    I'm creating a simple Isometric game using HTML5 and Javascript, but I can't seem to get the display to work, at the moment i have 9 tiles that have X and Y positions and the player has a X and Y position, the players X and Y properties are set to 100, and the tiles are as shown tiles[0] = new Array(3); tiles[1] = new Array(3); tiles[2] = new Array(3); tiles[0][0] = new point2D( 100, 100); tiles[0][1] = new point2D( 160, 100); tiles[0][2] = new point2D( 220, 100); tiles[1][0] = new point2D( 100, 160); tiles[1][1] = new point2D( 160, 160); tiles[1][2] = new point2D( 220, 160); tiles[2][0] = new point2D( 100, 220); tiles[2][1] = new point2D( 160, 220); tiles[2][2] = new point2D( 220, 220); Now I use this method to work out the isometric position function twoDToIso( point ) { var cords = point2D; cords.x = point.x - point.y; cords.y = (point.x + point.y) / 2; return cords; } point2D is function point2D( x, y) { this.x = x; this.y = y; } Now this i'm sure does work out the correct positioning, but here is the output Isometric view I just need to move my player position a tiny bit, but is that the best way to display my player position in the right position? Canvas P.S. the tile width is 120 and height is 60 and the player is width 30 by height 15

    Read the article

  • Should MVVM ViewModel inject an HTML template for default view?

    - by explunit
    I'm working on web application design that includes Knockout.js and have an overall MVVM question: Does it make sense for the ViewModel to automatically inject a default HTML template (pulled from separate file)? More detail: suppose I have a site like this... header... widget 1 widget 2 widget 3 footer ...and widgets 1/2/3 are going to be Knockout.js ViewModels determined at runtime from an overall list of available widgets, each with associated HTML template file. I understand that in MVVM you want the view (HTML template in this case) to be separate from the ViewModel (Javascript file in this case) so that people can edit it separately and possibly provide multiple templates for different "skins". However, it seems like it would also make sense for the ViewModel to point to a default html template that gets automatically used unless the controlling code provides a different one. Am I looking at this correctly? As an example, see this answer on StackOverflow where he recommends injecting the HTML and then the ViewModel. Seems like a one-liner would make more sense in that case, with the possibility of overriding a default template value.

    Read the article

  • Google Analytics cookie across SagePay checkout

    - by AlexCambridgeUK
    We use SagePay's Server integration for our online payments. We use Google Analytics to track activity on our website and Google Ecommerce tracking to log transactions. In Google Analytics, under the Ecommerce view, it shows direct/none for source/medium, as the 1st party cookie is lost when visiting the external SagePay checkout pages before the customer is redirected to my confirmation page which tracks the transaction. In all the answers I have viewed when searching for a solution, the suggestion is to alter the tracking code to read _gaq.push(['_setDomainName', 'none']); _gaq.push(['_setAllowLinker', true]); but this needs to be implemented on all pages, including 3rd party domains (SagePay). As SagePay don't allow javascript in their template customisation, what can I do? Is there another way? Edit: I just found this code: var pageTracker = _gat._getTracker('UA-XXXXX-X'); pageTracker._setCampNameKey('ga_campaign'); // name pageTracker._setCampMediumKey('ga_medium'); // medium pageTracker._setCampSourceKey('ga_source'); // source pageTracker._setCampNOKey('ga_nooverride'); // don't override pageTracker._trackPageview(); Could I store pre-checkout values for source/campaign/medium to a cookie and the retrieve it post-checkout into the code above, or would this start a new tracking session?

    Read the article

  • Google Fonts API JSON Data in WordPress Options-Framework-Theme

    - by Rob
    I'm developing a child-theme off of the new Twenty Twelve theme using Wordpress 3.4.2 and the development version of the Options Theme Framework by Devin Price. In Devin's tutorial, it shows of a way to implement 15 Google Web Fonts into the Theme Options page, but not all of them (roughly 560). I know I can create a "manual list", like in the tutorial that states each one with fallbacks, but this is time consuming and unproductive as Google may or may not add to, update, change or remove some of these fonts from their list. The list I've created above will ultimately store unavailable fonts the user thinks is there because of what they can see in the drop-down menu and it won't have any new ones - making the list and some selections obsolete. On the Google Developer API Web Fonts page, it talks briefly on retrieving a "dynamic list" using JSON/JavaScript. I was wondering how would I be able to pull the Google Web Fonts API into my Wordpress Theme Options page so I'm not creating my own list or have to constantly release an update to solve this issue. Could someone please walk me through what I would need to paste into my options.php, functions.php, /inc/options-framework.php file etc. or even in a new one to implement this? I've also had a look into some screencasts, plugins and tutorials on how it works, but none of them are specific enough for people just starting out. Please keep in mind I'm not the best coder... Thank you.

    Read the article

  • Managing JS and CSS for a static HTML web application

    - by Josh Kelley
    I'm working on a smallish web application that uses a little bit of static HTML and relies on JavaScript to load the application data as JSON and dynamically create the web page elements from that. First question: Is this a fundamentally bad idea? I'm unclear on how many web sites and web applications completely dispense with server-side generation of HTML. (There are obvious disadvantages of JS-only web apps in the areas of graceful degradation / progressive enhancement and being search engine friendly, but I don't believe that these are an issue for this particular app.) Second question: What's the best way to manage the static HTML, JS, and CSS? For my "development build," I'd like non-minified third-party code, multiple JS and CSS files for easier organization, etc. For the "release build," everything should be minified, concatenated together, etc. If I was doing server-side generation of HTML, it'd be easy to have my web framework generate different development versus release HTML that includes multiple verbose versus concatenated minified code. But given that I'm only doing any static HTML, what's the best way to manage this? (I realize I could hack something together with ERB or Perl, but I'm wondering if there are any standard solutions.) In particular, since I'm not doing any server-side HTML generation, is there an easy, semi-standard way of setting up my static HTML so that it contains code like <script src="js/vendors/jquery.js"></script> <script src="js/class_a.js"></script> <script src="js/class_b.js"></script> <script src="js/main.js"></script> at development time and <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script src="js/entire_app.min.js"></script> for release?

    Read the article

  • Jump and run HTML5 Game Framework

    - by user1818924
    We're developing a jump and run game with HTML5 and JavaScript and have to build an own game framework for this. Here we have some difficulties and would like to ask you for some advice: we have a "Stage" object, which represents the root of our game and is a global div-wrapper. The stage can contain multiple "Scenes", which are also div-elements. We would implement a Scene for the playing task, for pause, etc. and switch between them. Each scene can therefore contain multiple "Layers", representing a canvas. These Layer contain "ObjectEntities", which represent images or other shapes like rectangles, etc. Each Objectentity has its own temporaryCanvas, to be able to draw images for one entity, whereas another contains a rectangle. We set an activeScene in our Stage, so when the game is played, just the active scene is drawn. Calling activeScene.draw(), calls all sublayers to draw, which draw their entities (calling drawImage(entity.canvas)). But is this some kind of good practive? Having multiple canvas to draw? Each gameloop every layer-context is cleared and drawn again. E.g. we just have a still Background-Layer, … wouldn't it be more useful to draw this once and not to clear it everytime and redraw it? Or should we use a global canvas for example in the Stage and just use this canvas to draw? But we thought this would be to expensive... Other question: Do you have any advice how we could dive into implementing an own framework? Most stuff we find online relies on existing frameworks or they just implement their game without building a framework.

    Read the article

  • displaying multi-section html documents - best practices

    - by ecpepper
    I work at a research organization and we publish a lot of large-ish documents, usually organized in sections. What I want to know is how best to present these multi-section documents on our website. Presently, what I do is load the entire document as a single page, with each section as its own div. Then I show and hide divs as needed via a table of contents and "next" and "prev" buttons. The advantages to this are mainly: 1) that you can move between sections very quickly, 2) it produces consistent analytics (when a page is loaded, I know a report is being read). The disadvantages, however, are real: Readers can't take advantage of browser back/forward buttons to move between sections. It's complicated to create direct links to individual sections (I can do it with javascript but it's not easy for other people to grab and share). For long reports, you have to wait for the full report to load before you can move around (and that can include hordes of images and charts). Do other people have thoughts on better ways to organize this? Here's an example of the current system: http://massbudget.org/825

    Read the article

  • How to improve performance of map that loads new overlay images

    - by anthonysomerset
    I have inherited a website to maintain that uses a html map overlaying a real map to link specific countries to specific pages. previously it loaded the default map image, then with some javascript it would change the image src to an image with that particular country in a different colour on mouseover and reset the image source back to the original image on mouse out to make maintenance (adding new countries) easier i made the initial map a background image by utilising some CSS for the div tag, and then created new images for each country which only had that countries hightlight so that the images remain fairly small. this works great but theres one issue which is particularly noticeable on slower internet connections when you hover over a country if you dont have the image file in your browser cache or downloaded it wont load the image unless you hover over another country and then back onto the first country - i guess this is due to the image having to manually be downloaded on first hover. My question: is it possible to force the load of these extra images AFTER the page and all the other assets have finished loading so that this behaviour is all but eliminated? the html code for the MAP is as follows: <div class="gtmap"><img id="Image-Maps_6200909211657061" src="<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png" usemap="#Image-Maps_6200909211657061" alt="We offer Guided Motorcycle Tours all around the world" width="615" height="296" /> <map id="_Image-Maps_6200909211657061" name="Image-Maps_6200909211657061"> <area shape="poly" coords="511,134,532,107,542,113,520,141" href="/guided-motorcycle-tours-japan/" alt="Guided Japan Motorcycle Tours" title="Japan" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-japan.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="252,61,266,58,275,64,262,68" href="/guided-motorcycle-tour.php?iceland-motorcycle-adventure-39" alt="Guided Iceland Motorcycle Tours" title="Iceland" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-iceland.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="587,246,597,256,577,279,568,270" href="/guided-motorcycle-tour.php?new-zealand-south-island-adventure-10" alt="New Zealand Guided Motorcycle Tours" title="New Zealand" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-nz.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="418,133,412,145,412,154,421,178,430,180,430,166,443,154,443,145,438,144,433,142,430,138,431,130,430,129,425,128" href="/guided-motorcycle-tours-india/" alt="India Guided Motorcycle Tours" title="India" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-india.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="460,152,466,149,474,165,470,171,466,161" href="/guided-motorcycle-tours-laos/" alt="Laos Guided Motorcycle Tours" title="Laos" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-laos.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="468,179,475,166,468,152,475,152,482,169" href="/guided-motorcycle-tour.php?indochina-motorcycle-adventure-tour-32" onClick="javascript: pageTracker._trackPageview('/internal-links/guided-tours/map/vietnam');" alt="Vietnam Guided Motorcycle Tours" title="Vietnam" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-viet.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="330,239,337,235,347,226,352,233,351,243,344,250,335,253,327,255,323,249,322,242,323,241" href="/guided-motorcycle-tours-southafrica/" alt="South Africa Guided Motorcycle Tours" title="South Africa" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-sa.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="290,77,293,86,298,96,286,102,285,97,285,89,282,84,282,79" href="/guided-motorcycle-tour.php?great-britain-isle-of-man-scotland-wales-uk-18" alt="United Kingdom" title="United Kingdom Guided Motorcycle Tours" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-uk.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="357,118,368,118,369,126,345,129,338,125,338,117,342,115,348,116" href="/guided-motorcycle-tour.php?explore-turkey-adventure-45" alt="Turkey" title="Turkey Guided Motorcycle Tours" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-turkey.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="206,95,193,101,185,101,178,106,165,111,157,109,147,105,134,103,121,103,107,103,96,103,86,104,81,99,77,91,70,83,62,79,60,72,61,64,59,57,60,51,71,50,83,49,95,50,107,54,117,53,129,47,137,36,148,37,163,38,177,44,187,54,195,60,184,72,191,80,200,87" href="/guided-motorcycle-tours-canada/" alt="Guided Canada Motorcycle Tours" title="Canada" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-canada.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="61,75,60,62,60,55,59,44,51,44,43,43,36,42,28,43,23,48,17,51,15,62,19,74,27,79,19,83,16,93,35,83,43,77,50,75,55,75" href="/guided-motorcycle-tours-alaska/" alt="Guided Alaska Motorcycle Tours" title="Alaska" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-alaska.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="82,101,99,101,133,101,148,105,161,110,172,106,187,100,180,113,171,122,165,131,159,149,147,141,137,140,129,147,120,141,112,138,103,137,93,132,86,122,86,112,86,106" href="/guided-motorcycle-tours-usa/" alt="USA Guided Motorcycle Tours" title="USA" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-usa.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="178,225,180,214,175,208,174,204,178,198,174,193,167,192,157,199,158,204,164,211,167,218" href="/guided-motorcycle-tour.php?peru-machu-picchu-adventure-25" alt="Peru Guided Motorcycle Tours" title="Peru" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-peru.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="172,226,169,239,166,256,166,267,164,279,171,277,174,262,175,250,179,234,180,225,176,224" href="/guided-motorcycle-tours-chile/" alt="Guided Chile Motorcycle Tours" title="Chile" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-chile.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="199,260,194,261,187,265,184,276,183,296,170,292,168,282,174,270,174,257,177,245,180,230,190,228,205,237,199,245" href="/guided-motorcycle-tours-argentina/" alt="Guided Argentina Motorcycle Tours" title="Argentina" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-arg.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> </map> </div> The <?php echo cdnhttpsCheck(); ?> is just a site specific function that gets the correct web domain/url from a config file to load resources from CDN where possible (eg all non HTTPS requests) We are loading Jquery at the bottom of the HTML if anybody wonders why it is missing from the code snippet for reference, the page with the map in question is found here: http://www.motoquest.com/guided-motorcycle-tours/

    Read the article

  • What is the best python module skeleton code?

    - by user213060
    == Subjective Question Warning == Looking for well supported opinions or supporting evidence. Let us assume that skeleton code can be good. If you disagree with the very concept of module skeleton code then fine, but please refrain from repeating that opinion here. Many python IDE's will start you with a template like: print 'hello world' That's not enough... So here's my skeleton code to get this question started: My Module Skeleton, Short Version: #!/usr/bin/env python """ Module Docstring """ # ## Code goes here. # def test(): """Testing Docstring""" pass if __name__=='__main__': test() and, My Module Skeleton, Long Version: #!/usr/bin/env python # -*- coding: ascii -*- """ Module Docstring Docstrings: http://www.python.org/dev/peps/pep-0257/ """ __author__ = 'Joe Author ([email protected])' __copyright__ = 'Copyright (c) 2009-2010 Joe Author' __license__ = 'New-style BSD' __vcs_id__ = '$Id$' __version__ = '1.2.3' #Versioning: http://www.python.org/dev/peps/pep-0386/ # ## Code goes here. # def test(): """ Testing Docstring""" pass if __name__=='__main__': test() Notes: """ ===MODULE TYPE=== Since the vast majority of my modules are "library" types, I have constructed this example skeleton as such. For modules that act as the main entry for running the full application, you would make changes such as running a main() function instead of the test() function in __main__. ===VERSIONING=== The following practice, specified in PEP8, no longer makes sense: __version__ = '$Revision: 1.2.3 $' for two reasons: (1) Distributed version control systems make it neccessary to include more than just a revision number. E.g. author name and revision number. (2) It's a revision number not a version number. Instead, the __vcs_id__ variable is being adopted. This expands to, for example: __vcs_id__ = '$Id: example.py,v 1.1.1.1 2001/07/21 22:14:04 goodger Exp $' ===VCS DATE=== Likewise, the date variable has been removed: __date__ = '$Date: 2009/01/02 20:19:18 $' ===CHARACTER ENCODING=== If the coding is explicitly specified, then it should be set to the default setting of ascii. This can be modified if necessary (rarely in practice). Defaulting to utf-8 can cause anomalies with editors that have poor unicode support. """ There are a lot of PEPs that put forward coding style recommendations. Am I missing any important best practices? What is the best python module skeleton code? Update Show me any kind of "best" that you prefer. Tell us what metrics you used to qualify "best".

    Read the article

  • How would I implement this application idea?

    - by Mike Wills
    I am a D&D gamer and a developer that has mostly worked with ASP.NET applications professionally. I have written some chat bots in Node.js and I have only played a little with PHP but wrote nothing serious. I have had inspiration to create a site that allows a person to keep track of characters (aka the character sheet). I am thinking of using this as a learning opportunity to learn noSQL and to write a full javascript front-end. I want this application to save the value as I change it. So if I edit the armor class, it is saved immediately instead of waiting until I hit the submit button. I think that will make it easier to use while gaming and not losing anything because I forgot to save the change. I have never done anything like this. How do you implement this style of application? Is there a tutorial or howto to get me on the right path? While I would really like to use ASP.NET but I don't have a Windows server to publish on (and I really can't afford to pay for a service). What language that runs on Linux would work well for this type of application? Note: I feel noSQL would work in this case because of the sheer number of tables required to create something like this in SQL.

    Read the article

  • How to develop Online Shopping Portal Application using PHP ?

    - by Sarang
    I do not know PHP & I have to develop a Shopping Portal with following Definition : Scenario: Online Shopping Portal XYZ.com wants to create an online shopping portal for managing its registered customers and their shopping. The customers need to register themselves first before they do shopping using the shopping portal. However, everyone, whether registered or not, can view the various products along with the prices listed in the portal. The registered customers, after logging in, are allowed to place order for one or more products from the products listed in the portal. Once the order is placed, the customer gets a reference order number and the order status should be “order in process”. The customers can track their order using the given reference number. The management of XYZ.com should be able to modify the order status of a particular reference order number to “shipped” once the products are shipped to the shipping address entered by the customer at the time of placing the order. The Functionalities required are : Create the interface for the XYZ.com shopping portal using HTML/XHTML and CSS. Implement the client side validations using JavaScript. Create the tables using MySQL. Implement the functionality using the server side scripting language, PHP. Integrate all the above tasks and make the XYZ.com shopping portal functional. How do I develop this application with following proper steps of development ?

    Read the article

  • Making an interactive 2D map

    - by Chad
    So recently I have been working on a Legend of Zelda: A Link to the Past clone, and I am wondering how I could handle certain map interactions (like cutting grass, lifting rocks, etc). The way I am currently doing the tilemap is with 2 PNGs. The first is the "tilemap" where each pixel represents a 16x16 tile and the (red, green) values are the (x, y) coords for the tile in the second PNG (the "tileset"). I am then using the blue channel to store collision data. Each tile is split into 4 8x8 tiles and represented by a 2 bit value (0 = empty, 1 = Jumpdown point, 2 = unused right now, 3 = blocking). 4 of these 2 bit values make up the full blue channel (1 byte). So collisions work great, and I am moving on to putting interactive units on the level; but I am not sure what a good way is to do it. I have experimented with spawning an entity for each grass and rock, but there are just WAY to many; FPS just dies even if I confine it to the current "zone" the user is in (for those who remember LTTP it had zones you moved between). It does make a difference that this is a browser-based JavaScript game. tl;dr: What is a good way to have an interactive map without using full blown entities for each interactive item?

    Read the article

  • a little code to allow word substitution depending on user

    - by Fred Quimby
    Can anyone help? I'm creating a demo web app in html in order for people to physically see and comment on the app prior to committing to a proper build. So whilst the proper app will be database driven, my demo is just standard html with some javascript effects. What I do want to demonstrate is that different user group will see different words. For example, imagine I have an html sentence that says 'This will cost £100 to begin'. What I need to some way of identifying that if the user has deemed themselves to be from the US, the sentence says 'This will cost $100 to begin'. This requirement is peppered throughtout the pages but I'm happy to add each one manually. So I envisage some code along the lines of 'first, remove the [boot US] trunk' where the UK version is 'first remove the boot' but the code is saying that the visitor needs the US version. It then looks up boot (in an Access database perhaps) and sees that the table says for boot for US, display 'trunk'. I'm not a programmer but I can normally cobble together scripts so I'm hoping someone may have a relatively easy solution in javascrip, CSS or asp. To recap; I have a number of words or short sentences that need to appear differently and I'm happy to manually insert each one if necessary (but would be even better if the words were automatically changed). And I need a device which allows me to tell the pages to choose the US version, or for example, the New Zealand version. Thanks in advance. Fred

    Read the article

  • Google Chrome not rendering webpages correctly

    - by sumit_gt
    I am facing some serious web page rendering issues with Chrome. It is more prominent during javascript based animations and stuff on websites like youtube. I have tried removing chrome using (sudo apt-get purge google-chrome-stable) and then reinstalling it. But the problems still persist. The same webpages work correctly on firefox on ubuntu and chrome on windows. The problem only shows up when I use chrome on ubuntu. I think the issue has started after I updated to the latest version of Chrome. I have used Chrome previously on this machine without any problems. I have attached a image that demonstrates the issue. What could possibly be the problem? PS: here's the output of lshw -c video: *-display description: VGA compatible controller product: Madison [Radeon HD 5000M Series] vendor: Hynix Semiconductor (Hyundai Electronics) physical id: 0 bus info: pci@0000:01:00.0 version: 00 width: 64 bits clock: 33MHz capabilities: pm pciexpress msi vga_controller bus_master cap_list rom configuration: driver=fglrx_pci latency=0 resources: irq:46 memory:e0000000-efffffff memory:f0020000-f003ffff ioport:d000(size=256) memory:f0000000-f001ffff Here's the output of lspci -nn: output of lspci -nn

    Read the article

  • Which approach would lead to an API that is easier to use?

    - by Clem
    I'm writing a JavaScript API and for a particular case, I'm wondering which approach is the sexiest. Let's take an example: writing a VideoPlayer, I add a getCurrentTime method which gives the elapsed time since the start. The first approach simply declares getCurrentTime as follows: getCurrentTime():number where number is the native number type. This approach includes a CURRENT_TIME_CHANGED event so that API users can add callbacks to be aware of time changes. Listening to this event would look like the following: myVideoPlayer.addEventListener(CURRENT_TIME_CHANGED, function(evt){ console.log ("current time = "+evt.getDispatcher().getCurrentTime()); }); The second approach declares getCurrentTime differently: getCurrentTime():CustomNumber where CustomNumber is a custom number object, not the native one. This custom object dispatches a VALUE_CHANGED event when its value changes, so there is no need for the CURRENT_TIME_CHANGED event! Just listen to the returned object for value changes! Listening to this event would look like the following: myVideoPlayer.getCurrentTime().addEventListener(VALUE_CHANGED, function(evt){ console.log ("current time = "+evt.getDispatcher().valueOf()); }); Note that CustomNumber has a valueOf method which returns a native number that lets the returned CustomNumber object being used as a number, so: var result = myVideoPlayer.getCurrentTime()+5; will work! So in the first approach, we listen to an object for a change in its property's value. In the second one we directly listen to the property for a change on its value. There are multiple pros and cons for each approach, I just want to know which one the developers would prefer to use!

    Read the article

  • Is my JS/Jquery methodology good?

    - by absentx
    I always struggle with which of the stack sites is best to post "questions of theory" like this, but I think programmers is the best, if not, as usual a mod will move it etc... I am seeking critique on what has become my normal methodology of writing javascript. I have become heavily reliant on the Jquery library, but I think this has helped me learn the native language better also. Anyways, please critique the following style of JS coding...buried are a lot of questions of scope, if you could point out the strengths and weaknesses of this style I would appreciate it. var critique ={ start: function(){ globalness = 'GLOBAL-GLOBAL'; //available to all critique's methods var notglobalness = 'LOCAL-LOCAL';// only available to critiques start method //am I using the "method" teminology properly here?? $('#stuff').on('click','a.closer-target',function(){ $target = $(this); if($target.hasClass('active')){ $target.removeClass('active'); } else{ $target.addClass('active'); critique.madness($target); } }) console.log(notglobalness+': at least I am useful at home'); console.log('note here that: '+notglobalness+' is no longer available after this point, lets continue on:'); critique.madness(notglobalness); }, madness: function($e){ // do a bunch of awesomeness with $e //but continue to keep it seperate because you think its best to keep things isolated. //send to the next function when complete here console.log('here is globalness, which is still available from the start method of critique!! ' + globalness); console.log('lets see if the globalness carries on to a new var object!!'); console.log('the locally isolated variable of NOTGLOBALNESS is available here because it was passed to this method, lets show it:'+$e); carryOn.start(); } } //end critique var carryOn={ start: function(){ console.log('any chance critique.globalness will work here??? lets see: ' +globalness); console.log('it absolutely does'); } } $(document).ready(critique.start);

    Read the article

  • Split a 2D scene in layers or have a z coordinate

    - by Bane
    I am in the process of writing a 2D game engine, and a dilemma emerged. Let me explain the situation... I have a Scene class, to which various objects can be added (Drawable, ParticleEmitter, Light2D, etc), and as this is a 2D scene, things will obviously be drawn over each other. My first thought was that I could have basic add and remove methods, but I soon realized that then there would be no way for the programmer to control the order in which things were drawn. So I can up with two options, each with its pros and cons. A) Would be to split the scene in layers. By that I mean instead of having the scene be a container of objects, have it be a container of layers, which are in turn the containers of objects. B) Would require to have some kind of z-coordinate, and then have the scene sorted so objects with lower z get drawn first. Option A is pretty solid, but the problem is with the lights. In what layer do I add it? Does it work cross-layer? On all bottom layers? And I still need the Z coordinate to calculate the shadow! Option B would require me to change all my code from having Vector2D positions, to some kind of class that inherits from Vector2D and adds a z coordinate to it (I don't want it to be a Vector3D because I still need all the same methods the 2D kind has, just with .z clamped on). Am I missing something? Is there an alternative to these methods? I'm working in Javascript, if that makes a difference.

    Read the article

  • Starting an HTML canvas game with no graphics skills

    - by Jacob
    I want to do some hobby game development, but I have some unfortunate handicaps that have me stuck in indecision; I have no artistic talent, and I also have no experience with 3D graphics. But this is just a hobby project that might not go anywhere, so I want to develop the stuff I care about; if the game shows good potential, my graphic "stubs" can be replaced with something more sophisticated. I do, however, want my graphics engine to render something approximate to the end goal. The game is tile-based, with each tile being a square. Each tile also has an elevation. My target platform (subject to modification) is JavaScript rendering to the HTML 5 canvas, either with a 2D or WebGL context. My question to those of you with game development experience is whether it's easier to develop an isometric game using a 2D graphics engine and sprites or a 3D game using rudimentary 3D primitives and basic textures? I realize that there are limitations to isometric projection, but if it makes developing my throwaway graphics engine easier, I'm OK with the visual warts that would be introduced. Or is representing a 3D world with an actual 3D engine easier?

    Read the article

  • Transform coordinates from 3d to 2d without matrix or built in methods

    - by Thomas
    Not to long ago i started to create a small 3D engine in javascript to combine this with an html5 canvas. One of the issues I run into is how can you transform 3d to 2d coords. Since I cannot use matrices or built in transformation methods I need another way. I've tried implementing the next explanation + pseudo code: http://freespace.virgin.net/hugo.elias/routines/3d_to_2d.htm Unfortunately no luck there. I've replace all the input variables with data from my own camera and object classes. I have the following data: An object with a rotation, position vector and an array of 4 3d coords (its just a plane) a camera with a position and rotation vector the viewport - a square 600 x 600 surface. The example uses a zoom factor which I've set as 1 Most hits on google use either matrix calculations or don't implement camera rotation. Basic transformation should be like this: screen.x = x / z * zoom screen.y = y / z * zoom Can anyone point me in the right direction or explain to me howto achieve this? edit: Thanks for all your posts, I haven't been able to apply all this to my project yet but I hope to do this soon.

    Read the article

< Previous Page | 236 237 238 239 240 241 242 243 244 245 246 247  | Next Page >