MDM HTML5 Themes

Show your artwork
Forum rules
No support questions here please

Re: MDM HTML5 Themes

Postby hb1547 on Thu Jun 20, 2013 4:27 pm

anandrkris wrote:
hb1547 wrote:I made another login theme today -- this one's a Matrix-style login one:

Wanted to share something funny that happened on applying Matrix theme. I set it as the login theme in my laptop and left for work. My dad uses same laptop (dual-boot wit Win 7, he is comfortable with Windows but does not mind using Linux sometimes and am slowly acquainting him). So he selects Mint in GRUB and then pops the matrix login, seeing that he was scared that something went wrong with system since it was displaying all black and green screen with gibberish text. He packed the laptop and was about to take it to service centre to get it rectified but thankfully Mom prompted him to check with me before doing that. Then over phone I asked him to look for blinking username and password in middle to enter credentials. He did login but was puzzled why I would want a theme like that! He is old school and dont think he ever saw the Matrix movie. :)


Haha good story!

I had to let someone use my computer recently, and realized that if they booted into Mint (I also dual-boot), they'd see a confusing Matrix-style login page and be clueless about what the hell to do.
hb1547
Level 1
Level 1
 
Posts: 20
Joined: Sat Aug 18, 2012 4:03 pm

Linux Mint is funded by ads and donations.
 

Re: MDM HTML5 Themes

Postby saruman13 on Sun Jun 23, 2013 6:03 am

Image Image

eleMINTary by cdustybk with Mint Blue wallpaper
saruman13
Level 1
Level 1
 
Posts: 7
Joined: Sun Jun 23, 2013 4:45 am

Re: MDM HTML5 Themes

Postby killer de bug on Sun Jun 23, 2013 6:33 am

Ahhh nice !

