This document discusses various technologies for asynchronous distance learning, including multimedia presentations using tools like Director MX and Authorware, learning management systems like WebCT and Blackboard, and Web 2.0 technologies like AJAX. It provides details on the interfaces and features of specific presentation tools. It also summarizes learning management systems and the open source Moodle platform. Emerging approaches for e-learning using social aspects of Web 2.0 are outlined as well.
Invited Presentation to UBC Teaching and Learning with Technology series on Friday, January 20, 2006 introducing BCcampus' new Shareable Online Learning Resources system.
Invited Presentation to UBC Teaching and Learning with Technology series on Friday, January 20, 2006 introducing BCcampus' new Shareable Online Learning Resources system.
Drupal South 2015: Drupal in educationTechnocratAu
Using Drupal in education: strategies, standalone vs collaboration
==============
There is no simple solution to cover all the challenges that education is currently facing. The number of software applications that are currently on the market are addressing only fraction of requested features. After extensive research and the number of specialized and customized projects for universities, we set the goal to create LMS that education sector is craving for.
This session will address:
- history of education software including current education software leaders (open source and others)
- education software approaches: collaborative (using LMS with Drupal) versus standalone (can Drupal be an LMS?)
- LMS for Drupal 8
==============
https://melbourne2015.drupal.org.au/session/using-drupal-education-strategies-standalone-vs-collaboration
Talk giving to the ed tech group of the Council of Pacific and Prairie University Libraries, May 2006, on the feasability of using DSpace to distribute learning resources.
Invited online presentation for Alberta Distance Education and Training Association (ADETA) on some possible pedagogical uses of blogs, presented February 2005
Web 2.0 is the second generation of Web development. It facilitates communication, secure information sharing, interoperability, and collaboration. Web 2.0 concepts have led to the evolution of Web-based communities, hosted services, and applications such as socialnetworking sites, video-sharing sites, wikis, blogs, and folksonomies. Web 2.0 enables users to run applications entirely in a Web browser. Users own the data on a Web 2.0 site and exercise control over that data. Web 2.0 sites, with their architecture of participation, encourage users to add value to the applications they use. This differs from traditional Web sites, which are solely for information retrieval and modifiable only by their owners.
D2L Brightspace Vendor Integrations: Technology and TerminologyD2L Barry
Presentation at 2019 D2L Connection at Normandale CC on April 5, 2019
D2L Brightspace Vendor Integrations: Technology and Terminology- Jonathan Werth, Minnesota State Colleges and Universities System Office
Drupal South 2015: Drupal in educationTechnocratAu
Using Drupal in education: strategies, standalone vs collaboration
==============
There is no simple solution to cover all the challenges that education is currently facing. The number of software applications that are currently on the market are addressing only fraction of requested features. After extensive research and the number of specialized and customized projects for universities, we set the goal to create LMS that education sector is craving for.
This session will address:
- history of education software including current education software leaders (open source and others)
- education software approaches: collaborative (using LMS with Drupal) versus standalone (can Drupal be an LMS?)
- LMS for Drupal 8
==============
https://melbourne2015.drupal.org.au/session/using-drupal-education-strategies-standalone-vs-collaboration
Talk giving to the ed tech group of the Council of Pacific and Prairie University Libraries, May 2006, on the feasability of using DSpace to distribute learning resources.
Invited online presentation for Alberta Distance Education and Training Association (ADETA) on some possible pedagogical uses of blogs, presented February 2005
Web 2.0 is the second generation of Web development. It facilitates communication, secure information sharing, interoperability, and collaboration. Web 2.0 concepts have led to the evolution of Web-based communities, hosted services, and applications such as socialnetworking sites, video-sharing sites, wikis, blogs, and folksonomies. Web 2.0 enables users to run applications entirely in a Web browser. Users own the data on a Web 2.0 site and exercise control over that data. Web 2.0 sites, with their architecture of participation, encourage users to add value to the applications they use. This differs from traditional Web sites, which are solely for information retrieval and modifiable only by their owners.
D2L Brightspace Vendor Integrations: Technology and TerminologyD2L Barry
Presentation at 2019 D2L Connection at Normandale CC on April 5, 2019
D2L Brightspace Vendor Integrations: Technology and Terminology- Jonathan Werth, Minnesota State Colleges and Universities System Office
Crm for school education publishing and management systemMike Taylor
Refined Search Clicks Toolbar Development for Enabling Maximum Searches with minimal clicks used for quick searches in Facebook, Wikipedia etc. With IE, FireFox & Chrome.
Microsoft is often depicted as being against open source, but they actually sponsor some very exciting open source solutions for schools, like the Microsoft Learning Gateway and SharePoint Learning Kit.
View C/D/H's slide deck, presentated at the 2010 MAEDs conference, to learn more about SharePoint's open source solutions and why your district should take advantage.
For more information about this and other SharePoint topics visit www.cdh.com or our blog at www.cdhtalkstech.com.
WeWork Connect: Shaping Confluence to Reflect Our CultureAtlassian
WeWork is making significant strides in connecting members to the space, services, and community needed to create their life’s work. To scale effectively, it was essential to build an internal knowledge sharing platform that enables the WeWork team to be successful in a similar way. In this presentation, Colleen Kasprzak, Corporate Strategy Associate, will discuss the evolution of WeWork Connect from a grassroots effort to an on-brand corporate intranet for employees. By leveraging Confluence and available theming marketplace apps, a solution was developed that promotes interdepartmental transparency and collaboration, while connecting global team members through an interface that aligns with WeWork's core company values.
Similar to 02 asynchronized distance learning (20)
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualityInflectra
In this insightful webinar, Inflectra explores how artificial intelligence (AI) is transforming software development and testing. Discover how AI-powered tools are revolutionizing every stage of the software development lifecycle (SDLC), from design and prototyping to testing, deployment, and monitoring.
Learn about:
• The Future of Testing: How AI is shifting testing towards verification, analysis, and higher-level skills, while reducing repetitive tasks.
• Test Automation: How AI-powered test case generation, optimization, and self-healing tests are making testing more efficient and effective.
• Visual Testing: Explore the emerging capabilities of AI in visual testing and how it's set to revolutionize UI verification.
• Inflectra's AI Solutions: See demonstrations of Inflectra's cutting-edge AI tools like the ChatGPT plugin and Azure Open AI platform, designed to streamline your testing process.
Whether you're a developer, tester, or QA professional, this webinar will give you valuable insights into how AI is shaping the future of software delivery.
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.
Search and Society: Reimagining Information Access for Radical FuturesBhaskar Mitra
The field of Information retrieval (IR) is currently undergoing a transformative shift, at least partly due to the emerging applications of generative AI to information access. In this talk, we will deliberate on the sociotechnical implications of generative AI for information access. We will argue that there is both a critical necessity and an exciting opportunity for the IR community to re-center our research agendas on societal needs while dismantling the artificial separation between the work on fairness, accountability, transparency, and ethics in IR and the rest of IR research. Instead of adopting a reactionary strategy of trying to mitigate potential social harms from emerging technologies, the community should aim to proactively set the research agenda for the kinds of systems we should build inspired by diverse explicitly stated sociotechnical imaginaries. The sociotechnical imaginaries that underpin the design and development of information access technologies needs to be explicitly articulated, and we need to develop theories of change in context of these diverse perspectives. Our guiding future imaginaries must be informed by other academic fields, such as democratic theory and critical theory, and should be co-developed with social science scholars, legal scholars, civil rights and social justice activists, and artists, among others.
The Art of the Pitch: WordPress Relationships and SalesLaura Byrne
Clients don’t know what they don’t know. What web solutions are right for them? How does WordPress come into the picture? How do you make sure you understand scope and timeline? What do you do if sometime changes?
All these questions and more will be explored as we talk about matching clients’ needs with what your agency offers without pulling teeth or pulling your hair out. Practical tips, and strategies for successful relationship building that leads to closing the deal.
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.
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
PHP Frameworks: I want to break free (IPC Berlin 2024)Ralf Eggert
In this presentation, we examine the challenges and limitations of relying too heavily on PHP frameworks in web development. We discuss the history of PHP and its frameworks to understand how this dependence has evolved. The focus will be on providing concrete tips and strategies to reduce reliance on these frameworks, based on real-world examples and practical considerations. The goal is to equip developers with the skills and knowledge to create more flexible and future-proof web applications. We'll explore the importance of maintaining autonomy in a rapidly changing tech landscape and how to make informed decisions in PHP development.
This talk is aimed at encouraging a more independent approach to using PHP frameworks, moving towards a more flexible and future-proof approach to PHP development.
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/
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.
JMeter webinar - integration with InfluxDB and GrafanaRTTS
Watch this recorded webinar about real-time monitoring of application performance. See how to integrate Apache JMeter, the open-source leader in performance testing, with InfluxDB, the open-source time-series database, and Grafana, the open-source analytics and visualization application.
In this webinar, we will review the benefits of leveraging InfluxDB and Grafana when executing load tests and demonstrate how these tools are used to visualize performance metrics.
Length: 30 minutes
Session Overview
-------------------------------------------
During this webinar, we will cover the following topics while demonstrating the integrations of JMeter, InfluxDB and Grafana:
- What out-of-the-box solutions are available for real-time monitoring JMeter tests?
- What are the benefits of integrating InfluxDB and Grafana into the load testing stack?
- Which features are provided by Grafana?
- Demonstration of InfluxDB and Grafana using a practice web application
To view the webinar recording, go to:
https://www.rttsweb.com/jmeter-integration-webinar
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.
3. Multimedia Presentations
• Presentation Basics
– Time-line Based: Macromedia Director MX
– Flowchart Based: Macromedia Authorware
– Event Based: Flash Professional
• Models of Presentations (to be discussed in Ch. 3)
– Petri Net
– Temporal Relations
4. Macromedia Director MX
2004
• Macromedia Director MX 2004 is the proven multimedia tool for
building rich content and applications for delivery via CD, DVD,
and the Internet. Director MX 2004 offers many powerful new
features, including two scripting languages, DVD-Video support,
cross-platform publishing, and Flash MX 2004 integration. VTC
author, Brian Maxx, details how users can work effectively and
efficiently within Director MX 2004. He demonstrates how users
can integrate Director MX 2004 with other image editing
applications, such as Flash MX 2004 and Fireworks MX 2004.
Project planning, brainstorming, and integration are covered in
great detail as he guides users from start to finish on a complete
project.
Source: http://www.vtc.com/products/directormx2004.htm, March 2007
5. Director MX 2004 - Interface
Time line with multiple channels
Multimedia Resources
Layout
6. Macromedia Authorware 7
• Authorware is the leading visual
authoring tool for creating rich-media e-
learning applications for delivery on
corporate networks, CD/DVD, and the
Web. Develop accessible applications
that comply with learning management
system (LMS) standards.
Source: http://www.adobe.com/products/authorware/, March 2007
7. • FlowChart-Based
• Common Macromedia user interface
• Microsoft PowerPoint import
• Supports several standards –
SCORM, XML, etc.
• Media support – DVD, MP3, FLASH,
etc.
Macromedia Authorware
9. Flash Professional 8
• Flash® Professional 8 is the industry's
most advanced authoring environment
for creating interactive websites, digital
experiences and mobile content.
• With Flash Professional 8, creative
professionals design and author
interactive content rich with video,
graphics, and animation for truly unique,
engaging websites, presentations or
mobile content.
Source: http://www.adobe.com/products/flash/flashpro/, 2007
Video: http://www.9iv.com/down/controls/downlist.aspx?id=1827#, 2007
10. Adobe Flash Professional 8
1. Get full creative control
Flash provides full design control to
maximize creativity, resulting in a
consistent end-user experience across a
variety of platforms.
2. Build once, deliver anywhere
Unleash applications to the web, Windows,
Macintosh, Unix, PDAs, and even cell
phones.
3. Create rich animation
Create compelling 2D animations with the
tool that brought animation to the Web.
4. ActionScript
A script language for advanced
programming controls.
12. WebCT
• WebCT is an online proprietary virtual
learning environment system which is
sold to colleges and other institutions and
is used extensively in many campuses
for e-learning. Instructors can add to their
WebCT courses tools such as discussion
boards, mail systems and live chat, along
with content such as documents and web
pages. – Wikipedia
Source: http://www.webct.com/, March 2007
13. Background
• Originally developed at the University of British Columbia
by a faculty member in computer science Murray W.
Goldberg.
• In 1995 Goldberg began looking at the application of web-
based systems to education.
• In February 2006, WebCT was acquired by rival Blackboard
Inc.
• As part of the merger terms with Blackboard, the WebCT
name will be phased out over time in favor of the
Blackboard brand.
• WebCT is notable for being the first commercially
successful virtual learning environment
14. • Current Two versions of WebCT
– WebCT Vista
• Vista is a full-featured enterprise version
– WebCT Campus Edition
• targeted at institutions which already have existing services such
as file storage systems and course registration tools.
15. Criticisms
• WebCT has long been criticized for being the
most difficult of the course management
systems to use
• Generally considered more flexible and less
easy to use than some of its competitors.
• The "Vista" version of the product represents
an attempt to derive a more even balance
between flexibility and ease of use
16. • Founded in 1997
• Blackboard Inc. develops and licenses software
applications and related services to over 2200
education institutions in more than 60 countries
Blackboard
Source: http://www.blackboard.com, March 2007
17. • The Blackboard system includes four primary
areas of functionality:
– Content Management — an online repository for
course materials;
– Communication — asynchronous and synchronous
collaboration tools, and an email tool;
– Assessment — survey, test and quiz capabilities,
and a grade book;
– Control Panel — a toolkit for instructors, providing
overall management utilities.
Primary Functions
18. Blackboard + WebCT =
new Blackboard
• BlackCT? WebBoard?
• The new company will be called Blackboard
• Blackboard's CEO will lead the new company.
WebCT's CEO will become a consultant
• The combined company will continue to develop,
innovate, upgrade, improve and support both
Blackboard's and WebCT's products
– WebCT Vista and WebCT Campus Edition
– Blackboard Academic Suite and Blackboard
Commerce Suite
19. Moodle
• Moodle is a course management system (CMS)
- a free, Open Source software package
designed using sound pedagogical principles,
to help educators create effective online
learning communities. You can download and
use it on any computer you have handy
(including webhosts), yet it can scale from a
single-teacher site to a 50,000-student
University.
Source: http://moodle.org/, March 2007
20. Moodle
• Free software e-learning platform (also known
as a Course Management System (CMS), or
Learning Management Systems (LMS), or
Virtual Learning Environment (VLE)).
• Significant user base with 18,204 registered
sites with 7,270,260 users in 712,531 courses
(as of November 15, 2006)
21. Background
• Origins
– Moodle was the creation of Martin Dougiamas, a former
WebCT administrator at Curtin University
• Origin of the name
– The word Moodle is actually an acronym for Modular
Object-Oriented Dynamic Learning Environment,
although originally the M stood for "Martin", named after
Martin Dougiamas, the original developer.
22. • Designed to help educators create online
courses with opportunities for rich interaction
• Open source license and modular design
Moodle course screenshot with Firefox
23. Specification
• Moodle runs without modification on Unix, Linux, FreeBSD,
Windows, Mac OS X, NetWare and any other systems that
support PHP, including most webhost providers
• Data is stored in a single database: MySQL and PostgreSQL
were the only feasible options in Moodle 1.6
• The current version of Moodle, version 1.7, was released in
November 2006, and makes full use of database abstraction
so that other databases can be used just as easily (Oracle and
Microsoft SQL Server are two specific target DBMSes
24. Moodle statistics and
market share
• Moodle has a significant user base with 18,204 registered sites
with 7,270,260 users in 712,531 courses (as of November 15,
2006). More than 70 languages are supported.
• There are 152 registered Moodle sites that are larger than
5,000 users. The site with the most users is moodle.org with 40
courses and 123,254 users. The site with the most courses is
Online Campus with 8,282 courses and 54,955 users (as of
August 2, 2006).
• Moodle market share according to Alexa Web Traffic for LMS
Suppliers: Moodle only below Blackboard, above all other
VLE, including WebCT.
25. Deployment and
Development
• Moodle has been evolving since 1999 (since
2001 with the current architecture).
• Current version is Moodle 1.9.5+, June 2009.
• http://moodle.org/
• http://download.moodle.org/
• Will be discussed in lab exercise
26. LMS from ADL
• SCORM 2004
• Stand along program
• Web-based LMS (June 2009)
• Download free tool (and source code)
from ADL
• We will discuss this LMS when we
introduce SCORM 2004
Reference: http://www.adlnet.gov, March 2007
28. Web 2.0
(Source: http://en.wikipedia.org/wiki/Web_2, 2007)
• What is Web 2.0
– Web 2.0, a phrase coined by O'Reilly Media in 2004, refers to a
perceived or proposed second generation of Web-based
services — such as social networking sites, wikis,
communication tools, and folksonomies — that emphasize
online collaboration and sharing among users.
• Web 2.0 is not new
Time bar of Web 2.0 buzz words.
29. Principles of Web 2.0
• The web as a platform
• Data as the driving force
• Network effects created by an architecture of participation
• Innovation in assembly of systems and sites composed by
pulling together features from distributed, independent
developers (a kind of "open source" development)
• Lightweight business models enabled by content and
service syndication
• The end of the software adoption cycle ("the perpetual
beta")
• Software above the level of a single device, leveraging the
power of The Long Tail
• Easy to pick up by early adopters
Tim O'Reilly and John Battelle, 2004
30. Hierarchy of Web 2.0
• Level 3 applications, the most "Web 2.0", which could only exist on the
Internet, deriving their power from the human connections and network
effects Web 2.0 makes possible, and growing in effectiveness the more
people use them. O'Reilly gives as examples: eBay, craigslist, Wikipedia,
del.icio.us, Skype, dodgeball, and Adsense.
• Level 2 applications, which can operate offline but which gain advantages
from going online. O'Reilly cited Flickr, which benefits from its shared
photo-database and from its community-generated tag database.
• Level 1 applications, also available offline but which gain features online.
O'Reilly pointed to Writely (since 10 October 2006: Google Docs &
Spreadsheets, offering group-editing capability online) and iTunes
(because of its music-store portion).
• Level 0 applications would work as well offline. O'Reilly gave the
examples of MapQuest, Yahoo! Local, and Google Maps. Mapping
applications using contributions from users to advantage can rank as
level 2.
• non-web applications like email, instant-messaging clients and the
telephone.
Tim O'Reilly (2006-07-17). Levels of the Game: The Hierarchy of Web 2.0 Applications.
31. e-Learning 2.0
(Timothy K. Shih, et al., JDET_DistanceLearnign 2x.doc)
• Perspectives
– People Centric Learning
• LMS can be designed as Plug-in
• Student Service Center
• Student Associations
– Curriculum and Concept Tags for Rediscovery
• Curriculum
• Concept Map for Study Plan
• Search for Interesting Subjects
– Self-regulation and Self-assessment
• AJAX-based assessment system
• Instance Feedback
– Collaborative Authoring and Discussion Group
• Blog for Discussion
• Wiki for Report Writing
32. Technology Overview
• Rich Internet application techniques, Ajax-based
• CSS
• Semantically valid XHTML markup and the use of
Microformats
• Syndication and aggregation of data in RSS/Atom
• Clean and meaningful URLs
• Extensive use of folksonomies (in the form of tags or
tagclouds, for example)
• Use of wiki software either completely or partially (where
partial use may grow to become the complete platform
for the site)
• Weblog publishing
• Mashups
• REST or XML Webservice APIs
33. Criticism
• Many of the ideas of Web 2.0 already featured on networked
systems well before the term "Web 2.0" emerged.
• Conversely, when a web-site proclaims itself "Web 2.0" for the use
of some trivial feature (such as blogs or gradient boxes) observers
may generally consider it more an attempt at self-promotion than
an actual endorsement of the ideas behind Web 2.0.
• The argument also exists that "Web 2.0" does not represent a new
version of World Wide Web at all, but merely continues to use
"Web 1.0" technologies and concepts.
• Other criticism has included the term "a second bubble", (referring
to the Dot-com bubble of circa 1995–2001), suggesting that too
many Web 2.0 companies attempt to develop the same product
with a lack of business models.
34. Interesting Technologies
• Asynchronous JavaScript and XML
(AJAX)
• Really Simple Syndication (RSS)
• Cascading Style Sheets (CSS)
• Folksonomy (in the form of tags or
tagclouds)
35. AJAX
1. What is Rich User Experience?
2. Rich Internet Application (RIA) Technologies
3. AJAX: Real-life examples & Usage cases
4. What is and Why AJAX?
5. Technologies used in AJAX
6. Anatomy of AJAX operation
7. XMLHttpRequest Methods & Properties
8. AJAX Security
9. JavaScript debugging tools
10.Current issues and Future
A part of these slides are summarized from "Web
2.0 and Java: Building Rich Internet Applications
with AJAX, Sun Microsystems, inc."
36. Rich User Experience
• Take a look at a typical desktop application
(Spreadsheet app, etc.)
• The program responses intuitively and quickly
• The program gives a user meaningful feedback‗s
instantly
– A cell in a spreadsheet changes color when you hover your
mouse over it
– Icons light up as mouse hovers them
• Things happen naturally
– No need to click a button or a link to trigger an event
37. Characteristics of Conventional
Web Applications
• ―Click, wait, and refresh‖ user interaction
– Page refreshes from the server needed for all
events, data submissions, and navigation
• Synchronous ―request/response‖
communication model
– The user has to wait for the response
• Page-driven: Workflow is based on pages
– Page-navigation logic is determined by the server
38. Issues of Conventional Web
Application
• Interruption of user operation
– Users cannot perform any operation while waiting for a response
• Loss of operational context during refresh
– Loss of information on the screen
– Loss of scrolled position
• No instant feedback's to user activities
– A user has to wait for the next page
• Constrained by HTML
– Lack of useful widgets
• And these are the reasons why Rich Internet Application
(RIA) technologies were born!
39. Common Rich Internet Application
(RIA) Technologies
• Java Applet
• Macromedia Flash
• Java WebStart
• DHTML
• DHTML with Hidden iframe
• AJAX
40. Java Applet
Advantage
• Can use full Java APIs
• Custom data streaming,
graphic manipulation,
threading, and advanced
GUIs
• Well-established scheme
Disadvantage
• Code downloading time could
be significant
Use it if you are creating
advanced UIs on the
client and downloading
time is not a major
concern
41. Macromedia Flash
Advantage
• Good for displaying
vector graphics
Disadvantage
• Browser needs a Flash
plug-in
• ActionScript is proprietary
• Designed for playing interactive movies
• Programmed with ActionScript
• Implementation examples
• Macromedia Flex
• Laszlo suite (open source)
42. Java WebStart
Advantage
• Desktop experience once
loaded
• Leverages Java technology to
its fullest extent
• Disconnected operation is
possible
• Application can be digitally
signed
• Incremental redeployment
Disadvantage
• Old JRE-based system do not
work
• First-time download time could
be still significant
Desktop application
delivered over the net
Leverages the strengths of
desktop apps and applet
43. DHTML
• DHTML = JavaScript + DOM + CSS
– DOM = Document Object Model
– CSS = Cascading Style Sheets
• Used for creating interactive applications
• No asynchronous communication,
however
– Full page refresh still required
– Reason why it has only a limited success
44. DHTML with Hidden IFrame
• IFrame was introduced as a programmable layout to a
web page
– An IFrame is represented as an element of a DOM tree
– You can move it, resize it, even hide it while the page is visible
• An invisible IFrame can add asynchronous behavior
– The visible user experience is uninterrupted – operational
context is not lost
• It is still a hack
45. AJAX Pro and Con
Advantage
• Most viable RIA technology so
far
• Tremendous industry
momentum
• Several toolkits and
frameworks are emerging
• No need to download code &
no plug-in required
Disadvantage
• Still browser incompatibility
• JavaScript is hard to maintain
and debug
AJAX = DHTML + Asynchronous communication
capability through XMLHttpRequest
46. Real-Life Examples of AJAX
Apps
• Google maps
– http://maps.google.com
• Gmail
– http://gmail.com
• Yahoo Maps
– http://maps.yahoo.com
• My Yahoo
– http://my.yahoo.com
• Many more are popping everywhere
47. Key Aspects of Google
Maps
• A user can drag the entire map by using the mouse
– Instead of clicking on a button or something
• The action that triggers the download of new map data
is not a specific click on a link but a moving the map
around
• Behind the scene - AJAX is used
– The map data is requested and downloaded asynchronously in
the background
• Other parts of the page remains the same
• No loss of operational context
48. Usage cases for AJAX
• Real-time server-side input form data validation
– User IDs, serial numbers, postal codes
– Removes the need to have validation logic at both client side
for user responsiveness and at server side for security and
other reasons
• Auto-completion
– Email address, name, or city name may be auto-completed as
the user types
• Master detail operation
– Based on a user selection, more detailed information can be
fetched and displayed
49. Usage cases for AJAX
• Advanced GUI widgets and controls
– Controls such as tree controls, menus, and progress bars may
be provided that do not require page refreshes
• Refreshing data
– HTML pages may poll data from a server for up-to-date data
such as scores, stock quotes, weather, or application-specific
data
• Simulating server side notification
– An HTML page may simulate a server-side notification by
polling the server in the background
50. Why AJAX?
• Intuitive and natural user interaction
– No clicking required
– Mouse movement is a sufficient event trigger
• "Partial screen update" replaces the "click, wait,
and refresh" user interaction model
– Only user interface elements that contain new information are
updated (fast response)
– The rest of the user interface remains displayed without
interruption (no loss of operational context)
• Data-driven (as opposed to page-driven)
– UI is handled in the client while the server provides data
51. Why AJAX?
• Asynchronous communication replaces
"synchronous request/response model.―
– A user can continue to use the application
while the client program requests
information from the server in the
background
– Separation of displaying from data fetching
53. Technologies Used In AJAX
• JavaScript
– Loosely typed scripting language
– JavaScript function is called when an event in a page occurs
– Glue for the whole AJAX operation
• DOM
– API for accessing and manipulating structured documents
– Represents the structure of XML and HTML documents
• CSS
– Allows for a clear separation of the presentation style from the content
and may be changed programmatically by JavaScript
• XMLHttpRequest
– JavaScript object that performs asynchronous interaction with the
server
54. XMLHttpRequest
• JavaScript object
• Adopted by modern browsers
– Mozilla, Firefox, Safari, and Opera
• Communicates with a server via standard
HTTP GET/POST
• XMLHttpRequest object works in the
background for performing asynchronous
communication with the backend server
– Does not interrupt user operation
55. Server-Side AJAX Request
Processing
• Server programming model remains the same
– It receives standard HTTP GETs/POSTs
– Can use Web Service, Java Servlet, ...
• With minor constraints
– More frequent and finer-grained requests from client
– Response content type can be
• text/xml
• text/plain
• text/json (text/javascript)
56. Anatomy of an AJAX Interaction
(Auto-completion Example)
57. Steps of AJAX Operation
1. A client event occurs
2. An XMLHttpRequest object is created
3. The XMLHttpRequest object is configured
4. The XMLHttpRequest object makes an asynchronous
request and retrieve the back-end DB
5. The EmployeeServlet returns an XML document
containing the result
6. The XMLHttpRequest object calls the callBack()
function and processes the result
7. The HTML DOM is updated
58. XMLHttpRequest Methods
• open(―HTTP method‖, ―URL‖, syn/asyn)
– Assigns HTTP method, destination URL, mode
• send(content)
– Sends request including string or DOM object data
• abort()
– Terminates current request
• getAllResponseHeaders()
– Returns headers (labels + values) as a string
• getResponseHeader(―header‖)
– Returns value of a given header
• setRequestHeader(―label‖,‖value‖)
– Sets Request Headers before sending
59. XMLHttpRequest Properties
• onreadystatechange
– Set with an JavaScript event handler that fires at each state
change
• readyState – current status of request
– 0 = uninitialized
– 1 = loading
– 2 = loaded
– 3 = interactive (some data has been returned)
– 4 = complete
• status
– HTTP Status returned from server: 200 = OK
60. XMLHttpRequest Properties
• responseText
– String version of data returned from the
server
• responseXML
– XML document of data returned from the
server
• statusText
– Status text returned from server
61. AJAX Security: Server Side
• AJAX-based Web applications use the same server
side security schemes of regular Web applications
– You specify authentication, authorization, and data protection
requirements in your web.xml file (declarative in Tomcat or
J2EE Web Application Server) or in your program
(programmatic)
• AJAX-based Web applications are subject to the same
security threats as regular Web applications
– Cross-site scripting
– Injection flaw
62. AJAX Security: Client Side
• JavaScript code is visible to a user/hacker
– Hacker can use the JavaScript code for inferring
server side weaknesses
– Obfustication or compression can be used
• JavaScript code is downloaded from the server
and executed (―eval‖) at the client
– Can compromise the client by mal-intended code
• Downloaded JavaScript code is constrained by
sand-box security model
– Can be relaxed for signed JavaScript
64. Development Tools on Mozilla/Firefox
Browser
• Mozilla FireBug debugger (add-on)
– This is the most comprehensive and most useful JavaScript
debugger
– This tool does things all other tools do and more
• Mozilla JavaScript console
• Mozilla DOM inspector (comes with Firefox package)
• Mozilla Venkman JavaScript debugger (add-on)
• Mozilla LiveHTTPHeaders HTTP monitor
ALL FREE!!
65. Mozilla FireBug Debugger
• Spy on XMLHttpRequest traffic
• JavaScript debugger for stepping through code one line at a time
• Inspect HTML source, computed style, events, layout and the
DOM
• Status bar icon shows you when there is an error in a web page
• A console that shows errors from JavaScript and CSS
• Log messages from JavaScript in your web page to the console
– bye bye "alert debugging‖
• An JavaScript command line
– no more "javascript:" in the URL bar
66. Current Issues of AJAX
• Complexity is increased
– Server side developers will need to understand that
presentation logic will be required in the HTML client pages as
well as in the server-side logic
– Page developers must have JavaScript technology skills
• AJAX-based applications can be difficult to debug, test,
and maintain
– JavaScript is hard to test - automatic testing is hard
– Weak modularity in JavaScript
– Lack of design patterns or best practice guidelines yet
67. Current Issues of AJAX
• No standardization of the XMLHttpRequest yet
– Future version of IE will address this
• No support of XMLHttpRequest in old browsers or
mobile device
• JavaScript technology dependency & incompatibility
– Must be enabled for applications to function
– Still some browser incompatibilities
• JavaScript code is visible to a hacker
– Poorly designed JavaScript code can invite security problem
68. Browsers Which Support
XMLHttpRequest
• Mozilla Firefox 1.0 and above
• Netscape version 7.1 and above
• Apple Safari 1.2 and above (Mac OS)
• Microsoft Internet Explorer 5 and above
• Konqueror (Linux)
• Opera 7.6 and above
69. AJAX Futures
• Standardization of XMLHttpRequest
• Better browser support
• Better and Standardized Framework
support
– Dojo, Yahoo UI, Prototype, …and more
• More best practice guidelines in the
programming model
70. Really Simple Syndication
• Also known as ―web syndication‖
• RSS is a family of web feed formats used to
publish frequently updated digital content, such
as blogs, news feeds or podcasts.
• Users of RSS content use programs called
feed "readers" or "aggregators:" the user
subscribes to a feed by supplying to his or her
reader a link to the feed; the reader can then
check the user's subscribed feeds to see if any
of those feeds have new content since the last
time it checked, and if so, retrieve that content
and present it to the user.
Source: http://en.wikipedia.org, 2007
71. Background
• News Channel
– Netscape‘s ―Push Technology‖
– Microsoft IE‘s ―CDF (Channel Definition
Format)‖
– But, news channel can be improved
• Really Simple Syndication
– A personal aggregators (feed reader) can
check if the subscribed URL has an update.
72. What is RSS
• RSS is a format for syndicating news and the
content of news-like sites, but not just for news.
• Pretty much anything that can be broken down
into discrete items can be syndicated via RSS.
• Once information about each item is in RSS
format, an RSS-aware program (news
aggregator) can check the feed for changes
and react to the changes in an appropriate way.
73. Versions of RSS
Version Owner Pros Status Recommendation
0.90 Netscape Obsoleted by 1.0 Don't use
0.91 UserLand Drop dead simple Officially obsoleted by
2.0, but still quite
popular
Use for basic syndication.
Easy migration path to
2.0 if you need more
flexibility
0.92,
0.93,
0.94
UserLand Allows richer metadata
than 0.91
Obsoleted by 2.0 Use 2.0 instead
1.0 RSS-DEV
Working
Group
RDF-based,
extensibility via
modules, not controlled
by a single vendor
Stable core, active
module development
Use for RDF-based
applications or if you
need advanced RDF-
specific modules
2.0 UserLand Extensibility via
modules, easy
migration path from
0.9x branch
Stable core, active
module development
Use for general-purpose,
metadata-rich syndication
75. Summary
• Web 2.0 will be a trend
• LMS must follow standard
• Reading Assignments
– http://en.wikipedia.org/wiki/Web_2
– JDET_DistanceLearnign 2x.pdf
76. • Web Document Development Paradigm
• Web Document vs. Software Configuration
Management
• Web Document vs.Software Metrics and
Testing
• A Web Document Database
• Web Document Sharing and Object Reuse
• The Supporting Environment
Timothy K. Shih and Chuan-Feng Chiu
A Web Document
Development Environment
77. The Web Document
Development Paradigm
• Software Development Paradigms
– The Waterfall Model
– The Prototype Approach
– The Spiral Model
– Object-Oriented Approach
• Properties of Web Document are Different from
Software Program
– Information Delivery versus Problem Solving
– Human Factors are Very Important
– Evolving Documents versus Stable Programs
78. The Refined Spiral Model
• Script: a simple
outline of Web
document
• Implementation:
HTML files, pictures,
animation, sound,
video, plug-in
programs, etc.
• Testing and
Maintenance:
automatic testing and
periodical checking
Web Document Assessment
Consistency
Completeness and
soundness of
Implementation
Completeness and
Metrics of
Implementation
Completeness and
Quality
of Script
Script
ImplementationTesting and
Maintenance
Repository
Requirement
Delivery
Intra-directory Hyperlinks
Intra-station Hyperlinks
Inter-station Hyperlinks
79. SCIs of a Web Document
• Why Software Configuration Items (SCIs)
– Keep Track of Changes (Versions)
– Collaborative Development
• Web Document SCIs
– Script: Specification, Development Status,
References
– Implementation: HTML files, Multimedia
Resources, Control Programs, Database Supports,
etc.
– Testing and Maintenance: Testing Records, Bug
Reports, Update History
80. Web Document Metrics
• Basic Metric Elements
– Hyperlinks: Intra-Station versus Inter-Station
– Multimedia Data Objects: Continuous versus Discrete
– Plug-in Control Programs: Software Metrics of Programs
• Web Document Metrics
– Traversal Metrics: Hyperlinks + Navigation Sequences
– Data Metrics: HTML Files + Data Files + Program Files
– Computation Metrics: Complexities of Programs
– Transmission Metrics: Remote Ref. w.r.t. a Web Server
81. Web Document Structure
• A Multi-Digraph
Contains
– Entry Nodes
– End Nodes
– Navigation
Trails
– Navigation
Circuits
• Each Node is a
Compound
Object
• Each Edge is a
Hyperlink
f
b
k
j
g
a
d
h
c
e
i
Navigation Circuits Acyclic Full Navigation Trails Acyclic Full Navigation Trails
a-b-e-a a-b-e-i-k (three instances) d-h
a-c-f-e-a a-c-f-e-i-k (three instances) d-a-b-e-i-k (three instances)
a-d-a a-b-f-j d-a-c-f-e-i-k (three instances)
a-b-f-d-a a-c-f-j d-a-b-f-j
a-c-f-d-a a-c-g (two instances) d-a-c-f-j
a-d-h d-a-c-g (two instances)
a-b-f-d-h
a-c-f-d-h
82. Web Document Testing and
Erroneous Objects
• Testing Scope
– Local Testing Scope
– Fixed Depth of Navigation Trails
– Fixed Range of Domain Names
– Testing Scope Profile
• Search for Erroneous Objects
– Bad URLs
– Erroneous Plug-in Programs
– Redundant Data Objects
83. Web Document Testing
Criteria
• Level 0 Testing Criteria
– All URLs should be tested
– All primitive objects should be
tested
• Level 1 Testing Criteria
– All navigation trails should be tested
– All navigation circuits should be
tested
– All compounded objects should be
tested
84. A Web Document Database
• Layered Object-Oriented Multimedia
Database
• Object Reuse
• Object Sharing
• Referential Integrity
• Collaborative Web Document Design
• Toward a Web-Savvy Virtual Library
86. Attributes of Objects in
Different Layers
• Database Layer
• Document Layer
• BLOB Layer
Version
Date/Time
Script Names
Database Name
Keywords
Author
Script Table
Implementation Table
Test Record Table
Bug Report Table
Annotation Table
HTML Files
Program Files
Annotation Files
Multimedia Data Files
87. An Architecture for Web Doc Development
SQL Server
Relational Database
DB records
Web Document Repository
Assessment
DB records
Commercial Home
Page Design Tools
SCM Control
and Inference System
Implementation
SCIs
Implementation
SCIs
Web Document Testing
Tools
Web Document
Metrics Tool
Testing and
Maintenance
SCIs
Testing SCIs
Web Document Script
Editor
Multimedia
Resource
Pool
Media
Data
Script
Script SCIs
BLOBs
References
91. Notes
• Web Document Development from a Software
Engineering Perspective
• Web Document Development Paradigm
• Web Document Metrics and Testing
• Web Documentation Database
• Supporting Tools for Virtual University
Operations
92. • Front End of
Virtual World
User Interface
• Mobile Agent
Technique
• Universal Access
• Persistent Look
and Feel
• Integrated with
an E-Notebook
• Automatic
restore of
personal data
Timothy K. Shih and Jung-Hung Wang, MINE Lab, Tamkang University, Taiwan
A Persistent Look and Feel Agent
93. • Student Agent
• Instructor Agent
• Administrator Agent
Student Instructor Administrator
Mobile Agents of Different Roles
94. • Cut and Paste of Web Objects
• The notebook is saved as a HTML file
• Mobile Storage with a Replication Manager
• Integrated with communication tools
• Collaborative Notebook (Public Notebook) as a future work
An E-Notebook Tool
Demo