Roadmap Drawings

From Career Pathways Tutorial

(Difference between revisions)
Jump to: navigation, search
(Adding a New Drawing)
(Renaming Drawings)
Line 78: Line 78:
==Renaming Drawings==
==Renaming Drawings==
-
Each drawing must have a unique title. The Web Tool stores and references each drawing by organization abbreviation and Occupation/Program title.   
+
<b>Each drawing must have a unique title</b>. The Web Tool stores and references each drawing by organization abbreviation and Occupation/Program title.   
<b>To rename a drawing</b>:
<b>To rename a drawing</b>:

Revision as of 06:10, 16 April 2009

<< return to main Tutorials page...

Due to cross-browser issues, please use the latest version of FireFox or Internet Explorer 7 when working in the Career Pathways Roadmap Web Tool: http://oregon.ctepathways.org


Contents

Drawing List

To access, click Roadmap Drawings from the side navigation menu.

  • The drawing list interface allows you to filter Roadmap drawings by:
Image:FOrganizations.png, Image:FUsers.png and Image:FPrograms.png
  • Upon log-in, these filters default to the logged-in user's organization and user name, with the drawing list (located beneath the filter boxes) showing only drawings associated with the logged-in user.

Filtering Drawings

  • As you navigate the Web Tool the filters will remember changes to the selections that you make:
  • Click [Show All] for Organizations to view all drawings for all organizations. Users and Occupations/Programs will automatically [Show All].
  • Click [Show All] for Users to view all drawings by all users for your organization.
  • Click on any single Organization or User name to view corresponding results.
  • Select multiple Organizations, Users or Occupations/Programs by holding down the CTRL key to view corresponding results.
  • Click on a specific Occupation/Program to show all users associated with that drawing.
  • All drawings are listed in alphabetic order by drawing Occupation/Program title underneath the filter boxes.
  • Each drawing reflects who created and last modified the drawing.
  • Click the Image:MyDrawings.png icon above the drawing list to restore default settings for the logged in user.

Search Bar

  • The search bar, Image:Search.png, located above the drawing list filters allows you to search drawing titles, keywords in drawing content, and user names. Click Search or hit Enter/Return to submit the search query.

Drawing Versions

  • When a new drawing is created, the drawing title and "Version 1" is automatically added to the drawing list.
  • Versions of each drawing are listed beneath the drawing title in numeric order.
  • Each version has two links listed to the right of the version number:
  • wrench.png (Version Settings), and
  • pencil.png (Draw/Edit Version) or picture.png (View Version)
wrench.png Version Settings provides a summary of the drawing Occupation/Program, version number, who created and modified that version, a link to share that specific version with others, and the ability to delete this version. View Version Settings and Deleting Drawing Versions for more information.
pencil.png Draw/Edit Version means the drawings is available to be edited, copied, and/or published. pencil.png is displayed when that version has never been lock.png "Locked" or report.png "Published". The word Draft is stamped as a watermark in the background of the drawing.
picture.png View Version means the drawings can no longer be edited, but can be viewed and copied into a new version. picture.png is displayed when that version has been or currently is lock.png "Locked" or report.png "Published". If currently published, the drawing canvas will not have any watermark stamps in the background. If previously published, the drawing is stamped Outdated and you can either "page_copy.png copy this version" to edit the drawing, or re-publish the drawing by clicking "report_go.png publish this version" again.
  • The report.png (Published Version) icon will appear directly to the right of the version number if it is the currently published version. View Publishing Drawings for more information.

cog.png Drawing Properties

  • Here you have access to detailed information and properties settings about the drawing as a whole, such as:
  • Edit the Occupation/Program drawing title
  • Confirmation of Organization name
  • Edit or assign an applicable Oregon Skill Set category from the provided drop-down menu of choices
Image:OregonSkillSet.png
  • Click link to Preview the published drawing (if a version is currently published)
  • Obtain Embed Code for embedding the published version in a public website. (Available in wrench.png Version Settings page as well.)
  • Obtain URL hyperlinks for the published and Accessible view of the drawing - once shared these will always link to the currently "Published" version.
  • and view details on each drawing version, such as:
  • Version # with link to wrench.png (Version Settings)
  • Who created and modified each version, and
  • Actions to
  • pencil.png (Draw/Edit Version) or picture.png (View Version)
  • magnifier.png (Preview Version), or
  • page_copy.png (Copy Version)
  • Published versions are highlighted in tan, stamped with the word (Published) in parentheses beside the version number, and marked as report.png (Published Version) and lock.png (Version Locked).
  • Ability to Delete drawing and all versions. View Deleting Drawings for more information.

