Download the Ryuzine Publishers Distribution Kit (PDK) and unzip it. Most of these are not files you will need to edit or understand, but the are necessary to use Ryuzine and/or Ryuzine Machine. You will need either a Development Web Server or some hosted space on a Web Server. While Ryuzine doesn't actually use any server-side code some web technologies it utilizes do not work properly on some platforms or in some browsers if they are not delivered from a web server.

Set Up Your Development Server

This is just a fancy name for a web server running locally either on your desktop computer or on a computer somewhere on your network. The easiest cross-platform way to set it up is to download XAMPP and install it. You'll only need the "Apache" web server part for Ryuzine development.

Another option is to use the web server that may be built into your computer's operation system. Full details on how to install or set up the server is beyond the scope of this manual, but the following may help:

Windows

Computers running Windows use Internet Information Services (IIS) web server. It doesn't come with every version of windows.

Windows XP Home Edition:

Does not officially support installing IIS

Windows XP Professional:

http://www.microsoft.com/resources/documentation/windows/xp/all/proddocs/en-us/iiiisin2.mspx?mfr=true

Windows 7 Home (Premium, Basic, Starter)

http://technet.microsoft.com/en-us/library/cc731911.aspx

Windows 7 Professional, Enterprise, or Ultimate:

http://technet.microsoft.com/en-us/library/cc725762.aspx

(Windows Vista should be similar process to Windows 7)

Mac OSX

Mac OSX is based on UNIX and has a built-in Apache Server. All you have to do is turn it on and drop your files in the correct folder.

1. Open the "System Preferences" control panel
2. Click on the "Sharing" option
3. Find "Web Sharing" in the list of Services and tick the checkbox
4. Make note of the information on the right-hand side of the panel.
5. Drop the Ryuzine files in the "Sites" folder in your Home folder.

Linux

Many Linux distributions already include the Apache web server and all you need to do is turn it on and drop your files in the appropriate folder. Here are the instructions for the popular Ubuntu distribution: https://help.ubuntu.com/8.04/serverguide/C/httpd.html

If you use a different one consult that distribution's documentation or user forums for details on how to set it up.

Using a Live Web Server

Odds are that if you have an Internet Service Provider you have some web hosting space that came with your account. Check with your ISP if you aren't sure, and if your provider doesn't allow the use of server-side technologies (like SQL, CGI, Perl, etc.) don't worry - Ryuzine doesn't use any of those technologies. You only need a basic web server. You can also do this if you have a web hosting account.

You don't really have to worry about the public seeing what you are working on or of anyone using the Ryuzine Machine to change files on your publicly accessible web server. The files are processed locally in your web browser and nobody but you can see what you are doing.

You will need some way to upload files to your live web server. Typically you would use an FTP client, but many ISPs and web hosts provide browser-based file management tools as well - some of which are "drag-and-drop" to upload files.

Typical Folder Layout

The image below should give you an idea how the folders should look on your Development Server or Live Web Site. Typically, though, the "ryuzinemachine.htm" file and "ryu_dev" folder would not be uploaded to a live web server unless you were also using the live web server for development purposes.

Ryuzine Machine Configuration

Inside the "ryu_dev" folder you will see a couple of configuration scripts:

1. editor.config.js
2. machine.config.js

You should never need to open the "editor.config.js" file. However, the "machine.config.js" file has some options you may want to change:

1. importStyles: This is the filename for the default styles to be imported into the "My Styles" panel in the WYSIWYG editor (including the .css on the end).
2. myStyles: Set to 1 to have Ryuzine Machine ask you each time what style sheet to import for use in the "My Styles" panel. Set to a 0 (zero) to have it always use whatever stylesheet is set in the "importStyles" variable.
3. wysiwyg: normally Ryuzine Machine will automatically detect whether or not the platform can use the WYSIWYG editor. If you would like to prevent it from loading even on platforms capable of using it (for example if you prefer to code from scratch and do not like using the editor) set this value to 0 (zero) and the editor will never be loaded.
4. devices: Number of default devices that will appear in the Simulator drop-down. This number MUST match the count of devices in the deviceList array!
5. deviceList[n1][n2]: You can add more devices to the end of the deviceList array by simply copying the last one and incrementing the n1 number. Devices added to the default configuration are available to all browsers and platforms as opposed to ones you add with the "Custom Device" option, which are only available to the specific browser in which you added them.

Ryuzine Web App Configuration

In the "js" folder you will find several scripts. These need to be loaded in the <head> section of your web page (you can see them in the sample "index.html" file). The only file you'll need to edit is the "ryuzine.config.js" file. This file is no longer optional!

The configuration file settings you will see include the following options:

mystyles = "thisissue" // Your custom stylesheet name for this issue.

The file name for your custom stylesheet, which is used by the "Views" button. The default is actually "blank" (no styles).

binding = "left" // Book Binding (Spine on Left or Right)