Is it the modified one ? (viewtopic.php?f=25&t=126979&start=220#p728526)

Or is it the normal theme plus the wallpaper ?
If I have seen further it is by standing on the shoulders of giants. [Isaac Newton]
User avatar
killer de bug
Level 6
Level 6
 
Posts: 1077
Joined: Tue Jul 08, 2008 1:49 pm
Location: France

Re: MDM HTML5 Themes

Postby saruman13 on Sun Jun 23, 2013 7:03 am

It the normal theme, i just change the picture/wallpaper.
saruman13
Level 1
Level 1
 
Posts: 7
Joined: Sun Jun 23, 2013 4:45 am

MDM HTML5 Themes editor problem.

Postby rabideau on Tue Jun 25, 2013 2:23 pm

I think I committed a stupid user problem. A little help, please.

I was making some edits in MDM Login Screen editor from within the Control Panel in Mint 15 (Cinnamon) and managed to loose any/all evidence of the user icon on my Login screen (.face simply disappeared as did its 'container'). Is there a place/ way to reset the MDM settings to the original default or will I simoly have tolive with the errors of my ways?default
Pax vobiscum,
...mark

Geek & Genealogist (http://many-roads.com)
rabideau
Level 1
Level 1
 
Posts: 26
Joined: Wed Mar 30, 2011 11:14 am

Re: MDM HTML5 Themes

Postby hb1547 on Mon Jul 01, 2013 6:36 pm

Finished up another one today. This one is called ASCII:

ascii_screen_full.png


Download it here: http://xatal.com/ascii.tar.gz (v1.0)

What It's Like: Converts each user's account picture to ASCII art, and puts all user names on a line. Changing the active user loads the next user's ASCII art and allows input of password.

Notes:
- As always, no guarantees! If you have problems I'm happy to help fix any bugs.
- Most photos don't look great when converted to ASCII, so animated account pictures will look better here. Hopefully in the future I'll find/make a better conversion method.
- If you have enough users and/or a low resolution, the list of users might extend into a second row. This will probably look bad.
- Left/right arrow keys cycle through users, but only if you're not typing in the password box.
- If you edit 'index.html' in the folder, you can set the default user by changing the line "var firstUser = 'Paul';". The text in quotes should be the displayed username (eg, "Paul"), not the actual username (eg, "paul"). If this is unset, it'll just pick the first user.
hb1547
Level 1
Level 1
 
Posts: 20
Joined: Sat Aug 18, 2012 4:03 pm

Re: MDM HTML5 Themes

Postby clem on Wed Sep 25, 2013 6:57 am

Hi everyone,

The next MDM will bring user pre-selection. In other words, the last user who was logged in, will be automatically selected by MDM and the user will only have to input his password.

When MDM selects the user, it will tell your theme by calling the following new function:

mdm_set_current_user(username)

You need to add that function to your HTML theme and basically highlight the selected user.

The link below shows how this was done in the Cloud theme:

https://github.com/linuxmint/mint-mdm-t ... 4048fdfd7b

As you can see, in mdm_add_user(), for each user, I put the username in the row object (in row.username). At the bottom I use mousetrap to call my own select_user_at_index() (to browse through the table of users), and in mdm_add_user() I also make it so clicking on a user calls alert('USER###'+username); ... wherever you call alert('USER', username) that will tell MDM who the user you want to select is, and MDM will come back to you by calling mdm_set_current_user(username)... so you only need to worry about highlighting the user graphically in mdm_set_current_user().

One last detail, mdm_prompt is called when the user presses escape or the login screen is reset. In there, I reset my selected_row to -1... so next time I press up or down, it doesn't start from where I previously was.

Support for this is in MDM 1.3.2 available in git. Let me know if you need debs for it.
Image
User avatar
clem
Level 15
Level 15
 
Posts: 5514
Joined: Wed Nov 15, 2006 8:34 am

Re: MDM HTML5 Themes

Postby samriggs on Wed Sep 25, 2013 8:53 am

Thanks Clem
I'll get to it as soon as I can for all of them, I had to reinstall LMDE, after the UP7 (I guess all the stuff I added gave it issues so it's a fresh one now and works after some -f install and dist-upgrade, just have to shove everything back in again :)
and since I have a fresh install, it needs a spanking new mdm theme to go with it, one I started but never got done yet, plus cinnamon/gtk/metacity theme.
But I will add all that to the ones I have done.
I'll post it here once done.
Sam
Maybe if I can grab some extra time, I'll make some clean simple mdm ones also for those who want some of those with the options for them to choose their own colors for some things to fit their own themes, (something I had in mind before for clean simple ones).
"Windows: the worst system for the most money, Linux: the best system for free"
Registered Linux User #545430
SolydK
User avatar
samriggs
Level 5
Level 5
 
Posts: 843
Joined: Sun Apr 24, 2011 6:09 pm
Location: Canada

Re: MDM HTML5 Themes

Postby samriggs on Thu Sep 26, 2013 11:04 pm

clem wrote:Support for this is in MDM 1.3.2 available in git. Let me know if you need debs for it.


Wouldn't mind a deb for lmde if you got one kicking around for the mdm so I can test things.
Also since the reinstall and upgrade I can't seem to get the users list to show up in the login screen, this happened once before to me and I fixed it, I tried all the old methods that worked before but no go on the list showing up anymore.
Not sure what to do now to get the users list to show up in lmde
Sam
"Windows: the worst system for the most money, Linux: the best system for free"
Registered Linux User #545430
SolydK
User avatar
samriggs
Level 5
Level 5
 
Posts: 843
Joined: Sun Apr 24, 2011 6:09 pm
Location: Canada

Re: MDM HTML5 Themes

Postby Zorba on Fri Sep 27, 2013 1:55 am

My concept MDM theme! Can anyone make it real :D

Image

What about this too :D :D

Imageper:

well thanks this is the wallpaper bro :

Image
Last edited by Zorba on Fri Oct 04, 2013 2:12 am, edited 1 time in total.
Image Image
User avatar
Zorba
Level 7
Level 7
 
Posts: 1980
Joined: Tue May 29, 2012 10:12 pm
Location: Tunisia

Re: MDM HTML5 Themes

Postby samriggs on Fri Sep 27, 2013 3:05 am

Nice ideas Brahim
Give it a go, start learning this stuff, I keep pushing you towards it because you got a lot of great designs and ideas floating around in that head of yours, :lol:
Get er done! it won't take ya long to learn how to code in html, css and some basic javascript, (which you probably won't need much of)
I personally don't have time right now, I am making one for my new install but that's personally for me, (which I'll also share once done.
Don't know about the other folks making these, (right now I have about ten games on the go at the same time so my time is taken up for the next six months or so along with a full time job)
The html is simple to learn (think of it like a book and use tags
(the book all off it from front to back)
Code: Select all
<html></html>

then the begining of the book goes inside the html tag, where the book title is and the contents etc go inside the head tag like so
Code: Select all
<html><head></head></html>

if you want a title (for the mdm themes we don't use but I'll add it to show you
Code: Select all
<html><head><title></title></head></html>

the content section of a book or index is like the links to the css files or javascript files we use that go inside the head like so
Code: Select all
<html>
<head>
<title></title>
<link href="css/bootstrap.css" rel="stylesheet" media="screen">   
<link href="theme.css" rel="stylesheet" media="screen">      
 <link href="gears.css" rel="stylesheet" media="screen">         
<script src="js/bootstrap.min.js"></script>
<script src="js/mousetrap.min.js"></script>
<script src="js/jquery-1.9.1.min.js"></script>   
<script>   
</head>
</html>

These links allow the whats in the body or other parts to communicate with these scripts.
Then at last the body, this is like the body of the book, the story part you read and the layout of it.
Code: Select all
<html>
<head>
<title></title>
<link href="css/bootstrap.css" rel="stylesheet" media="screen">   
<link href="theme.css" rel="stylesheet" media="screen">      
 <link href="gears.css" rel="stylesheet" media="screen">         
<script src="js/bootstrap.min.js"></script>
<script src="js/mousetrap.min.js"></script>
<script src="js/jquery-1.9.1.min.js"></script>   
<script>   
</head>
<body></body>
</html>

all the pages stuff and layouts of the page goes in the body part, you set up the measurements, colors, images, positions, animations mostly in css files for the pages to be displayed but the final link goes into the html body part usually under class of div tags.
This is an extreme short tutorial but I found when I showed folks in the past to think of html as a book it helped them to understand it easier for some reason, so hopefully it'll help ya out.
css is where the display parts are mostly done now.
Here's a link to teach you all this stuff.
http://www.w3schools.com/css3/css3_animations.asp
they have all the css, html, javascript tutorials you'll need to get ya going and make some mdm themes.
Hope it helps ya out.
Sam
"Windows: the worst system for the most money, Linux: the best system for free"
Registered Linux User #545430
SolydK
User avatar
samriggs
Level 5
Level 5
 
Posts: 843
Joined: Sun Apr 24, 2011 6:09 pm
Location: Canada

Re: MDM HTML5 Themes

Postby Zorba on Fri Sep 27, 2013 3:11 am

Thanks Sam for the thorough explanation :D I'm learning this stuff now :D Expect something big bro :D
Image Image
User avatar
Zorba
Level 7
Level 7
 
Posts: 1980
Joined: Tue May 29, 2012 10:12 pm
Location: Tunisia

Re: MDM HTML5 Themes

Postby samriggs on Mon Sep 30, 2013 5:35 pm

Since it seems a lot of folks with art skills but lack the coding skills to make a mdm theme here might be some suggestions that seemed to work well for making cinnamon, gtk/metacity themes.
Take a mdm already made by someone else, choose the layout that resembles the layout you got in mind for your design and just change the name of it and change the artwork (keeping the size the same, ** this is important**) to your artwork.
No coding invloved, the only thing your doing is changing the artwork itself to your design.
The more layouts that get created by developers in the future the more choices for a layout you'll have to use as a base for art creations, again no coding involved for this method.
Why miss out showing and sharing your creations because you never learnt how to develop in web design.

Here's how to do it.
Grab a theme already made by someone else.
I'll use one of mine as an example. BlimpCity
Grab the BlimpCity folder from /usr/share/mdm/html-themes/
copy paste it to where you want to work on it.
1: Change the folder name from BlimpCity to a name you want to call your creation
2: open the folder and open the theme.info file
it looks like this inside:
Code: Select all
[Theme]
Encoding=UTF-8
Name=BlimpCity
Description=A boostrap HTML theme
Screenshot=screen.jpg

change the name to the same name you renamed the folder, add a description, what the theme is about (keep it very short or it won't all show up in the login preferences) and save it. (leave screenshot alone)

next start making your own artwork creations.
The bg.jpg is the background, if not all artwork is found in the main folder look in the img folder for the rest to change to make your own.
Keep the image extensions the same (example: jpg or png), because they are typed this way in the css files, changing that will not show your image)
If it's an animation sprite sheet make sure you keep the same distance between each image (to figure this out just take the width of the image and divide it by how many images there are, this will give you the width of each image).
Make sure all images are the same size as the original or it will not show all the of the image or leave spaces as the sizes of the images are also coded in the css.

To test your newly created theme:
Open a terminal and type “mdm-theme-emulator”
Click “open” and select your index.html file
Click “Add dummies” to add random users and sessions to your theme

Take a screenshot of it (from the emulator) resize the screenshot to the same size as the screenshot in the main folder and replace that original with your own.

To install your theme zip it up as tar.gz extension, open up the login preferences screen and drag the tar.bz file into the html section and it will install it for you.

Then once done upload it so others can share your creation. :D


Another method we used to use in the old days is get artist and developers together.
If your a developer that is not an artist offer your skills to the artist who cannot develop but want to make some themes and team up together to make some awesome work together.

Sam
"Windows: the worst system for the most money, Linux: the best system for free"
Registered Linux User #545430
SolydK
User avatar
samriggs
Level 5
Level 5
 
Posts: 843
Joined: Sun Apr 24, 2011 6:09 pm
Location: Canada

Re: MDM HTML5 Themes

Postby passerby on Mon Sep 30, 2013 11:45 pm

Brahim wrote:My concept MDM theme! Can anyone make it real :D

Image


If you can send me the individual images you used in that concept art, I could give it a go.
I'm one of those aforementioned coders who can't draw to save his life :lol:
I've never made an mdm theme before though, so I can't make any promises.
Home PC: Xubuntu 14.04 beta 2 x64, Nvidia GTX650, i7 3770K, 16GB RAM, Asus Xonar DX
Work PC: Mint 13 x64 XFCE, Nvidia GT620, i5 3470, 8GB RAM
Laptop: System76 Kudu Pro, Xubuntu 13.10 x64

My HTML5 login themes + screenshots
User avatar
passerby
Level 6
Level 6
 
Posts: 1319
Joined: Sun Dec 16, 2012 7:29 pm

Re: MDM HTML5 Themes

Postby samriggs on Tue Oct 01, 2013 6:59 am

Whoohoo I see the makings of a mdm team forming :D
slowly but forming yet the same.
Thanks passerby glad to have ya aboard :)
Brahim send him the artwork :)
Sam
"Windows: the worst system for the most money, Linux: the best system for free"
Registered Linux User #545430
SolydK
User avatar
samriggs
Level 5
Level 5
 
Posts: 843
Joined: Sun Apr 24, 2011 6:09 pm
Location: Canada

Re: MDM HTML5 Themes

Postby Zorba on Thu Oct 03, 2013 11:27 pm

Check my new plymouth theme I called it "freshmint"

Get them at http://kde-look.org/content/show.php?content=160977

Image

grub background:

Image
Image Image
User avatar
Zorba
Level 7
Level 7
 
Posts: 1980
Joined: Tue May 29, 2012 10:12 pm
Location: Tunisia

Re: MDM HTML5 Themes

Postby samriggs on Fri Oct 04, 2013 1:11 am

Wrong thread to show that at Brahim, this ia about html5 mdm themes, but Passerby (in threads above) is willing to take your designs and make some mdm themes out of them, I think he's waiting for some art from you.
Sam
"Windows: the worst system for the most money, Linux: the best system for free"
Registered Linux User #545430
SolydK
User avatar
samriggs
Level 5
Level 5
 
Posts: 843
Joined: Sun Apr 24, 2011 6:09 pm
Location: Canada

Re: MDM HTML5 Themes

Postby Zorba on Fri Oct 04, 2013 2:14 am

passerby wrote:
Brahim wrote:My concept MDM theme! Can anyone make it real :D

Image


If you can send me the individual images you used in that concept art, I could give it a go.
I'm one of those aforementioned coders who can't draw to save his life :lol:
I've never made an mdm theme before though, so I can't make any promises.



I'm glad you're doing this theme. here grab the wallpaper http://www.artleo.com/pic/201106/1920x1080/artleo.com-4164.jpg
Image Image
User avatar
Zorba
Level 7
Level 7
 
Posts: 1980
Joined: Tue May 29, 2012 10:12 pm
Location: Tunisia

Re: MDM HTML5 Themes

Postby passerby on Fri Oct 04, 2013 2:22 am

Brahim wrote:I'm glad you're doing this theme. here grab the wallpaper http://www.artleo.com/pic/201106/1920x1080/artleo.com-4164.jpg


Is the box and its frame in CSS, or did you draw it up? (doesn't matter, just want to match it best I can)
I'll start playing around when I get home from work.
Home PC: Xubuntu 14.04 beta 2 x64, Nvidia GTX650, i7 3770K, 16GB RAM, Asus Xonar DX
Work PC: Mint 13 x64 XFCE, Nvidia GT620, i5 3470, 8GB RAM
Laptop: System76 Kudu Pro, Xubuntu 13.10 x64

My HTML5 login themes + screenshots
User avatar
passerby
Level 6
Level 6
 
Posts: 1319
Joined: Sun Dec 16, 2012 7:29 pm

Re: MDM HTML5 Themes

Postby Zorba on Fri Oct 04, 2013 2:47 am

actually i took it from anMDM theme can't remember it's name :lol: :lol: :lol: Thanks man add some magic to it man :D
Image Image
User avatar
Zorba
Level 7
Level 7
 
Posts: 1980
Joined: Tue May 29, 2012 10:12 pm
Location: Tunisia

Linux Mint is funded by ads and donations.
 
PreviousNext

Return to Other artwork

Who is online

Users browsing this forum: No registered users and 0 guests