wrench.png Version Settings

  • Here you have access to version specific drawing information and settings, such as:
  • View the Occupation/Program drawing title with link to cog.png (Drawing Properties)
  • Version #, and whether or not it is (Published)
  • Confirmation of Organization name
  • Save a Note to help identify details about this version, e.g. Pending Approval or Needs OLMIS links. This note will appear on the drawing list next to the version #.
  • Who created and modified each version
  • Actions to
  • pencil.png (Draw/Edit Version) or picture.png (View Version)
  • magnifier.png (Preview Version), or
  • page_copy.png (Copy Version)
  • Whether or not it is Editable as identified by lock_open.png (Lock Version) or lock.png (Version Locked). Use this feature in place of publishing until your drawing is ready to go "public".
  • Obtain Embed Code for embedding the published version in a public website. (Available regardless of version, and within cog.png Drawing Properties page as well.)
  • Obtain URL links for specific version and Accessible view of the drawing version - once shared these will always link to this specific version, regardless if it is current or not.
  • Ability to Delete this version. View Deleting Drawing Versions for more information.

Renaming Drawings

Each drawing must have a unique title. The Web Tool stores and references each drawing by organization abbreviation and Occupation/Program title.

To rename a drawing:

  1. from the Roadmap drawing list, click on cog.png (Drawing Properties) to the left of the drawing title
  2. click edit to the right of the current drawing title
  3. a text editing field will appear; change the title as desired
  4. click Image:TitleSave.png

Warning: changing the drawing title will break any external web pages that link to this drawing. Update external links as necessary.

  • Return to the drawing list by clicking back, the back arrow on your browser, or clicking Roadmap Drawings from the side navigation.

Adding a New Drawing

  • Click Image:NewDrawing.png at the top of the drawing list to create a new Roadmap drawing.
  • Each drawing must have a unique name. The Web Tool stores and references each drawing by organization abbreviation and drawing Occupation/Program name.


Adding a New Drawing

  1. Click the green + sign at the top of the drawing list.
  2. Type a short and descriptive Title for your drawing, such as "EMT", "Accounting", or "Game Programming". Please do not add your organization's abbreviation to the title.
  3. Click Create.
  4. Your drawing and Version 1 has now been created.
    • Your organization abbreviation, the Career Pathways logo, and drawing title are automatically placed in a header at the top of the drawing area. These are fixed.
    • To edit the drawing title you must return to the drawing list, click the drawing title, and click edit.

Tools Orientation

The drawing window tools operate in a WYSIWYG fashion (What You See Is What You Get). View HELP on the drawing canvas, and click More Help for a complete list of features.

Adding Objects
  • Right-click the drawing area for a tools menu to add new objects (box, line, arrow) on the spot clicked.
  • Or, from TOOLS (left of the drawing area) click line, arrow, or box to add objects to a fixed left-hand destination on the drawing area.
Deleting Objects
  • Delete objects with the DELETE key or the object's menu.
Duplicating Objects
  • Duplicate objects with CTRL+C, CTRL+V or the object's menu.
