Today I develop a very basic and simple web application that you can use to play MP3 files. The MP3 player just like a sound cloud. It is a very basic and user-friendly web application for learners who are interested to learn Web Development .
In this application I am using waveSurfer a JavaScript Plugin.
Features
Ajax based login screen. Change password feature after login user can change or update the password. Forgot password page is ready but not functional. If you want to make it functional you can visit Validate Emails and send using PHPMailer and JQuery Ajax . How to Login in the admin panel?
To login into admin panel you can use below details to see demo .
Email: zaid@learncodeweb.comPassword: adminHow to setup into your local server?
To setup this web application into your local server you need to follow the below steps.
Step 1
First of all, you need to install XAMPP or WAMP server into your local system. After installation, open htdocs
audio-player [Folder] Extract downloaded application into the audio-player folder. Create DataBase.
Create a DB with the name of audiotracker
Create Admin Table.
CREATE TABLE `admins` (
`ID` int(11) NOT NULL,
`username` varchar(64) NOT NULL,
`useremail` varchar(128) NOT NULL,
`userpassword` varchar(128) NOT NULL,
`token` varchar(128) NOT NULL,
`dt` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
--
-- Dumping data for table `admins`
--
INSERT INTO `admins` (`ID`, `username`, `useremail`, `userpassword`, `token`, `dt`) VALUES
(1, 'Zaid Bin Khalid', 'zaid@learncodeweb.com', '21232f297a57a5a743894a0e4a801fc3', '', '2019-02-09 04:54:30');
ALTER TABLE `admins`
ADD PRIMARY KEY (`ID`);
ALTER TABLE `admins`
MODIFY `ID` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=2;
COMMIT;
Create User Data table.
CREATE TABLE `userdata` (
`ID` int(11) NOT NULL,
`firstname` varchar(32) NOT NULL,
`lastname` varchar(32) NOT NULL,
`callid` int(11) NOT NULL,
`campaign` varchar(32) NOT NULL,
`phone` varchar(32) NOT NULL,
`calltime` time NOT NULL,
`recordingfile` text NOT NULL,
`dt` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
--
-- Dumping data for table `userdata`
--
INSERT INTO `userdata` (`ID`, `firstname`, `lastname`, `callid`, `campaign`, `phone`, `calltime`, `recordingfile`, `dt`) VALUES
(1, 'Zaid', 'Khalid', 120, 'HHG544', '08080824727', '00:00:00', 'tropo-rocks.mp3', '2019-02-09 05:16:28');
ALTER TABLE `userdata`
ADD PRIMARY KEY (`ID`);
ALTER TABLE `userdata`
MODIFY `ID` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=2;
COMMIT;
Change URL’s to run application.
Open config.php custom.js
http://localhost/demo/web-development/audio-work/
