DOCSLIB.ORG

Javascript Chapitre 5 : Encore Plus Loin…

Total Page：16

File Type：pdf, Size：1020Kb

Download full-text PDF Read full-text
Javascript Chapitre 5 : Encore Plus Loin… 12/17/2019 JavaScript Chapitre 5 : encore plus loin… MAS‐RAD – Master of Advanced Studies, Rapid Application Development Stéphane GOBRON HE‐Arc –hes.so 2019 JavaScript 6 chapitres . Description du cours . Ch1 : fondamentaux . Ch2 : instructions de base . Ch3 : structure objet . Ch4 : instructions avancées . Ch5 : encore plus loin Après ce cours vous savez que c'est la réponse 'D' bien sur! 1 12/17/2019 Librairies et extensions …en quelques mots donc seulement l'introduction des concepts de… . 5.1 Librairies Généraliste : jQuery Spécialisée : Buzz . 5.2 En complément AJAX Pour la 3D : WebGL "More, more, and more!" 5. Encore plus loin… 5.1 Librairies . JS lib ‐ Dom, JS ‐ Graphisme, Web ‐ Recherche spécifique . E.g. généraliste : jQuery . E.g. spécialisée : Buzz Il y aurait beaucoup à dire… 2 12/17/2019 Librairies DOM ou JS Manipulation du DOM Pure JavaScript/AJAX AccDC FuncJS Dojo Toolkit Google Closure Library Glow Joose jQuery jsPHP midori Microsoft's Ajax library MooTools MochiKit Prototype JS Framework PDF.js YUI Library Rico Socket.io Spry framework Underscore.js Wakanda Framework Librairies Web‐application related Graphisme & Web GUI‐related (Widget AngularJS Graphical/Visualization libraries) Backbone.js (Canvas or SVG related) Ample SDK Batman.js D3.js DHTMLX Cappuccino Ext JS Echo CanvasJS HTML5 Charts Ink Ember.js JavaScript InfoVis Toolkit iX Framework Enyo Fellowrock jQuery UI Google Web Toolkit Kinetic.js Lively Kernel JavaScriptMVC Processing.js qooxdoo Knockout Raphaël Script.aculo.us rAppid.js SWFObject SmartClient Rialto Toolkit Three.js Kendo UI SproutCore Frame‐Engine CreateJS Web Atoms 3 12/17/2019 Librairies Plus généralement . Pour rechercher une lib spécifique et/ou accéder à l’ensemble de l’étendu des lib JS : https://www.javascripting .com/ Librairies généralistes jQuery http://en.wikipedia.org/ But et principe wiki/JQuery Plan visuel de jQuery . jQuery est une librairie JavaScript . jQuery simplifie grandement la programmation JS . jQuery is considéré comme facile à apprendre Exemple 4 12/17/2019 Librairie spécialisée Buzz But et principe . Une des très nombreuses librairies annexes… Rien à voir avec Buzz l'éclair 5. Encore plus loin… 5.2 En complément de JS . AJAX . WebGL Des milliers et des milliers de polygônes en temps réel… 5 12/17/2019 En complément de JS AJAX But et principe • AJAX est une technique pour créer des pages Web rapide et . AJAX = Asynchronous dynamique JavaScript and XML • AJAX permet aux pages Web d'être mis à jour de manière asynchrone par échange de petites quantités de données avec le serveur dans les coulisses. Cela signifie qu'il est possible de mettre à jour des parties d'une page Web sans recharger toute la page • Les sites qui n'utilisent pas AJAX doivent recharger la page complète au moindre changement • Qui utilise AJAX? Google Maps, Gmail, Youtube, and Facebook tabs http://www.w3schools.com/ajax/ajax_intro.asp AJAX : c'est quoi, pour faire quoi et pour qui? En complément de JS AJAX Où se place Ajax? http://fr.wikipedia.org/wiki/Ajax_%28informatique%29 6 12/17/2019 En complément de JS WebGL But et principe Exemples de rendu 3D temps‐réel multi‐passes . Utilisation d'OpenGL dans un navigateur avec version 4.0 WebGL : JS + GLSL . Implique de connaître Les notions d'infographie La notion de Shaders Language I.e. programmation sous carte graphique ici GLSL http://webGL3D.info En complément de JS WebGL A visiter !!! http://www.awwward s.com/22‐ experimental‐webgl‐ demo‐examples.html Plus de détail pour ceux qui le souhaitent après ce cours 7 12/17/2019 Buzz . eg05‐01.html : librairie Buzz pour le son jQuery . eg05‐02.html : translation et 'zoom in' de texte . eg05‐03.html : zoom in/out d'images Exemple avancé sans librairie! . eg05‐04.html : tracés de courbes et mémorisation d'information sur navigateur WebGL . eg05‐05.html : vérifier le contexte pour WebGL . eg05‐06.html : un premier triangle . eg05‐07.html : WebGL Earth AJAX . eg05‐08.html : changer un texte . eg05‐09.html : calculer coté serveur avec l'aide de php Merci pour votre attention! Questions? Une archive de tous les exemples comprenant .html, .css, .js, images, et sons et cachées à cette adresse : http:\\www.stephane‐gobron.net\Core\Courses\3_HE‐Arc\JavaScript\Eg\Eg.rar Attention! Cette archive à de fortes chances de changer car il reste encore du travail pour rendre tous les exemples pleinement fonctionnels … 8.
Load more

