1) Qooxdoo is a JavaScript framework that provides object-oriented programming features to JavaScript. It turns JavaScript into a "grown up OO language" and allows developers to write browser-based applications without needing HTML or CSS knowledge.
2) The document discusses how to get started with a basic "Hello World" Qooxdoo application by installing Python, unpacking Qooxdoo, and generating and running the application files.
3) Key aspects of programming with Qooxdoo include leveraging JavaScript features like anonymous functions, closures, and proper understanding of scoping, as the framework relies heavily on these elements.
Using the Groovy Ecosystem for Rapid JVM DevelopmentSchalk Cronjé
Overviewing Ratpack, Geb, Spock & Gradle to help with rapid development on the JVM. Mentions of other Gr8 tools & libraries. Swift introduction to Groovy.
Introduction to Gradle in 45min as done at JBCN 2016. Covers the basics of Gradle for people familiar with other build tools. Includes building Java, Scala, Groovy & Kotlin projects
Using the Groovy Ecosystem for Rapid JVM DevelopmentSchalk Cronjé
Overviewing Ratpack, Geb, Spock & Gradle to help with rapid development on the JVM. Mentions of other Gr8 tools & libraries. Swift introduction to Groovy.
Introduction to Gradle in 45min as done at JBCN 2016. Covers the basics of Gradle for people familiar with other build tools. Includes building Java, Scala, Groovy & Kotlin projects
This presentation provides a brief overview of the history of JavaScript and its ecosystem and highlights the excellent JS support provided by the latest NetBeans IDE. You can find the examples on github: https://github.com/saikos/NetBeansES6Support
Apache Groovy: the language and the ecosystemKostas Saidis
An overview of the Groovy language and its awesome ecosystem, advocating Groovy as the language of choice for (a) Java developers that want to dive into dynamic languages or (b) for Javascript, Ruby or Python developers that want to dive into the Java platform.
The presentation was given at the 9th FOSSCOMM (16-17 April 2016) organized by the Software Libre Sociecy of the University of Piraues.
The web is growing fast and online games and other compute-intensive applications expand their user-bases every day. These trends create a growing demand on performance in JavaScript applications. Even though JavaScript has benefited from huge performance improvements in recent years, there is great potential for an even faster web. Browser technologies such as asm.js or Google’s NativeClient enable near-native performance in browsers. More recent efforts led to the specification of WebAssembly, the future vendor-independent standard for native webapps. This talk takes a closer look at Emscripten, a toolchain that transpiles C++ to asm.js. The talk answers questions regarding performance and about the integration with the popular CMake build system.
Uma introdução ao uso de Sockets usando Golang, apresenta as formas de criar seus próprios Sockets e qual cenário poderia está aplicando Sockets.
Aborda como a arquitetura Rest funciona e qual seria o cenário para sua aplicabilidade comparada com Socket.
A apresentação é uma tentativa de apresentar os recursos e poder do Golang quando o assunto é REST e Socket.
Extracting Plugins And Gems From Rails AppsJosh Nichols
Rails Plugins and Ruby Gems are the basic mechanism of sharing functionality between multiple projects. This talk will go over extracting functionality into a plugin, testing it, sharing it, and converting it to a gem.
A case study of the usage of Gradle in the Ratpack web framework. First, we'll examine the Ratpack Gradle plugins, including their functionality, implementation, and testing. Next, we'll examine the build script for the Ratpack project itself. Here, we'll discuss various details of the project's build, including handling multiple projects, multiple types of testing, support for multiple styles of target hardware (developer workstations, cloud CI), and more. For each, we'll go over the desired behavior, how it was achieved, and why it was necessary.
This presentation provides a brief overview of the history of JavaScript and its ecosystem and highlights the excellent JS support provided by the latest NetBeans IDE. You can find the examples on github: https://github.com/saikos/NetBeansES6Support
Apache Groovy: the language and the ecosystemKostas Saidis
An overview of the Groovy language and its awesome ecosystem, advocating Groovy as the language of choice for (a) Java developers that want to dive into dynamic languages or (b) for Javascript, Ruby or Python developers that want to dive into the Java platform.
The presentation was given at the 9th FOSSCOMM (16-17 April 2016) organized by the Software Libre Sociecy of the University of Piraues.
The web is growing fast and online games and other compute-intensive applications expand their user-bases every day. These trends create a growing demand on performance in JavaScript applications. Even though JavaScript has benefited from huge performance improvements in recent years, there is great potential for an even faster web. Browser technologies such as asm.js or Google’s NativeClient enable near-native performance in browsers. More recent efforts led to the specification of WebAssembly, the future vendor-independent standard for native webapps. This talk takes a closer look at Emscripten, a toolchain that transpiles C++ to asm.js. The talk answers questions regarding performance and about the integration with the popular CMake build system.
Uma introdução ao uso de Sockets usando Golang, apresenta as formas de criar seus próprios Sockets e qual cenário poderia está aplicando Sockets.
Aborda como a arquitetura Rest funciona e qual seria o cenário para sua aplicabilidade comparada com Socket.
A apresentação é uma tentativa de apresentar os recursos e poder do Golang quando o assunto é REST e Socket.
Extracting Plugins And Gems From Rails AppsJosh Nichols
Rails Plugins and Ruby Gems are the basic mechanism of sharing functionality between multiple projects. This talk will go over extracting functionality into a plugin, testing it, sharing it, and converting it to a gem.
A case study of the usage of Gradle in the Ratpack web framework. First, we'll examine the Ratpack Gradle plugins, including their functionality, implementation, and testing. Next, we'll examine the build script for the Ratpack project itself. Here, we'll discuss various details of the project's build, including handling multiple projects, multiple types of testing, support for multiple styles of target hardware (developer workstations, cloud CI), and more. For each, we'll go over the desired behavior, how it was achieved, and why it was necessary.
Talent has gone global. It can be found in every corner of the planet. Employers everywhere are competing for it. They realise that finding the right people is critical to their competitive advantage. Resourcing experts like BPS World are pushing into new frontiers in trusted partnership with their clients, they are conquering Planet Talent. To dominate Planet Talent and win the global recruitment race, BPS World has complied ten top tips.
FUSE and beyond: bridging filesystems paper by Emmanuel Dreyfuseurobsdcon
Abstract
Everything started with the desire to have a distributed filesystem better than NFS, which would be elastic and replicated with no SPOF. glusterFS was among the filesystems that could do that, but it uses The FUSE interface to the kernel, which was not available on NetBSD.
We will therefore discuss FUSE implementation and its NetBSD counterpart which is called PUFFS. A first but isufficient bridging attmpt called reFUSE was done, but porting real filesystems required the more complete PERFUSE bridge, which we will present here.
In a third part, we will look at the various unexpected roadblocks that had to be handled during PERFUSE implementation, in order to get a fully functionnal glusterFS on NetBSD.
Speaker bio
Emmanuel Dreyfus works as an IT manager at ESPCI ParisTech in France. He has been contributing for 13 years to NetBSD, in areas such as binary compatibility, and FUSE implementation. More at http://hcpnet.free.fr/pubz/
Have you ever facilitated a workshop or meeting, but felt like something was missing? Do you find your workshop notes or meeting minutes are a long list of action points, with little to remind you about the conversations you had? Have you ever wanted to be more creative in your facilitation style?
A core skill of any Business Analyst, whether in a traditional or agile environment, is the ability to effectively facilitate meetings and workshops. Often, we rely on a scribe (or our memory) to record the details of the workshop or meeting, placing emphasis on written word rather than on the conversation that took place. Why not use something everyone can understand? Pictures!
Luckily, you don’t have to be an artist to make your meetings and workshops more stimulating and engaging. Join me as we create a visual vocabulary to use during facilitation sessions. We will also learn new ways to put your flip chart to good use – it’s not just for parking lots anymore!
Palestra sobre os ataques à liberdade na internet, realizada na Aniventure em Itajaí, SC, dia 19 de maio de 2013 e no VIII SOLISC, dia 21 de setembro de 2013.
The curious Life of JavaScript - Talk at SI-SE 2015jbandi
My talk about the life of JavaScript, from birth to today.
I went trough the demos and code examples very quickly, rather as a teaser to show how modern JavaScript development might look.
If you are interested in a deep dive into the topic of modern JavaScript development, HTML5, ES6, AngularJS, React, Gulp, Grunt etc, please consider my courses: http://www.ivorycode.com/#schulung
This is the Google Tech Talk that I gave August 17th, 2007 on building a JavaScript library. I derived much of the talk from my experiences in building the jQuery and FUEL JavaScript libraries.
The Power of the JVM: Applied Polyglot Projects with Java and JavaScriptHazelcast
In this webinar
JavaScript is a powerful, flexible, and dynamically typed language. JVM is proven to be reliable and stable production platform. The power of the JVM is an ability to run programs written in different languages, including JavaScript. You can short the development cycle by leveraging a scripting abilities of JavaScript. This presentation is about JVM’s scripting capabilities that allow to mix Java and JavaScript in the same application.
In this session you’ll get introduced to the latest state of the polyglot frameworks that use JavaScript and Java side-by-side.
We’ll cover these topics:
-The JDK8’s Nashorn benefits for the server and the client side developers
-Using JavaScript and NodeJS applications and libraries on the Java platform
-Real-world projects overview that leveraging on Java-JavaScript interactions
-Live Q&A
Presenter:
Viktor Gamov, Senior Solutions Architect at Hazelcast
Viktor joined Hazelcast with over 5 years experience of architecting and building the enterprise applications using open source technologies. At his previous roles, he helped the financial companies and startups with various Java and HTML5 projects. He holds MS in Computer Science. He is a co-author of the O’Reilly book «Enterprise Web Development. From Desktop To Mobile». Viktor presented at various international conferences (http://lanyrd.com/gamussa) on Java and JavaScript related topics. He tweets at @gamussa.
A guest lecture I gave for the "Internet Technology" course at my old University (Bath). I tried to pull together all of the things I wish I'd been told before I started building things on the Web.
GraphRAG is All You need? LLM & Knowledge GraphGuy Korland
Guy Korland, CEO and Co-founder of FalkorDB, will review two articles on the integration of language models with knowledge graphs.
1. Unifying Large Language Models and Knowledge Graphs: A Roadmap.
https://arxiv.org/abs/2306.08302
2. Microsoft Research's GraphRAG paper and a review paper on various uses of knowledge graphs:
https://www.microsoft.com/en-us/research/blog/graphrag-unlocking-llm-discovery-on-narrative-private-data/
Connector Corner: Automate dynamic content and events by pushing a buttonDianaGray10
Here is something new! In our next Connector Corner webinar, we will demonstrate how you can use a single workflow to:
Create a campaign using Mailchimp with merge tags/fields
Send an interactive Slack channel message (using buttons)
Have the message received by managers and peers along with a test email for review
But there’s more:
In a second workflow supporting the same use case, you’ll see:
Your campaign sent to target colleagues for approval
If the “Approve” button is clicked, a Jira/Zendesk ticket is created for the marketing design team
But—if the “Reject” button is pushed, colleagues will be alerted via Slack message
Join us to learn more about this new, human-in-the-loop capability, brought to you by Integration Service connectors.
And...
Speakers:
Akshay Agnihotri, Product Manager
Charlie Greenberg, Host
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Tobias Schneck
As AI technology is pushing into IT I was wondering myself, as an “infrastructure container kubernetes guy”, how get this fancy AI technology get managed from an infrastructure operational view? Is it possible to apply our lovely cloud native principals as well? What benefit’s both technologies could bring to each other?
Let me take this questions and provide you a short journey through existing deployment models and use cases for AI software. On practical examples, we discuss what cloud/on-premise strategy we may need for applying it to our own infrastructure to get it to work from an enterprise perspective. I want to give an overview about infrastructure requirements and technologies, what could be beneficial or limiting your AI use cases in an enterprise environment. An interactive Demo will give you some insides, what approaches I got already working for real.
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.
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.
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!
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.
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.
Generating a custom Ruby SDK for your web service or Rails API using Smithyg2nightmarescribd
Have you ever wanted a Ruby client API to communicate with your web service? Smithy is a protocol-agnostic language for defining services and SDKs. Smithy Ruby is an implementation of Smithy that generates a Ruby SDK using a Smithy model. In this talk, we will explore Smithy and Smithy Ruby to learn how to generate custom feature-rich SDKs that can communicate with any web service, such as a Rails JSON API.
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.
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.
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
LISA Qooxdoo Tutorial Handouts
1. The Joy of writing JavaScript Applications
How Qooxdoo puts the fun back into programming for the web
Tobias Oetiker
22nd Large Installation System Administration Conference
2. 1 Introduction
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.
It is said that people at Netscape back in the nineties had the vision of escaping
the Microsoft dominance by enhancing their browser so that it could become a
platform of its own for running client side applications. It is also said that MS was
not thrilled by this thought.
Netscape is no more but the vision has become a reality. The Web 2.0 hype
sparked a slew of highly interactive web applications that used JavaScript snipets
on the browser to enhance the user experience.
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.
3. 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.
Qooxdoo is way more than yet another JavaScript widget collection. Apart from
a cool collection of widgets, it introduces fully object oriented programming to
the JavaScript world. Similar to the way OO got introduced in the Perl world, the
Qooxdoo folks designed a framework that provides all of the OO bits that were
left out of JavaScript’s initial design.
2
4. 2 Hello World
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!
Some claim Qooxdoo has a steep learning curve since it does just publish some
JavaScript files you can link into your web page. While there are ways todo this all
the same, I think it is actually a good thing since Qooxdoo’s main objective is to
provide an environment for writing standalone, browser based applications. With
such a scope in mind, the developer should treat herself to a decent programming
environment.
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
Qooxdoo comes with many sensible defaults. One could argue, that a lot of Qoox-
doo’s appeal comes from the many defaults. Normally when I start to write a pro-
gram from scratch I am faced with way too many decisions at once. I often spend
considerable time mulling about seemingly trivial decisions instead of just start-
ing to program. Qooxdoo takes a lot of this “freedom” away by setting a standard
on how to write your application. Many of these defaults can be changed, but I
found that they are actually quite a good aproximation to my optimal program-
ming environment, so there is no immediate need to change them.
3
5. generated files
hello/generate.py
hello/config.json
hello/source/resource/hello/test.png
hello/source/translation/readme.txt
hello/source/class/hello/test/DemoTest.js
hello/source/class/hello/Application.js
hello/source/index.html
hello/Manifest.json
hello/readme.txt
source code: hello/source/class/hello/Application.js
1 /* Tell qooxdoo that we need the resources in hello/*
2 #asset(hello/*)
3 */
4 qx.Class.define(quot;hello.Applicationquot;,
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.debugquot;, quot;onquot;))
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 }
21 // Create a button
22 var button1 = new qx.ui.form.Button(
23 quot;First Buttonquot;, quot;hello/test.pngquot;);
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;executequot;, function(e) {
30 alert(quot;Hello World!quot;);
31 });
32 }
33 }
34 });
The original Qooxdoo hello world application, modified to fit the slide.
4
6. 3 The finer Points of JavaScript
Qooxdoo and JavaScript
• It’s just like Perl and OO
• It’s all about anonymous functions
• and closures . . . and scoping.
A function pointer example
1 var add_alert=function(a,b){
2 alert(’The Result is: ’+(a+b));
3 }
4 add_alert(1,2);
Calling function creates a function object which I can use exactly like a normal
function.
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
5
7. 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!
While many languages provide scope for every block, this is not the case for
JavaScript. Here the only scoping block is the function block. So if we need
scope inside a looping block for example, we just add an anonymous function and
execute it in place. I am not sure how efficient this is, so do not use it in tight
loops.
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.
6
8. With closures, several functions can share a common variable defined outside the
function. Lisp/Scheme has been the first language to implement this concept. To-
day many object oriented languages can do closures: There are subtle differences
though, as I had to discover the hard way, working with JavaScript coming from
a Perl/C background.
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!
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.
7
9. When programming with Qooxdoo its almost entirely about anonymous functions
and closures. It took me almost a year to finally figure out about JavaScript scop-
ing, before it was just the odd problem which I could not really fix and spent
hours working finding a work-a-round, cursing mysterious JavaScript bugs in the
process.
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.
Be careful when using this in an anonymous function since it always points to
the current parent. Call-back functions are especially ’vulnerable’ to this problem.
8
10. 4 The Qooxdoo OO Features
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.Classquot;, {
2 // declare constructor, members, ...
3 });
A regular class can then be instantiated
1 var myClass = new my.cool.Class;
Class inheritance
The map contains the meat of the class.
1 qx.Class.define(quot;my.cool.Classquot;,
2 {
3 extend : my.great.SuperClass,
4 construct : function() { ... },
5 destruct : function() { ... }
6 });
Embrace and extend.
Static members
Static member names are in the statics key. They use UPPERCASE names by
convention.
1 qx.Class.define(quot;my.cool.Classquot;, {
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();
9
11. Instance Members
Instance members reside in the members map.
1 qx.Class.define(quot;my.cool.Classquot;, {
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();
Calling the Superclass
1 qx.Class.define(quot;my.cool.Classquot;,
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.
The arguments object/map used in this example is a native JavaScript feature.
Inside a function call it contains all the information about how the function was
called: a list of the arguments passed to the function as well as pointers to the
function itself.
10
12. Generic access to static members
1 qx.Class.define(quot;my.cool.Classquot;,
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
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.
A mixin may contain anything a normal class can contain, but it does not get
instantiated or inherited from directly. Is included into new and existing classes to
provide additional features through its methods and properties.
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.
11
13. 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.
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 }
12
14. 5 Working with Qooxdoo
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
For me the demobrowser is the quickest way of seeing how to write Qooxdoo.
Select a widget on the tree at the left and activate the JS Code toggle. Now you
can see both the running program as well as the JavaScript code. The rest is mostly
cut and paste.
13
15. 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
The Qooxdoo API documentation is generated directly from embedded javadoc
in the Qooxdoo JS source files. You can apply the same process to your own
Qooxdoo application to get a api viewer for your own code.
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
• ...
14
16. 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.
To run a Qooxdoo application, the code for each class you used must be loaded.
This can easily be 30 or more files. When calling the generator with the option
source it will create an JavaScript file in source/script/hello.js which
takes care of loading these class files. While developing you may want to try the
lint option as well, to catch some frequent mistakes.
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
The Qooxdoo generator builds a fully custom js file containing all the Qooxdoo
classes required to run your application. It also compresses and optimizes the
code in this step. You will notice that the first source and build run will take quite
some time. This is because Qooxdoo creates cache files of all classes involved. If
you run the build for a second time things will run much quicker.
15
17. 6 Programming with Qooxdoo
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!
In this first example there is already a closure. The variable tf1 is used inside
the event handler. The function is passed as a reference and takes the access to the
TextField object with it.
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.
16
18. 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);
The container widget together with an associated layout object can arrange wid-
gets on screen giving the user high level control over the operation. Here the tog-
gle button lets us choose if the text field should grow vertically to fill the available
space or not.
17
19. 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
The grid widget has all the flexibility of a html table plus a great deal more. It is
the ideal basis for laying out dialog boxes or complex screen setups.
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, shrinkabil-
ity, 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!
For me the best way to understand how layouts work was to first try them out in
the demo browser and then use them in a little program of my own.
18
20. 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
Qooxdoo locale files are normal .po files. You can use any of the existing kde/g-
nome tools for updating your translations. Qooxdoo will automatically pick the
language that best matches the locale settings in your browser.
calling code on the server
• JSON RPC for transport
• various language bindings
• often minimal server code
• async with callbacks
• qx.io.Rpc
19
21. 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.
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.
20
22. 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.
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.
Debugging client/server AJAX applications can be pretty daunting. I find that I
have the best success when I keep my eyes on the Apache error log and add debug-
ging output liberally. For the Perl bindings, setting $Qooxdoo::JSONRPC::debug
to 1 gives also valuable debugging output from the Qooxdoo Perl modules point
of view.
21
23. 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
The textclick class
1 /**
2 * textclick combines a textfield and a button.
3 */
4 qx.Class.define(quot;lisa08.ui.textclickquot;,
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
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 });
22
24. 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});
By splitting your application into different classes, your code becomes simpler to
understand and to test, you can even re-use it in other projects.
The generator tool will merge your own classes with the relevant Qooxdoo Classes
into optimized, monolithic JavaScript files, ready for deployment.
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});
While a message bus can provide a nice way to get inner-application communica-
tion organized, you may soon end up in a maze of different messages being sent
back and forth to no end. A better way to organize an applications logic may be
provided by the qx.util.fsm class which lets you describe the logic in form
of an finite state machine which then takes care of how your gui works. There is
a nice example in the Qooxdoo api viewer.
Tobias Oetiker <tobi@oetiker.ch>
23