The document discusses the Qooxdoo JavaScript framework. It introduces Qooxdoo and how it makes JavaScript programming fun again by allowing developers to write applications that run in browsers. It covers key Qooxdoo features like class definitions, inheritance, static and instance members, mixins, and more. The document includes code examples to demonstrate JavaScript concepts like scoping, closures, and working with 'this'.
JavaFX 8 est disponible depuis mars 2014 et apporte son lot de nouveautés. Gradle est en version 2 depuis juillet 2014. Deux technologies plus que prometteuses: JavaFX donne un coup de jeune au développement d’applications desktop en Java en apportant un navigateur web intégré, le support des WebSockets, de la 3D, et bien d’autres. Gradle est l’outil de d’automatisation de build à la mode, apportant de superbes possibilités par rapport rapport à maven, outil vieillissant, grâce à l’engouement de la communauté vis à vis de cet outil mais aussi par le fait de la technologie utilisée en son sein: groovy. Venez découvrir comment il est possible de réaliser rapidement une application à la mode en JavaFX avec un outil à la mode également. Bref venez à une session trendy.
REX about JavaFX8 used in SlideshowFX. This presentation covers concept from JavaFX as well as technologies like OSGi, Vert.x, LeapMotion, nashorn and friends in order to make them communicate inside one application developed in JavaFX.
This presentation was made at the ElsassJUG
Дмитрий Демчук. Кроссплатформенный краш-репортSergey Platonov
Доклад будет посвящен возможностям библиотеки Google Breakpad по созданию краш-репорта. Посмотрим как это работает изнутри.
На примерах будут рассмотрены способы интеграции библиотеки на разных платформах Windows, Linux, Max OS.
Practical JavaScript Programming - Session 7/8Wilson Su
JavaScript is one of the most popular skills in today’s job market. It allows you to create both client- and server-side applications quickly and easily. Having a solid understanding of this powerful and versatile language is essential to anyone who uses it.
“Practical JavaScript Programming” does not only focus on best practices, but also introduces the fundamental concepts. This course will take you from JavaScript basics to advanced. You’ll learn about topics like Data Types, Functions, Events, AJAX and more.
JavaFX 8 est disponible depuis mars 2014 et apporte son lot de nouveautés. Gradle est en version 2 depuis juillet 2014. Deux technologies plus que prometteuses: JavaFX donne un coup de jeune au développement d’applications desktop en Java en apportant un navigateur web intégré, le support des WebSockets, de la 3D, et bien d’autres. Gradle est l’outil de d’automatisation de build à la mode, apportant de superbes possibilités par rapport rapport à maven, outil vieillissant, grâce à l’engouement de la communauté vis à vis de cet outil mais aussi par le fait de la technologie utilisée en son sein: groovy. Venez découvrir comment il est possible de réaliser rapidement une application à la mode en JavaFX avec un outil à la mode également. Bref venez à une session trendy.
REX about JavaFX8 used in SlideshowFX. This presentation covers concept from JavaFX as well as technologies like OSGi, Vert.x, LeapMotion, nashorn and friends in order to make them communicate inside one application developed in JavaFX.
This presentation was made at the ElsassJUG
Дмитрий Демчук. Кроссплатформенный краш-репортSergey Platonov
Доклад будет посвящен возможностям библиотеки Google Breakpad по созданию краш-репорта. Посмотрим как это работает изнутри.
На примерах будут рассмотрены способы интеграции библиотеки на разных платформах Windows, Linux, Max OS.
Practical JavaScript Programming - Session 7/8Wilson Su
JavaScript is one of the most popular skills in today’s job market. It allows you to create both client- and server-side applications quickly and easily. Having a solid understanding of this powerful and versatile language is essential to anyone who uses it.
“Practical JavaScript Programming” does not only focus on best practices, but also introduces the fundamental concepts. This course will take you from JavaScript basics to advanced. You’ll learn about topics like Data Types, Functions, Events, AJAX and more.
Practical JavaScript Programming - Session 6/8Wilson Su
JavaScript is one of the most popular skills in today’s job market. It allows you to create both client- and server-side applications quickly and easily. Having a solid understanding of this powerful and versatile language is essential to anyone who uses it.
“Practical JavaScript Programming” does not only focus on best practices, but also introduces the fundamental concepts. This course will take you from JavaScript basics to advanced. You’ll learn about topics like Data Types, Functions, Events, AJAX and more.
Oxygine 2 d objects,events,debug and resourcescorehard_by
Доклад будет посвящен созданию/удалению и взаимодействию игровых объектах, о стандартных и кастомизированных смартпоинтерах. Какими вещами пользоваться чтобы получить debug информацию о том что происходит в игре. Будут приведены примеры шаблонов игрового проектирования. Несколько слов о интересных редакторах игровых ресурсов: MapEditor.com, Astralax.ru
Practical JavaScript Programming - Session 5/8Wilson Su
JavaScript is one of the most popular skills in today’s job market. It allows you to create both client- and server-side applications quickly and easily. Having a solid understanding of this powerful and versatile language is essential to anyone who uses it.
“Practical JavaScript Programming” does not only focus on best practices, but also introduces the fundamental concepts. This course will take you from JavaScript basics to advanced. You’ll learn about topics like Data Types, Functions, Events, AJAX and more.
Presentation I gave at a Rust Austin meetup in November 2018 about exploring different approaches for interpreting custom DSLs in Rust with varying speed characteristics and associated safety issues.
Practical JavaScript Programming - Session 1/8Wilson Su
JavaScript is one of the most popular skills in today’s job market. It allows you to create both client- and server-side applications quickly and easily. Having a solid understanding of this powerful and versatile language is essential to anyone who uses it.
“Practical JavaScript Programming” does not only focus on best practices, but also introduces the fundamental concepts. This course will take you from JavaScript basics to advanced. You’ll learn about topics like Data Types, Functions, Events, AJAX and more.
Vous subissez les régressions à chaque livraison ? Vous ne voyez pas l’intérêt des tests unitaires car ils ne servent qu’à tester des additions ? Les tests ne sont pas applicables à votre projet car il est trop complexe ? Si c’est le cas, suivez David dans la quête du Test Driven Development. Vous rencontrerez pléthore d’ennemies contre lesquels vous aurez à combattre : bugs, complexité, code statique, couplage fort. Ils essaieront de vous barrer la route, mais heureusement, vous pourrez compter sur vos alliés jUnit, Mockito, refactoring et injection/dépendance.
David finira la soirée par une démonstration pratique sur un exercice de refactoring.
It isn't mine but i sure hope it helps others.It's a Mini Project on a Food Automaton Restaurant type.you know Enter food type stuff. It's in C++ ,so it's an easy one .You can understand it on your own
Class 12 ip project on wwe management system
sql databases available
netbeans file available
made in year 2018-19
unique topic
easy java coding used
made in netbeans version 8.1
ready to print
The role of TANDBERG videoconferencing in the new way of workingrobert blaas
This is a presentation I gave during a customer event of Dimension Data in the Netherlands. It was about the role videoconferencing plays in the New way of working and how TANDBERG can enable people to be more productive, save costs and reduce their CO2 footpint.
Practical JavaScript Programming - Session 6/8Wilson Su
JavaScript is one of the most popular skills in today’s job market. It allows you to create both client- and server-side applications quickly and easily. Having a solid understanding of this powerful and versatile language is essential to anyone who uses it.
“Practical JavaScript Programming” does not only focus on best practices, but also introduces the fundamental concepts. This course will take you from JavaScript basics to advanced. You’ll learn about topics like Data Types, Functions, Events, AJAX and more.
Oxygine 2 d objects,events,debug and resourcescorehard_by
Доклад будет посвящен созданию/удалению и взаимодействию игровых объектах, о стандартных и кастомизированных смартпоинтерах. Какими вещами пользоваться чтобы получить debug информацию о том что происходит в игре. Будут приведены примеры шаблонов игрового проектирования. Несколько слов о интересных редакторах игровых ресурсов: MapEditor.com, Astralax.ru
Practical JavaScript Programming - Session 5/8Wilson Su
JavaScript is one of the most popular skills in today’s job market. It allows you to create both client- and server-side applications quickly and easily. Having a solid understanding of this powerful and versatile language is essential to anyone who uses it.
“Practical JavaScript Programming” does not only focus on best practices, but also introduces the fundamental concepts. This course will take you from JavaScript basics to advanced. You’ll learn about topics like Data Types, Functions, Events, AJAX and more.
Presentation I gave at a Rust Austin meetup in November 2018 about exploring different approaches for interpreting custom DSLs in Rust with varying speed characteristics and associated safety issues.
Practical JavaScript Programming - Session 1/8Wilson Su
JavaScript is one of the most popular skills in today’s job market. It allows you to create both client- and server-side applications quickly and easily. Having a solid understanding of this powerful and versatile language is essential to anyone who uses it.
“Practical JavaScript Programming” does not only focus on best practices, but also introduces the fundamental concepts. This course will take you from JavaScript basics to advanced. You’ll learn about topics like Data Types, Functions, Events, AJAX and more.
Vous subissez les régressions à chaque livraison ? Vous ne voyez pas l’intérêt des tests unitaires car ils ne servent qu’à tester des additions ? Les tests ne sont pas applicables à votre projet car il est trop complexe ? Si c’est le cas, suivez David dans la quête du Test Driven Development. Vous rencontrerez pléthore d’ennemies contre lesquels vous aurez à combattre : bugs, complexité, code statique, couplage fort. Ils essaieront de vous barrer la route, mais heureusement, vous pourrez compter sur vos alliés jUnit, Mockito, refactoring et injection/dépendance.
David finira la soirée par une démonstration pratique sur un exercice de refactoring.
It isn't mine but i sure hope it helps others.It's a Mini Project on a Food Automaton Restaurant type.you know Enter food type stuff. It's in C++ ,so it's an easy one .You can understand it on your own
Class 12 ip project on wwe management system
sql databases available
netbeans file available
made in year 2018-19
unique topic
easy java coding used
made in netbeans version 8.1
ready to print
The role of TANDBERG videoconferencing in the new way of workingrobert blaas
This is a presentation I gave during a customer event of Dimension Data in the Netherlands. It was about the role videoconferencing plays in the New way of working and how TANDBERG can enable people to be more productive, save costs and reduce their CO2 footpint.
This presentation is on advanced debugging using Java bytecodes (presented in Core Java meetup on 1st October in Accion Labs). If you are a Java developer and are interested in knowing advanced debugging techniques or understanding bytecodes, this presentation is for you.
Here's a presentation I did for the Japanese Perl Association on April 21st, 2009.
It covers 10 aspects of Catalyst that may not be documented or discussed as much as they could be, that are very useful.
This session of The Ajax Experience 2008 takes a look at the latest features in both Prototype and script.aculo.us, including custom events and how to leverage them, method wrapping for AOP-style programming, sprockets, the refactorings and improvements on Ajax, scheduling and the DOM, the new effects engine, and more.
We wrap up with an overview of the community landscape for these libraries, looking at major helpful resources, prominent peripheral frameworks, and seeing what the future looks like for both Prototype and script.aculo.us.
A discussion on the upcoming new features in ES6 and how they change the way we build applications with JavaScript.
Most Notable Upcoming Changes in EcmaScript 6
Classes: Classes are now first-class citizens in ES6. The language offers support for classes ("class" keyword), constructors ("constructor" keyword) and the "extend" keyword for inheritance.
Modules: Modules provide a much needed way to segment and organize JavaScript applications in logical chunks of code. Many frameworks already provide ways to modularize large apps, but standardizing a common module structure will bring a level of interoperability between various JavaScript libraries.
Block Scoping: Scoping in JavaScript can be a confusing topic for programmers coming from more traditional Object-Oriented languages such as Java or C#. There are basically two scopes in JavaScript: global and function. Until now. With the help of the "let" keyword, ES6 enables the definition of block scopes for variables and functions.
Default Parameters: A liked feature of many other languages such as Ruby, the default parameters save endless checking of they've been passed and if they are "undefined".
Enhanced Object Literals: There is now a handy expression for property: property assignments and methods can be defined without the "function" keyword.
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...James Anderson
Effective Application Security in Software Delivery lifecycle using Deployment Firewall and DBOM
The modern software delivery process (or the CI/CD process) includes many tools, distributed teams, open-source code, and cloud platforms. Constant focus on speed to release software to market, along with the traditional slow and manual security checks has caused gaps in continuous security as an important piece in the software supply chain. Today organizations feel more susceptible to external and internal cyber threats due to the vast attack surface in their applications supply chain and the lack of end-to-end governance and risk management.
The software team must secure its software delivery process to avoid vulnerability and security breaches. This needs to be achieved with existing tool chains and without extensive rework of the delivery processes. This talk will present strategies and techniques for providing visibility into the true risk of the existing vulnerabilities, preventing the introduction of security issues in the software, resolving vulnerabilities in production environments quickly, and capturing the deployment bill of materials (DBOM).
Speakers:
Bob Boule
Robert Boule is a technology enthusiast with PASSION for technology and making things work along with a knack for helping others understand how things work. He comes with around 20 years of solution engineering experience in application security, software continuous delivery, and SaaS platforms. He is known for his dynamic presentations in CI/CD and application security integrated in software delivery lifecycle.
Gopinath Rebala
Gopinath Rebala is the CTO of OpsMx, where he has overall responsibility for the machine learning and data processing architectures for Secure Software Delivery. Gopi also has a strong connection with our customers, leading design and architecture for strategic implementations. Gopi is a frequent speaker and well-known leader in continuous delivery and integrating security into software delivery.
Essentials of Automations: Optimizing FME Workflows with ParametersSafe Software
Are you looking to streamline your workflows and boost your projects’ efficiency? Do you find yourself searching for ways to add flexibility and control over your FME workflows? If so, you’re in the right place.
Join us for an insightful dive into the world of FME parameters, a critical element in optimizing workflow efficiency. This webinar marks the beginning of our three-part “Essentials of Automation” series. This first webinar is designed to equip you with the knowledge and skills to utilize parameters effectively: enhancing the flexibility, maintainability, and user control of your FME projects.
Here’s what you’ll gain:
- Essentials of FME Parameters: Understand the pivotal role of parameters, including Reader/Writer, Transformer, User, and FME Flow categories. Discover how they are the key to unlocking automation and optimization within your workflows.
- Practical Applications in FME Form: Delve into key user parameter types including choice, connections, and file URLs. Allow users to control how a workflow runs, making your workflows more reusable. Learn to import values and deliver the best user experience for your workflows while enhancing accuracy.
- Optimization Strategies in FME Flow: Explore the creation and strategic deployment of parameters in FME Flow, including the use of deployment and geometry parameters, to maximize workflow efficiency.
- Pro Tips for Success: Gain insights on parameterizing connections and leveraging new features like Conditional Visibility for clarity and simplicity.
We’ll wrap up with a glimpse into future webinars, followed by a Q&A session to address your specific questions surrounding this topic.
Don’t miss this opportunity to elevate your FME expertise and drive your projects to new heights of efficiency.
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf91mobiles
91mobiles recently conducted a Smart TV Buyer Insights Survey in which we asked over 3,000 respondents about the TV they own, aspects they look at on a new TV, and their TV buying preferences.
Transcript: Selling digital books in 2024: Insights from industry leaders - T...BookNet Canada
The publishing industry has been selling digital audiobooks and ebooks for over a decade and has found its groove. What’s changed? What has stayed the same? Where do we go from here? Join a group of leading sales peers from across the industry for a conversation about the lessons learned since the popularization of digital books, best practices, digital book supply chain management, and more.
Link to video recording: https://bnctechforum.ca/sessions/selling-digital-books-in-2024-insights-from-industry-leaders/
Presented by BookNet Canada on May 28, 2024, with support from the Department of Canadian Heritage.
Accelerate your Kubernetes clusters with Varnish CachingThijs Feryn
A presentation about the usage and availability of Varnish on Kubernetes. This talk explores the capabilities of Varnish caching and shows how to use the Varnish Helm chart to deploy it to Kubernetes.
This presentation was delivered at K8SUG Singapore. See https://feryn.eu/presentations/accelerate-your-kubernetes-clusters-with-varnish-caching-k8sug-singapore-28-2024 for more details.
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Albert Hoitingh
In this session I delve into the encryption technology used in Microsoft 365 and Microsoft Purview. Including the concepts of Customer Key and Double Key Encryption.
Epistemic Interaction - tuning interfaces to provide information for AI supportAlan Dix
Paper presented at SYNERGY workshop at AVI 2024, Genoa, Italy. 3rd June 2024
https://alandix.com/academic/papers/synergy2024-epistemic/
As machine learning integrates deeper into human-computer interactions, the concept of epistemic interaction emerges, aiming to refine these interactions to enhance system adaptability. This approach encourages minor, intentional adjustments in user behaviour to enrich the data available for system learning. This paper introduces epistemic interaction within the context of human-system communication, illustrating how deliberate interaction design can improve system understanding and adaptation. Through concrete examples, we demonstrate the potential of epistemic interaction to significantly advance human-computer interaction by leveraging intuitive human communication strategies to inform system design and functionality, offering a novel pathway for enriching user-system engagements.
Key Trends Shaping the Future of Infrastructure.pdfCheryl Hung
Keynote at DIGIT West Expo, Glasgow on 29 May 2024.
Cheryl Hung, ochery.com
Sr Director, Infrastructure Ecosystem, Arm.
The key trends across hardware, cloud and open-source; exploring how these areas are likely to mature and develop over the short and long-term, and then considering how organisations can position themselves to adapt and thrive.
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...UiPathCommunity
💥 Speed, accuracy, and scaling – discover the superpowers of GenAI in action with UiPath Document Understanding and Communications Mining™:
See how to accelerate model training and optimize model performance with active learning
Learn about the latest enhancements to out-of-the-box document processing – with little to no training required
Get an exclusive demo of the new family of UiPath LLMs – GenAI models specialized for processing different types of documents and messages
This is a hands-on session specifically designed for automation developers and AI enthusiasts seeking to enhance their knowledge in leveraging the latest intelligent document processing capabilities offered by UiPath.
Speakers:
👨🏫 Andras Palfi, Senior Product Manager, UiPath
👩🏫 Lenka Dulovicova, Product Program Manager, UiPath
Securing your Kubernetes cluster_ a step-by-step guide to success !KatiaHIMEUR1
Today, after several years of existence, an extremely active community and an ultra-dynamic ecosystem, Kubernetes has established itself as the de facto standard in container orchestration. Thanks to a wide range of managed services, it has never been so easy to set up a ready-to-use Kubernetes cluster.
However, this ease of use means that the subject of security in Kubernetes is often left for later, or even neglected. This exposes companies to significant risks.
In this talk, I'll show you step-by-step how to secure your Kubernetes cluster for greater peace of mind and reliability.
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Ramesh Iyer
In today's fast-changing business world, Companies that adapt and embrace new ideas often need help to keep up with the competition. However, fostering a culture of innovation takes much work. It takes vision, leadership and willingness to take risks in the right proportion. Sachin Dev Duggal, co-founder of Builder.ai, has perfected the art of this balance, creating a company culture where creativity and growth are nurtured at each stage.
Elevating Tactical DDD Patterns Through Object CalisthenicsDorra BARTAGUIZ
After immersing yourself in the blue book and its red counterpart, attending DDD-focused conferences, and applying tactical patterns, you're left with a crucial question: How do I ensure my design is effective? Tactical patterns within Domain-Driven Design (DDD) serve as guiding principles for creating clear and manageable domain models. However, achieving success with these patterns requires additional guidance. Interestingly, we've observed that a set of constraints initially designed for training purposes remarkably aligns with effective pattern implementation, offering a more ‘mechanical’ approach. Let's explore together how Object Calisthenics can elevate the design of your tactical DDD patterns, offering concrete help for those venturing into DDD for the first time!
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Jeffrey Haguewood
Sidekick Solutions uses Bonterra Impact Management (fka Social Solutions Apricot) and automation solutions to integrate data for business workflows.
We believe integration and automation are essential to user experience and the promise of efficient work through technology. Automation is the critical ingredient to realizing that full vision. We develop integration products and services for Bonterra Case Management software to support the deployment of automations for a variety of use cases.
This video focuses on the notifications, alerts, and approval requests using Slack for Bonterra Impact Management. The solutions covered in this webinar can also be deployed for Microsoft Teams.
Interested in deploying notification automations for Bonterra Impact Management? Contact us at sales@sidekicksolutionsllc.com to discuss next steps.
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
LISA QooxdooTutorial Slides
1. The Joy of writing JavaScript Applications
How Qooxdoo puts the fun back into programming for the
web
Tobias Oetiker
OETIKER+PARTNER AG
22nd Large Installation System Administration Conference
2. The Browser: my application platform
Applications in the Browser: Netscapes original Plan.
Performance: SquirelFish, V8, Tracemonkey engines.
JavaScript graduated with Web 2.0
Widget libraries for breakfast, lunch and dinner.
A separte hack for every browser.
3. Qooxdoo: application in the browser
Web 2.0 is all about the look and feel.
Web pages with eye candy.
Applications running in the browser.
Back to client/server computing.
Qooxdoo is a complete environment.
4. Qooxdoo features
Turns JS into a grown up OO language.
No HTML or CSS knowledge required.
Cross Browser: >= FF 1.5, Safari 3, Chrome, IE6, Opera8.
Multilingual.
Full API Documentation.
Users works ’inside the box’.
LGPL, EPL
Fun.
5. Jump right in
Install Python. http://www.python.org/download/
Unpack Qooxdoo. http://qooxdoo.org/download/
Get Js2-mode for emacs
http://code.google.com/p/js2-mode/
Do this NOW!
6. Jump right in
Install Python. http://www.python.org/download/
Unpack Qooxdoo. http://qooxdoo.org/download/
Get Js2-mode for emacs
http://code.google.com/p/js2-mode/
Do this NOW!
7. Generating the first application
Point your path to qooxdoo-0.8-sdk/tools/bin
Change directory to your development space.
Run create-application.py –name hello
CD into the hello directory.
Run generate.py source
Point your browser to hello/source/index.html
8. Generating the first application
Point your path to qooxdoo-0.8-sdk/tools/bin
Change directory to your development space.
Run create-application.py –name hello
CD into the hello directory.
Run generate.py source
Point your browser to hello/source/index.html
10. source code: hello/source/class/hello/Application.js I
1 /* Tell qooxdoo that we need the resources in hello /*
2 # asset ( hello /*)
3 */
4 qx . Class . define ( quot; hello . Application quot; ,
5 {
6 extend : qx . application . Standalone ,
7 members :
8 {
9 main : function ()
10 {
11 // Call super class
12 this . base ( arguments );
13 // Enable logging in debug variant
14 if ( qx . core . Variant . isSet ( quot; qx . debug quot; , quot; on quot; ))
15 { // native logging capabilities
16 qx . log . appender . Native ;
17 // additional cross - browser console .
18 // Press F7 to toggle visibility
19 qx . log . appender . Console ;
20 }
11. source code: hello/source/class/hello/Application.js II
21 // Create a button
22 var button1 = new qx . ui . form . Button (
23 quot; First Button quot; , quot; hello / test . png quot; );
24 // Document is the application root
25 var doc = this . getRoot ();
26 // Add button to document at fixed coordinates
27 doc . add ( button1 , { left : 100 , top : 50});
28 // Add an event listener
29 button1 . addListener ( quot; execute quot; , function ( e ) {
30 alert ( quot; Hello World ! quot; );
31 });
32 }
33 }
34 });
The original Qooxdoo hello world application,
modified to fit the slide.
12. Qooxdoo and JavaScript
It’s just like Perl and OO
It’s all about anonymous functions
and closures . . . and scoping.
13. Qooxdoo and JavaScript
It’s just like Perl and OO
It’s all about anonymous functions
and closures . . . and scoping.
14. Qooxdoo and JavaScript
It’s just like Perl and OO
It’s all about anonymous functions
and closures . . . and scoping.
15. A function pointer example
1 var add_alert = function (a , b ){
2 alert ( ’ The Result is : ’ +( a + b ));
3 }
4 add_alert (1 ,2);
16. Scoping for the naïve
You know scoping from other languages
1 var j = 100;
2 var z = 22;
3 for ( var z = 1; z <10; z ++){
4 var j = z ;
5 }
6 alert ( ’ And the Winner is j : ’+ j + ’ z : ’+ z );
Or so you thought
17. Scoping for the naïve
You know scoping from other languages
1 var j = 100;
2 var z = 22;
3 for ( var z = 1; z <10; z ++){
4 var j = z ;
5 }
6 alert ( ’ And the Winner is j : ’+ j + ’ z : ’+ z );
Or so you thought
18. Scoping for the disillusioned
JavaScript scoping works only within function blocks.
1 var j = 100;
2 var z = 22;
3 for ( var z = 1; z <10; z ++){( function (){
4 var j = z ;
5 })()}
6 alert ( ’ And the Winner is j : ’+ j + ’ z : ’+ z );
Note that z is outside the function block!
19. Scoping for the disillusioned
JavaScript scoping works only within function blocks.
1 var j = 100;
2 var z = 22;
3 for ( var z = 1; z <10; z ++){( function (){
4 var j = z ;
5 })()}
6 alert ( ’ And the Winner is j : ’+ j + ’ z : ’+ z );
Note that z is outside the function block!
20. A simple closures example
1 var set ;
2 var get ;
3 var j =2;
4 ( function (){ // the magic javascript scope trick
5 var j ;
6 set = function ( x ){ j = x };
7 get = function (){ alert ( ’ Hidden j is ’+ j )};
8 })(); // end of scope
9 set (33);
10 get ();
11 alert ( ’ Outside j is still ’+ j );
Everything as expected.
21. A simple closures example
1 var set ;
2 var get ;
3 var j =2;
4 ( function (){ // the magic javascript scope trick
5 var j ;
6 set = function ( x ){ j = x };
7 get = function (){ alert ( ’ Hidden j is ’+ j )};
8 })(); // end of scope
9 set (33);
10 get ();
11 alert ( ’ Outside j is still ’+ j );
Everything as expected.
22. A simple closures example
1 var set ;
2 var get ;
3 var j =2;
4 ( function (){ // the magic javascript scope trick
5 var j ;
6 set = function ( x ){ j = x };
7 get = function (){ alert ( ’ Hidden j is ’+ j )};
8 })(); // end of scope
9 set (33);
10 get ();
11 alert ( ’ Outside j is still ’+ j );
Everything as expected.
23. A broken function factory
1 var j = [];
2 for ( var z = 1; z <10; z ++){
3 var g = z ;
4 j [ g ] = function ( a ){
5 alert ( ’ The value for j [ ’ + a + ’] is ’+ g );
6 };
7 }
8 j [2](2);
JavaScript! Has! No! Scope! For! Loop! Blocks!
24. A broken function factory
1 var j = [];
2 for ( var z = 1; z <10; z ++){
3 var g = z ;
4 j [ g ] = function ( a ){
5 alert ( ’ The value for j [ ’ + a + ’] is ’+ g );
6 };
7 }
8 j [2](2);
JavaScript! Has! No! Scope! For! Loop! Blocks!
25. A broken function factory
1 var j = [];
2 for ( var z = 1; z <10; z ++){
3 var g = z ;
4 j [ g ] = function ( a ){
5 alert ( ’ The value for j [ ’ + a + ’] is ’+ g );
6 };
7 }
8 j [2](2);
JavaScript! Has! No! Scope! For! Loop! Blocks!
26. A working function factory
1 var j = [];
2 for ( var z = 1; z <10; z ++){( function (){ // for a block
3 var g = z ;
4 j [ g ] = function ( a ){
5 alert ( ’ The value for j [ ’ + a + ’] is ’+ g );
6 };
7 })()} // end of block
8 j [2](2);
Again the anonymous function trick comes to the rescue.
27. A working function factory
1 var j = [];
2 for ( var z = 1; z <10; z ++){( function (){ // for a block
3 var g = z ;
4 j [ g ] = function ( a ){
5 alert ( ’ The value for j [ ’ + a + ’] is ’+ g );
6 };
7 })()} // end of block
8 j [2](2);
Again the anonymous function trick comes to the rescue.
28. fun with this
1 var hello = {
2 world : ’ You ’ ,
3 show : function (){
4 alert ( ’ Hello ’+ this . world + ’ this : ’+ this ); }
5 };
6 hello . show (); // method call
7 var plain = hello . show ; // function pointer
8 var world = ’ Me ’; // change this . world
9 plain (); // method call
this refers to this refers to the browsers
the hello object. base Window object.
29. fun with this
1 var hello = {
2 world : ’ You ’ ,
3 show : function (){
4 alert ( ’ Hello ’+ this . world + ’ this : ’+ this ); }
5 };
6 hello . show (); // method call
7 var plain = hello . show ; // function pointer
8 var world = ’ Me ’; // change this . world
9 plain (); // method call
this refers to this refers to the browsers
the hello object. base Window object.
30. Class definition
In its most basic form, a Qooxdoo class is very simple.
1 qx . Class . define ( ’ my . first . Class ’ );
In reality you would use something like this
1 qx . Class . define ( quot; my . cool . Class quot; , {
2 // declare constructor , members , ...
3 });
A regular class can then be instantiated
1 var myClass = new my . cool . Class ;
31. Class inheritance
The map contains the meat of the class.
1 qx . Class . define ( quot; my . cool . Class quot; ,
2 {
3 extend : my . great . SuperClass ,
4 construct : function () { ... } ,
5 destruct : function () { ... }
6 });
Embrace and extend.
32. Static members
Static member names are in the statics key.
They use UPPERCASE names by convention.
1 qx . Class . define ( quot; my . cool . Class quot; , {
2 statics : {
3 FOO : VALUE ,
4 BAR : function () { ... }
5 }
6 });
Static members are accessed with their full name:
1 my . cool . Class . FOO = 3.141;
2 my . cool . Class . BAR ();
33. Static members
Static member names are in the statics key.
They use UPPERCASE names by convention.
1 qx . Class . define ( quot; my . cool . Class quot; , {
2 statics : {
3 FOO : VALUE ,
4 BAR : function () { ... }
5 }
6 });
Static members are accessed with their full name:
1 my . cool . Class . FOO = 3.141;
2 my . cool . Class . BAR ();
34. Instance Members
Instance members reside in the members map.
1 qx . Class . define ( quot; my . cool . Class quot; , {
2 members : {
3 foo : VALUE ,
4 bar : function () { ... }
5 }
6 });
Use new to create an instance.
1 var myClass1 = new my . cool . Class ;
2 myClass1 . foo = 3.141;
3 myClass1 . bar ();
35. Instance Members
Instance members reside in the members map.
1 qx . Class . define ( quot; my . cool . Class quot; , {
2 members : {
3 foo : VALUE ,
4 bar : function () { ... }
5 }
6 });
Use new to create an instance.
1 var myClass1 = new my . cool . Class ;
2 myClass1 . foo = 3.141;
3 myClass1 . bar ();
36. Calling the Superclass
1 qx . Class . define ( quot; my . cool . Class quot; ,
2 {
3 extend : my . great . SuperClass ,
4 construct : function ( x ) {
5 this . base ( arguments , x ); // superclass constructor
6 }
7 members : {
8 foo : function ( x ) {
9 this . base ( arguments , x );
10 }
11 }
12 });
The this.base construct works for both constructor and
member functions.
37. Generic access to static members
1 qx . Class . define ( quot; my . cool . Class quot; ,
2 {
3 extend : qx . core . Object ,
4 construct : function ( x ){ this . base ( arguments , x )} ,
5 statics : {
6 PI : 3.141
7 }
8 members : {
9 circumference : function ( radius ) {
10 return 2 * this . self ( arguments ). PI * radius ;
11 }
12 }
13 });
this.self only works for subclasses of qx.core.Object
38. mixins
1 qx . Mixin . define ( ’ my . cool . MMixin ’ ,{
2 // code and variables like in a class
3 });
Like classes, but without inheritance.
By convention Mixin names start with ’M’.
1 qx . Class . define ( ’ my . cool . Class ’ , {
2 include : [ my . cool . MMixin , my . other . cool . MMixin ]
3 ...
4 });
Include mixins when creating new classes.
1 qx . Class . include ( qx . ui . core . Widget , qx . MWidgetFeatures );
Or even inject them into an existing class.
39. class access control
There is the following naming convention for class members.
1 publicMember
2 _protectedMember
3 __privateMember
In the Qooxdoo build process it is optionally possible to
randomize the names of private members to protect access.
40. static, abstract and singleton classes
1 qx . Class . define ( ’ my . static . Class ’ , {
2 type : ’ static ’
3 statics : { ... };
4 });
Neither members nor constructors are allowed in static classes.
1 qx . Class . define ( ’ my . abstract . Class ’ , {
2 type : ’ abstract ’
3 });
Abstract classes must be sub-classed for use.
1 qx . Class . define ( ’ my . singleton . Class ’ , {
2 type : ’ singleton ’
3 });
4 var instance = my . singleton . Class . getIntance ()
There is only one instance which gets created on the first call.
41. Browser specific code
Normally Qooxdoo takes care of all browser differences, but if
you must intervene . . .
1 members : {
2 foo : qx . core . Variant . select (
3 ’ qx . bom . client . Engine . NAME ’ , {
4 ’ mshtml | opera ’: function () {
5 // Internet Explorer or Opera
6 },
7 ’ default ’: function () {
8 // All other browsers
9 }
10 }
11 )
12 }
42. The demo Browser
1 $ cd $QX / frontend / application / demobrowser /
2 $ ./ generate . py build
3 $ gnome - open build / index . html
Or surf to http://demo.qooxdoo.org/current/demobrowser
43. The API Documentation
1 $ cd $QX / frontend / framework
2 $ ./ generate . py api
3 $ gnome - open api / index . html
Or surf to http://demo.qooxdoo.org/current/apiviewer
44. The Qooxdoo generator
Python is the sole dependency
generator.py is the tool
it gets called by generate.py
The generator has many functions
source - prep development code
build - prep code for deployment
api - build api doc
lint - check your code for beauty
pretty - fix the code layout
...
45. Running your Qooxdoo program in source
Use source code during development
1 $ cd hello
2 $ ./ generate . py source
3 $ gnome - open source / index . html
As long as you do not use any new classes, press reload in the
browser to see changes.
46. Deploying your Qooxdoo program
1 $ cd hello
2 $ ./ generate . py build
3 $ cp - rp build ~/ public_html / hello
only two js files
code gets optimized and compressed
no external dependencies
47. Button, TextField and some Action
1 // Create a textfield
2 var tf1 = new qx . ui . form . TextField ( ’ Demo Text ’ );
3 // Add button to root
4 root . add ( tf1 , { column : 0 , row : 0});
5 // Create a button
6 var bt1 = new qx . ui . form . Button (
7 ’ Open Alert ’ , ’ lisa08 / test . png ’ );
8 // Add button to root
9 root . add ( bt1 , { column : 1 , row : 0});
10 // Add an event listener
11 bt1 . addListener ( ’ execute ’ , function ( e ) {
12 // closure !!
13 this . info ( ’ TextField : ’+ tf1 . getValue ());
14 alert ( ’ TextField : ’ + tf1 . getValue ());
15 });
Try F7 to see inline console!
48. The Layout Manager
Qooxdoo Widgets can contain other widgets.
Layout manager positions child widgets.
qx.ui.container.Composite basic
qx.ui.container.Scroll draws scroll bars
qx.ui.window.Window directs children to an inner
composite pane.
Layout manager set at construction time
Modified with setLayout method.
49. Container and Layout
1 // a container with horizontal layouyt manager
2 var hbox = new qx . ui . layout . HBox ();
3 hbox . setSpacing (4); // set property
4
5 // assign layout
6 var ctr1 = new qx . ui . container . Composite ( hbox );
7 ctr1 . setWidth (600); ctr1 . setHeight (40);
8 // layout properties : position
9 root . add ( ctr1 ,{ column : 0 , row : 1 , colSpan : 2});
10
11 var tf2 = new qx . ui . form . TextField ( ’ Some More Text ’ );
12 var bt2 = new qx . ui . form . ToggleButton ( ’ AllowGrowY ’ );
13 bt2 . addListener ( ’ changeChecked ’ , function ( e ) {
14 // modify widget property
15 tf2 . setAllowGrowY ( e . getData ());
16 this . info ( ’ New Value for AllowGrowY : ’+ e . getData ());
17 });
18 ctr1 . add ( tf2 ); ctr1 . add ( bt2 );
50. Grid Layout
qx.ui.layout.Grid
fully dynamic
ideal for dialogs
one widget per cell
row and column spans
minimal and maximal column and row sizes
fixed row and column sizes
51. About the Qooxdoo Layout Widgets
A container widget needs a layout manager to place its
children.
The layout manager object has properties.
Every widget has basic properties like: alignment,
growability, shrinkability, stretchability, margins, padding,
width and height.
Each widget can have layout-specific properties.
Layout properties get checked as the widget is added to a
layout.
Lets play with the layout demos!
52. Localized Applications
1 var lmgr = qx . locale . Manager . getInstance ();
2 var bt3 = new qx . ui . form . ToggleButton (
3 this . tr ( ’ Translate ! ’)
4 );
5 root . add ( bt3 , { column : 1 , row : 3});
6 bt3 . addListener ( ’ changeChecked ’ , function ( e ) {
7 var lang = e . getData () ? ’ de ’ : ’ en ’;
8 lmgr . setLocale ( lang );
9 this . info ( ’ Language set to : ’+ lang );
10 });
add locale to config.json
./generate.py translation
translate de.po
./generate.py source
53. calling code on the server
JSON RPC for transport
various language bindings
often minimal server code
async with callbacks
qx.io.Rpc
54. An RPC Example: Client
1 var rpc = new qx . io . remote . Rpc ( ’ jsonrpc . cgi ’ , ’ myclass ’ );
2 var bt4 = new qx . ui . form . Button ( this . tr ( ’ Call RPC ’ ));
3 root . add ( bt4 , { column : 1 , row : 4});
4 var that = this ; // we want this ’ this ’!
5 var callback = function ( result , ex , id ) {
6 that . RpcRunning = null ; // free the reference
7 if ( ex == null ) {
8 alert ( ’ The RPC call returned : ’+ result );
9 that . info ( ’ RPC call returned : ’+ result );
10 } else {
11 alert ( ’ Async ( ’ + id + ’) exception : ’ + ex );
12 that . error ( ’ Async ( ’ + id + ’) exception : ’ + ex );
13 }
14 };
15 bt4 . addListener ( ’ execute ’ , function ( e ) {
16 that . RpcRunning = rpc . callAsync (
17 callback , ’ mymethod ’ , ’ Hello ’ );
18 });
The example only works on a cgi enabled webserver.
55. An RPC Example: Server CGI
source/jsonrpc.cgi:
1 # !/ usr / bin / perl -w
2 use strict ;
3 use lib qw ( perl );
4
5 use CGI ;
6 # use CGI :: Fast ;
7 use CGI :: Session ;
8 use Qooxdoo :: JSONRPC ;
9
10 # $Qooxdoo :: JSONRPC :: debug =1;
11 my $cgi = new CGI ;
12 # while ( my $cgi = new CGI :: Fast ){
13 my $session = new CGI :: Session ;
14 Qooxdoo :: JSONRPC :: handle_request ( $cgi , $session );
15 # }
For best performance use CGI::Fast and configure
CGI::Session to keep the session data in a database.
56. An RPC Example: the myclass service
source/perl/Qooxdoo/Services/myclass.pm:
1 package Qooxdoo :: Services :: myclass ;
2 use strict ;
3
4 # for now let everyone access the methods
5 sub GetAccessibility { ’ public ’ };
6
7 sub method_mymethod {
8 my $error = shift ;
9 my $arg = shift ;
10 return ’ The argument was : ’. $arg ;
11 }
12
13 1;
The myclass module gets loaded dynamically.
57. An RPC Example: Getting it to work
Install language bindings from Qooxdoo website.
ln -s /var/www/lisa08 build
./generate.py build
cp -rp source/jsonrpc.cgi source/perl build
Open the application in the browser.
Make sure the cgis are actually executed
Watch the Apache error log while testing.
58. Organizing the code into multiple classes
Object orientation “by the book”.
One file per class.
Java’s file name based approach.
Supported by the generator.
Ideal for code re-use.
Use Inline Docs!
./generate.py api
59. The textclick class I
1 /* *
2 * textclick combines a textfield and a button .
3 */
4 qx . Class . define ( quot; lisa08 . ui . textclick quot; ,
5 {
6 extend : qx . ui . container . Composite ,
7 /* *
8 * @param button_text { String } button text .
9 */
10 construct : function ( button_text ) {
11 this . base ( arguments ,
12 new qx . ui . layout . HBox (). set ({ spacing : 4})
13 );
14 this . __tf = new qx . ui . form . TextField ();
15 this . __bt = new qx . ui . form . Button ( button_text );
16 this . add ( this . __tf );
17 this . add ( this . __bt );
18 },
19
20
60. The textclick class II
21 members :
22 {
23 /* *
24 * Get a handle to the Button widget .
25 */
26 getButton : function () { return this . __bt } ,
27 /* *
28 * Get a handle to the TextField widget .
29 */
30 getTextField : function () { return this . __tf } ,
31 __bt : null ,
32 __tf : null
33 }
34 });
61. Using the textclick class
1 var mywi = new lisa08 . ui . textclick (
2 this . tr ( ’ Copy Text from Example 1 ’ ));
3
4 mywi . getButton (). addListener ( ’ execute ’ , function ( e ) {
5 mywi . getTextField (). setValue ( tf1 . getValue ());
6 this . info ( ’ Set textfield to ’+ tf1 . getValue ());
7 });
8
9 root . add ( mywi ,{ column : 0 , row : 5 , colSpan : 2});
62. The Message Bus
Communication in “large” applications.
Singleton message bus class.
Careful with references: memory leaks!
1 var mywi2 = new lisa08 . ui . textclick (
2 this . tr ( ’ Send Hello to Textfield ’ ));
3 var bus = qx . event . message . Bus . getInstance ();
4 mywi2 . getButton (). addListener ( ’ execute ’ , function ( e ) {
5 bus . dispatch ( ’ mybus .1 ’ , ’ Hello World ’ );
6 this . info ( ’ Sent Hello World on this bus ’ );
7 } , this ); // context provided for console
8 bus . subscribe ( ’ mybus .1 ’ , function ( m ){
9 mywi2 . getTextField (). setValue ( m . getData ());
10 this . info ( ’ Got ’+ m . getData ()+ ’ from the bus ’ );
11 } , this );
12
13 root . add ( mywi2 ,{ column : 0 , row : 6 , colSpan : 2});