CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Mentor: Jeff Wood Members: Jonathan Person Justin Deloatch Jamison Jones.

Slides:



Advertisements
Similar presentations
Cascading Style Sheets
Advertisements

1 A Tool-box for Web-site Maintenance Manjula Patel UKOLN University of Bath Bath, BA2 7AY UKOLN is funded by the Library and Information Commission, the.
September Public Library Web Managers Workshop 2000 Cascading Style Sheets Manjula Patel UKOLN University of Bath Bath, BA2 7AY UKOLN is funded.
HIGH LEVEL OVERVIEW: CSS CSS SYNTAX CONSISTS OF A SET OF RULES THAT HAVE 3 PARTS: A SELECTOR, A PROPERTY, AND A VALUE. IT’S NOT NECESSARY TO REMEMBER THIS.
Intro To Cascading Style Sheets By Mario Yannakakis.
CSS Cascading Style Sheets. Objectives Using Inline Styles Working with Selectors Using Embedded Styles Using an External Style Sheet Applying a Style.
Web Engineering 1 Ishaq Khan Shinwari MCS City University Peshawar.
Cascading Style Sheets
Cascading Style Sheets
Today CSS HTML A project.
Presenter: James Huang Date: Sept. 26,  Introduction  Basics  Lists  Links  Forms  CSS 2.
Introducing CSS CIS 133 mashup Javascript, jQuery and XML 1.
CSS. Intro to CSS Cascading Style Sheets – styles and enhances appearance of webpage.css extension.
Web Standards XHTML and CSS. Today’s Show ► Discuss web standards ► XHTML ► Layout Without Tables ► CSS ► Why Web Standards?
Very quick intro HTML and CSS. Sample html A Web Title.
Cascading Style Sheets (CSS): Pixel-Level Control with HTML Ease
Cascading Style Sheets. CSS stands for Cascading Style Sheets and is a simple styling language which allows attaching style to HTML elements. CSS is a.
Links.  Styling Links  Links can be styled with any CSS property (e.g. color, font-family, background-color).  Special for links are that they can.
Web Development & Design Foundations with XHTML Chapter 7 Key Concepts.
HyperText Markup Language (HTML) Uses plain text to add markup instructions to a file. If you can't produce it with a standard keyboard, it can't go into.
Advanced Web Design Using Dreamweaver Robby Seitz 121 Powers Hall
Cascading Style Sheets Basics. Why use Cascading Style Sheets? Allows you to set up a series of rules for all pages in a site. The series may be changed.
Cascading Style Sheets By: Valerie Kuna. What are Cascading Style Sheets? Cascading Style Sheets (CSS) are a standard for specifying the presentation.
Web Development & Design Foundations with XHTML Chapter 7 Key Concepts.
Web Development & Design Foundations with XHTML Chapter 7 Key Concepts.
1 Web Developer & Design Foundations with XHTML Chapter 9 Key Concepts.
End User Computing An Introduction to CSS Sujana Jyothi Research Lab1, Callan Building, Department of Computer Science
Advance CSS (Menu and Layout) Miftahul Huda. CSS Navigation MENU It's truly remarkable what can be achieved through CSS, especially with navigation menus.
CSS BASICS. CSS Rules Components of a CSS Rule  Selector: Part of the rule that targets an element to be styled  Declaration: Two or more parts: a.
Cascading Style Sheets Based on Castro, HTML for the WWW, 6 th edition Ron Gerton, Fall 2007.
CIS 1310 – HTML & CSS 6 Layout. CIS 1310 – HTML & CSS Learning Outcomes  Describe & Apply the CSS Box Model  Configure Float with CSS  Designate Positioning.
Cascading Style Sheet CSS CS1520 Ali Alanjawi. 2 TA Information Ali Alanjawi Homepage: Office:
CSS(Cascading Style Sheets )
HTML for Beginners & JavaScript Magic - Step By Step - Thrandur Arnthorsson thrandur.net.
CSW131 Steven Battilana 1 CSW 131 – Chapter 5 (More) Advanced CSS Prepared by Prof. B. for use with Teach Yourself Visually Web Design by Ron Huddleston,
Diliev.com & pLOVEdiv.com  DIliev.com.
Robby Seitz 121 Powers Hall ADVANCED WEB DESIGN USING DREAMWEAVER
กระบวนวิชา CSS. What is CSS? CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to.
Class four: the box model and positioning. is an HTML tag which allows you to create an element out of inline text. It doesn’t mean anything! try it:
Unit 20 - Client Side Customisation of Web Pages
CSS normally control the html elements. Three Ways to Insert CSS There are three ways of inserting a style sheet: External style sheet Internal style.
Web Design with Cascading Style Sheet Lan Vu. Overview Introduction to CSS Designing CSS Using Visual Studio to create CSS Using template for web design.
Beginning Web Site Creation: Dreamweaver CS4. XHTMLCSS  Describes the structure  Content  Collection of styles  Formatting body { background-color:
Introducing Cascading Style Sheets  Cascading Style Sheet Basics  Creating Styles  Using Styles  Manipulating Styles  Text Formatting with CSS.
Dreamweaver MX. 2 Creating External Style Sheets-1 (p. 400) n A style is a group of formatting attributes identified by a single name. n An ________ style.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
Web Technologies Website Development Trade & Industrial Education
Website Development with Dreamweaver
HTML Authoring. Design  A good website starts its life in the design stage Layout, Color, Sound, Content, Functionality and Maintainability aspects are.
Introduction to Programming the WWW I CMSC Winter 2003 Lecture 7.
AUTOMATING THE TERASCAN IMAGE PROCESS Mentor: Keisha Wilkins Brandi R. Brehon Jameson D. Gibbs.
Cascading Style Sheets (CSS) Within the Enterprise Architecture Framework (EAF) Wes Ziegeler August 3, 2006.
Automated Approach of Cataloguing TeraScan Images Utilizing Active Server Pages ONR Multimedia.
Introducing Cascading Style Sheets. Cascading Style Sheet Basics  Cascading Style Sheet Basics  Creating Styles  Using Styles  Manipulating Styles.
Cascading Style Sheets Primary readings Presentations Explain & review projects with class mates.
CM143- WEB CM143-WEB Page Layout live sites HTML Images User Considerations Planning Navigation CSS Architecture File Management Cascading Style Sheets.
WebD Introduction to CSS By Manik Rastogi.
CSS.
Cascading Style Sheets
Style Sheets.
Creating Page Layouts with CSS
Madam Hazwani binti Rahmat
Unit Objectives Create a new page Import text Set text properties
Cascading Style Sheets
IS333: MULTI-TIER APPLICATION DEVELOPMENT
Cascading Style Sheets 2
TOPICS Chrome Dev Tools Process for Building a Static Website
Software Engineering for Internet Applications
What are Cascading Stylesheets (CSS)?
Introduction to Cascading Style Sheets (CSS)
Presentation transcript:

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Mentor: Jeff Wood Members: Jonathan Person Justin Deloatch Jamison Jones

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Abstract Multimedia Team The Center of Excellence in Remote Sensing Education and Research (CERSER) on the campus of Elizabeth City State University is currently tasked with the responsibility of receiving remotely sensed Advanced Very High Resolution Radiometer (AVHRR) and Sea Wide Field-of-View Sensor (SeaWiFS) data for research projects year round. This data is collected, processed, annotated, and transformed into images in the Tagged Image File Format (tiff). These tiff images are then uploaded to the CERSER archive library server located at Once uploaded, they are converted into various resolutions and their information is added to a tracking database maintained with Microsoft Access software. This database provides a searchable means for retrieving satellite image data through various parameters. The current site and database architecture were developed in 2003 and modified in New capabilities and site requirements necessitated a redesign of the current site to include a more logical navigation scheme and flexibility to expand as needed. The image database required an update of the over four thousand images, many of which were corrupted or missing information. The database also required the implementation of product categories such as AVHRR color images, SeaWiFS chlorophyll images, and SeaWiFS sea surface temperature, as new satellite licenses have been acquired.

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Overview CERSER Revisions Cascading Style Sheets (CSS) Image Database JavaScript

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Site Redesign-Introduction Examination of current website Color Scheme Graphical Interface Navigation

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Site Redesign- Storyboard Compiling pages and links Current site navigation

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Site Redesign- Storyboard Regrouping of Links External Links Internal Links New Site Navigation

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Site Redesign- Page Layout Page Layout Consistency Rough diagram of new navigation layout

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Cascading Style Sheets Cascading Style Sheets (CSS) Styles Updating HTML Code Reduction

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Redefining HTML Tags “links”, “body” “a” a:link {text-decoration: none} a:visited {text-decoration: none} a:active {text-decoration: none} a:hover {text-decoration: underline}

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Redefining HTML Tags “body” tag body { background-color: #FFFFFF; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; background-image: url(images08/bg_01.jpg); font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; }

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH CSS Classes Classes “.txtBOLD”.txtBOLD { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; }

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH global_nav-ext Attributes Font Family Size Font Color Text Decoration Text Alignment Font Weight Font Variant Letter Spacing Display Area

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH global_nav-ext global_nav-ext CSS Link a.global_nav-ext:link { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #FFFFFF; text-decoration: none; text-align: right; font-weight: normal; font-variant: small-caps; letter-spacing: 1px; display: block; }

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Implementing CSS in HTML Files Syntax

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Image Database Update Overview Image Types Sea Surface Temperature (SST) Advanced Very High Resolution Radiometer (AVHRR) Total Deleted = 1000+

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Microsoft Access Overview Use Tables/Fields

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Remote Sensing Overview Use Sea Surface Temperature Sea Ice Geology Vegetation Snow Cover Fire Monitoring Fuel Potential

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH TeraScan Overview Use Environmental Research Meteorology Oceanography Tactical Operations Disaster Management Education CERSER

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH TeraScan Processing 1. Data Received 2. Annotation and Conversion 3. Upload to CERSER 4. JavaScript

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Corrupted/Missing Data Examples of Good and Bad Images Subjective Determination

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH No Image For This File Placeholder Revised JavaScript coding

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Corrupted SST Image Corruption vs. Missing Data Straight Lines

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Corrupted AVHRR Image AVHRR Corruption Usability

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Missing Data No data Usability

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Good SST Image

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Great SST Image Temperature Studies

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Good AVHRR Image Visual Studies

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Defining the Products Overview “Product” Requested Product Categories NOAA AVHRR Visible Image NOAA AVHRR Color Image NOAA AVHRR Sea Surface Temperature Orbview-2 SeaWiFS Visible Image Orbview-2 SeaWiFS Color Image Orbview-2 SeaWiFS Chlorophyll Image NOAA AVHRR Events Orbview-2 SeaWiFS Events

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Identifier File Name Identifier AVI - NOAA AVHRR Visible Image ACI - NOAA AVHRR Color Image AST - NOAA AVHRR Sea Surface Temperature OSV - Orbview-2 SeaWiFS Visible Image OSC - Orbview-2 SeaWiFS Color Image OSH - Orbview-2 SeaWiFS Chlorophyll Image AEV - NOAA AVHRR Events OEV - Orbview-2 SeaWiFS Events

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH JavaScript Implementation If-then-else File Name Syntax: date.time.satellite.tiff Example: n15.tiff Proposed Syntax: date.time.satellite.product.tiff Example: n18.AVI.tiff

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH JavaScript – MID() MID() Definition Example: Mid(x.name,17,1)

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Product Code 'START PRODUCT Conversion if (Mid(x.name,17,1)="a" OR Mid(x.name,17,1)="o") Then if Mid(x.name, 17,3="avi" Then product="NOAA AVHRR visible image" Else if Mid(x.name, 17,3="aci" Then product="NOAA AVHRR color image" Else if Mid(x.name, 17,3="ast" Then product="NOAA AVHRR sea surface temperature" Else if Mid(x.name, 17,3="aev" Then product="NOAA AVHRR event" Else if Mid(x.name, 17,3="osv" Then product=" Orbview-2 SeaWiFS visible image" Else if Mid(x.name, 17,3="oci" Then product=" Orbview-2 SeaWiFS color image" Else if Mid(x.name, 17,3="och" Then product=" Orbview-2 SeaWiFS chlorophyll image" Else if Mid(x.name, 17,3="oev" Then product="Orbview-2 SeaWiFS chlorophyll image" Else product="0" End if End if End if End if End if End if End if End if else product="0" End if 'END PRODUCT Conversion

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Future Work - CERSER Upgrades Upcoming Events Page More Images

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Future Work - Image Library Maintenance Time Update Method Secure HTML/ASP Interface

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH Future Work - Product Development TeraScan Script Update Product Values

CENTER OF EXCELLENCE IN REMOTE SENSING EDUCATION AND RESEARCH MMT ? ?