| Author |
Message |
|
kylejohnson
Joined: Tue Aug 21, 2007 2:42 pm
Posts: 223
Location: Baltimore, MD
|
Craver - I'm aware of that bug. It showed up when I added the jquery files. I'll see if I can fix it today. As for the layout, thanks for the feedback. I'm not much of a designer so it is good to have input. 
|
| Fri Mar 26, 2010 2:22 pm |
 
|
|
|
|
|
craver84
Joined: Sun Aug 31, 2008 8:35 am
Posts: 78
|
What about doing something more radical? I thought we can "copy" the layout of other projects, like IpCop or Elastix
The thing I don't really like in ZM is that there are more that one windows (option, filters, monitors, source...)
I was looking at elastix and I draw this (I'm not a designer, and I can't draw very well.... sorry  )
It's only an idea... I can do it better if you like it
|
| Fri Mar 26, 2010 2:38 pm |
|
|
|
kylejohnson
Joined: Tue Aug 21, 2007 2:42 pm
Posts: 223
Location: Baltimore, MD
|
I was about to say, holy shit - you put my work to shame! But it's only a mock-up
Well, I like some of the ideas - like the menu bar. Perhaps a menu bar that defaults to "Cameras" or "History" (user definable option), but also has "System" and the other tabs that you mentioned. I can see that making things easier - the Cam tab has only cameras, the History tab has only events. Makes sense. The "System" tab would be nice too, but would probably come last. Maybe even something under "System" that calculates how many hours / days / whatever of storage you have, based on the number of cameras, resolution, etc.
|
| Fri Mar 26, 2010 2:43 pm |
|
|
|
kylejohnson
Joined: Tue Aug 21, 2007 2:42 pm
Posts: 223
Location: Baltimore, MD
|
I've also fixed the bug which prevented you from changing tabs when adding / editing a monitor (Monitor view).
So this skin is not completely usable.
Still lots to do.
|
| Fri Mar 26, 2010 4:28 pm |
|
|
|
kylejohnson
Joined: Tue Aug 21, 2007 2:42 pm
Posts: 223
Location: Baltimore, MD
|
Per craver84's idea,
Thoughts?
All of the navigation links do not full work (though mostly). You can check this out from the skin-with-nav branch of my git repo.
|
| Mon Mar 29, 2010 9:03 pm |
|
|
|
craver84
Joined: Sun Aug 31, 2008 8:35 am
Posts: 78
|
kylejohnson, great work!
I think that the navigation with the tabs (with only 1 window!) is the better way to improve the front end, kylejohnson don't you think so? I also would like to know what other people think...
Please help me to download it. i'm here:
http://github.com/kylejohnson/zm_newski ... n-with-nav
and I don't know how to download it...
|
| Mon Mar 29, 2010 10:00 pm |
|
|
|
kingofkya
Joined: Mon Mar 26, 2007 7:07 am
Posts: 1101
Location: Las Vegas, Nevada
|
I must say its coming along great two suggestions.
Fist make the divs or tables expand because with the higher res pics, axis ip cams it overflowed. If you want a pic to test with let me know i can give you a link to mine. You might have fixed it my versions a week out of date and haven updated yet.
Same goes for monitor/camera popup window.
Also if you need some graphics done let me know. Hears some stuff I have done.
http://www.zoneminder.com/forums/viewtopic.php?t=13779_________________GOOGLE TUTORIALProfessional ZM install Give PM or email. E-lance Profile LinkExperiment/Blog
|
| Tue Mar 30, 2010 3:21 am |
|
|
|
kylejohnson
Joined: Tue Aug 21, 2007 2:42 pm
Posts: 223
Location: Baltimore, MD
|
I'm not sure yet... I like the tabbed navigation, but the history also looks good underneath the camera snapshot. It's a small change so it isn't too big of a deal yet. To download it, you'll need to download the entire repo as normal. Then once the repo is downloaded, type "git checkout skin-with-nav". Reload your web page and there you go. To switch back to the main skin, type "git checkout master". To see all options, type "git branch"
I know that this is still a pending issue - I just haven't thought of a good way to implement it yet. The problem is that with this CSS layout, I need a fixed width on li.monitor... So I need a way to dynamically override the width. I'll figure it out soon enough.
And thanks for the offer. I am definitely not a graphic / ui designer, so I could use some help.
|
| Tue Mar 30, 2010 3:04 pm |
|
|
|
timgman
Joined: Wed Mar 14, 2007 7:01 pm
Posts: 46
|
 Wow good plans... It's about time someone makes this baby look as good as it needs to.
