Cropforge for ICIS
From ICISWiki
Contents |
Cropforge from GForge
This is a documentation of the new Cropforge for ICIS Communication
Background
"CropForge is a collaborative software development site, providing tools and a centralized workspace for developers to control and manage software development. "
Figure1. Old repository (CropForge)
"GForge CE (Community Edition) is completely rebuilt to make a modern, extensible platform with an intuitive interface that ties together a huge toolset, from Source Code Management (SCM) to extremely customizable Trackers, Task Managers, Document Managers, Forums, Mailing Lists. All of these are controlled by a centralized permission system and maintained automatically by the system." http://gforge.org/gf/
Figure2. Original GForge Design
A new CropForge will be released making use of new utilities provided by GForge.
Figure 3. New repository (New CROPFORGE) based on the new GForge CE design
Changes made
changes were made in order to make the new GForge design look more like the old CropForge (which ultimately changed into something that is altogether different from both)
There are two files modified for the design:
GFTheme.css
GFTheme.css (Cascading Style Sheet Document) contains the actual design for the page. Any changes made is explained by enclosed in /*comment*/ . To view the document better, it is advised for the users to use Notepad++ and Change the style to Deep Black.
"Notepad++ is a free (as in "free speech" and also as in "free beer") source code editor and Notepad replacement that supports several languages. Running in the MS Windows environment, its use is governed by GPL License." http://notepad-plus-plus.org/
How to change the style in Notepad++:
(assuming you have already downloaded and installed Notepad++)
- On the menu tab Click on Settings-> Style Configurator
2. Select Deep Black in the Select theme: drop down menu and click the Save & Close button
This will change the background to deep black and since comments are expressed in lime green colored fonts it will be easily seen.
In GFTheme.css, the actual code is the current code as written in the server. The commented code
background: #ffffff;
added:
color: #000; */
Is referring to the original code
Any commented code not preceded by the words ‘changed’ or ‘added’ are comments created before the changes were implemented by this author.
Images of the Tabs in the header of the webpage were completely altered to accommodate the design and the size of the new logo. Detected an error in the Administrator’s page since image was too small to accommodate the extra utilities an administrator can use.
GFTheme.php
In GFTheme.php (Hypertext Preprocessor Document), very few changes were made. All of it had to do with images since the functionalities were already taken care of.
The GForge logo at the bottom of each page was replaced by a simple link Powered by GForge.
| Old | New |
| <a href=”http://gforge.org/”> <img src=”/themes/<?php echo $this->getName();?>/images/gforge-ee-logo.large.png” height= “43” width=”130” alt= “Powered by GForge® Collaborative Development Environment” border= “0”> </a>
| <a href=”http://gforge.org/”> Powered by GForge </a> |
 |  |
| Old | New |
|
help_off, help_on, quickjump_off, quickjump_on, searchbyid_off, searchbyid_on (left to right).gif |
help_off2, help_on2, quickjump_off2, quickjump_on2, searchbyid_off2, searchbyid_on2 (left to right).jpg |
Applying changes
- Download SSH http://www.colorado.edu/its/docs/authenticate/printouts/win_ssh.html for transferring files
There are two ways to do this using SSH
- Change the file directly using nano (an editor)
- Extract file ,modify (Any editor ed Notepad++),put it back (overwrite existing file)
Changing the file directly using nano (an editor)
- use cd command to go to the folder/directory where the file is located (eg cd </folder/folder/>)
- (You don't have to do this) use ls to list the contents of the current folder/directory
- Create a backup copy usingsudo cp command
- type 'sudo nano <filename'>'
- edit
- press (CTRL + O) to save or (CTRL + G) for help
Extract file ,modify (Any editor ed Notepad++),put it back (overwrite existing file)
- use cd command to go to the folder/directory where the file is located (eg cd </folder/folder/>)
- (You don't have to do this) use ls to list the contents of the current folder/directory
- Create a backup copy using cp command
- use cp to copy the file you wish to modify into the home/<username>/
- open/refresh(F5) the file File Transfer Window. If instruction 4 was done successfully you should be able to see the file on the right frame of the window
- drag that into the left partition, preferably into the location you wish (eg document folder)
- Then your computer can access the file using any editor you wish (just use Notepad++. its easier)
- save any changes and open/refresh(F5) the File Transfer Window
- drag the file from the left partition (location of file) to the right partition (home/<username>/)
- use sudo cp to copy the file into its location
Changing the CSS code
If the author wishes to make any changes in the code,
- (Always) Create a backup copy of the code
- Understand the html code of the page you are currently viewing and take note of the id’s and classes of the tags (Author is expected to understand html code)
- Once you know the id and/or class of your tag , you can then search for it in the SSH nano using the ‘Where is’ command (CTRL + W) or in the Notepad++ using the ‘Find’ command (CTRL + F).
Remember: id-> # and class->.
Make sure that you are modifying the right tag, classes can be used more than once. Sometimes nested designs can be confusing.
Changing the PHP code
To begin with, the php code does not need that much change as far as the functionalities are concerned. They work. Whether or not they are all needed or there are other functionalities needed but not supported by GForge was not considered as of yet.
The GFTheme.php was modified because images needed to be removed or changed. There was no modification done on the actual fuctions (inner workings/server side).
It is advised that the author should know what they need to do and how to do it taking note of the changes they chose to implement.
Changing the content
by content we pertain to the words, links, images, etc seen in the actual webpage
Document Type Definition (DTD). --doctype declaration
Definition and Usage
The doctype declaration should be the very first thing in an HTML document, before the <html> tag.
The doctype declaration is not an HTML tag; it is an instruction to the web browser about what version of the markup language the page is written in.
The doctype declaration refers to a Document Type Definition (DTD). The DTD specifies the rules for the markup language, so that the browsers render the content correctly.
http://www.w3schools.com/tags/tag_doctype.asp
The Doctype declaration in the new CROPFORGE is specified as Strict.
"This DTD contains all HTML elements and attributes, but does NOT INCLUDE presentational or deprecated elements (like font). Framesets are not allowed." http://www.w3schools.com/tags/tag_DOCTYPE.asp
From the name itself, it has specific rules that if not followed may cause errors in the rendering of the page in different browsers as shown below. Detected errors in IE and safari rendering due to align attribute attached to the image tag.
Changes in the HTML code should be in accordance with the rules of the document type definition.
Brief Introduction to the new CropForge Repository (Users' HowTo)
The following links are videos that serve as an introduction to using the New CropForge Repository
(At the bottom of the video is a seek bar and controls)
How to use the new Cropforge
1. Go to http://cropforge.irri.org
2. The new Cropforge is a new installation therefore you cannot use your old login account. Please register a new account in the new Cropforge, click [Register new account]; fill-up the information; make sure you click the [Submit] button at the end of the form; wait for the administrator for the approval of your new account. For more details, please view this videos: How to Register New Account