If you need to do so you can change this value to "right" (lowercase) and the page animations will act as if they are bound on the right-hand side instead of the left. This option was primarily included for the presentation of manga-style comic books, but is suitable for right-to-left reading languages as well (you'll need to adjust the text alignment in your stylesheet). The app will automatically select the correct "Ryuzine_leftbound" or "Ryuzine_rightbound" stylesheet regardless of which one is coded into the head of the HTML page.

fillpad = 0; // Fill iPad in App View (hidden controls)

This option lets you have slightly longer pages that completely fill the available height in both portrait and landscape view when the WebApp has been bookmarked to the home screen on an iPad (in which case no browser toolbars are visible) and you are using a theme that hides the WebApp controls. This option allows you to maximize the available space and present an extremely clean view uncluttered by interface elements. However, for other devices and themes which do not hide the controls be aware that part of the top and bottom of each page will be obscured (though this is usually not a problem since the top and bottom are typically the "header" and "footer" of the page which are generally margin space anyway). You will probably also want to change the stylesheet in your Ryuzine file from "ryuzine_leftbound.css" or "ryuzine_rightbound.css" to "ryuzine_leftbound_fill.css" or "ryuzine_rightbound_fill.css" respectively to avoid a momentary view of the no-fill stylesheet being visible to your readers.

zoomable = 0; // User Scale-able: 1= Yes | 0 = no
maxzoom = 5.0; // Maximum Zoom Amount

This is an option for touch-enabled devices regarding the ability of users to scale the content by double-tapping to zoom in and out on an element or to use the "pinch" and "spread" gestures to zoom in and out. This is the default behavior for such devices, but is not always desirable. The differences in the two behaviors is:

• Zooming Disabled: (WebApp default behavior) double-tapping, pinching, spreading, and dragging have no effect, the web app remains at one size and cannot be moved within the window. Users will also not be able to select or copy text or images from your magazine. This behavior is much more like a native mobile app than a web page. If you are using dynamic images optimized for various viewing sizes this may be the best zoom option for you.
• Zooming Enabled: (Device default behaivor) double-tapping on an element will center and zoom to it, double-tapping again will zoom back out. Grabbing non-scrolling elements can pan around in this zoomed mode. A small icon with a [+/-] appears in the upper right-hand corner and when tapped toggles "Pan & Zoom" mode (indicated by a red border) allowing a user to pinch/spread to zoom in and out and drag the page around without inadvertantly clicking on any links. In this mode users can also select and copy text and images from the pages of your magazine, just as they can from any web page. If you have content users may want to zoom (especially on small screen devices) this is probably the best zoom option for you.

If you enable user-selectable zooming for your Ryuzine magazine the meta tag will automatically be rewritten to make it work properly, you do not need to edit the HTML file. The "maxzoom" variable allows you to ajust the maximum allowed user-selectable zoom factor (5.0 is the default). Note: Enabling zooming can significantly slow down the responsiveness of the web app on some devices!

localization = 0; // 0 = no localization | 1 = localization
language = "en" // BSD language code
country = "US" // HTML country code

Unless you need to localize the user interface to another language you should leave it set to zero. The language and country codes are only used if localization is enabled. See Localization page for details on localization settings and on adding custom localizations.

pageshadow = 1 // Toggle Page Shadows
swapThemes = 0 // Swap Themes Based on Device
deskTheme = "" // Desktop theme
iOSTheme = "" // iOS Devices theme
andTheme="" // Android devices theme
tabTheme="" // Android tablet theme
wOSTheme="" // webOS device theme
bbtTheme="" // BlackBerry Tablet theme
wp7Theme="" // Windows Phone 7.5 theme

The page shadows are intended to give a more realistic 3D look without relying on the poorly supported CSS3 3D transforms. However if you are targeting older or lower-end systems with your Ryuzine magazine these shadows can still cause a performance hit to the page animations. Change the "pageshadow" variable to "0" (zero) to turn off the page shadow effect.

Themes are completely optional. If you don't either set one in the configuration file or code one into your HTML page the User Interface will use the default (plain) style. Ryuzine can automatically detect the type of device viewing the magazine and deliver different themes. If swapping is enabled and a device theme is left empty it will use the default theme if one is set in the HTML, otherwise it falls back to the plain un-themed style. If you set swapThemes = 1 but forgot to put the <link> tag for themes in the <head> of your HTML it will automatically add it but it adds it at the end of the <head> content, so any UI elements you changed in your "thisissue.css" file may be over-ridden by those in the theme. It is always better to put the <link> for themes in the HTML yourself, right after the UI one but before your issue-specific stylesheet. Some themes do not render properly in webOS, test before publishing.

There are significant differences in browser rendering and the User Interface between Android versions up to 2.3.x ("Gingerbread") and 3.x ("Honeycomb") and after. So much so you will probably want to deliver different themes to pre and post Honeycomb platforms. The "andTheme" is for any Android device running 2.3.x or earlier and the "tabTheme" is for any devices running 3.x and later.

Note: Theme switching will only target properly if the browser is not spoofing the User Agent String.

If you don't have a splashad set as well the "swapThemes" option will add a short (2 second) delay to the splash screen in order to apply the theme without giving readers a glimpse of the unthemed interface. If this is too long or short (more complex themes take longer to apply) simply set a duration with the "splashad" option in the configuration file.

AndApp = 1; // 0 = no | 1 = yes : Android "App View" (hides URL bar)

iOS devices have an option to bookmark websites to the home screen and, if they are coded to do so, run them like native mobile apps without the browser toolbars at the top and bottom of the screen. Android devices can also bookmark sites to the home screen, but does not honor the mobile app setting so the bookmarked page will open in the browser normally. One of the annoying things on Android, though, is that the URL address bar appears and disappears as you scroll up and down causing a page "resize" event. Ryuzine is coded to prevent this unwanted behavior and you can choose whether you would like your content to be displayed in "browser view" (set AndApp to zero) or if you would like to have it look more like a native application. If set to "1" (one) the URL bar will move out of view and your content will fill the entire window. The only way to get the URL bar back is to navigate away from the Ryuzine so carefully consider whether your users will want this feature. When set to zero the URL bar will be continuously displayed (this is similar to how it works on iOS devices in browser view). This feature does not work on some versions of Android, so do not rely on it.

APP ICON

When someone bookmarks your magazine in their web browser, or bookmarks it to their Home Screen on an iOS or Android device it will use the App Icon. Ryuzine uses one of three PNG image files for App Icons depending on the device (technically it could use just one and have it scaled, but this method prevents sending unnecessarily high-resolution icons to devices that can't use them). If you look in the "images" folder you will find the icon images. You can, of course, replace these generic App Icons with your own designs.

1. Favicon is 16x16 used by most browsers in address bar and bookmarks
2. Icon 1 is 114x114 pixels for Apple "Retina" displays
3. Icon 2 is 72x72 pixels for the iPad
4. Icon 3 is 57x57 and is for iPhone, iPod Touch, and Android devices. It is also scaled down for use as the "favicon" in Desktop browser bookmarks

ADVERTISING OPTIONS

The inclusion of revenue generating advertising in Ryuzine requires a "commercial license" so please consult the License information. In addition to placing ads within the pages you can also have banner ads and splash ads in your magazine.

bannerad = null; // null = no ads | 0 = persistent | any other value
// determines how often the ad appears

Banner ads appear in a box that drops in from the top and shows a clickable ad image overlay. If you don't have any ads just leave this as "null" and you'll never see the ad box. If you set it at zero the ad will be "persistent" (it will show until the reader closes it). Any other value is the interval in seconds you'd like the ad to show and also the amount of time in between showings. For example, if you set it to "60" then the ad would show for the first time one minute after the magazine had loaded, and would display for half a minute before retracting out of view. A minute later it would reappear for another 60 seconds. If your banners are using a rotator script that will operate independently from the display interval of the ad box.

splashad = 0; // 0 = no splash ad | value = number of seconds to display

When the Web App first loads it displays a "Splash Screen" while it is organizing everything in the background where you can't see it. Normally this screen disappears automatically as soon as the magazine is set up, but you can choose to delay it in order to display an advertisement on that screen.

boxad = 0; // 0 = no ad | value = number of seconds to display | non-number value = peristent ad

Another common ad method is to automatically show an ad overlay on the site when you first load the page. These types of ads are almost always in a lightbox, so Ryuzine offers a similar way to do this. Setting to zero disables it. Setting a numerical value gives the number of seconds to display the ad before it automatically closes. Setting it to anything in quotes (any non-numerical value) will set the ad to persistent - meaning it will display until the reader manually closes it.

IMPORTANT!

In order for readers to click on your ads while using Android or iOS (or any other touch-enabled device that understands ontouchstart, ontouchend, or ontouchmove) you need to include a special command in your link. If you do not include this command your ads will still be visibile but cannot be clicked on most phones and tablets! In some cases this may be the desireable state - for example ads placed in the body of a page probably should remain non-clickable or a user attempting to turn or scroll a page may accidentally click through on an ad. For Splash Ads, Box Ads, and the drop-in Banner Ads you most likely will want users to be able to follow those links. In order to do that just add the following code to your <a> link tag:

ontouchstart="RYU.restoreDefault(this);"

So your links would look something like this:

<a href="http://www.ryumaru.com/" ontouchstart="RYU.restoreDefault(this);">
<img src="images/ads/bannerad.jpg" alt="Visit Ryu Maru!" height="60" width="480" />
</a>

Default Bookmarks

var bmarkData = [[],[]];
bmarkData[0][0] = escape("Ryuzine User Forums");
bmarkData[0][1] = "http://www.ryumaru.com/forum/";

bmarkData[1][0] = escape("Ryu Maru Website");
bmarkData[1][1] = "http://www.ryumaru.com";

The new in-app Bookmark Manager Panel initially only has whatever default bookmarks you define here and you can have more than two if you like. To add additional Default Bookmarks add another comma and closed square brackets for var bmarkData. For example to add a third default bookmark it would read:

var bmarkData = [[],[],[]];

And then add to the end of the array like so:

bmarkData[2][0] = escape("My Custom Bookmark");
bmarkData[2][1] = "http://www.mysite.com"

Note that these bookmarks cannot be deleted by end users.

These are the IDs and Styles for which the Ryuzine Machine is looking. The "id" ones are for unique page items and the "class" ones are for multiple items. If you use a class instead of an ID for any of the unique items the Ryuzine Machine app will simply use the first one it finds and ignore the rest.

id="splash_title" - This is the title as it will appear on the Splash Screen that displays when the app starts. If you don't include it the script will use whatever text it finds between the <TITLE> tags in the <HEAD> of the page (that is the text that displays in the web browser's title bar). If you chose to set a "splash_title" it can be different from the title that displays in the browser's title bar. This title is also used in the footer of the pages next to the page numbers.

id="welcome_sign" - This is any formatted text or images you'd like to appear on the "table top" to the left of the closed magazine when viewing the front cover in landscape "two-page spread" view. This text will not be visible to legacy browsers, phones, or tablets in portrait orientation.

id="exit_sign" - This is any formatted text or images you'd like to appear on the "table top" to the right of the closed magazine when viewing the back cover in landscape "two-page spread" view. This text will not be visible to legacy browsers, phones, or tablets in portrait orientation.

id="social_widget" - You can include any social networking share widget code in a container tagged with this ID. If you omit such a container Ryuzine will automatically build a simple widget for sharing the URL via email.

id="copy_right" - Place your copyright notice in a container with this ID. It will be used on the Splash Page.

class="section_head" - use this for all page titles. If you omit it the script will automatically create a section head and Table of Contents entry that says "Page" and the page number.

class="page_box" - this is the class for each container that represents a page in your magazine. Since Ryuzine is supposed to be like leafing through a paper magazine you should have an even number of pages since sheets of paper have two sides. If you do not have an even number of pages, however, the script will automatically add a blank page and a section header.

class="dyn_img" - This is the preferred method for dynamically swapping out images for the various screen sizes. You also need to declare a unique ID for each of these. Then in your "thisissue.css" stylesheet you would target each one by name and adjust the size and background. Normally any image you place inside will be hidden, but you should place the lowest-resolution version inside, which will be available to browsers with CSS disabled and provide image data to accessibility browsers. The format looks like this:

<div id="p1-1" class="dyn_img">
<img src="images/gallery/small/sample.jpg" height="240" width="320" alt="Sample" />
</div>

The ID can be anything you want so long as it is unique. In this case I chose to use a naming convention of page number + image number (so this is the first image on page one). Then in my "thisissue.css" stylesheet I set it like this for each media query in which I want to swap it out:

#p1-1 {
height: 480px;
width: 320px;
background: url('../images/gallery/medium/sample.jpg') no-repeat;
}

