DonationCoder.com Software > Ecaradec's Software
Qatapult
ecaradec:
Sorry for the strange previous response. I typed it on my phone, so it's a bit weird. :P. I forgot to address some of your questions :
- For the input field I probably forgot to use the specified fontsize and color. I'll fix that.
- About 4, I'll give you a way to enumerate what is available inside the objects. Until that you can watch in the database too : anything that's available as a string in the DB is available via getArgValue. There are some properties that are deduced like rpath and rdirectory but there are only a few.
ecaradec:
I tried a small test adding a background to the pigeonlips skin to test the new transparent results and it looks nice so I'm sharing it for just that reason. The picture is from here http://photography.nationalgeographic.com/photography/photo-of-the-day/mediterranean-sea-swimming/ I picked it a bit randomly on the internet.
pigeonlips:
For now here's a *cough* better version on the skin.
This skin is my first time ever using js so please point out anything that's wrong. Its but fugaly (code wise) but it does get closer to that "alfred app" experience.
Found out how to get the extended properties of a file.
Bashed my head against a wall trying to get data out of id3 tags, so for now album art only works if you have a cover.jpg in the folder of the mp3s listed. Lucky me i always have this. I need to include a library to get this done right but at the moment thats a little advanced for me. Any tips around this will save me a lot off googleing
Also the extended property index of a file differ for windows OS (win Xp, 2000, vista, 7) so they need to be changed. I'll write a skin for each version, but can only test on xp.
I was using info from http://www.kixtart.org/forums/ubbthreads.php?ubb=showflat&Number=201630 to get them.
its still very rough but my heart isn't in getting it to look slick until it can be something other than white.
You post gives me hope. It looks nice. I cannot wait to try it out - let me know when its ready and how to set the transparency. Then i'll add tons more polish and finish it off.
If you just after the js (dont think the images changed):
Spoilervar skin ="skins\\alfred-like\\";
var SkinWidth =500;
var SkinHeight =300;
var SkinBorder =10;
function draw(ui)
{
// set the text color
ui.textcolor =0x88000000;
ui.fontsize =12;
// draw the canvas
ui.drawBitmap(skin+"background.png", 0, 0, SkinWidth, SkinHeight);
// > ----------------------------------------------------------
// > I mieght make this bigger one day
// > ----------------------------------------------------------
ui.drawInput(30,42,SkinWidth-((SkinBorder+10)*2),15);
// now draw the items - pane one
if(qatapult.argscount==1)
{
drawItem(ui,0, SkinBorder + 20, SkinHeight - 47, 150, 36);
//ui.drawBitmap(skin+"next.png",190,SkinHeight - 37, 15, 15);
}
// now draw the items - pane two
if (qatapult.argscount==2)
{
drawItem(ui,0, SkinBorder + 20, SkinHeight - 47, 150, 36);
drawItem(ui,1, SkinBorder + 200, SkinHeight - 47, 150, 36);
ui.drawBitmap(skin+"next.png",190,SkinHeight - 37, 15, 15);
}
// now draw the items - pane three
if (qatapult.argscount==3)
{
drawItem(ui,0, SkinBorder + 20, SkinHeight - 47, 150, 36);
drawItem(ui,1, SkinBorder + 200, SkinHeight - 47, 150, 36);
drawItem(ui,2, SkinBorder + 350, SkinHeight - 47, 150, 36);
ui.drawBitmap(skin+"next.png",340,SkinHeight - 37, 15, 15);
}
// draw results box
if(qatapult.resultscount!=0)
{
var resultscount=Math.min(5,qatapult.resultscount);
// > ----------------------------------------------------------
// > new version might allow the background or color of the results box
// > to change - revisit if this happens as we need to set it here
// > ----------------------------------------------------------
ui.drawResults(SkinBorder,65,(SkinWidth/2) - SkinBorder,SkinHeight -(100+SkinBorder));
if (qatapult.resultscount>4)
{
ui.fontsize = 8;
ui.drawText("... arrow down for more ...", SkinBorder,SkinHeight -(57+SkinBorder),(SkinWidth/2) - SkinBorder, 15);
}
}
else
{
ui.drawText("start typing ..... ", SkinBorder * 2 ,190,200,50);
}
if(qatapult.argscount>1)
{
// whats the type?
type = qatapult.getArgValue(0, "type");
if (type == "TEXT")
{
// display the image of the object
ui.drawBitmap("icons\\edit.png",320 ,65, 107, 91);
// set text size and color
ui.fontsize = 14;
ui.textcolor = 0x88000000;
// display the heading of the object
ui.drawText("free text", SkinWidth/2 + SkinBorder,160,200,25);
// reset the size
ui.fontsize = 8;
ui.textcolor =0x88000000;
// display the text info about the object
ui.drawText(qatapult.getArgValue(0, "status"), SkinWidth/2 + SkinBorder,190,200,50);
/*
// the first result at the bottom in free text is white. ? Add it here instead.
ui.drawText(status, SkinBorder + 20,SkinHeight - 47, 150, 36);
*/
}
if (type == "WINDOW")
{
// set text size and color
ui.fontsize = 8;
ui.textcolor = 0x88000000;
// draw the frame - this can be used for images or something.
ui.drawBitmap(skin+"frame.png",320 ,65, 107, 91);
// display some info in text
winTitle = qatapult.getArgValue(0, "title");
winHWD = qatapult.getArgValue(0, "hwnd");
text = qatapult.getArgValue(0, "text");
ui.drawText(winTitle, SkinWidth/2 + SkinBorder,160,200,15); // seams static in the wrong position ?
ui.drawText("Windows Handle : "+winHWD, SkinWidth/2 + SkinBorder,180,200,15); // seams centered?
ui.fontsize = 12;
}
if (type == "FILE")
{
var heading = "";
var picture = "";
var item1 = "";
var item2 = "";
var item3 = "";
var fileext = "";
// what is the file and where is it. We'll need this most of the time in the if statements below. Get it early then.
filedir = qatapult.getArgValue(0, "directory")
filename = qatapult.getArgValue(0, "filename")
// Time to work out the extention. WIth this we can target the best properties of an object to display
fileext = filename.substring(filename.length,filename.length-4);
// lower case the extension then it doesnt matter is its .xxx or .XXX or .XxX - we still know it
fileext = fileext.toLowerCase()
if ((fileext == ".png")||(fileext == ".jpg")||(fileext == ".bmp"))
{
heading = "Image";
picture = filedir+"\\"+filename;
// draw the picture border
//ui.drawBitmap(skin+"frame.png",316 ,61, 116, 100);
item1 = "";
item2 = "";
item3 = "";
}
else if (fileext == ".mp3")
{
heading = "Audio";
// cheap but luckly me i keep cover.jpg in my music folders. - would be nice to rip the thumb from the id3 tag.
// ui.drawBitmap(skin+"frame.png",316 ,61, 116, 100);
picture = filedir+"\\cover.jpg";
// now lets get the extended properties of the file.
// these vaules are diffrent for XP win 7 and vista. Need to make seprate skins for this.
// http://www.kixtart.org/forums/ubbthreads.php?ubb=showflat&Number=201630
var ARTIST_NAME = 16; // Win7 use 216
var ALBUM_TITLE = 17; // Win7 use 14
var YEAR = 18; // Win7 use 15
// need the filename to be an object!
var oShell = new ActiveXObject("Shell.Application");
var oFolder = oShell.Namespace(filedir);
var oFile = oFolder.ParseName(filename);
item1 = "Artist : " + oFolder.GetDetailsOf(oFile, ARTIST_NAME);
item2 = "Album: " + oFolder.GetDetailsOf(oFile, ALBUM_TITLE);
item3 = "Year: " + oFolder.GetDetailsOf(oFile, YEAR);
}
else if (fileext == ".lnk")
{
heading = "Shortcut";
item1 = qatapult.getArgValue(0, "rfilename");
item2 = qatapult.getArgValue(0, "rdirectory");
}
else if (fileext == ".exe")
{
heading = filename;
// now lets get the extended properties of the file.
// these vaules are diffrent for XP win 7 and vista. Need to make seprate skins for this.
// http://www.kixtart.org/forums/ubbthreads.php?ubb=showflat&Number=201630
var COMPANY_NAME = 35;
var FILE_VERSION = 37; // Win7 use 156
var PROGRAM_DESC = 30;
// need the filename to be an object!
var oShell = new ActiveXObject("Shell.Application");
var oFolder = oShell.Namespace(filedir);
var oFile = oFolder.ParseName(filename);
item1 = "Company Name : " + oFolder.GetDetailsOf(oFile, COMPANY_NAME);
item2 = "File Version : " + oFolder.GetDetailsOf(oFile, FILE_VERSION);
item3 = "Description : " + oFolder.GetDetailsOf(oFile, PROGRAM_DESC);
}
else
{
// now lets get the extended properties of the file.
// these vaules are diffrent for XP win 7 and vista. Need to make seprate skins for this.
// http://www.kixtart.org/forums/ubbthreads.php?ubb=showflat&Number=201630
var FILE_TYPE = 2;
var DATE_CREATED = 4; // Win7 use 156
var FILE_SIZE = 1;
var ATTRIBUTES = 6;
// need the filename to be an object!
var oShell = new ActiveXObject("Shell.Application");
var oFolder = oShell.Namespace(filedir);
var oFile = oFolder.ParseName(filename);
heading = oFolder.GetDetailsOf(oFile, FILE_TYPE);
item1 = "Created : " + oFolder.GetDetailsOf(oFile, DATE_CREATED);
item2 = "Size : " + oFolder.GetDetailsOf(oFile, FILE_SIZE);
item3 = "Attributes : " + oFolder.GetDetailsOf(oFile, ATTRIBUTES);
}
// Draw the properties of the object for type FILE depending on whats been set above
// display the image of the object
if (picture !="")
{
ui.drawBitmap(picture,320 ,65, 107, 91);
}
else
{
drawItem(ui,0,320 ,65, 107, 91);
}
// set text size and color for header
ui.fontsize = 14;
ui.textcolor = 0x88000000;
// display the heading of the object
ui.drawText(heading, SkinWidth/2 + SkinBorder,160,200,25);
// reset the size for the rest
ui.fontsize = 8;
ui.textcolor = 0x88000000;
// display the text info about the object
ui.drawText(item1, SkinWidth/2 + SkinBorder,190,200,15);
ui.drawText(item2, SkinWidth/2 + SkinBorder,210,200,15);
ui.drawText(item3, SkinWidth/2 + SkinBorder,230,200,15);
}
else
{
drawItem(ui,0,320 ,65, 107, 91);
}
}
// draw the menu button
ui.drawBitmap(skin+"ui-radio-button.png", SkinWidth-33, SkinBorder+2, 16, 16);
// drawn index progress
ui.fontsize = 8;
ui.textcolor = 0x88000000;
if(qatapult.crawlprogress!=0 && qatapult.crawlprogress!=100)
ui.drawText("Updating index : "+qatapult.crawlprogress+"%",SkinBorder,SkinBorder,SkinWidth-(SkinBorder*2),15)
// this drew status line - opting out of this as i dont know where to put it at the moment
/*
var focus=qatapult.getFocus();
ui.drawEmphased(qatapult.getArgValue(focus,"status"),qatapult.getQuery(focus),15,SkinHeight-20,SkinWidth-30,10);
*/
// determine the mode - will add support for this later.
/*
if(qatapult.textmode)
{
//ui.drawBitmap(skin+"textbackground.png", 0, 0, 350, 200);
//ui.drawInput(25,25,305,138);
//height=200;
}
else
{
//ui.textcolor=0xFF000000;
// draw the background according to the number of current args
if(qatapult.argscount<3)
{
//ui.drawBitmap(skin+"background.png", 0, 0, 350, 120);
//height=120;
}
else
{
//ui.drawBitmap(skin+"background_3.png", 0, 0, 350, 170);
//height=170;
}
}
*/
}
function drawItem(ui,i,x,y,w,h)
{
if(qatapult.getArgValue(i,"type")=="TEXT")
{
// HELP > ----------------------------------------------------------
// HELP > free text always appears in white. Dont know how to set the color?
// ui.drawItem(i,x+5,y+5,w-10,h-20);
}
else
{
// draw the item visual and draw it's label below
ui.drawItem(i,x+2,y+2,h-4,h-4);
var text = "";
//if(qatapult.getArgValue(i,"email")!="")
// var text=" <"+qatapult.getArgValue(i,"email")+">";
ui.drawEmphased(qatapult.getArgValue(i,"text")+text,qatapult.getQuery(i),x+h,y+10,w-2*h,30);
}
}
// ui.drawBitmap(skin+"ui-radio-button.png", SkinWidth-33, SkinBorder+2, 16, 16);
function onClick(x,y)
{
if(x > SkinWidth-33 && x < SkinWidth-17 && y > SkinBorder + 2 && y < SkinBorder + 18)
qatapult.showmenu(x,y);
}
ecaradec:
That's a very impressive work for a newcomer to javascript.
I've also added a few things to allow path trimming (... inside the middle of the path instead of the end ) and a textrendering hint that allow you to use full antialias or grid fit that looks darker on screens.
pigeonlips:
For text color you can use textcolor on the UI object. You can also use the fontfamily property to select a different font.
--- End quote ---
thanks i'll give this a try.
3. Uuuh ? I'm not sure about what you mean, I'll give a look at the skin tomorrow
--- End quote ---
Again i didnt explain this well. I didnt understand what was happening at first, but I think its on the matching of the status. In stead of colors i'll explain via text case. for example i type:
> appcatn
and in the bottom left by the 3 in the piture i get :
> APPliCATioN
only the Upper case text (its not really upper case - just making it that way to help explain) shows in an off white which is nearly invisible - its this text i would like to control the color off. The lower case text displays in the normal color i set so that bits fine. The only real problem is if its free text (using ' for example) then it all appears in uppercase. I understand it better now after more playing around so in a nutshell
- it would be nice to set the color of the matching text from the inputbox
4. Don't worry about the performance of getstring it's in memory, you'll run out of place on the skin before it get slow
--- End quote ---
Again i didnt explain this too well ether. I was worryed about preformance of the skin/qatapult if i coded to get properties of the object from other sources. ID3 tag of the file, EXIF info for images etc. I guess i just wanted a little hand holding, but the only way to find out is to give it a try.
I have and the new skin looks up extended properties of a FILE type. ID3 tags and EXIF are a little out of my reach for now.
I love the start of that skin
--- End quote ---
thanks :) - its still very early - It needs lots more polish. Little things like the alignment of contorls, text sizes etc. i'll make it nicer soon. Work in progress.
Navigation
[0] Message Index
[#] Next page
[*] Previous page
Go to full version