Recommended publications
  • Advances in the Application of Information and Communication Technologies in Healthcare at the Patient's Home
    Advances in the application of information and communication technologies in healthcare at the patient's home Valentina Isetta Aquesta tesi doctoral està subjecta a la llicència Reconeixement- CompartIgual 3.0. Espanya de Creative Commons. Esta tesis doctoral está sujeta a la licencia Reconocimiento - CompartirIgual 3.0. España de Creative Commons. This doctoral thesis is licensed under the Creative Commons Attribution-ShareAlike 3.0. Spain License. ADVANCES IN THE APPLICATION OF INFORMATION AND COMMUNICATION TECHNOLOGIES IN HEALTH CARE AT THE PATIENT'S HOME Memòria presentada per Valentina Isetta per optar al títol de Doctora Director de la tesi: Dr. Ramon Farré Ventura Unitat de Biofísica i Bioenginyeria Facultat de Medicina Universitat de Barcelona If you put your mind to it, you can accomplish anything. Marty McFly, “Back to the future”, 1985 ACKNOWLEDGMENTS I would like to thank all the people that supported me in these intense years of work. First of all, my gratitude goes to Prof. Ramon Farré, for his solid trust since my early beginning in Barcelona and for seeing in me a researcher that I never imagined I could be. Many thanks to Dr. Josep M. Montserrat, for his irreplaceable mentoring in the clinical world and for his advice and affection. Thanks also to all his medical and nursing staff of the Sleep Lab of the Hospital Clinic of Barcelona, where I have learned a lot and I have felt as another team member. A special thank to Carmen Lopez, for her affectionate help and splendid work to create “Petits a casa”. Without her tenacity and the collaboration of all nursing and medical staff of the Hospital de Sant Pau Neonatology department this successful service to the community would not exist.
    [Show full text]
  • Modern Javascript: Develop and Design Larry Ullman
    TEMPORAry SPINE WIDTH: 0.000” Designer-Developers are hot commodities today. But how do you build your development chops fast enough to join their ranks? With Peachpit’s Develop and Design series for visual learners. Modern Modern JavaScript DEVELOP AND DESIGN Modern JavaScript JavaScript IT’S TIME FOR A CURRENT, DEFINITIVE JAVASCRIPT BOOK, “A breath of fresh air in the over-complicated and in this comprehensive beginner’s guide, bestselling author world of JavaScript books. This is one I’ll keep DEVELOP AND DESIGN close by!” Larry Ullman teaches the language as it is implemented today. Jay Blanchard Larry demonstrates how to build upon JavaScript’s ease of use, Web developer and consultant and author of while demystifying its often-cryptic syntax, especially for those Applied jQuery: Develop and Design who have not programmed before. This book enforces modern JavaScript’s best practices and embraces key Web development THIS BOOK INCLUDES: approaches such as progressive enhancement and unobtrusive J Easy step-by-step instruction, ample scripting. The author demonstrates loads of real-world code illustrations, and clear examples DEVELOP and makes it freely available for download. J Real-world techniques to build your You’ll learn about JavaScript itself and the relationship between skills JavaScript and HTML. Next you’ll explore variables, common J Insight into best practices from a operators, and control structures. Then you’ll create functions, veteran Web expert AND handle events, and do more with HTML forms. You’ll master J Emphasis on strategies for creating Ajax, work with frameworks, and use JavaScript with PHP to reliable code that will work on all of create a complete example.
    [Show full text]
  • Marketing Cloud Published: August 12, 2021
    Marketing Cloud Published: August 12, 2021 The following are notices required by licensors related to distributed components (mobile applications, desktop applications, or other offline components) applicable to the services branded as ExactTarget or Salesforce Marketing Cloud, but excluding those services currently branded as “Radian6,” “Buddy Media,” “Social.com,” “Social Studio,”“iGoDigital,” “Predictive Intelligence,” “Predictive Email,” “Predictive Web,” “Web & Mobile Analytics,” “Web Personalization,” or successor branding, (the “ET Services”), which are provided by salesforce.com, inc. or its affiliate ExactTarget, Inc. (“salesforce.com”): @formatjs/intl-pluralrules Copyright (c) 2019 FormatJS Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
    [Show full text]
  • Pragmatic Guide to Javascript
    www.allitebooks.com What Readers Are Saying About Pragmatic Guide to J a v a S c r i p t I wish I had o w n e d this book when I first started out doing JavaScript! Prag- matic Guide to J a v a S c r i p t will take you a big step ahead in programming real-world JavaScript by showing you what is going on behind the scenes in popular JavaScript libraries and giving you no-nonsense advice and back- ground information on how to do the right thing. W i t h the condensed years of e x p e r i e n c e of one of the best JavaScript developers around, it’s a must- read with great reference to e v e r y d a y JavaScript tasks. Thomas Fuchs Creator of the script.aculo.us framework An impressive collection of v e r y practical tips and tricks for getting the most out of JavaScript in today’s browsers, with topics ranging from fundamen- tals such as form v a l i d a t i o n and JSON handling to application e x a m p l e s such as mashups and geolocation. I highly recommend this book for anyone wanting to be more productive with JavaScript in their web applications. Dylan Schiemann CEO at SitePen, cofounder of the Dojo T o o l k i t There are a number of JavaScript books on the market today, b u t most of them tend to focus on the new or inexperienced JavaScript programmer.
    [Show full text]
  • THE FUTURE of SCREENS from James Stanton a Little Bit About Me
    THE FUTURE OF SCREENS From james stanton A little bit about me. Hi I am James (Mckenzie) Stanton Thinker / Designer / Engineer / Director / Executive / Artist / Human / Practitioner / Gardner / Builder / and much more... Born in Essex, United Kingdom and survived a few hair raising moments and learnt digital from the ground up. Ok enough of the pleasantries I have been working in the design field since 1999 from the Falmouth School of Art and onwards to the RCA, and many companies. Ok. less about me and more about what I have seen… Today we are going to cover - SCREENS CONCEPTS - DIGITAL TRANSFORMATION - WHY ASSETS LIBRARIES - CODE LIBRARIES - COST EFFECTIVE SOLUTION FOR IMPLEMENTATION I know, I know, I know. That's all good and well, but what does this all mean to a company like mine? We are about to see a massive change in consumer behavior so let's get ready. DIGITAL TRANSFORMATION AS A USP Getting this correct will change your company forever. DIGITAL TRANSFORMATION USP-01 Digital transformation (DT) – the use of technology to radically improve performance or reach of enterprises – is becoming a hot topic for companies across the globe. VERY DIGITAL CHANGING NOT VERY DIGITAL DIGITAL TRANSFORMATION USP-02 Companies face common pressures from customers, employees and competitors to begin or speed up their digital transformation. However they are transforming at different paces with different results. VERY DIGITAL CHANGING NOT VERY DIGITAL DIGITAL TRANSFORMATION USP-03 Successful digital transformation comes not from implementing new technologies but from transforming your organisation to take advantage of the possibilities that new technologies provide.
    [Show full text]
  • Overview: * Conclusion Modules and Libraries Modern Perl Techniques
    Modern Perl Techniques to Build Distributed Web 2.0 Applications. Presented By: Matt Burns [email protected] * Conclusion Moose just makes things easier. Joose is just like moose but in javascript land. jQuery and Seamstress allow us to be free of clunky template languages. Customized Web Apps spun up on the fly that are stateful are super neato. CPAN modules make concurrent distributed web apps/service possible and straight-forward. Configuration UDC Joose, jQuery Communication Event Distributed Demultiplexing WDC Continuity, Seamstess Computing Dimensions Concurrency Moose, Coro, AnyEvent EDC Service Ideas Behind This: 1) Owning stock and trading options on that will beat owning stock alone. 2) The Web Browser is the new operating system. KiokuDB RDC 3) Distributed parallel programming allows us the ability to tackle very complicated problems. 4) Explore the ideas behind the "Modern Perl" movement. 5) Explore the benefits of the Moose Joose relationship. 6) Instead of templating languages HTML/XML/etc operate directly on the dom. 7) How to enable an ad-hoc system of services to be coordinated into runtime alliances to solve business processes. Distributed Business Component UDC WDC EDC RDC Messages Events Overview: *** Distributed Paradigm Friendly Joose, jQuery Perl, CPAN Dom About how simple(maybe even easy) it is to build a simple distributed application stack with these off the self of CPAN Component Execution Environment The decrease in the impedence mismatch between objects in perl land and objects in Javascript land. Serializing perl/js objects and marshelling them back and forth from the client and server and between server and server. When we think distributed apps there are often many servers working with the client that hosts the user level component of these distributed apps in a piece of dom tied to a Joose object.
    [Show full text]
  • A World of Active Objects for Work and Play: the First Ten Years of Lively
    A World of Active Objects for Work and Play The First Ten Years of Lively Daniel Ingalls Tim Felgentreff Robert Hirschfeld Y Combinator Research Hasso Plattner Institute Hasso Plattner Institute, Potsdam, San Francisco, CA, USA Potsdam, Germany Germany [email protected] [email protected] [email protected] Robert Krahn Jens Lincke Marko Roder¨ Y Combinator Research Hasso Plattner Institute Y Combinator Research San Francisco, CA, USA Potsdam, Germany San Francisco, CA, USA [email protected] [email protected] [email protected] Antero Taivalsaari Tommi Mikkonen Nokia Technologies Tampere University of Technology Tampere, Finland Tampere, Finland [email protected] tommi.mikkonen@tut.fi Abstract Keywords Web programming, Software as a Service, Live The Lively Kernel and the Lively Web represent a continu- Object System, Lively Kernel, Lively Web, Lively, JavaScript, ing effort to realize a creative computing environment in the Morphic context of the World Wide Web. We refer to that evolving system simply as Lively. Lively is a live object computing 1. Live Object Systems environment implemented using JavaScript and other tech- Lively [12] is a live object system which provides a web niques available inside the browser. When first built in 2006, programming and authoring system to its users. By live ob- it was a grand accomplishment to have created such a sys- jects we mean entities that can usually be seen, touched, and tem that would run in any web browser and that could be moved and that will react in a manner prescribed by some set saved and loaded simply as a web page.
    [Show full text]
  • IADIS Conference Template
    www.seipub.org/ie Information Engineering (IE) Volume 3, 2014 Performance and Quality Evaluation of jQuery Javascript Framework Andreas Gizas, Sotiris P. Christodoulou, Tzanetos Pomonis HPCLab, Computer Engineering & Informatics Dept., University of Patras Rion, Patras Received Jun 10, 2013; Revised Jun 21, 2013; Accepted Mar 12, 2014; Published Jun 12, 2014 © 2014 Science and Engineering Publishing Company Abstract devices. Mobile web is the name of this new field of The scope of this work is to provide a thorough web applications and JavaScript is expected to play a methodology for quality and performance evaluation of the major role in its development with the evolution of most popular JavaScript framework, the jQuery Framework, new devices and standards (ex. iPhone, Android) or as by taking into account well established software quality the heart of cross platform applications (like factors and performance tests. The JavaScript programming phonegap.com). There are also proposals for language is widely used for web programming and employing JavaScript in server-side applications increasingly, for general purpose of computing. Since the (Server-Side JavaScript Reference v1.2). growth of its popularity and the beginning of web 2.0 era, many JavaScript frameworks have become available for Due to the plethora of applications that JavaScript programming rich client-side interactions in web serves and the variety of programming needs, applications. The jQuery project and its community serve frameworks have been created in order to help both today as a major part of web programmers. The main programmers and end-users. These frameworks aim to outcome of this work is to highlight the pros and cons of be a useful tool for simplifying JavaScript code jQuery in various areas of interest and signify which and development and repeat blocks of code by using just a where the weak points of its code are.
    [Show full text]
  • Learning Javascript Design Patterns
    Learning JavaScript Design Patterns Addy Osmani Beijing • Cambridge • Farnham • Köln • Sebastopol • Tokyo Learning JavaScript Design Patterns by Addy Osmani Copyright © 2012 Addy Osmani. All rights reserved. Revision History for the : 2012-05-01 Early release revision 1 See http://oreilly.com/catalog/errata.csp?isbn=9781449331818 for release details. ISBN: 978-1-449-33181-8 1335906805 Table of Contents Preface ..................................................................... ix 1. Introduction ........................................................... 1 2. What is a Pattern? ...................................................... 3 We already use patterns everyday 4 3. 'Pattern'-ity Testing, Proto-Patterns & The Rule Of Three ...................... 7 4. The Structure Of A Design Pattern ......................................... 9 5. Writing Design Patterns ................................................. 11 6. Anti-Patterns ......................................................... 13 7. Categories Of Design Pattern ............................................ 15 Creational Design Patterns 15 Structural Design Patterns 16 Behavioral Design Patterns 16 8. Design Pattern Categorization ........................................... 17 A brief note on classes 17 9. JavaScript Design Patterns .............................................. 21 The Creational Pattern 22 The Constructor Pattern 23 Basic Constructors 23 Constructors With Prototypes 24 The Singleton Pattern 24 The Module Pattern 27 iii Modules 27 Object Literals 27 The Module Pattern
    [Show full text]
  • Towards Secure and Reusable Web Applications
    Mashups and Modularity: Towards Secure and Reusable Web Applications Antero Taivalsaari Tommi Mikkonen Sun Microsystems Laboratories [email protected] http://research.sun.com/projects/lively 2 Evolution of the Web 1) Simple pages with text and static images only (e.g., http://www.google.com) 2) Animated pages with plug-ins (e.g., http://www.cadillac.com) 3) Rich Internet Applications (e.g., docs.google.com) What's Next? 3 Web Applications – Implications • Web-based software will dramatically change the way people develop, deploy and use software. • No more installations! > Applications will simply run off the Web. • No more upgrades! > Always run the latest application version. • Instant worldwide deployment! > No middlemen or distributors needed. • No CPU dependencies, OS dependencies, ... > The Web is the Platform. 4 Unfortunately... • The web browser was not designed for running real applications. > It was designed in the early 1990s for viewing documents, forms and other page-structured artifacts – not applications. > Programming capabilities on the web were an afterthought, not something inherent in the design of the browser. • Various Rich Internet Application (RIA) technologies have been introduced recently to retrofit application execution capabilities into the web browser. 5 Web Development vs. Conventional Software The Impedance Mismatch Web Development Conventional SW Development - Documents - Applications - Page / form oriented interaction - Direct manipulation - Managed graphics, static layout - Directly drawn, dynamic
    [Show full text]
  • Black Panther Toolkit! We Are Excited to Have You Here with Us to Talk About the Wonderful World of Wakanda
    1 Fandom Forward is a project of the Harry Potter Alliance. Founded in 2005, the Harry Potter Alliance is an international non-profit that turns fans into heroes by making activism accessible through the power of story. This toolkit provides resources for fans of Black Panther to think more deeply about the social issues represented in the story and take action in our own world. Contact us: thehpalliance.org/fandomforward [email protected] #FandomForward This toolkit was co-produced by the Harry Potter Alliance, Define American, and UndocuBlack. @thehpalliance @defineamerican @undocublack Contents Introduction................................................................................. 4 Facilitator Tips............................................................................. 5 Representation.............................................................................. 7 Racial Justice.............................................................................. 12 » Talk It Out.......................................................................... 17 » Take Action............................................................................ 18 Colonialism................................................................................... 19 » Talk It Out.......................................................................... 23 » Take Action............................................................................24 Immigrant Justice........................................................................25 »
    [Show full text]
  • Adobe Spry and Dreamweaver ADOBE SPRY and DREAMWEAVER (SUP)
    Adobe Spry and Dreamweaver ADOBE SPRY AND DREAMWEAVER (SUP) The Adobe Spry Framework for Ajax (Spry v.1.6.1 is the latest release of Spry) Spry is a JavaScript-base framework that enables the rapid development of Ajax-powered web pages. Ajax is technology. It is a term commonly used to define a group of interrelated web development techniques used on the client-side to create interactive web applications. Spry uses JavaScript, but acts like an extension of HTML and CSS (so anyone with HTML and CSS can use it). Spry can be used with both client-side and server-side technologies. • Spry is implemented as a set of JavaScript libraries. To add Spry to your page, the user includes the JavaScript library that contains the Spry features as needed, and then deploys that JavaScript file to the web site along with other page. • Spry has three basic components: Spry Data, Spry Widgets and Spry Effects. They can be used together or independently of one another. • No browser plug-ins or server-side modules are required for Spry to work. • Dreamweaver CS4 has features that ease the development of Spry pages but Spry itself is completely tool independent. Any code editor can be used to develop Spry pages (Dreamweaver, Visual Studio, Notepad…). Sidebar AJAX Other Frameworks similar to Spry: Google, Yahoo, jQuery, MooTools, Dojo, etc Spry provides developers with easy to implement tools (Spry Data, Spry Widgets and Spry Effects) Widgets examples Validation widgets Menu Bars (Vertical and Horizontal) Sliding Panels Tooltip Effects examples Show/Hide: Fade
    [Show full text]