#p1-1 img { /* If this is the only image that's being swapped out */
visibility: hidden;
}

If you are swapping out all the images you can just automatically hide all the images in the dyn_img containers (declare it before any of the IDs in your stylesheet):

.dyn_img img { visibility: hidden; }

It is recommended you use "visibility: hidden" rather than "display: none" so the page flow is unaffected. Also, if any of the images have image maps the will still work with the image = hidden but will not with diplay = none.

class="light_boxed" - if you have images you want to be turned into Lightbox Gallery features you each on in a container with this class. You should also include a second class of "port" or "land" to indicate the preferred orientation of the content as either "portrait" or "landscape" (if you omit the secondary class it will assume "land" is intended). Example:

<div class="light_boxed land">
<img src="images/mypic.jpg" />
<p class="caption">My Picture</p>
</div>

If you use straight <img> links the images will simply be resized at different screen sizes. You'll have to decide if you want to deliver a high quality images or low quality ones as the default, keeping in mind low resolution images will look pixelated and blurry when scaled up for desktop and high-res images scaled down for phone screens force them to load unnecessarily large images! Ideally you want to deliver the right image to each user, in which case you should use CSS dynamic images (see dyn_img section for details).

class="new_link" and class="lightbox_link t-x" - these two classes are used in conjunction within your page boxes wherever you want to create a link that will open the Lightbox content. Example:

<div class="new_link">
<a href="#mypic" class="lightbox_link t-0">
<img src="thumbnail0.jpg" alt="My Pic" /></a>
</div>

The "#mypic" is a simple in-page anchor and is only used by the simple page if the Ryuzine script doesn't run. This link is not preserved. The "lightbox_link" tells the script that this is a special kind of link that will open a Lightbox Gallery item, and the "t-0" tells it that the "target" is gallery item "zero" (which is the first item tagged with "light_boxed"). It is up to you to tell the script which link points to which gallery item since it is entirely possible the links may not be in the same order as the items they launch. It also assumes you are using a thumbnail image, though it is not actually required.

Ryuzine is ONLY interested in the content tagged with the aforementioned IDs and classes. Anything else you include will be ignored! If you want to provide an alternative or accessible version you can post this file to your site and direct those users to the simple page.

* The WYSIWYG text editor is not compatible with Mobile Safari on iOS devices and is therefore disabled. You can still manually code pages in the text entry box or load preformatted files for editing. The text fields can only be scrolled using two fingers (this is iOS default behavior). Also the source preview pane is not scrollable in split-editing view. On small screen devices you can zoom in and out to make working easier.

Options Button

The "Options" button opens a dialog with some configurable settings for the Ryuzine output file. Changing these settings is optional, but if you want to enable some of the advanced features and use add-ons you need to use this panel. Options are:

• Include HTML5 Cache Manifest: HTML5 includes an offline storage function which can reduce load times for future visits to the site. If you want to enable this function for browsers supporting it tick the checkbox.
• Natural Language: This is a two-letter country code which is a part of the HTML specification and should be included (code will not validate without it).
• Load Language Localizations: If you want the UI elements in another language tick this box to load the script. You will also need to make sure the "localization" folder is in your "addons" directory.
• Legacy Support for Internet Explorer 8: To make Ryuzine work in Internet Explorer 8 you must load the legacy support script and make sure the "legacy_ie" folder is in your "addons" directory.
• Load Rounded Corners Add-On: Two-page spreads in most modern browsers can show rounded page corners to better simulate an open book. Tick this box to load the stylesheet and then make sure the "rounded_corners" folder is in your "addons" directory.
• Issue Configuration File: "Default" will use the "ryuzine.config.js" file. However, since you can host multiple issues from one Ryuzine installation you may want to have a custom configuration file associated with each issue. If you select "Custom Configuration" a text entry box will appear in which you can type the custom configuration file name (include the file extension .js in the name).
• Custom Default Theme: The default theme is actually no theme. In some browsers you may see a glimpse of the un-themed UI before the theme is applied. To prevent this you can set the default theme to be the same as your custom theme. Make sure the theme's folder is in your "theme" directory.
• Issue-specific Styles: By default the magazine will use the "thisissue.css" file for issue-specific styling. If you want to use some other stylesheet or want to declare issue-specific styles in the HTML page choose here. If you are also using a configuration file you will need to set the same stylesheet file name there as well. You can also declare styles in the page itself, however those will be applied regardless of viewing mode so it is strongly recommended that you move those styles into an external stylesheet before uploading/distributing your publication.
• Custom Stylesheet: If you have a completely custom stylesheet enter the name here to load it in the <head> of the page (it will load after all Ryuzine stylesheets)
• Custom Script: If you need to include a custom script (for example some third-party services require including a script in the page) enter it here. The "Load Script" radio buttons let you choose whether the custom script loads BEFORE all other scripts, AFTER all other scripts, or is placed at the end of the <body> of the page.

