Posted: Wed May 30, 2007 3:57 pm
@d11, can you have a look now and see if the bolding did anything for you?
A community of PHP developers offering assistance, advice, discussion, and friendship.
http://forums.devnetwork.net/
PerfectEverah wrote:@d11, can you have a look now and see if the bolding did anything for you?
Or two, the active one, and the next one that the opened. (Takes more programming, but it's worth it to the user... They don't care how much you work :-p)ole wrote:[*]In the navigation tree I think it would be more user friendly is only one branch was expanded at a time. This avoids, overloading the user with too many options and the need to close branches.
Lol. What about the highlighting syntax here?ole wrote:[*]The markup generated by the PHP syntax highlighting is fugly. I'm not sure how important it is but I just thought I'd point it out.
[/list]
Code: Select all
// Does this syntax suck?
private function Hola($i)
{
switch($i)
{
case 'Awesome':
echo 'Hola Mundo';
break;
default:
echo 'Default is bolded!';
}
return;
}I support coding to the standard. If IE7 handles standards, then the users should have no problem. In all actuality, I did hack this quite a bit to make it IE6 compatible. I am just not going to mess with little things like fixing positional elements requiring a border to render properly, or IE handling if fieldset background colors that extend to the top of the legend element. For the most part, however, the site will work just fine in IE (6) if you can live with the minute details that I really don't want to fix.ole wrote:Nice one Everah! Really nice.
Couple of things:
- Not supporting IE: I understand your principles, but you are just being a bit lazy really. You should at least support IE 7?
- In places you made fall short of the W3C's colour contrast standards. There's an extension you can get for FireFox that will tell you where you do. I can give you the link when I'm at work if you like/care.
- In the navigation tree I think it would be more user friendly is only one branch was expanded at a time. This avoids, overloading the user with too many options and the need to close branches.
- The markup generated by the PHP syntax highlighting is fugly. I'm not sure how important it is but I just thought I'd point it out.
Ultimately the syntax highlighting will be handled by the application. The settings will be configurable, and I may go with a lower level color base to make it a little easier on the eyes. At the moment the colors are PHP's core highlight_string() colors as taken from a vanilla php install.superdezign wrote:Lol. What about the highlighting syntax here?
Hehe he. OK cool man.I support coding to the standard. If IE7 handles standards, then the users should have no problem. In all actuality, I did hack this quite a bit to make it IE6 compatible.
OK I'll try and remember to dig it out tomorrow.As for the color contrast... you can send me the link. There are no guarantees that I'll change the colors (it took a little while to find just the right light version of the already lighter colors I am using).
Thinking about it, your navigation doesn't have any of the problems that tree structures do, before there is no nesting and open/close action is easy to perform. I think my preference and yours are just that, preferences.But I thought would limit the user experience a bit in forcing a user to choose which section they want to see. If it were me, and I wanted to see the entire tree, if the thing kept closing my sections, I'd leave. But that is me.
Nothing wrong with the visual output just the markup itself. This is just a fraction of itCan you throw out a screen shot of the syntax highlighting.
Code: Select all
<br /> * @return boolean True if all criteria is met, false otherwise
<br /> */
<br /></span><span style="color: #007700">function </span><span style="color: #0000BB">is_value_set</span><span style="color: #007700">(</span><span style="color: #0000BB">$required</span><span style="color: #007700">, </span><span style="color: #0000BB">$checkthis</span><span style="color: #007700">, </span><span style="color: #0000BB">$requireall </span><span style="color: #007700">= </span><span style="color: #0000BB">false</span><span style="color: #007700">)
<br />{
<br /> </span><span style="color: #FF8000">// If the index or array to check are empty, return false
<br /> </span><span style="color: #007700">if (empty(</span><span style="color: #0000BB">$required</span><span style="color: #007700">) || empty(</span><span style="color: #0000BB">$checkthis</span><span style="color: #007700">))
<br /> {
<br /> return </span><span style="color: #0000BB">false</span><span style="color: #007700">;
<br /> }
<br />
<br /> </span><span style="color: #FF8000">// If the required value to check is a string or number
<br /> </span><span style="color: #007700">if (</span><span style="color: #0000BB">is_string</span><span style="color: #007700">(</span><span style="color: #0000BB">$required</span><span style="color: #007700">) || </span><span style="color: #0000BB">is_numeric</span><span style="color: #007700">(</span><span style="color: #0000BB">$required</span><span style="color: #007700">))I believe QuirksMode allows users to select whether or not they want more than one menu open at a time. It's done through a cookie.ole wrote:Not everybody is as confident with these are we like to think. We are very used to the concept of tree structures but many are not. Novices leave all there documents in a single folder and like to avoid compartmentalization for fear of the inability to find their way in and out of the many doors involved.
Code: Select all
<?php
// static number variable
$cnum = 0;
class highlighter {
var $code; // code to highlight
var $adjust; // add <?php if needed?
var $line_numbers; // show linenumbers?
var $highlight_method; // highlight_string / highlight_file
var $title; // title for code
var $isphp; // php or other code?
############## HIGHLIGHTER - initiation
function highlighter ($br = false, $method = 'highlight_string') {
$this->highlight_method = $method;
// set defaults
$this->adjust = true;
$this->line_numbers = true;
$this->title = "PHP Code";
$this->isphp = true;
}
############## SET_CONFIG - set configuration
function set_config ($property, $value) {
if (isset ($this->$property)) {
$this->$property = $value;
// if $isphp is changed
if ($property == 'isphp' && $value == false && $this->title == "PHP Code") $this->title = 'Code';
return true;
} else {
return false;
}
}
############## SET_CODE - sets the code to highlight
function set ($code) {
// trim the code from newlines, delete linebreaks anddecode special characters into real code
$this->code = html_entity_decode (str_replace ('<br />', '', trim ($code, "\r\n \n")));
}
############## CLEAR - empty code
function clear () {
$this->code = '';
}
############## MAKE_CSS - create html/css code
function make_css ($code) {
if (PHP_VERSION >= 5) { // PHP 5 highlighting
$code = preg_replace (
'{([\w_]+)(\s*</span>)'.
'(\s*<span\s+style="color: '.ini_get ('highlight.keyword').'">\s*\()}m',
"<a class='function' rel='ext' href='http://www.php.net/$1'>$1</a>$2$3",
$code);
} else { // old highlighting
$code = preg_replace (
'{([\w_]+)(\s*</font>)'.
'(\s*<font\s+color="'.ini_get ('highlight.keyword').'">\s*\()}m',
"<a class='function' rel='ext' href='http://www.php.net/$1'>$1</a>$2$3",
$code);
}
$colors[ini_get ('highlight.bg')] = 'background';
$colors[ini_get ('highlight.comment')] = 'comment';
$colors[ini_get ('highlight.default')] = 'default';
$colors[ini_get ('highlight.html')] = 'html';
$colors[ini_get ('highlight.keyword')] = 'keyword';
$colors[ini_get ('highlight.string')] = 'string';
foreach ($colors as $color=>$class) {
$code = str_replace ('<span style="color: '.$color.'">', "<span class='$class'>", $code); // PHP 5 highlighting
$code = str_replace ('<font color="'.$color.'">', "<span class='$class'>", $code); // old highlighting
}
return str_replace ('</font>', '</span>', $code);
}
############## PROCESS - processes code and creates output
function process () {
global $cnum;
$code = $this->code;
$hlfunc = $this->highlight_method;
if ($this->isphp) { // highlight if php
if ($this->adjust && !strstr ($code, '<?php') && !strstr ($code, '<?')) { // add php-tags {
if (strpos ($code, "\r\n") === 0) $code = "<?php".$code."\r\n?>";
else $code = "<?php\r\n".$code."\r\n?>";
} // } add php-tags
$code = $hlfunc ($code, true);
$code = $this->make_css ($code);
$lines = count (explode ('<br />', $code));
$output = @file_get_contents ('tpl/php.tpl');
} else { // not php
$code = "<span class='keyword'>".nl2br (htmlentities ($code))."</span>";
$code = str_replace (' ', ' ', $code); // 2 spaces > 1 space + 1 nbsp
$code = str_replace (chr(9), ' ', $code); // Tab > 4 spaces
$lines = count (explode ('<br />', $code));
$output = @file_get_contents ('tpl/code.tpl');
}
for ($i = 1; $i < ($lines + 1); $i++) {
if($this->line_numbers) {
$rownumbers .= "$i<br />";
}
}
// convert brackets to entities to prevent formatting
$code = str_replace (chr(91), '[', $code); // [
$code = str_replace (chr(93), ']', $code); // ]
$cnum++; // increase the current number for box id
#### turn template into output
$output = str_replace ('{%title%}', $this->title, $output); // title
$output = str_replace ('{%rownumbers%}', $rownumbers, $output); // rownumbers
$output = str_replace ('{%code%}', $code, $output); // actual code
$output = str_replace ('{%numlines%}', $lines, $output); // number of lines
$output = str_replace ('{%id%}', $cnum, $output); // number of lines
return $output;
}
}Code: Select all
$(function(){
$('.tree-navigation li').click(function(){
$(this).toggleClass("branch-closed").toggleClass("branch-open").focus();
});
$('.tree-navigation ul').click(function(){
return false;
});
});Well, I think that, per section, he assigns the "closed" and "open" class to the appropriate menus so that users without JavaScript only see the current section. This also makes it so that users with browsers that read aloud to them do read every single menu item every time.Kieran Huggins wrote:In fact, I'd even add a piece in there to do the initial hiding to make it non-javascript friendly!