Customizing Objects: Editing Content
  • Right-click an object for a menu of customizing options.
  • To add/edit box titles, right-click the desired box and click Edit - Title.
    • Use your keyboard and/or mouse to highlight and edit text.
    • Click outside of the box to accept changes.
    • Titles default to all CAPS.
    • Please do not exceed 2 lines of text for your box titles.
  • To add/edit box content, right-click the desired box and click Edit - Content.
    • A WYSIWYG editor will open for text entry and text formatting. Here you can create hyperlinks and edit source code for additional formatting options.
    • NOTE: You are welcome to copy and paste text from any generic text editor such as NotePad, however please DO NOT copy and paste text from Microsoft Word as undesired formatting results may occur.
  • Create dynamic connections. Connect two boxes by selecting Start Connection Here from one box's right-click menu and End Connection Here from another’s. These dynamic connections move with the connected boxes as layout changes occur.
  • Customize connections by right-clicking on the connecting line and selecting options such as Start Point, End Point, Orientation, Segments (default set to “1 (Straight Line”), Color, and Delete.
  • When selected, connections now show a blue box frame, with a green control point at the start and a red control point at the end. The object's menu can be brought up by right-clicking anywhere within this box. Click and drag the start control point or end control point to adjust the starting or ending location.
  • To change object colors, select the object and click a color from TOOLS, or using Color on the object's menu.
    • Connections are automatically assigned the color of the box they start from. If you change the color of the box, the connection is automatically updated; however you can manually override the connection color as stated above.
Snap To Grid
  • Right-click the drawing area for a tools menu to show and/or edit the grid.
  • Snap to Grid is enabled by default. To disable, choose Grid → Snap to Grid from the tool's menu.
  • The grid is 10 pixels by default, and can be any size. To change the grid size, choose Grid → Edit Grid Size from the tool's menu.
  • Grid options are not saved.


NOTE: There are no “save” or “undo” features built in to this web tool. Drawing changes are instantaneously saved as they are made to the drawing. Confirmation is provided before any objects are deleted from the drawing area.

Moving and Resizing Objects

  • Moving Boxes:
  • Click any point of a box, and drag and release your mouse at the desired location. When clicked, boxes are highlighted with a blue box frame.
  • Resizing Boxes:
  • When selected, boxes are highlighted with a blue box frame, with left and right blue control points. Click and drag either point to expand/retract box width. Box height is determined by content.
  • Positioning Objects:
  • When selected, connections, lines and arrows now show a blue box frame, with a green control point at the start and a red control point at the end. The object's menu can be brought up by right-clicking anywhere within this box. Click and drag the start control point or end control point to adjust the starting or ending location.
  • When dragging a box, line or arrow, hold down the ALT key (option on Mac) to move the object without snapping to the grid.
  • When dragging a control point for a line or arrow, hold down the Shift key to make the line vertical or horizontal.
  • Connecting lines adjust with boxes as layout changes occur. Right-click a connection to change connection Segments, and Start and End Points as necessary to obtain desired layout.
  • To change the pointing direction of basic arrows, click and drag the arrow head control point in the desired direction. Hold down the Shift key while dragging to make the line vertical or horizontal.

Video Demonstration

View a short video demonstrating several key Web Tool drawing features here.

Copying Drawings

Do you have a drawing that you want to use as a template for other roadmaps? Then this feature is for you!

Select copy this version from the drawing tools menu, or drawing title link from the drawing list menu. This feature operates through a pop-up window.

  • Within Your School, you can create:
    • a New Version, to the existing drawing, or
    • a New Drawing, which copies the existing drawing into an identical new drawing at your organization; provide a new[1] drawing name before hitting “OK”.
  • From Another School, you can create:
    • a New Drawing at your school, and provide a new[1] drawing name before hitting “OK”.
    • the drawing will be added to your school list and Version 1 will be created.

Note

1: New Drawing Name
If no new drawing name is provided, the original drawing name is used and the word “copy” is appended to the new drawing name by default.
2: Drawing Status?
No matter the drawing status, any drawing can be copied into a new version or new drawing.


Sharing Unpublished Drawings

These are permanent links to this specific version of the drawing. If this version is deleted, the link will break. If the version is copied and updated, this link will only ever point to this version.

  1. From the Drawings list click the info link next to the drawing version you wish to share.
  2. Copy and paste the link into an email message, and send it to the desired recipient to share your in-progress drawing.
    • The recipient will view the drawing as a stand-alone HTML web page and will not be able to edit the drawing.

Publishing Drawings

Once "published" a drawing can no longer be edited. From the Drawing list the link to "draw" a roadmap will be changed to read "view" in the drawing list. In order to edit the drawing, a new version must be created by copying the published version. Previously published versions can no longer be edited either, however, they can be re-published.

Links to published drawings will always point to the currently published version of a drawing. When a link to a published drawing is shared by email or embedded in a website you will not have to update that link as new versions are published. The only time a link must be updated is when the drawing title is edited.

To publish a drawing from the Drawing list:

  1. Select the info link of a drawing version
  2. Click the button to publish this version
  3. You will be returned to the Drawing list, and the version published will be highlighted and stamped as "(published)".

To publish a drawing while viewing a drawing in draw or view mode:

  1. Select publish this version from the drawing tools menu
  2. You will be redirected to the version info page; click the button to publish this version.
  3. You will be returned to the Drawing list, and the version published will be highlighted and stamped as "(published)".

Users are able to publish drawings within their school only, with the exception of State Admin who can publish drawings for all schools.

Embedding Published Drawings

To embed a drawing on an external website, copy the Embed Code provided through the Drawing list, drawing title or version info links. Paste this code into the section of your website where you want to include the drawing.

Here is a example of embed code:

<iframe width="800" height="600" 
src="http://oregon.ctepathways.org/c/published/lcc_early_childhood_education"
frameborder="0" scrolling="no">
</iframe>
  • Webmaster users can follow the Embedding Instructions provided in the Web Tool site navigation for additional details.
  • Adjust width and height attributes to accommodate roadmap accordingly:
width="750" height="600"

Printing Drawings

For best results, design your roadmap drawing to fit to one (1) page in a portrait layout. To do so, keep all objects within the boundaries of the blue title bar at the top of the drawing pane. NOTE: The Web Tool does not currently support landscape layout or multi-page printing.

  • From the drawing list, click view or draw for the drawing you wish to print.
  • Click print this version, from TOOLS on the drawing canvas, to render a roadmap drawing for printing from the browser menu.
  • Select print preview to preview your drawing prior to printing, and to ensure it will fit to one (1) page.
  • Change print size from "Shrink to Fit" to a fixed percentage or scale if drawing preview shows an undesired layout.
  • Set your browsers print settings to "print background images" so that titles of boxes print white over dark colored boxes. Directions follow below.
Setup FireFox
* Click File --> Page Setup...
* Make sure Options - Print Background (colors & images) is checked
* Click OK to save
Setup IE7
* If you do not see your browser toolbar at the top of your browser window, 
  hit the ALT key (for PC) to make it visible.
* Click Tools --> Internet Options
* Click the Advanced tab
* Under Settings, scroll down to Printing
* Make sure Print background colors and images is checked
* Click OK to save

Print To PDF

Do you need a roadmap drawing in PDF format to share with colleagues or have available to download from your institutions website? By emailing help@ctepathways.org and requesting a PDF of your roadmap, you are guaranteed to have a PDF document with active hyperlinks, keeping your roadmap data accessible to all viewers.


When submitting a request, please include your name, school, drawing title and version number. We will provide a high-resolution PDF document by email.


NOTE: Users on Mac computers are able to print direct to PDF. PC users are able to print to PDF if they have PDF writing software installed on their system. However, printing direct to PDF will not keep hyperlinks in your roadmap drawings "live". Please email help@ctepathways.org for assistance.


Deleting Drawings

There is no way to recover deleted drawings! Don't be hasty to clean-up or delete old versions of drawings. Take advantage of the version control this Web Tool provides to maintain an archival history of your roadmaps.

  • To delete an entire drawing, including all of its versions, click the drawing title from the drawing list, select the link to Delete drawing and all versions at the bottom of the page, and click Yes to confirm.
CAUTION! Deleting drawings in this manner will remove all versions. Please be careful! Deleting drawings will break any links from external web pages to that drawing. There is no way to recover deleted drawings!
  • Only State Admin users have the ability to delete drawings for all schools.

Deleting Drawing Versions

There is no way to recover deleted drawings! Don't be hasty to clean-up or delete old versions of drawings. Take advantage of the version control this Web Tool provides to maintain an archival history of your roadmaps.

  • To delete a drawing version, click info next to the drawing version on the drawing list, select the link to Delete this version at the bottom of the page, and click Yes to confirm. That version number will no longer be available for future versions of that drawing.
  • If a drawing only has one version, click the drawing title from the drawing list and select Delete drawing and all versions at the bottom of the page, and click Yes to confirm.
  • If a drawing version is currently Published, the version cannot be deleted. Copy the published version to a new version and click the info link on the old version to delete that version, or click the drawing title from the drawing list to Delete drawing and all versions (at the bottom of the page), and click Yes to confirm.

ADA/504 Accessibility Compliance

Viewing Roadmaps

The transition to using the Canvas technology for rendering roadmaps also enables end-users and roadmap creators with vision impairments to zoom the view of each roadmap to a certain extent. Using the browser's zoom functionality a roadmap viewer can zoom a roadmap in or out of normal view. Zooming out too far will cause certain components of the roadmap to appear broken, or missing color.

Text-Only View

A URL to an "accessible" (text-only) version of your drawing is available in the drawing's information page, accessed by clicking the drawing title from the drawing menu. This view eliminates all the graphical components of the roadmaps, and is suitable for viewing in any browser or using a screen reader.

<a href="http://oregon.ctepathways.org/c/text/cocc_emt_basic.html">Accessible version</a>

The "accessible" URL will always link to the published version of that drawing. Include a link to this URL on your web page where you have embedded the full drawing so that visitors can access a version of your drawing that will be compatible with screen readers.


NOTE: In order for a roadmap to function in this view, it must be created using "connections" to link boxes together. If a drawing does not use connections, it will still be visible in this view, however it will be difficult to navigate. It is the responsibility of the roadmap creator to assure their roadmaps are created in a way to support this representation.