Note that the configuration file can override some of these. Also, localization will not work without a configuration file because it needs to know what the language and country codes are. If you use in-page issue-specific styles they will ALWAYS be applied, even in alternative viewing modes. For this reason it is recommended that before distribution you move those styles into an external stylesheet.

WebAppify!

Regardless of how you've chosen to get content into the Editor the process of converting it into a Ryuzine file is the same: Press the "WebAppify!" button on the top right. You can do this multiple times while working on your magazine and it will just update the converted file, so you do not need to make everything perfect and then convert. You can convert and check your progress at any time.

Once you've converted the code the Editor will slide to the left and reveal the "Processed" file window.

1. To go back and work on your source file more press the "Source File" button to slide back.
2. "Ryuzine File" lets you load an already processed Ryuzine File just like you can load a Source File in the source editor. The drawback of doing this is you won't have a source file to go back to, you'll have to work directly with the code in the Processed File Code Window.
3. The Processed File Code Window. This is the actual code for your Ryuzine Magazine! You can select it all and copy and paste it into a plain text editor to save your file (more on that below).
4. If you used any custom styles in your source file they are ported to the CSS Window. You can copy and paste these into your "thisissue.css" stylesheet if necessary.
5. Go to Simular of Update checkbox. If you edit the code in the (3) Processed File Code Window and want to see the changes in the Simulator immediately after refreshing checking this box will take you to the Simulator Tab automatically. Otherwise it will just stay on the Editor Tab.
6. Update Simulation button will refresh the Simulator by reloading whatever code is in the Processed File Code Window.

Saving Your Ryuzine Files

Ryuzine Machine is built on Javascript technologies which unfortunately does not have any native way to save files directly. Instead you'll need to select, copy, and paste the code from the Ryuzine Machine code windows into a plain text editor (like TextEdit, Notepad, etc.) and save it with an .htm extension.

While you are working on a file it is nice to know how it will look in various mobile devices. The Ryuzine Machine has a "Device Simulator" built into it that give you a very general idea of how it will display without requiring you to contanstly save and upload a file, run an emulator, or own the actual device.

1. Drop-down list of available simulated devices
2. [+] button allows you to add custom device configurations of your own (currently cannot save them)
3. Rotate button changes the preview from Landscape to Portrait and back.
4. View Options
5. Simulator Options

The "App View" option shows you what your Ryuzine looks like in application view mode. This is available on iOS devices when a reader bookmarks your magazine to their Home Screen. There is a similar option available for some Android devices, but most will see your site in "Browser View."

The "Browser View" is how your Ryuzine will look in the device's web browser. This option adds bars to the screen representing the space consumed by browser controls, navigation bars, toolbars, and tab bars.

The "Screen Only" option removes the simulated device bezel and can help you better fit larger simulations in the Simulator window.

Note: If you are running Ryuzine Machine on a tablet or smartphone you will only be able to reposition the simulated device by dragging the bezel or dark gray background. Any touches in the "screen" area will be interpreted as interactions with the simulation itself.

Adding Custom Devices

To add a custom device profile press the [+] button and the "Add Custom Device" dialog will pop up. Give the device a name (this will appear in the drop-down list). Select whether the device is a Phone or a Tablet (you can also use "Tablet" for netbooks, laptops, and desktop simulations). Select the simulated operating system (presently your options are iOS, Android 2.x, or Android 3.x). When you click in the subsequent boxes it will use the Profile and OS settings to preload some suggested values. You can override these with your own if you wish. Do not leave any of them blank, enter a zero. Press the "Submit" button and the Device Name will become available at the end of the drop-down list. Select it to view the simulation in your custom device.

Note: The beta version of Ryuzine Machine cannot save custom device profiles and has no built-in method of deleting unwanted profiles from the list. To remove custom profiles created via the "Add Device" dialog you need to delete your web browser cookies for your development server URL.

Boomkark Can Equal Instant Subscription

If your current issue is always named "index.htm" (or "index.html" or "default.htm" depending on what file your web server considers the root document of a folder), when a reader bookmarks your site this will be the document served up to them each time they visit. If you always save your current issue with this name then readers who bookmarked your site will always get the latest issue when they visit.

Unlike an RSS Feed it doesn't push the new issue to your readers, they'd have to manually check the bookmarked URL in their browser - however you can ALSO use an RSS feed to inform your readers when a new issue is available if you like. To let your readers know if you have set up your Ryuzine magazines this way use the "FeedMark" icon with a link set to the rotating issue URL for your magazines and instruct your readers to simply drag the icon to their bookmarks bar or desktop. Drag and Drop, no fancy coding required! For mobile devices it alerts the reader to bookmark the page since the drag and drop functionality is blocked in iOS and Android. (Hint: Try it for yourself with the icon shown here, works in most desktop browsers)

Back Issues

You can have multiple issues of your Ryuzine magazine running from a single Ryuzine installation on your server! Simply rename your old issues to an archive file name. You will also have a different "thisissue.css" file for each issue, so you'll need to rename that as well and change the link in the header of the corresponding html file. If you use different configuration settings for different issues you can also copy the "ryuzine_config.js" file and rename it to correspond with the specific issue and, again, change the link to the file in the header of the html document.

So, for example, when your second issue is ready for upload you can go to your existing (first issue) "index.htm" file and change its name to "issue1.htm" and find these links in the header:

<link rel="stylesheet" type="text/css" href="css/thisissue.css" id="this_issue" />
<script type="text/javascript" src="js/ryuzine_config.js"></script>

and change them to something like this:

<link rel="stylesheet" type="text/css" href="issue1.css" />
<script type="text/javascript" src="js/issue1_config.js"></script>

Then change the names of the "thisissue.css" and "ryuzine.config.js" files as well. Upload your second issue as "index.htm" with it's own configuration script and "thisissue.css" file. If you repeat this process each time you release a new issue your readers can also have access to back issues archived in the same place and you do not need to maintain multiple installations of the Ryuzine software on your web server.

Image note: Unless you are using your live web server as a Development Server as well you do not need to upload the "ryu_dev" folder or the "ryuzinemachine.htm" file.

Problem:No momentum touch scrolling in pages.

Platform(s): iOS and Android

Cause: The web app was not coded with momentum scrolling (Note: that if zooming is enabled momentum scrolling DOES work for dragging the zoomed content around while in "Pan & Zoom" mode).

Solution: None. A future release may offer it.

Problem: There are display errors during 2D page turn animations.

Platform(s): Google Chrome 12 on both Mac and Windows

Cause: Unknown, appears to be a browser bug.

Solution: Wait for an update to the browser. This behavior was not seen in Chrome 10 or 11 and is not present in Chrome Canary 14.

Problem: There are display errors during 3D page turn animations.

Platform(s): Google Chrome <20 and Firefox 4+ on all Platforms,

Cause: 3D effects are still experimental and presently only work as intended in Safari