With the added eye-candy of those Custom icons and the sweet one page layout, This app will become more popular very fast.
|
| Tue Mar 30, 2010 7:50 pm |
|
|
|
craver84
Joined: Sun Aug 31, 2008 8:35 am
Posts: 78
|
Sorry for my stupid question, but I still don't know how to download it ....
In terminal I type:
paolo@Shuttle:~$ git clone git://github.com/kylejohnson/zm_newskin.git
Initialized empty Git repository in /home/paolo/zm_newskin/.git/
remote: Counting objects: 245, done.
remote: Compressing objects: 100% (206/206), done.
remote: Total 245 (delta 95), reused 162 (delta 36)
Receiving objects: 100% (245/245), 191.71 KiB | 246 KiB/s, done.
Resolving deltas: 100% (95/95), done.
after that? If I type:
paolo@Shuttle:~$ git checkout skin-with-nav
fatal: Not a git repository (or any of the parent directories): .git
|
| Wed Mar 31, 2010 4:16 pm |
|
|
|
kylejohnson
Joined: Tue Aug 21, 2007 2:42 pm
Posts: 223
Location: Baltimore, MD
|
So I've been working away on the skin, and I feel that I've made enough progress for an update to be worthy. Still lots to go. Again, this is all available via my git repo, so feel free to check it out.
* Main console screen now only shows the monitors - no addition events, zones or what have you information.
* Clicking on a monitor "drills into" the events for that monitor, bringing you to the Events page, with that monitor's results shown.
* All even searching and paginating are now done with jquery and ajax calls.
* I have removed MANY features. I think it is best to start with only what is needed, and add extras as required. That said, filtering is only available by Monitor Name and Date Range.
* Click a monitor's corresponding Check Box to add that monitor to the filter
* Clicking a monitor will filter immediately.
* Add a date range and click "Submit" to search the currently selected monitors by that date range.
|
| Tue Apr 20, 2010 7:00 pm |
|
|
|
thomasjohansen
Joined: Thu Apr 22, 2010 11:54 am
Posts: 3
|
Bug: No cam in the console view, with this new skin.
Proberly because its a axis ip cam with resolution 1280x800.
the camera view is empty.
|
| Thu Apr 22, 2010 12:20 pm |
|
|
|
kylejohnson
Joined: Tue Aug 21, 2007 2:42 pm
Posts: 223
Location: Baltimore, MD
|
What browser and OS?
Is ZoneMinder's authentication (hashed or plain) enabled?
|
| Thu Apr 22, 2010 2:34 pm |
|
|
|
thomasjohansen
Joined: Thu Apr 22, 2010 11:54 am
Posts: 3
|
Version 1.24.1 (ubuntu) Victor peterson livecd
windows 7 Firefox 3.6.3
Axis IP M3014 1280x800
Tried both with and without user auth and with plain and hash and none.
classic skin works fine.
output of the source:  | | | | Code: <DOCTYPE> <html> <head> <title>ZM - Console</title> <link> <link> <link> <link> <link> <link> <link> <script></script> <script></script> <script> $(document).ready(function(){ var refresh = 300000; $("#monitors").load("/skins/new/views/monitors.php"); setInterval(function() { $("#monitors li").each(function() { var _this = $(this); $(".spinner",_this).html("<img>"); var mid = $(this).attr("id"); mid = mid.split("_"); $(".mon",this).load("/skins/new/views/monitors.php?mid=" + mid[1] + " .mon", function () { $(".spinner",_this).fadeOut('slow'); }); }); }, refresh); $("#monitors").sortable({ opacity: 0.6, cursor: 'move', update: function() { var order = $(this).sortable("serialize") + '&action=sequence'; $.post("skins/new/includes/updateSequence.php", order); }}); }); </script> <link> <script> var AJAX_TIMEOUT = 3000; var currentView = 'console'; var thisUrl = "http://10.192.67.108/index.php"; var skinPath = "skins/zm_newskin"; var canEditSystem = true; var canViewSystem = true; var refreshParent = false; var focusWindow = false; </script> <script> var consoleRefreshTimeout = 300000; var showVersionPopup = false; var showDonatePopup = false; </script> <script></script> <script></script> <script>console.error = alert;</script> </head> <body> <div> <div> <h2><a>ZoneMinder</a> Console - <a>Running</a></h2> <div></div> <div><a>1 Monitor</a></div> <div><a>Options</a></div> <h3>Configured for <a>High</a> Bandwidth</h3> </div> <div> <ul> <li><a>Cameras</a></li> <li><a>Events</a></li> <li><a>Timeline</a></li> <li><a>Admin.</a></li> <li><a>Options</a></li> <li><a>System</a></li> </ul> </div> <div> <ul> </ul> </div> <div> <a>v1.24.1</a></div> </div> </body> </html> </div> | | | | |
|
| Thu Apr 22, 2010 2:58 pm |
|
|
|
kylejohnson
Joined: Tue Aug 21, 2007 2:42 pm
Posts: 223
Location: Baltimore, MD
|
Thomas,
Seems to not work on my Windows XP Firefox 3.6.3, but it does on my Ubuntu install. I'll look into it soon.
|
| Thu Apr 22, 2010 3:27 pm |
|
|
Who is online |
Users browsing this forum: No registered users and 1 guest |
|
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum
|
|
