How to customise Error Page ?

[sanjoydesk]

Hi,
I seems tracy has all cool features as I am looking for, but i would like to know how can I customise error template page, I am trying to integrate with my latest project Cygnite Framework , I would like to display few information about Cygnite Framework in the Error page.

Is it possible i can overwrite the error page, change design, color schema, project name and version etc.

Any response would be highly appreciated.

Thanks,
Sanjoy

[fprochazka]

@Sanjoy87 The error page that Tracy renders on fatal error or uncatched exception is only a last resort. Therefore it is as simple as possible and you cannot customize it.

You should do something similar to this

Tracy\Debugger::enable();

try {
    $myApplication->run();

} catch (\Exception $e) {
    if ( ! Tracy\Debugger::$productionMode) {
        throw $e;
    }

    Tracy\Debugger::log($e, 'error');
    $myApplication->renderErrorPage($e);
}

this should allow you to

• always log exceptions in production mode
• render your own custom pages
• in development mode the bluescreen will render immediately without the need to check logs

[hrach]

@fprochazka if I understood it correctly, @Sanjoy87 was talking about blue-screen.

[fprochazka]

Oh, in that case, there are bluescreen panels that you can use for adding information.

For example rendering of SQL that caused the exception, used like this:

Nette\Diagnostics\Debugger::getBlueScreen()
    ->addPanel('Nette\Bridges\DatabaseTracy\ConnectionPanel::renderException');

But there is no way to customize bluescreen design at this point.

[JanTvrdik]

@Sanjoy87 This is how Nette Framework customizes Tracy for itself: https://github.com/dg/nette/blob/506b1e6e3470f31caa1e923528bcd1750e18b392/Nette/Bridges/Framework/TracyBridge.php

[sanjoydesk]

Thanks @fprochazka @hrach @JanTvrdik all of you for quick response. Tracy is really awesome project so far.

I can see we can do some small changes with blue screen object. Tracy is standalone component. In this case it should be more flexible to customize (Development mode) according to the project though it has various features in it.

No idea how much my comments are valid for this project but i found few features can be added.

For example -

In the right side bottom of the exception page it shows _"Tracy - Nette Framework"_. So if tracy integrated with any other framework or project then it should not display "Nette Framework".

Using blue screen object allow us to add panel to the exception page, but panel displays two times, first one top as top panel next one after Call Stack, what if developer require only the first panel ?
If we add html tag to first panel title it simply displaying it into the browser.

 $blueScreen->addPanel(function($e) {
     return array(
     'tab' => '<h1>My Framework </h1> ', // instead of My Framework
     'panel' => '<h1> <span style="color:blue">My Framework </span> </h1>'// Works
     );
 });

It will be really great if you please add feature to customise template with external stylesheet.

Why it is requiring all files inside tracy.php[https://github.com/nette/tracy/blob/master/src/tracy.php]? Since tracy is composer powered, everything can be autoloaded right. So that it will look much better.

Hope it helps.

Thanks

[JanTvrdik]

it shows "Tracy - Nette Framework".

You mean the tiny text in Tracy logo? That's unlikely to change.

what if developer require only the first panel?

That's that the parameter $e is for. You should return the array only if $e is NULL.

If we add html tag to first panel title it simply displaying it into the browser.

And that's OK. It's a panel title, it should not contain any HTML tags.

Why it is requiring all files inside tracy.php

Because Tracy is usable without Composer as well. If you use Composer, you'll never need to load this file.

[sanjoydesk]

Yes it make sense. thanks @JanTvrdik .

You mean the tiny text in Tracy logo? That's unlikely to change.

Cygnite Framerwork is under MIT license, hope it is not a problem to integrate Tracy with. It seems we need to code a bit to fit Tracy with our color schema.

You can see Laravel Framework uses Whoops Error handler which is similar to Tracy but Laravel does theme changes with external stylesheet and template customization.

We can add same feature into Tracy to make it much more flexible.

Is there any discussion chat room for Tracy, if possible let me know if we can chat, to know much more about it.

Thanks for your response. Great work!

[mishak87]

I could understand if you needed dark version but rebranding it is just silly. Getting rid of obsessions about tools visual style is more helpful then creating one. Tracy has quite polished appearance. And as a tool for debugging hers purpose is not to look colourful.

Maybe it would be useful to have interface for main framework and its version instead of constant Nette Framework. But that is something for @dg to decide. For now you can show it by adding BarPanel.

[dg]

To allow to create skins for Tracy is not a bad idea.

[stepansvoboda]

All included in the exception-...-log.html files?

[mikerockett]

I'd like to bring this back to life. I think that, at the very least, it should be possible to override the stylesheet definition. As an alternative, perhaps we could work on the blue screen included in the package itself.

In my honest opinion, the blue screen could do with a minimal/modern facelift. The red is quite peircing to the eye (for me, anyway), and system native fonts would look great. The idea of multiple 'skins' could very well be overkill, and so my thinking is just to improve its appearance in such a way that it's more comfortable.

Here's a screenshot of a stylesheet I worked on today:

@dg, do you think this could be worked on?

[sanjoydesk]

You may also see the reference screen for Cygnite Framework. Tracy is default debugger of Cygnite and the color combination you are proposing is almost looking similar. :) Thanks !!

…

Sent from my iPhone On 08-Oct-2017, at 10:40 PM, Mike Rockétt <notifications@github.com<mailto:notifications@github.com>> wrote: I'd like to bring this back to life. I think that, at the very least, it should be possible to override the stylesheet definition. As an alternative, perhaps we could work on the blue screen included in the package itself. In my honest opinion, the blue screen could do with a minimal/modern facelift. The red is quite peircing to the eye (for me, anyway), and system native fonts would look great. The idea of multiple 'skins' could very well be overkill, and so my thinking is just to improve its appearance in such a way that it's more comfortable.= Here's a screenshot of a stylesheet I worked on today: [pw_tracy_1]<https://user-images.githubusercontent.com/4586280/31319033-33ace05c-ac5c-11e7-8359-54859a2c4783.jpeg> @dg<https://github.com/dg>, do you think this could be worked on? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub<#27 (comment)>, or mute the thread<https://github.com/notifications/unsubscribe-auth/ABqebbJhc8syHt0YE-4L_ew2nsooVjqQks5sqQHfgaJpZM4BuYu4>.

[dg]

I added Tracy\Debugger::getBlueScreen()->userCssFile Tracy\Debugger::$customCssFile to allow to add custom CSS file.