Solution: Wait for an update to the browser.

Problem: Default "Share" Widget can't find E-Mail program to send message.

Platform(s): All

Cause: Most likely an E-Mail Client (such as Apple Mail, Microsoft Outlook, Eudora, or Thunderbird) has not been configured on the system. If you use a "Web Mail" service like Yahoo, HotMail, GMail, etc., this feature will not work.

Solution: Most ISPs offer some kind of E-mail service which is compatible with E-Mail Client programs. You need to set one of these up to use the default "Share" Widget.

Problem: Occasionally the word "undefined" appears on top of my magazine.

Platform(s): All

Cause: You have enabled banner ads in your configuration file, but there is no banner ad.

Solution: Set the bannerad variable in the configuration file to zero.

Problem: When scrolling text areas in Ryuzine Machine the middle tab's layering pops forward and back as you scroll.

Platform(s): Safari 5.0.x

Cause: This is a bug in this version of the browser. It is normally seen when any Flash content is in the page, but it also can occur with IFRAME content.

Solution: There is no fix for this aside from either using Safari 4.x or Safari 5.1.x or another browser entirely.

Problem: Page fails to load due to galleryData error.

Platform(s): All

Cause: One of your gallery items is not an image. The javascript image swap outs only work if ALL your gallery items are images.

Solution: Remove the non-image gallery item(s) or switch to the CSS Dyanamic Image swap-out method instead.

Problem: In landscape mode with zooming enabled and zoomed in the page turn action turns to the wrong page.

Platform(s): iOS

Cause: The web app is misinterpreting the width of the screen as portrait because it is zoomed in.

Solution: Zoom back out and page turning will work properly in landscape mode.

Problem: In alternative View modes text spills out of pages if I resize the browser.

Platform(s): All

Cause: The height of the main body of the page is being set by javascript and does not update that height on resize.

Solution: Resize, reload web app, switch back into alternative viewing mode.

Problem: Button and panel backgrounds with gradients display offset or garbled.

Platform(s): webOS 3.0.4

Cause: A bug in the webOS Browser regarding CSS3 gradients.

Solution: In your configuratin file set either no theme or a theme without CSS3 gradients for the webOS platform.

Problem: Cannot swipe to turn pages or touch-scroll when "Zoom & Pan" is enabled in Options (even if zoom mode is not turned on!)

Platform(s): webOS

Cause: The webOS browser is intercepting the touch gestures rather than applying them to the page elements.

Solution: Turn "Zoom & Pan" off in the Options Panel (it is normally turned off in webOS by default)

Problem: Ryuzine Machine HTML Editor collapses so you can't see what you are typing.

Platform(s):BlackBerry Playbook

Cause: The editor textarea is sized dynamically and the keyboard forces it to collapse by shrinking the window height.

Solution: Try using the WYSIWYG editor with side panels turned off.

"OVR" automatically creates touch-enabled "Object VR" animations from a series of image files with no plugins or Flash required. You only need to place the first frame image in the page inside a container tagged with the class "vr" and the script does the rest. The animations can then be "rotated" either by mousing across them in a desktop browser or with a slider control on touchscreen devices.

The OVR animations can technically be placed anywhere in the Ryuzine, but (because the OVRs also have their own touch-enabled controller) they can conflict with Ryuzine's own touch support on mobile devices. To avoid touch conflicts you should ONLY place the OVR animations in the Lightbox gallery.

To enable OVR in Ryuzine Machine simply include an image tagged as an OVR and it will automatically include the necessary script and stylesheet links (and you need to make sure the "ovr" folder is in your "addons" directory). If you are manually editing a Ryuzine file you need to place the OVR scripts in the <head> of the HTML page:

<link rel="stylesheet" type="text/css" src="addons/ovr/ovr.css" / >
<script type="text/javascript" src="addons/ovr/ovr.swap.js" ></script>
<script type="text/javascript" src="addons/ovr/ovr.config.js" ></script>
<script type="text/javascript" src="addons/ovr/ovr.js" ></script>

The OVR images are ignored by the still-image Lightbox settings, so if you are using image optimization swap-outs on your OVR content as well it has to be handled differently. Instead of giving the still image "id" to each one, name them in the order they appear in the code as "vrPic0, vrPic1, vrPic2, etc."

Image Optimizations

In the ovr.swap.js file there are data options for TWO optimized images - one for mobile devices with small screens and one for desktop systems. Other than that it works exactly like the still image optimizations for the Lightbox gallery:

var ovrCount = 1; // Number of OVR Viewers (set to 0 to disable swap-outs) //
var ovrData = [];
if (ovrCount>0) {
for (var j=0; j<ovrCount; j++) {
ovrData[j] = [];}
ovrData[0][0] = "images/manual/small/box-vr_00.jpg"; // mobile
ovrData[0][1] = "images/manual/medium/box-vr_00.jpg"; // desktop
}

You should also be aware that, unlike still images, the OVR images will not scale correctly as the browser is resized. The page needs to be refreshed to fix the OVR display after resizing the browser. For that reason it is strongly recommended that you have one size for all mobile devices and another for all desktop sizes (this assumes nobody is going to be resizing their browser between phone screen and desktop screen sizes).

For full details on how to create OVR content and implement the script consult the OVR documentation.

Ryuzine Reader App Themes

Ryuzine uses a simple CSS file to theme the visual elements of the User Interface. You can radically change the look and feel of your magazine and provide customized versions targeting different devices - all from the very same Ryuzine file!

Where are the theme files?

Ryuzine does not ship with any themes preinstalled. You can either download and install one of the available themes at www.ryumaru.com or you can edit one of the files to create your own custom theme for your own use or to share with others. Just download, unzip, and drop it into the "theme" folder (and remember to upload it to your live site too).

Do I have to include a theme file?

No. The theme file is completely optional. It's just provided as an easy way to put all the UI visual settings in one convenient place and make it easy for users to share those settings with other publishers. However, without the theme file you will only see a very plain interface so it is recommended you at least use the included default theme file.

What goes into a theme file?

If you look at an existing theme file you'll probably notice that none of the styles have things like margins, height, width, font information, etc., it only has the following styles (for panels, toolbars, and buttons, not pages):

• background = can be a solid color, gradient color, or image

• border = can also set top, bottom, left, right; thickness and color

• border-radius = rounded corners, can be limited to top, bottom, left, right

• color = the color of any text inside the container

• opacity = whether something is transparent, semi-transparent, or opaque

• text-shadow = shadows cast by text (not supported by all browsers)

• box-shadow = shadows cast by containers (not supported by all browsers)

• CSS3 animations = these are applied to the panels and toggled with the panel_IN and panel_OUT styles for each panel.

There are also proprietary forms of most of these but what they all have in common is that they just set the color, transparency, edge, and lighting of the User Interface elements. The theme file is always named "theme.css" and put inside a folder with the name of the theme. Any images or fonts specific to your theme should also be bundled with it in that theme folder.

So where do I adjust the size or position of UI elements?

You can do that in a theme file since it loads after the default UI file anything you set in your theme will override the defaults.

Where do I change things like page size, fonts, margins, etc.?

That's the purpose of the "thisissue.css" file (or whatever you wish to name it). As the last of the stylesheets that is loaded it will "over-ride" any element settings that came before it. Every element you'd want to style is also tagged with a unique ID (for example "back0" and "margin-left5") that allows you to even style a specific button or box on a specific page.

Couldn't I just put all my "theme" color settings in my "thisissue.css" file?

YES! The theme file is optional, you don't have to include it at all. But even if you include a theme file and there is some specific part of it you want to change you could over-ride it in your "thisissue.css" file instead of editing the theme stylesheet, especially if it's just one or two small things you want to change. But it's up to you which file you use to determine your themes.

Can I still use themes if I am not using a configuration file?

YES! In the <head> tag just directly point the stylesheet element with the id="ui_theme" to your theme. You won't have the advantage of dynamic theme swapping, but if you only intended to use one theme for all users this is an option.

If I forget to put the themes stylesheet link in my HTML file can I still swap themes?

Yes. If theme swapping is enabled but there is no theme stylesheet element Ryuzine will automatically create one so the theme swapping will work. However, this auto-generated element is loaded AFTER all other stylesheets and could (depending on the theme) potentially over-ride some of your issue-specific styling.

Note: The more complicated the CSS for a theme is the more it may slow down the responsiveness of the web app as the browser "reflows" the page content. Try to keep complex styles to a minimum.

Ryuzine Machine Skins

"Ryuzine Machine" has the ability to "skin" the Simulator devices. It ships with several skinned devices already installed including iPhone 3gs, iPhone 4s, iPad, HTC Droid, Samsung GalaxyTab 7, 7.7, and 10.1, Samsung Focus S, and BlackBerry Playbook.

Adding New Devices

If the device you want to add has a Skin simply drop its folder into the "Skins" sub-folder under "ryu_dev" to make it accessible to Ryuzine Machine.

There are two ways to add new devices to Ryuzine Machine. The first (and easiest) is to use the [+] button on the Simulator workspace to open the "Add Custom Device" dialog. There you enter the parameters of the new device, including any "skin" file it may have. Add-on Skins should have the correct device parameter written in the comments at the top of the CSS file. You can also add devices that do not have skin files and the Simulator will simply work as it did in previous versions by providing a generic device bezel. Devices added this way are ONLY available to the specific browser in which they were added, and only persist in that browser so long as the cookie file is not deleted.

The second way to add a device is in the "machine.config.js" file by editing the "devices" and "deviceList" array. Devices added this way are available across all browsers and platforms and persist even if cookie files are deleted.

Creating Skins

Creating custom device skins is pretty easy if you have some skills with image editing. You will need a decent, undistorted image of the front of the device. Using a program like GIMP, Fireworks, or Photoshop crop the image down to just the device. Preferably you should set it against a transparent background and export as a PNG file, but this is not absolutely necessary (it just looks better). You will need two images, one in vertical orientation and one rotate 90 degrees to landscape orientation.

Scaling the image is the trickiest bit. You have to find out what the screen size of the device is, keeping in mind mobile devices use "device independent pixels" (or "dips") rather than the actual pixel dimensions of the screen. For example, an iPhone 4 has a 640x960 screen, but the rendering dimensions are the same as the iPhone 3gs (320x480). If you have the actual device you can load a media query test page to see what actual pixel dimensions Ryuzine will "see" and then add the height of any navbars, toolbars, or statusbars. If you do not have the device you may still be able to find the pixel density information in an Online Device Database or from the device manufacturer.

The easiest way to scale the device properly is to create a box with the correct dimensions at 72 dpi and overlay it on the device image in a new layer. Then scale the device image layer until the screen area on it matches the box on the layer above it. Trim away any extra space and save the image @ 72 dpi.

The last step is the skin CSS file. You can pull one from an existing skin to see how it works. Make sure to include the OS, Width, and Height (of the simulated screen) in the comments at the top of the file if you plan to share the skin with other people, so they'll know what settings to use in either the "Add Custome Device" dialog or when adding it to the "machine.config.js" file.

If you want to use a custom background image or color you can, but it is optional:

.simbox {
background: #808080 url('carbonfiber.jpg');
}

Change the following parameters to match your custom device:

.device_tablet_(port|land) for tablet devices or .device_phone_(port|land) for phone devices.

height: This is the height of the SKIN image, no screen height.

width: This is the width of the SKIN image, not screen width.

margin-top: negative (minus) of half the height of the skin image

margin-left: negative (minus) of half the width of the skin image

background: transparent url('(your_skin_image.png)') 0 0 no-repeat;

Under each is a sub-set with "#screen" which is the size and position of the simulated screen:

left: how far to push the screen box from the left and toward the right to align the left edge of the simulated screen with the left edge of the screen space on the device skin image

top: how far to push the screen box down to align the top of the simulated screen with the top of hte screen area on the skin image

width: the simulated screen width

height: the simulated screen height

Lastly, since the simulation can be displayed without the skin you need to make sure it will center properly in the Simulator box:

margin-top: negative (minus) half the height of the SCREEN

margin-left: negative (minus) half the width of the SCREEN

Then all you need to do is put all the images and the "skin.css" stylesheet in a folder, place it in your "ryu_dev" > "skins" folder, and use one of the two methods to add the device to the drop-down list. You can also zip the folder and share it with other Ryuzine Machine users.

RYUZINEâ„¢ DIGITAL MAGAZINE WEB APPLICATION

Software License and Distribution Agreement for "Ryuzine" Digital Magazine Web Application and "Ryuzine Machine" Authoring Application.

BY INSTALLING OR USING THE SOFTWARE PROGRAM, YOU CONSENT ON BEHALF OF YOURSELF AND ANY ENTITY YOU REPRESENT TO BE BOUND BY, AND BECOME A PARTY TO, THIS AGREEMENT AS THE "LICENSEE." IF YOU DO NOT AGREE TO ALL OF THE TERMS OF THIS AGREEMENT, YOU MUST NOT INSTALL OR USE THE SOFTWARE, AND YOU DO NOT BECOME A LICENSEE UNDER THIS AGREEMENT.

DEFINITIONS

"AUTHOR" refers collectively to Kristiana M. Hansen, duly appointed representatives, KMH Creative (www.kmhcreative.com), and Ryu Maru (www.ryumaru.com).

"DISTRIBUTORS" refers to KMH Creative (www.kmhcreative.com), Ryu Maru (www.ryumaru.com) and any other affiliates who may be added over time.

"PROPRIETARY RIGHTS" means any patent, copyright, trademark, service mark, trade secret, or other intellectual property or property right held by the Author.

"PUBLISHER" means an individual or entity who downloads the software to create or package Content in a digital format and accepts the terms of the license herein. "CONTENT" is defined as any digital text, images, scripts, audio, video or other materials which may be bundled into the Content Viewer and distributed to readers.

A "TITLE" is defined as any Content published on a periodic basis, even if infrequently, under the same Banner, Name, Heading, or Masthead. Examples of a Title would be a magazine, comic book series, newsletter, annual report, or a program booklet for a repeating event.

"AUTHORING TOOLS" refers to the "Ryuzine Machine" Software Product and components which can be used to create digital magazines.

"CONTENT VIEWER" refers to the "Ryuzine" Software Product used by the PUBLISHER to distribute digital content to readers.

"SOFTWARE PRODUCT" identified as "Ryuzine," which product includes computer software in the form of HTML, CSS, and collected Javascript code and may include associated media, images, printed materials, and "online" or electronic documentation. Use of some third party materials included in the software may be subject to other terms and conditions typically found in a separate license agreement, a read me file located with such materials or in the third party software notices and/or additional terms and conditions found at http://www.ryumaru.com.

"EFFECTIVE DATE" means the date the Software Product was downloaded and the terms of this Agreement were accepted by the Publisher, except for a Commercial License as stipulated hereunder.

GRANT OF LICENSE

Subject to the terms of this agreement, Author grants to Publisher a non-exclusive, non-transferable (except as permitted by this agreement) license under all applicable Proprietary Rights during the Term as follows:

AUTHORING TOOLS LICENSE. Publisher may use the Authoring Tools solely for the purpose of developing a Ryuzine magazine to be displayed using the Content Viewer. Publisher may not distribute the Authoring Tools to any third party. Publisher may sub-contract development to a third party using the Authoring Tools on the Publisher's behalf, provided that:

1. Publisher is responsible for ensuring that sub-contractor agrees to abide by and fully comply with the terms of this Agreement as such use of the Software applies on the same basis to Publisher
2. such use is only in relation to the Publisher's direct benefit and business as restricted by this Agreement
3. such use does not constitute nor represent a broadening of scope for the license provided by this Agreement
4. Publisher shall remain fully liable for any and all acts or omissions by the sub-contractor related to this Agreement.

CONTENT VIEWER LICENSE. Publisher may distribute the Content Viewer to Publisher's End Users (including but not limited to "Readers" and "Subscribers") and use any available methods to grant to Publisher's End Users the license to access online or download for offline use the Content Viewer for their personal use via an End User License Agreement (EULA), Terms of Service (TOS), or Terms of Use (TOU). Such license shall ensure that the Content Viewer is distributed to Publisher's End Users under an enforceable license agreement in favor of the Publisher, the Publisher's suppliers and distributors, and shall contain the following minimum license terms:

1. Prohibition against copying or further distribution
2. Prohibition against derivative works or modifications
3. Prohibition against decompiling, decoding, disassembling, reverse engineering, or otherwise attempting to derive the source code for the Software Product (except to the extent applicable laws specifically prohibit such restriction)
4. A provision indicating Publisher has licensed Software Product
5. A disclaimer of indirect, special, incidental, punitive, and consequential damages and
6. any other standard industry disclaimers as applicable, including but not limited to: disclaimer of all statutory warranties, to the full extent allowed by the law, a limitation of liability not to exceed the price of a Commercial License for the Content Viewer and/or a provision that the End User's sole remedy shall be a right of return and refund, if any, from the Publisher and not the Author of the Software Product.
7. Include a copy of the EULA, TOS, or TOU with Content Viewer download or a hyperlink to it online
8. Any additional restrictions or provisions as deemed necessary by the Publisher, provided such restrictions or provisions do not negate or conflict with the terms of this Agreement.

OBLIGATIONS AND RESTRICTIONS

Non-Commercial Use. Author grants a free, no-cost license to use the Authoring Tools and distribute Content with the Content Viewer to Publisher if Publisher meets the following conditions:
End Users are not being charged to access or download the Content Viewer
Publisher is not receiving revenue or compensation of monetary value for any of the Content presented with the Content Viewer via sponsorship, advertising, or other revenue generating means presented with or within the Content Viewer.
Content Viewer is not embedded in another document or application supported by advertising, requiring payment for access, or otherwise generating revenue.
Non-Profit corporate status does not determine whether use is non-commercial.

Commercial Use. Any use of the Software Product to create or present content which generates revenue, income, or compensation of monetary value of any kind by any means is considered "Commercial Use" under the terms of this Agreement. Commercial Use requires the purchase of a Commercial License as defined within the terms of this Agreement.

Terms of Use. Except with the Author's prior written consent or as otherwise expressly permitted in this Agreement, Licensee may NOT:

• modify or create any derivative works of the Software Product javascript code;
• decompile, decode, disassemble, reverse engineer, or otherwise attempt to derive the source code for the Product (except to the extent applicable laws specifically prohibit such restriction);
• encumber, sublicense, host or otherwise transfer rights to the Software Product.
• Remove or alter trademarks, copyright notices, logos, license files, or identifying information from the Software Product.
• Publish, upload, post or otherwise transmit any Content that is unlawful, harmful, threatening, abusive, harassing, tortious, defamatory, vulgar, obscene, libelous, homophobic, transphobic, invasive of another's privacy, hateful, or racially, ethnically or otherwise objectionable;
• Use the Software Product for "spam," "blast-faxes," "pop-ups" or any other abusive and annoying method to market or sell Content;
• Use the Software Product to interfere with the operation web sites or computers via the use of viruses, programs or technology designed to disrupt service or damage software or hardware;
• Employ a robot, spider or other process or device in the Software Product to clandestinely harvest e-mail addresses or other User information or to monitor the activity on a web site;
• Impersonate another person or entity or to forge any communication or message; or
  Transmit or post Content that pretends to be from some other source than the Publisher.
• remove, modify or alter any copyright or trademark notice from any part of the Software Product, including but not limited to any such notices contained in the physical and/or electronic media or documentation, in code or other embodiments originally contained in or dynamically or otherwise created by the Software Product.

Use of Publisher's Name. The Software Product Author, duly appointed representative, or Distributor may, at its sole discretion, list Publisher's name on the KMH Creative (www.kmhcreative.com) or Ryu Maru (www.ryumaru.com) web site as a licensee of the Software Product for the purposes of marketing and promotion of the Software Product.

Installation. This Software Product does not require a typical software installation. It works in conjunction with an existing installation of a compatible web browser and web server software. Some pages and scripts utilized by the software program may be copied and retained in your web browser's cache file or stored (temporarily) in the memory of your computer. This Agreement applies to a single Publisher's Title. Multiple issues of a single Title can use a single installation of the Software Product.

Upgrades. If the Software Product is labeled or otherwise identified as an "upgrade", you must be properly licensed to use a product identified as being eligible for the upgrade in order to use the software product. A Software Product labeled or otherwise identified as an upgrade replaces and/or supplements the product that formed the basis for your eligibility for such upgrade. You may use the resulting upgraded product only in accordance with the terms of this Agreement. If the Software Product is an upgrade of a component of a package of software programs that you licensed as a single product, the Software Product may be used and transferred only as part of that single product package and may not be separated for use on more than one computer or web host.

Governing Law. If you acquired or use this Software Product in the United States, this Agreement is governed by the laws of the State of Minnesota. If this Software Product was acquired or accessed outside of the United States, the end user agrees that the Federal Laws of the United States of America and of the State of Minnesota shall be applied. Questions or other contact should be directed to this email address: info@ryumaru.com.

COMMERCIAL LICENSE

Any use of the Software Product to create content which generates revenue or income by any means is considered "Commercial Use" and requires the purchase of a non-refundable, non-transferable, per-title Commercial License from Author hereafter referred to as the "LICENSE FEE." Each Publisher's Title which generates such revenue shall require purchase of a separate Commercial License. The Effective Date of a Commercial License begins when all required information has been provided and payment has cleared. A confirmation e-mail/receipt will be sent to the Licensee indicating the exact Effective Date the Commercial License was put in force. Regarding the Commercial License the Author shall:

1. Publicly publish the amount for the Commercial License Fee to a Distributor web site
2. Provide information on accepted methods of payment
3. Define what information shall be required from Publisher such that the Author, duly appointed representatives, or Distributors can reasonably determine who the Publisher is and whether Publisher's use is authorized under this Agreement. Required information shall include, but is not necessarily limited to, Publisher's e-mail address or other contact information, unique identifier such as individual or entity name, and Host URL where the Publisher's content will be made available to Publisher's End Users.

Upon completion of the License Fee transaction and provision of all required information the Commercial License shall authorize the Publisher to:

1. Place revenue generating advertisements in the Content Viewer with no claims made by the Author against such income beyond the aforementioned License Fee
2. Place the Content Viewer behind a "Pay Wall" with no claims made by the Author against revenue collected from such a scheme beyond the aforementioned License Fee.
3. Sell downloads of or distribute on physical media copies of the Publishers Content with the Content Viewer for offline use with no claims made by the Author against any revenue collected from such distribution beyond the aforementioned License Fee.
4. Embed the Content Viewer in another web page or application which is supported by advertising revenues, sponsorship, or sold to Publisher's End Users with no claims made by Author against such revenue collection beyond the aforementioned License Fee.

TERMINATION OF LICENSE

Without prejudice to any of the Author's other rights, the Author (or duly appointed representatives) may terminate this Agreement if you fail to comply with the terms and conditions of the License. Author reserves the right to terminate this Agreement over any content or use deemed inappropriate or illegal, or offensive, or potentially or actually harmful in any respect, or negatively affects the Author, Distributor, or Software Product. In such event, you must destroy all copies of the Software Product and all of its component parts in your possession and agree to cease any and all access of the hosted application and related web sites.

PRIVACY PROVISION

No personal information is collected nor transmitted by the Software Product. Any cookie files, cache files, or data storage are written to your computer and are not normally accessed by any application other than your web browser or by any HTML page other than those associated with this Software Product. No guarantee is made that such data cannot be intercepted, accessed, or transmitted by third party application, computer virus, worm, or other unauthorized access to your computer. The Author and Distributor(s) of this software product do not collect nor transmit any personal or identifying information via this Software Product. If you choose to provide information voluntarily it will not be shared with any third parties without your express, written permission to do so. if you access the Software Product online certain data about your usage may be logged and tracked by either the Distributor or the web host owning/operating the server on which the Software Product is accessed. This information is usually limited to your IP address but may log more detailed session data. The Author will not share any data collected by the Author with any third parties. Individual Distributor(s), or web host(s) may have their own terms of service or privacy provisions.

WORKS CREATED OR DISTRIBUTED WITH SOFTWARE PRODUCT

The Authoring Tools were designed for Publishers to produce digital Content in the Ryuzine format and distribute it to the Publisher's End Users with the Content Viewer portion of the Software Product. No claims are made by the Author, Distributor(s), web host(s), or other authorized representative(s) against the intellectual property rights of any artistic work licensee(s) might create or utilize this Software Product to create, distribute, or display. The Author, Distributor(s), web host(s), or other authorized representative(s) will not be held liable for any losses or litigation resulting from artistic works created, used, included, contained, distributed in whole or in part, with this Software Product. Publishers using this Software Product are responsible for securing the intellectual property rights, licenses, or other authorization for the Content used by the Authoring Tools or in the Content Viewer.

GENERAL PROVISIONS

If any part of this agreement is found void and unenforceable, it will not affect the validity of the balance of this agreement, which shall remain valid and enforceable according to its terms. This agreement shall not prejudice the statutory rights of any party dealing as a consumer. This agreement may only be modified by a writing signed by the Author. Updates may be licensed to Publisher by Author with additional or different terms. This is the entire agreement between Author and Publisher relating to the Software Product and it supersedes any prior representations, discussions, undertakings, communications or advertising relating to the Software Product.

PROPRIETARY RIGHTS

Author claims the "Ryuzine" name and Ryuzine Logo as Trademarks and claims exclusive worldwide Copyright on the code and designs used by the Software Product. Copyrighted and Trademarked material may not be used outside of the terms of this Agreement without express written permission. There are usage guidelines for the Ryuzine name and logo specified at www.ryumaru.com.

NO WARRANTY

The Software Product, is being delivered to Publisher AS IS and with ALL FAULTS. AUTHOR AND AUTHORIZED DISTRIBUTORS DO NOT AND CANNOT WARRANT THE PERFORMANCE OR RESULTS PUBLISHER MAY OBTAIN BY USING THE SOFTWARE. EXCEPT FOR ANY WARRANTY, CONDITION, REPRESENTATION OR TERM THAT CANNOT OR MAY NOT BE EXCLUDED OR LIMITED BY LAW APPLICABLE TO PUBLISHER IN PUBLISHER'S JURISDICTION, AUTHOR AND AUTHORIZED DISTRIBUTORS MAKE NO WARRANTIES CONDITIONS, REPRESENTATIONS, OR TERMS (EXPRESS OR IMPLIED WHETHER BY STATUTE, COMMON LAW, CUSTOM, USAGE OR OTHERWISE) AS TO ANY MATTER INCLUDING WITHOUT LIMITATION NONINFRINGEMENT OF THIRD PARTY RIGHTS, MERCHANTABILITY, INTEGRATION, SATISFACTORY QUALITY, OR FITNESS FOR ANY PARTICULAR PURPOSE. PUBLISHERMAY HAVE STATUTORY WARRANTY RIGHTS UNDER LAW IN PUBLISHER'S JURISIDCTION THAT MAY NOT BE DISCLAIMED BY AUTHOR.

The foregoing exclusions and limitations will apply to the maximum extent permitted by applicable law, even if any remedy fails its essential purpose. The provisions of the Warranty and Liability sections of this Agreement shall survive the termination of this Agreement, however caused, but this shall not imply or create any continued right for Publisher to use the Software Product after termination of this agreement.

LIMITATION OF LIABILITY.

IN NO EVENT WILL THE AUTHOR OR DISTRIBUTORS BE LIABLE TO PUBLISHER FOR ANY DAMAGES, CLAIMS OR COSTS WHATSOEVER ARISING FROM THIS AGREEMENT AND/OR PUBLISHER'S USE OF THE Software Product, INCLUDING WITHOUT LIMITATION ANY CONSEQUENTIAL, INDIRECT, INCIDENTAL DAMAGES, OR ANY LOST PROFITS OR LOST SAVINGS, EVEN IF THE AUTHOR, AUTHOR'S REPRESENTATIVE, OR DISTRIBUTOR HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH LOSS, DAMAGES, COSTS, OR CLAIMS. THE FOREGOING LIMITATIONS AND EXCLUSIONS APPLY TO THE EXTENT PERMITTED BY APPLICABLE LAW IN PUBLISHER'S JURISDICTION. IN ANY EVENT, AUTHOR'S AGGREGATE LIABILITY AND THAT OF AUTHOR'S DISTRIBUTORS OR DULY APPOINTED REPRESENTATIVES UNDER OR IN CONNECTION WITH THIS AGREEMENT SHALL BE LIMITED TO FIFTY U.S. DOLLARS ($50.00).

Nothing contained in this Agreement limits Author's liability to Publisher in the event of death or personal injury resulting from Author's negligence or for the tort of deceit (fraud). Author is acting on behalf of Author's Suppliers, Distributors, and duly appointed representatives for the purpose of disclaiming, excluding and/or limiting obligations, warranties and liability as provided in this agreement, but in no other respects and for no other purpose.