sliderbywebline - Version 0.1.0

Version Notes

First Release

Release Info

Developer	Weblineindia
Extension	sliderbywebline
Version	0.1.0
Comparing to
See all releases

Version 0.1.0

Files changed (29) hide show

app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider.php +12 -0
app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Edit.php +24 -0
app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Edit/Form.php +18 -0
app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Edit/Tab/Form.php +80 -0
app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Edit/Tabs.php +22 -0
app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Grid.php +83 -0
app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Renderer/Imagedisplay.php +16 -0
app/code/local/Wli/Wlislider/Block/Html/Header.php +11 -0
app/code/local/Wli/Wlislider/Helper/Data.php +5 -0
app/code/local/Wli/Wlislider/Model/Mysql4/Wlislider.php +8 -0
app/code/local/Wli/Wlislider/Model/Mysql4/Wlislider/Collection.php +8 -0
app/code/local/Wli/Wlislider/Model/Slideroption.php +13 -0
app/code/local/Wli/Wlislider/Model/Wlislider.php +10 -0
app/code/local/Wli/Wlislider/controllers/Adminhtml/WlisliderController.php +181 -0
app/code/local/Wli/Wlislider/controllers/IndexController.php +9 -0
app/code/local/Wli/Wlislider/etc/adminhtml.xml +42 -0
app/code/local/Wli/Wlislider/etc/config.xml +113 -0
app/code/local/Wli/Wlislider/etc/system.xml +135 -0
app/code/local/Wli/Wlislider/sql/wlislider_setup/mysql4-install-0.1.0.php +21 -0
app/design/frontend/base/default/layout/wlislider.xml +74 -0
app/design/frontend/base/default/template/wlislider/page/html/header.phtml +68 -0
app/etc/modules/Wli_Wlislider.xml +9 -0
js/slider/123protoshow.js +746 -0
js/slider/site.js +21 -0
package.xml +18 -0
protoshow.php +758 -0
skin/frontend/base/default/css/slider/protoshow.css +305 -0
skin/frontend/base/default/css/slider/reset.css +102 -0
skin/frontend/base/default/css/slider/site.css +9 -0

app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider.php ADDED Viewed

	@@ -0,0 +1,12 @@


1	+ <?php
2	+ class Wli_Wlislider_Block_Adminhtml_Wlislider extends Mage_Adminhtml_Block_Widget_Grid_Container
3	+ {
4	+ public function __construct()
5	+ {
6	+ $this->_controller = 'adminhtml_wlislider';
7	+ $this->_blockGroup = 'wlislider';
8	+ $this->_headerText = Mage::helper('wlislider')->__('Item Manager');
9	+ $this->_addButtonLabel = Mage::helper('wlislider')->__('Add Item');
10	+ parent::__construct();
11	+ }
12	+ }

app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Edit.php ADDED Viewed

	@@ -0,0 +1,24 @@


1	+ <?php
2	+ class Wli_Wlislider_Block_Adminhtml_Wlislider_Edit extends Mage_Adminhtml_Block_Widget_Form_Container
3	+ {
4	+ public function __construct()
5	+ {
6	+ parent::__construct();
7	+
8	+ $this->_objectId = 'id';
9	+ $this->_blockGroup = 'wlislider';
10	+ $this->_controller = 'adminhtml_wlislider';
11	+
12	+ $this->_updateButton('save', 'label', Mage::helper('wlislider')->__('Save Banner'));
13	+ $this->_updateButton('delete', 'label', Mage::helper('wlislider')->__('Delete Banner'));
14	+ }
15	+
16	+ public function getHeaderText()
17	+ {
18	+ if( Mage::registry('wlislider_data') && Mage::registry('wlislider_data')->getId() ) {
19	+ return Mage::helper('wlislider')->__("Edit Banner '%s'", $this->htmlEscape(Mage::registry('wlislider_data')->getTitle()));
20	+ } else {
21	+ return Mage::helper('wlislider')->__('Banner Item');
22	+ }
23	+ }
24	+ }

app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Edit/Form.php ADDED Viewed

	@@ -0,0 +1,18 @@


1	+ <?php
2	+ class Wli_Wlislider_Block_Adminhtml_Wlislider_Edit_Form extends Mage_Adminhtml_Block_Widget_Form
3	+ {
4	+ protected function _prepareForm()
5	+ {
6	+ $form = new Varien_Data_Form(array(
7	+ 'id' => 'edit_form',
8	+ 'action' => $this->getUrl('//save', array('id' => $this->getRequest()->getParam('id'))),
9	+ 'method' => 'post',
10	+ 'enctype' => 'multipart/form-data',
11	+ )
12	+ );
13	+
14	+ $form->setUseContainer(true);
15	+ $this->setForm($form);
16	+ return parent::_prepareForm();
17	+ }
18	+ }

app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Edit/Tab/Form.php ADDED Viewed

	@@ -0,0 +1,80 @@


1	+ <?php
2	+ class Wli_Wlislider_Block_Adminhtml_Wlislider_Edit_Tab_Form extends Mage_Adminhtml_Block_Widget_Form
3	+ {
4	+ protected function _prepareForm()
5	+ {
6	+
7	+ $UrlData=$this->getRequest()->getParams();
8	+ $CheckEdit=$UrlData['id'];
9	+ $form = new Varien_Data_Form();
10	+ $this->setForm($form);
11	+ $fieldset = $form->addFieldset('wlislider_form', array('legend'=>Mage::helper('wlislider')->__('Item information')));
12	+ $URLID=$this->getRequest()->getParam('id');
13	+ $_edited_banner = Mage::getModel('wlislider/wlislider')->load($URLID);
14	+ $_edited_banner = ($_edited_banner->getdata());
15	+
16	+ $fieldset->addField('title', 'text', array(
17	+ 'label' => Mage::helper('wlislider')->__('Title'),
18	+ 'class' => 'required-entry validate-alpha',
19	+ 'required' => true,
20	+ 'name' => 'title',
21	+ ));
22	+
23	+ if(isset($CheckEdit))
24	+ {
25	+ $fieldset->addField('image', 'image', array(
26	+ 'label' => Mage::helper('wlislider')->__('Banner'),
27	+ 'class' => 'required-entry required-file',
28	+ 'src' => Mage::getBaseUrl('media') . 'wlislider'.DS.$_edited_banner['image'],
29	+ 'required' => true,
30	+ 'name' => 'image',
31	+ 'after_element_html' => '<div style="padding-top:5px;padding-bottom:5px" id="imagetag"><img src="'.Mage::getBaseUrl('media') . 'wlislider'.DS.$_edited_banner['image'].'" width=250px height=250/></div> ',
32	+ ));
33	+ }
34	+ else
35	+ {
36	+ $fieldset->addField('image', 'image', array(
37	+ 'label' => Mage::helper('wlislider')->__('Banner'),
38	+ 'class' => 'required-entry required-file',
39	+ 'src' => Mage::getBaseUrl('media') . 'wlislider'.DS.$_edited_banner['image'],
40	+ 'required' => true,
41	+ 'name' => 'image',
42	+ 'after_element_html' => '<small><br>File Type: <i>.jpg,.png,.gif,.jpeg</i></small>',
43	+ ));
44	+ }
45	+
46	+ $fieldset->addField('imageurl', 'text', array(
47	+ 'label' => Mage::helper('wlislider')->__('Image Url:'),
48	+ 'class' => 'required-entry',
49	+ 'required' => true,
50	+ 'name' => 'imageurl',
51	+ ));
52	+
53	+ $fieldset->addField('status', 'select', array(
54	+ 'label' => Mage::helper('wlislider')->__('Status'),
55	+ 'name' => 'status',
56	+ 'values' => array(
57	+
58	+ array(
59	+ 'value' => 1,
60	+ 'label' => Mage::helper('wlislider')->__('Active'),
61	+ ),
62	+
63	+ array(
64	+ 'value' => 0,
65	+ 'label' => Mage::helper('wlislider')->__('Inactive'),
66	+ ),
67	+ ),
68	+ ));
69	+
70	+
71	+ if ( Mage::getSingleton('adminhtml/session')->getWlisliderData() )
72	+ {
73	+ $form->setValues(Mage::getSingleton('adminhtml/session')->getWlisliderData());
74	+ Mage::getSingleton('adminhtml/session')->setWlisliderData(null);
75	+ } elseif ( Mage::registry('wlislider_data') ) {
76	+ $form->setValues(Mage::registry('wlislider_data')->getData());
77	+ }
78	+ return parent::_prepareForm();
79	+ }
80	+ }

app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Edit/Tabs.php ADDED Viewed

	@@ -0,0 +1,22 @@


1	+ <?php
2	+ class Wli_Wlislider_Block_Adminhtml_Wlislider_Edit_Tabs extends Mage_Adminhtml_Block_Widget_Tabs
3	+ {
4	+ public function __construct()
5	+ {
6	+ parent::__construct();
7	+ $this->setId('wlislider_tabs');
8	+ $this->setDestElementId('edit_form');
9	+ $this->setTitle(Mage::helper('wlislider')->__('Item Information'));
10	+ }
11	+
12	+ protected function _beforeToHtml()
13	+ {
14	+ $this->addTab('form_section', array(
15	+ 'label' => Mage::helper('wlislider')->__('Item Information'),
16	+ 'title' => Mage::helper('wlislider')->__('Item Information'),
17	+ 'content' => $this->getLayout()->createBlock('wlislider/adminhtml_wlislider_edit_tab_form')->toHtml(),
18	+ ));
19	+
20	+ return parent::_beforeToHtml();
21	+ }
22	+ }

app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Grid.php ADDED Viewed

	@@ -0,0 +1,83 @@


1	+ <?php
2	+ class Wli_Wlislider_Block_Adminhtml_Wlislider_Grid extends Mage_Adminhtml_Block_Widget_Grid
3	+ {
4	+ public function __construct()
5	+ {
6	+ parent::__construct();
7	+ $this->setId('wlisliderGrid');
8	+ // This is the primary key of the database
9	+ $this->setDefaultSort('wlislider_id');
10	+ $this->setDefaultDir('ASC');
11	+ $this->setSaveParametersInSession(true);
12	+ $this->setUseAjax(true);
13	+ }
14	+
15	+ protected function _prepareCollection()
16	+ {
17	+ $collection = Mage::getModel('wlislider/wlislider')->getCollection();
18	+ $this->setCollection($collection);
19	+ return parent::_prepareCollection();
20	+ }
21	+
22	+ protected function _prepareColumns()
23	+ {
24	+ $this->addColumn('wlislider_id', array(
25	+ 'header' => Mage::helper('wlislider')->__('ID'),
26	+ 'align' =>'right',
27	+ 'width' => '10px',
28	+ 'index' => 'wlislider_id',
29	+ ));
30	+
31	+ $this->addColumn('title', array(
32	+ 'header' => Mage::helper('wlislider')->__('Title'),
33	+ 'align' =>'left',
34	+ 'width' => '50px',
35	+ 'index' => 'title',
36	+ ));
37	+
38	+
39	+ $this->addColumn('image', array(
40	+ 'header' => Mage::helper('wlislider')->__('Image'),
41	+ 'filter' => false,
42	+ 'sortable' => false,
43	+ 'align' =>'center',
44	+ 'width' =>'150px',
45	+ 'index' => 'image',
46	+ 'renderer' =>'Wli_Wlislider_Block_Adminhtml_Wlislider_Renderer_Imagedisplay',
47	+ ));
48	+
49	+ $this->addColumn('imageurl', array(
50	+ 'header' => Mage::helper('wlislider')->__('Image Url'),
51	+ 'align' =>'left',
52	+ 'width' => '100px',
53	+ 'index' => 'imageurl',
54	+ ));
55	+
56	+ $this->addColumn('status', array(
57	+
58	+ 'header' => Mage::helper('wlislider')->__('Status'),
59	+ 'align' => 'left',
60	+ 'width' => '80px',
61	+ 'index' => 'status',
62	+ 'type' => 'options',
63	+ 'options' => array(
64	+ 1 => 'Active',
65	+ 0 => 'Inactive',
66	+ ),
67	+ ));
68	+
69	+ return parent::_prepareColumns();
70	+ }
71	+
72	+ public function getRowUrl($row)
73	+ {
74	+ return $this->getUrl('//edit', array('id' => $row->getId()));
75	+ }
76	+
77	+ public function getGridUrl()
78	+ {
79	+ return $this->getUrl('//grid', array('_current'=>true));
80	+ }
81	+
82	+
83	+ }

app/code/local/Wli/Wlislider/Block/Adminhtml/Wlislider/Renderer/Imagedisplay.php ADDED Viewed

	@@ -0,0 +1,16 @@


1	+ <?php
2	+ class Wli_Wlislider_Block_Adminhtml_Wlislider_Renderer_Imagedisplay extends Mage_Adminhtml_Block_Widget_Grid_Column_Renderer_Abstract
3	+ {
4	+ public function render(Varien_Object $row)
5	+ {
6	+ return $this->_getValue($row);
7	+ }
8	+ protected function _getValue(Varien_Object $row)
9	+ {
10	+ $imageData = $row->getData();
11	+
12	+ $url = Mage::getBaseUrl('media') . 'wlislider'.DS. $imageData['image'];
13	+ $out = "<img src=". $url ." width='150px' height='150px'/></a>";
14	+ return $out;
15	+ }
16	+ }

app/code/local/Wli/Wlislider/Block/Html/Header.php ADDED Viewed

	@@ -0,0 +1,11 @@


1	+ <?php
2	+ class Wli_Wlislider_Block_Html_Header extends Mage_Page_Block_Html_Header
3	+ {
4	+ public function _construct()
5	+ {
6	+ $collection = Mage::getModel('wlislider/wlislider')->getCollection()
7	+ ->addFieldToFilter('status',1);
8	+ $this->setCollection($collection);
9	+ $this->setTemplate('wlislider/page/html/header.phtml');
10	+ }
11	+ }

app/code/local/Wli/Wlislider/Helper/Data.php ADDED Viewed

	@@ -0,0 +1,5 @@


1	+ <?php
2	+ class Wli_Wlislider_Helper_Data extends Mage_Core_Helper_Abstract
3	+ {
4	+
5	+ }

app/code/local/Wli/Wlislider/Model/Mysql4/Wlislider.php ADDED Viewed

	@@ -0,0 +1,8 @@


1	+ <?php
2	+ class Wli_Wlislider_Model_Mysql4_Wlislider extends Mage_Core_Model_Mysql4_Abstract
3	+ {
4	+ public function _construct()
5	+ {
6	+ $this->_init('wlislider/wlislider', 'wlislider_id');
7	+ }
8	+ }

app/code/local/Wli/Wlislider/Model/Mysql4/Wlislider/Collection.php ADDED Viewed

	@@ -0,0 +1,8 @@


1	+ <?php
2	+ class Wli_Wlislider_Model_Mysql4_Wlislider_Collection extends Mage_Core_Model_Mysql4_Collection_Abstract
3	+ {
4	+ public function _construct()
5	+ {
6	+ $this->_init('wlislider/wlislider');
7	+ }
8	+ }

app/code/local/Wli/Wlislider/Model/Slideroption.php ADDED Viewed

	@@ -0,0 +1,13 @@


1	+ <?php
2	+ class Wli_Wlislider_Model_Slideroption
3	+ {
4	+ public function toOptionArray()
5	+ {
6	+ return array(
7	+ array('value'=>'fade', 'label'=>Mage::helper('wlislider')->__('Fade')),
8	+ array('value'=>'slide', 'label'=>Mage::helper('wlislider')->__('Slide')),
9	+ );
10	+ }
11	+
12	+ }
13	+

app/code/local/Wli/Wlislider/Model/Wlislider.php ADDED Viewed

	@@ -0,0 +1,10 @@


1	+ <?php
2	+ class Wli_Wlislider_Model_Wlislider extends Mage_Core_Model_Abstract
3	+ {
4	+ public function _construct()
5	+ {
6	+ parent::_construct();
7	+ $this->_init('wlislider/wlislider');
8	+ }
9	+
10	+ }

app/code/local/Wli/Wlislider/controllers/Adminhtml/WlisliderController.php ADDED Viewed

	@@ -0,0 +1,181 @@


1	+ <?php
2	+ class Wli_Wlislider_Adminhtml_WlisliderController extends Mage_Adminhtml_Controller_Action
3	+ {
4	+
5	+ protected function _initAction()
6	+ {
7	+ $this->loadLayout()
8	+ ->_setActiveMenu('wlislider/items')
9	+ ->_addBreadcrumb(Mage::helper('adminhtml')->__('Items Manager'), Mage::helper('adminhtml')->__('Item Manager'));
10	+ return $this;
11	+ }
12	+
13	+ public function indexAction() {
14	+ $this->_initAction();
15	+ $this->_addContent($this->getLayout()->createBlock('wlislider/adminhtml_wlislider'));
16	+ $this->renderLayout();
17	+ }
18	+
19	+ public function editAction()
20	+ {
21	+ $wlisliderId = $this->getRequest()->getParam('id');
22	+
23	+ $wlisliderModel = Mage::getModel('wlislider/wlislider')->load($wlisliderId);
24	+
25	+ if ($wlisliderModel->getId() \|\| $wlisliderId == 0) {
26	+
27	+ Mage::register('wlislider_data', $wlisliderModel);
28	+
29	+ $this->loadLayout();
30	+ $this->_setActiveMenu('wlislider/items');
31	+
32	+ $this->_addBreadcrumb(Mage::helper('adminhtml')->__('Item Manager'), Mage::helper('adminhtml')->__('Item Manager'));
33	+ $this->_addBreadcrumb(Mage::helper('adminhtml')->__('Item News'), Mage::helper('adminhtml')->__('Item News'));
34	+
35	+ $this->getLayout()->getBlock('head')->setCanLoadExtJs(true);
36	+
37	+ $this->_addContent($this->getLayout()->createBlock('wlislider/adminhtml_wlislider_edit'))
38	+ ->_addLeft($this->getLayout()->createBlock('wlislider/adminhtml_wlislider_edit_tabs'));
39	+
40	+ $this->renderLayout();
41	+ } else {
42	+ Mage::getSingleton('adminhtml/session')->addError(Mage::helper('wlislider')->__('Item does not exist'));
43	+ $this->_redirect('//');
44	+ }
45	+ }
46	+
47	+ public function newAction()
48	+ {
49	+ $this->_forward('edit');
50	+ }
51	+
52	+ public function saveAction()
53	+ {
54	+ if ( $this->getRequest()->getPost() ) {
55	+ try {
56	+ $postData = $this->getRequest()->getPost();
57	+ $wlisliderModel = Mage::getModel('wlislider/wlislider');
58	+ if(isset($_FILES['image']['name']) && $_FILES['image']['name'] != '')
59	+ {
60	+ try
61	+ {
62	+ if($this->getRequest()->getParam('id'))
63	+ {
64	+ $wlisliderModel->load($this->getRequest()->getParam('id'));
65	+ if($wlisliderModel->getImage())
66	+ {
67	+ $this->removeRequiredImages($wlisliderModel->getImage());
68	+ }
69	+ }
70	+ /* Upload Image Code Start */
71	+ $fileName = time()."_".$_FILES['image']['name'];
72	+ $fileExt = strtolower(substr(strrchr($fileName, "."), 1));
73	+ $fileNamewoe = rtrim($fileName, $fileExt);
74	+ $fileName = str_replace(' ', '', $fileNamewoe) . $fileExt;
75	+
76	+ $uploader = new Varien_File_Uploader('image');
77	+ $uploader->setAllowedExtensions(array('jpg','jpeg','gif','png')); //allowed extensions
78	+ $uploader->setAllowRenameFiles(false);
79	+ $uploader->setFilesDispersion(false);
80	+ $path = Mage::getBaseDir('media') . DS . 'wlislider';
81	+
82	+ if(!is_dir($path))
83	+ {
84	+ mkdir($path, 0777, true);
85	+ }
86	+
87	+ $uploader->save($path . DS, $fileName );
88	+ /* End code for image upload */
89	+
90	+
91	+
92	+
93	+ }catch (Exception $e)
94	+ {
95	+ Mage::getSingleton('adminhtml/session')->addError($e->getMessage());
96	+ $this->_redirect('//');
97	+ return;
98	+ }
99	+ }else
100	+ {
101	+ if(isset($postData['image']['delete']) && $postData['image']['delete'] == 1)
102	+ {
103	+ $fileName = '';
104	+ $wlisliderModel->load($this->getRequest()->getParam('id'));
105	+ if($wlisliderModel->getImage())
106	+ {
107	+ $this->removeRequiredImages($wlisliderModel->getImage());
108	+ }
109	+ } else
110	+ {
111	+ unset($fileName);
112	+ }
113	+ }
114	+
115	+
116	+ $wlisliderModel->setId($this->getRequest()->getParam('id'))
117	+ ->setTitle($postData['title'])
118	+ ->setImage($fileName)
119	+ ->setImageurl($postData['imageurl'])
120	+ ->setStatus($postData['status'])
121	+ ->save();
122	+
123	+ Mage::getSingleton('adminhtml/session')->addSuccess(Mage::helper('adminhtml')->__('Item was successfully saved'));
124	+ Mage::getSingleton('adminhtml/session')->setWlisliderData(false);
125	+
126	+ $this->_redirect('//');
127	+ return;
128	+ } catch (Exception $e) {
129	+ Mage::getSingleton('adminhtml/session')->addError($e->getMessage());
130	+ Mage::getSingleton('adminhtml/session')->setWlisliderData($this->getRequest()->getPost());
131	+ $this->_redirect('//edit', array('id' => $this->getRequest()->getParam('id')));
132	+ return;
133	+ }
134	+ }
135	+ $this->_redirect('//');
136	+ }
137	+
138	+ public function deleteAction()
139	+ {
140	+ if( $this->getRequest()->getParam('id') > 0 ) {
141	+ try {
142	+ $wlisliderModel = Mage::getModel('wlislider/wlislider');
143	+
144	+ $wlisliderModel->setId($this->getRequest()->getParam('id'))
145	+ ->delete();
146	+
147	+ Mage::getSingleton('adminhtml/session')->addSuccess(Mage::helper('adminhtml')->__('Item was successfully deleted'));
148	+ $this->_redirect('//');
149	+ } catch (Exception $e) {
150	+ Mage::getSingleton('adminhtml/session')->addError($e->getMessage());
151	+ $this->_redirect('//edit', array('id' => $this->getRequest()->getParam('id')));
152	+ }
153	+ }
154	+ $this->_redirect('//');
155	+ }
156	+ /**
157	+ * Product grid for AJAX request.
158	+ * Sort and filter result for example.
159	+ */
160	+ public function gridAction()
161	+ {
162	+ $this->loadLayout();
163	+ $this->getResponse()->setBody(
164	+ $this->getLayout()->createBlock('wlislider/adminhtml_wlislider_grid')->toHtml()
165	+ );
166	+ }
167	+
168	+ /**
169	+ * Remove Required Images for edit/delete data.
170	+ */
171	+ public function removeRequiredImages($fileName)
172	+ {
173	+ if(!($fileName)) return;
174	+
175	+ $orignalImg = Mage::getBaseDir('media') . DS . 'wlislider'.DS. $fileName;
176	+
177	+ if(file_exists($orignalImg)) {
178	+ unlink($orignalImg);
179	+ }
180	+ }
181	+ }

app/code/local/Wli/Wlislider/controllers/IndexController.php ADDED Viewed

	@@ -0,0 +1,9 @@


1	+ <?php
2	+ class Wli_Wlislider_IndexController extends Mage_Core_Controller_Front_Action
3	+ {
4	+ public function indexAction()
5	+ {
6	+ $this->loadLayout();
7	+ $this->renderLayout();
8	+ }
9	+ }

app/code/local/Wli/Wlislider/etc/adminhtml.xml ADDED Viewed

	@@ -0,0 +1,42 @@


1	+ <?xml version="1.0"?>
2	+ <config>
3	+ <menu>
4	+ <wlislider module="wlislider">
5	+ <title>Wlislider</title>
6	+ <sort_order>71</sort_order>
7	+ <children>
8	+ <items module="wlislider">
9	+ <title>Manage Items</title>
10	+ <sort_order>71</sort_order>
11	+ <action>wlislider/adminhtml_wlislider</action>
12	+ </items>
13	+ </children>
14	+ </wlislider>
15	+ </menu>
16	+ <acl>
17	+ <resources>
18	+ <admin>
19	+ <children>
20	+ <system>
21	+ <children>
22	+ <config>
23	+ <children>
24	+ <wli_wlislider>
25	+ <title>Wli Slider</title>
26	+ </wli_wlislider>
27	+ </children>
28	+ </config>
29	+ </children>
30	+ </system>
31	+ </children>
32	+ </admin>
33	+ </resources>
34	+ </acl>
35	+ <layout>
36	+ <updates>
37	+ <wlislider>
38	+ <file>wlislider.xml</file>
39	+ </wlislider>
40	+ </updates>
41	+ </layout>
42	+ </config>

app/code/local/Wli/Wlislider/etc/config.xml ADDED Viewed

	@@ -0,0 +1,113 @@


1	+ <?xml version="1.0"?>
2	+ <config>
3	+ <modules>
4	+ <Wli_Wlislider>
5	+ <version>0.1.0</version>
6	+ </Wli_Wlislider>
7	+ </modules>
8	+ <frontend>
9	+ <routers>
10	+ <wlislider>
11	+ <use>standard</use>
12	+ <args>
13	+ <module>Wli_Wlislider</module>
14	+ <frontName>wlislider</frontName>
15	+ </args>
16	+ </wlislider>
17	+ </routers>
18	+ <layout>
19	+ <updates>
20	+ <wlislider>
21	+ <file>wlislider.xml</file>
22	+ </wlislider>
23	+ </updates>
24	+ </layout>
25	+ </frontend>
26	+ <admin>
27	+ <routers>
28	+ <wlislider>
29	+ <use>admin</use>
30	+ <args>
31	+ <module>Wli_Wlislider</module>
32	+ <frontName>wlislider</frontName>
33	+ </args>
34	+ </wlislider>
35	+ </routers>
36	+ </admin>
37	+ <adminhtml>
38	+ <acl>
39	+ <resources>
40	+ <all>
41	+ <title>Allow Everything</title>
42	+ </all>
43	+ </resources>
44	+ </acl>
45	+ <layout>
46	+ <updates>
47	+ <wlislider>
48	+ <file>wlislider.xml</file>
49	+ </wlislider>
50	+ </updates>
51	+ </layout>
52	+ </adminhtml>
53	+ <wli_wlislider>
54	+ <wli_wlislider>
55	+ <transitionTime>1.5</transitionTime>
56	+ </wli_wlislider>
57	+ </wli_wlislider>
58	+ <global>
59	+ <models>
60	+ <wlislider>
61	+ <class>Wli_Wlislider_Model</class>
62	+ <resourceModel>wlislider_mysql4</resourceModel>
63	+ </wlislider>
64	+ <wlislider_mysql4>
65	+ <class>Wli_Wlislider_Model_Mysql4</class>
66	+ <entities>
67	+ <wlislider>
68	+ <table>wlislider</table>
69	+ </wlislider>
70	+ </entities>
71	+ </wlislider_mysql4>
72	+ </models>
73	+ <resources>
74	+ <wlislider_setup>
75	+ <setup>
76	+ <module>Wli_Wlislider</module>
77	+ </setup>
78	+ <connection>
79	+ <use>core_setup</use>
80	+ </connection>
81	+ </wlislider_setup>
82	+ <wlislider_write>
83	+ <connection>
84	+ <use>core_write</use>
85	+ </connection>
86	+
87	+
88	+ </wlislider_write>
89	+ <wlislider_read>
90	+ <connection>
91	+ <use>core_read</use>
92	+ </connection>
93	+ </wlislider_read>
94	+ </resources>
95	+ <blocks>
96	+ <page>
97	+ <rewrite>
98	+ <html_header>Wli_Wlislider_Block_Html_Header</html_header>
99	+ </rewrite>
100	+ </page>
101	+ </blocks>
102	+ <blocks>
103	+ <wlislider>
104	+ <class>Wli_Wlislider_Block</class>
105	+ </wlislider>
106	+ </blocks>
107	+ <helpers>
108	+ <wlislider>
109	+ <class>Wli_Wlislider_Helper</class>
110	+ </wlislider>
111	+ </helpers>
112	+ </global>
113	+ </config>

app/code/local/Wli/Wlislider/etc/system.xml ADDED Viewed

	@@ -0,0 +1,135 @@


1	+ <?xml version="1.0"?>
2	+ <config>
3	+ <tabs>
4	+ <wlislider translate="label" module="wlislider">
5	+ <label>Wli Slider</label>
6	+ <sort_order>250</sort_order>
7	+ </wlislider>
8	+ </tabs>
9	+ <sections>
10	+ <wli_wlislider>
11	+ <label>Wli Slider</label>
12	+ <tab>wlislider</tab>
13	+ <frontend_type>text</frontend_type>
14	+ <sort_order>1000</sort_order>
15	+ <show_in_default>1</show_in_default>
16	+ <show_in_website>1</show_in_website>
17	+ <show_in_store>1</show_in_store>
18	+ <groups>
19	+ <wli_wlislider translate="label" module="wlislider">
20	+ <label>Wlislider Menu: Config General</label>
21	+ <frontend_type>text</frontend_type>
22	+ <sort_order>1000</sort_order>
23	+ <show_in_default>1</show_in_default>
24	+ <show_in_website>1</show_in_website>
25	+ <show_in_store>1</show_in_store>
26	+ <fields>
27	+ <interval translate="label">
28	+ <label>Interval: </label>
29	+ <comment>Time interval between each slide transition</comment>
30	+ <frontend_type>text</frontend_type>
31	+ <sort_order>20</sort_order>
32	+ <show_in_default>1</show_in_default>
33	+ <show_in_website>1</show_in_website>
34	+ <show_in_store>1</show_in_store>
35	+ </interval>
36	+ <autoplay translate="label">
37	+ <label>Auto Play: </label>
38	+ <comment>Decides whether to start the show automatically</comment>
39	+ <frontend_type>select</frontend_type>
40	+ <sort_order>90</sort_order>
41	+ <show_in_default>1</show_in_default>
42	+ <show_in_website>1</show_in_website>
43	+ <show_in_store>1</show_in_store>
44	+ <source_model>adminhtml/system_config_source_yesno</source_model>
45	+ </autoplay>
46	+ <transitionType translate="label">
47	+ <label>Transition Type: </label>
48	+ <comment>Type of transition. Either a fading slideshow or a slider.</comment>
49	+ <frontend_type>select</frontend_type>
50	+ <sort_order>91</sort_order>
51	+ <show_in_default>1</show_in_default>
52	+ <show_in_website>1</show_in_website>
53	+ <show_in_store>1</show_in_store>
54	+ <source_model>wlislider/slideroption</source_model>
55	+ </transitionType>
56	+ <transitionTime translate="label">
57	+ <label>Transition Time: </label>
58	+ <comment>Time taken to animate transition from one slide to the next.</comment>
59	+ <frontend_type>text</frontend_type>
60	+ <sort_order>92</sort_order>
61	+ <show_in_default>1</show_in_default>
62	+ <show_in_website>1</show_in_website>
63	+ <show_in_store>1</show_in_store>
64	+ </transitionTime>
65	+ <navigation translate="label">
66	+ <label>Navigation: </label>
67	+ <comment>Whether to generate/use navigation elements (eg: 1,2,3,4...etc) for each slide for quick navigation.</comment>
68	+ <frontend_type>select</frontend_type>
69	+ <sort_order>93</sort_order>
70	+ <show_in_default>1</show_in_default>
71	+ <show_in_website>1</show_in_website>
72	+ <show_in_store>1</show_in_store>
73	+ <source_model>adminhtml/system_config_source_yesno</source_model>
74	+ </navigation>
75	+ <controls translate="label">
76	+ <label>Controls: </label>
77	+ <comment>Whether to generate/use control elements for forward,backward and stop/start.</comment>
78	+ <frontend_type>select</frontend_type>
79	+ <sort_order>94</sort_order>
80	+ <show_in_default>1</show_in_default>
81	+ <show_in_website>1</show_in_website>
82	+ <show_in_store>1</show_in_store>
83	+ <source_model>adminhtml/system_config_source_yesno</source_model>
84	+ </controls>
85	+ <captions translate="label">
86	+ <label>Captions: </label>
87	+ <comment>Whether to generate captions from the alt attribute of the img for each slide.</comment>
88	+ <frontend_type>select</frontend_type>
89	+ <sort_order>95</sort_order>
90	+ <show_in_default>1</show_in_default>
91	+ <show_in_website>1</show_in_website>
92	+ <show_in_store>1</show_in_store>
93	+ <source_model>adminhtml/system_config_source_yesno</source_model>
94	+ </captions>
95	+ <pauseonhover translate="label">
96	+ <label>Pause On Hover: </label>
97	+ <comment>Pause the show when mouse is hovered over the show element.</comment>
98	+ <frontend_type>select</frontend_type>
99	+ <sort_order>96</sort_order>
100	+ <show_in_default>1</show_in_default>
101	+ <show_in_website>1</show_in_website>
102	+ <show_in_store>1</show_in_store>
103	+ <source_model>adminhtml/system_config_source_yesno</source_model>
104	+ </pauseonhover>
105	+ <keyboardControls translate="label">
106	+ <label>keyboard Controls: </label>
107	+ <comment>Bind arrow keys as keyboard controls for forward and backward.</comment>
108	+ <frontend_type>select</frontend_type>
109	+ <sort_order>97</sort_order>
110	+ <show_in_default>1</show_in_default>
111	+ <show_in_website>1</show_in_website>
112	+ <show_in_store>1</show_in_store>
113	+ <source_model>adminhtml/system_config_source_yesno</source_model>
114	+ </keyboardControls>
115	+ <progressTimer translate="label">
116	+ <label>Progress Timer: </label>
117	+ <comment>Generate a "whirling" progress timer element to mark progress until next transition occurs. Only available in browsers that support HTML5 canvas.</comment>
118	+ <frontend_type>select</frontend_type>
119	+ <sort_order>98</sort_order>
120	+ <show_in_default>1</show_in_default>
121	+ <show_in_website>1</show_in_website>
122	+ <show_in_store>1</show_in_store>
123	+ <source_model>adminhtml/system_config_source_yesno</source_model>
124	+ </progressTimer>
125	+
126	+
127	+
128	+
129	+
130	+ </fields>
131	+ </wli_wlislider>
132	+ </groups>
133	+ </wli_wlislider>
134	+ </sections>
135	+ </config>

app/code/local/Wli/Wlislider/sql/wlislider_setup/mysql4-install-0.1.0.php ADDED Viewed

	@@ -0,0 +1,21 @@


1	+ <?php
2	+
3	+ $installer = $this;
4	+
5	+ $installer->startSetup();
6	+
7	+ $installer->run("
8	+
9	+ -- DROP TABLE IF EXISTS {$this->getTable('wlislider')};
10	+ CREATE TABLE {$this->getTable('wlislider')} (
11	+ `wlislider_id` int(11) unsigned NOT NULL auto_increment,
12	+ `title` varchar(255) NOT NULL default '',
13	+ `image` varchar(255) NOT NULL default '',
14	+ `imageurl` varchar(255) NOT NULL default '',
15	+ `status` smallint(6) NOT NULL default '0',
16	+ PRIMARY KEY (`wlislider_id`)
17	+ ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
18	+
19	+ ");
20	+
21	+ $installer->endSetup();

app/design/frontend/base/default/layout/wlislider.xml ADDED Viewed

	@@ -0,0 +1,74 @@


1	+ <?xml version="1.0"?>
2	+ <!--
3	+ /**
4	+ * Magento
5	+ *
6	+ * NOTICE OF LICENSE
7	+ *
8	+ * This source file is subject to the Academic Free License (AFL 3.0)
9	+ * that is bundled with this package in the file LICENSE_AFL.txt.
10	+ * It is also available through the world-wide-web at this URL:
11	+ * http://opensource.org/licenses/afl-3.0.php
12	+ * If you did not receive a copy of the license and are unable to
13	+ * obtain it through the world-wide-web, please send an email
14	+ * to license@magentocommerce.com so we can send you a copy immediately.
15	+ *
16	+ * DISCLAIMER
17	+ *
18	+ * Do not edit or add to this file if you wish to upgrade Magento to newer
19	+ * versions in the future. If you wish to customize Magento for your
20	+ * needs please refer to http://www.magentocommerce.com for more information.
21	+ *
22	+ * @category design
23	+ * @package base_default
24	+ * @copyright Copyright (c) 2014 Magento Inc. (http://www.magentocommerce.com)
25	+ * @license http://opensource.org/licenses/afl-3.0.php Academic Free License (AFL 3.0)
26	+ */
27	+ -->
28	+ <layout version="0.1.0">
29	+ <!--
30	+ Default layout, loads most of the pages
31	+ -->
32	+ <default translate="label" module="page">
33	+ <reference name="head">
34	+
35	+
36	+
37	+ <action method="removeItem"><type>skin_css</type><name>css/styles.css</name></action>
38	+ <action method="addItem"><type>skin_css</type><name>css/slider/reset.css</name></action>
39	+ <action method="addItem"><type>skin_css</type><name>css/slider/protoshow.css</name></action>
40	+ <action method="addItem"><type>skin_css</type><name>css/slider/site.css</name></action>
41	+ <action method="addItem"><type>skin_css</type><name>css/styles.css</name></action>
42	+
43	+
44	+
45	+ <action method="addJs"><script>prototype/prototype.js</script></action>
46	+ <action method="addJs"><script>lib/ccard.js</script></action>
47	+ <action method="addJs"><script>prototype/validation.js</script></action>
48	+ <action method="addJs"><script>scriptaculous/scriptaculous.js</script></action>
49	+ <action method="addJs"><script>scriptaculous/builder.js</script></action>
50	+ <action method="addJs"><script>scriptaculous/effects.js</script></action>
51	+ <action method="addJs"><script>scriptaculous/dragdrop.js</script></action>
52	+ <action method="addJs"><script>scriptaculous/controls.js</script></action>
53	+ <action method="addJs"><script>scriptaculous/slider.js</script></action>
54	+ <action method="addJs"><script>varien/js.js</script></action>
55	+ <action method="addJs"><script>varien/form.js</script></action>
56	+ <action method="addJs"><script>varien/menu.js</script></action>
57	+ <action method="addJs"><script>mage/translate.js</script></action>
58	+ <action method="addJs"><script>mage/cookies.js</script></action>
59	+
60	+ <action method="addJs"><script>slider/site.js</script></action>
61	+
62	+
63	+ <block type="page/js_cookie" name="js_cookies" template="page/js/cookie.phtml"/>
64	+
65	+ <action method="addCss"><stylesheet>css/styles.css</stylesheet></action>
66	+ <action method="addItem"><type>skin_css</type><name>css/styles-ie.css</name><params/><if>lt IE 8</if></action>
67	+ <action method="addCss"><stylesheet>css/widgets.css</stylesheet></action>
68	+ <action method="addCss"><stylesheet>css/print.css</stylesheet><params>media="print"</params></action>
69	+
70	+ <action method="addItem"><type>js</type><name>lib/ds-sleight.js</name><params/><if>lt IE 7</if></action>
71	+ <action method="addItem"><type>skin_js</type><name>js/ie6.js</name><params/><if>lt IE 7</if></action>
72	+ </reference>
73	+ </default>
74	+ </layout>

app/design/frontend/base/default/template/wlislider/page/html/header.phtml ADDED Viewed

	@@ -0,0 +1,68 @@


1	+ <?php
2	+ require_once ("protoshow.php");
3	+
4	+ /**
5	+ * Magento
6	+ *
7	+ * NOTICE OF LICENSE
8	+ *
9	+ * This source file is subject to the Academic Free License (AFL 3.0)
10	+ * that is bundled with this package in the file LICENSE_AFL.txt.
11	+ * It is also available through the world-wide-web at this URL:
12	+ * http://opensource.org/licenses/afl-3.0.php
13	+ * If you did not receive a copy of the license and are unable to
14	+ * obtain it through the world-wide-web, please send an email
15	+ * to license@magentocommerce.com so we can send you a copy immediately.
16	+ *
17	+ * DISCLAIMER
18	+ *
19	+ * Do not edit or add to this file if you wish to upgrade Magento to newer
20	+ * versions in the future. If you wish to customize Magento for your
21	+ * needs please refer to http://www.magentocommerce.com for more information.
22	+ *
23	+ * @category design
24	+ * @package base_default
25	+ * @copyright Copyright (c) 2014 Magento Inc. (http://www.magentocommerce.com)
26	+ * @license http://opensource.org/licenses/afl-3.0.php Academic Free License (AFL 3.0)
27	+ */
28	+ /**
29	+ * @var Mage_Page_Block_Html_Header $this
30	+ */
31	+
32	+ ?>
33	+ <?php $collection = $this->getCollection(); ?>
34	+ <div class="header-container">
35	+ <div class="header">
36	+ <?php if ($this->getIsHomePage()):?>
37	+ <h1 class="logo"><strong><?php echo $this->getLogoAlt() ?></strong><a href="<?php echo $this->getUrl('') ?>" title="<?php echo $this->getLogoAlt() ?>" class="logo"><img src="<?php echo $this->getLogoSrc() ?>" alt="<?php echo $this->getLogoAlt() ?>" /></a></h1>
38	+ <?php else:?>
39	+ <a href="<?php echo $this->getUrl('') ?>" title="<?php echo $this->getLogoAlt() ?>" class="logo"><strong><?php echo $this->getLogoAlt() ?></strong><img src="<?php echo $this->getLogoSrc() ?>" alt="<?php echo $this->getLogoAlt() ?>" /></a>
40	+ <?php endif?>
41	+ <div class="quick-access">
42	+ <?php echo $this->getChildHtml('topSearch') ?>
43	+ <p class="welcome-msg"><?php echo $this->getChildHtml('welcome') ?> <?php echo $this->getAdditionalHtml() ?></p>
44	+ <?php echo $this->getChildHtml('topLinks') ?>
45	+ <?php echo $this->getChildHtml('store_language') ?>
46	+ </div>
47	+ <?php echo $this->getChildHtml('topContainer'); ?>
48	+ </div>
49	+ </div>
50	+ <?php echo $this->getChildHtml('topMenu') ?>
51	+ <?php if($collection->getSize()):
52	+ $sliderdata = $collection->getdata();
53	+ $UrlData=$this->getRequest()->getParams();
54	+ ?>
55	+ <?php if($UrlData['id']=="")
56	+ { ?>
57	+ <div id="myshow1" class="protoshow">
58	+ <ul class="show">
59	+ <?php foreach($sliderdata as $slider) {?>
60	+ <?php $url = Mage::getBaseUrl('media') . 'wlislider'.DS. $slider['image']; ?>
61	+ <li class="slide" data-slide-interval=""><a href="<?php echo $slider['imageurl'];?>" target="_blank"><img src="<?php echo $url; ?>" alt="<?php echo $slider['title']?>" height="300px;" width="900px;"/></a></li>
62	+ <?php }?>
63	+
64	+
65	+ </ul>
66	+ </div>
67	+ <?php }?>
68	+ <?php endif ?>

app/etc/modules/Wli_Wlislider.xml ADDED Viewed

	@@ -0,0 +1,9 @@


1	+ <?xml version="1.0" encoding="iso-8859-1"?>
2	+ <config>
3	+ <modules>
4	+ <Wli_Wlislider>
5	+ <active>true</active>
6	+ <codePool>local</codePool>
7	+ </Wli_Wlislider>
8	+ </modules>
9	+ </config>

js/slider/123protoshow.js ADDED Viewed

	@@ -0,0 +1,746 @@


1	+ /* ProtoShow JavaScript slide show,
2	+ * v 0.9 (beta) - 24/02/12
3	+ * Copyright(c) 2012 David Smith (web: http://www.aheadcreative.com; twitter: @get_dave)
4	+ *
5	+ * This work is licenced under the Creative Commons Attribution-No Derivative Works 3.0 Unported License.
6	+ * http://creativecommons.org/licenses/by-nd/3.0/
7	+ *
8	+ * For more information on this project visit:
9	+ * http://www.protoshow.net
10	+ * http://www.deepbluesky.com
11	+ *
12	+ --------------------------------------------------------------------------/
13	+
14	+
15	+
16	+ if(typeof Prototype=='undefined' \|\| typeof Scriptaculous =='undefined') {
17	+ throw("Protoshow.js requires the Prototype & Scriptaculous JavaScript frameworks");
18	+ } else {
19	+
20	+ var protoShow = Class.create({
21	+
22	+ initialize: function(element,options) {
23	+
24	+ // Default options
25	+ this.options = Object.extend({
26	+ selector : ".slide",
27	+ interval : 3000,
28	+ initialSlide : 1,
29	+ mode : "forward",
30	+ autoPlay : true,
31	+ autoRestart : true,
32	+ transitionType : "slide",
33	+ transitionTime : 1.5,
34	+ manTransitionTime : 0.5,
35	+ navigation : true,
36	+ controls : true,
37	+ stopText : "Pause",
38	+ playText : "Play",
39	+ nextText : "Next",
40	+ previousText : "Previous",
41	+ captions : true,
42	+ pauseOnHover : false,
43	+ keyboardControls : true,
44	+ fireEvents : true,
45	+ progressTimer : true,
46	+ swipeEvents : true
47	+
48	+ }, options \|\| {}); // We use Prototype's Object.extend() to overwrite defaults with user preferences
49	+
50	+
51	+
52	+
53	+ // get/set various options
54	+ this.element = $(element); // DOM element that contains the slideshow
55	+ this.slides = this.element.select(this.options.selector); // Elements that are to be the "Slides"
56	+ this.slidesLength = this.slides.size(); // Total number of Slides
57	+ this.interval = this.options.interval;
58	+ this.transitionType = this.options.transitionType;
59	+ this.transitionTime = this.options.transitionTime;
60	+ this.manTransitionTime = this.options.manTransitionTime;
61	+ this.currentSlideID = this.options.initialSlide - 1;
62	+ this.nextSlideID = this.currentSlideID + 1;
63	+ this.playText = this.options.playText;
64	+ this.nextText = this.options.nextText;
65	+ this.previousText = this.options.previousText;
66	+ this.stopText = this.options.stopText;
67	+ this.mode = this[this.options.mode]; // Get play "mode" (forward, backward, random...etc)
68	+ this.autoPlay = this.options.autoPlay;
69	+ this.progressTimer = this.options.progressTimer;
70	+ this.showUniqueID = element; // get a unique ID based on the id attr of the show element
71	+
72	+
73	+
74	+
75	+ // define variables before use
76	+ this.running = false;
77	+ this.masterTimer = false;
78	+ this.animating = false; // boolean for "animating" status
79	+ this.loopCount = 0;
80	+ this.slideWidth = 0;
81	+ this.slideHeight = 0;
82	+ this.slideIntervals = [];
83	+ this.currentSlideEle = this.slides[this.currentSlideID];
84	+ this.nextSlideEle = this.slides[this.nextSlideID];
85	+
86	+
87	+ //run some initial setup
88	+ this.setupTransitions(this.options.transitionType);
89	+ this.setupSlides();
90	+ this.setupControls();
91	+ this.setupNavigation();
92	+ this.setupCaptions();
93	+ this.setupKeyboardControls();
94	+ this.setupSwipeEvents();
95	+ this.stopOnHover();
96	+
97	+ //this.createTimer();
98	+ this.setupTimer();
99	+
100	+ // let's get things going!
101	+ this.play();
102	+
103	+ },
104	+
105	+
106	+ /* DIRECTIONAL CONTROLS
107	+ ------------------------------------------------*/
108	+
109	+
110	+
111	+ play: function() {
112	+ // Role: Starts the show and initialises master timer
113	+
114	+ var _this = this;
115	+ this.running = true;
116	+ this.toggleMasterTimer(true);
117	+ this.updateControls(true);
118	+
119	+ this.fireCustomEvent("protoShow:started");
120	+ },
121	+
122	+ stop: function() {
123	+ // Completely stops the show and clears the master timer
124	+ var _this = this;
125	+
126	+ this.running = false;
127	+
128	+ this.toggleMasterTimer(false);
129	+ this.updateControls(false);
130	+
131	+ this.fireCustomEvent("protoShow:stopped");
132	+ },
133	+
134	+ toggleMasterTimer: function(bln) {
135	+ var _this = this;
136	+
137	+ if (bln) {
138	+ // Check if custom interval has been defined by user as data attribute in HTML
139	+ var slideInterval = (this.slideIntervals[this.currentSlideID]) ? this.slideIntervals[this.currentSlideID] : this.interval;
140	+ this.runProgressTimer();
141	+
142	+ // Set Master time which controls progress of show
143	+ this.masterTimer = new PeriodicalExecuter(function(pe) {
144	+ _this.mode();
145	+ }, slideInterval/1000);
146	+ this.loopCount++;
147	+ } else {
148	+ this.stopProgressTimer();
149	+ _this.masterTimer && _this.masterTimer.stop();
150	+ _this.masterTimer = null;
151	+ }
152	+
153	+ },
154	+
155	+ forward: function(transTime) {
156	+ // Role: Runs slideshow "forwards"
157	+
158	+ this.goMaster( this.currentSlideID + 1, transTime, "forward");
159	+ },
160	+
161	+ backward: function(transTime) {
162	+ // Role: Runs slideshow "backwards"
163	+
164	+ this.goMaster( this.currentSlideID - 1, transTime, "backward");
165	+ },
166	+
167	+ next: function() {
168	+ this.forward(this.manTransitionTime);
169	+ },
170	+
171	+ previous: function() {
172	+ this.backward(this.manTransitionTime);
173	+ },
174	+
175	+ gotoSlide: function(slide,transTime) {
176	+ if (slide === this.currentSlideID) {
177	+ return false;
178	+ }
179	+ this.goMaster( slide, this.manTransitionTime );
180	+ },
181	+
182	+ goMaster: function(next,transTime, direction) {
183	+ // Role: Master function - controls delegation of slide swapping
184	+
185	+ var _this = this;
186	+
187	+ // First thing's first, we hault the show whatever the circumstances
188	+ this.toggleMasterTimer(false);
189	+
190	+ if(this.isAnimating()) {
191	+ return false;
192	+ }
193	+
194	+ // Set the transistion speed to transTime arg (if set) else fallback to standard transitionTime
195	+ var transTime = (transTime) ? transTime : _this.transitionTime;
196	+
197	+
198	+
199	+ this.toggleAnimating(true);
200	+ this.setNextIndex(next); // set this.nextSlideID correctly
201	+
202	+ this.fireCustomEvent("protoShow:transitionStarted",transTime,direction,_this.nextSlideID);
203	+ _this.updateNavigation(_this.currentSlideID, _this.nextSlideID);
204	+
205	+ this.transitionType(this.currentSlideEle,this.nextSlideEle, {
206	+ transitionTime : transTime,
207	+ transitionFinish : function() { // pass a callback to ensure play can't resume until transition has completed
208	+ _this.toggleAnimating(false);
209	+ _this.currentSlideEle.removeClassName('active-slide');
210	+ _this.nextSlideEle.addClassName('active-slide');
211	+
212	+ _this.updateCaptions(_this.nextSlideEle);
213	+ _this.fireCustomEvent("protoShow:transitionFinished");
214	+ _this.currentSlideID = _this.nextSlideID; // update current slide to be the slide we're just moved to
215	+ _this.currentSlideEle = _this.slides[_this.nextSlideID];
216	+
217	+
218	+ if (_this.autoPlay && _this.running ) {
219	+ // if we're autoplaying and we're not explicity stopped
220	+ // otherwise show Master Timer is not permitted to restart itself
221	+ _this.toggleMasterTimer(true);
222	+ }
223	+ }
224	+ });
225	+ },
226	+
227	+
228	+ /* TRANSITION FUNCTIONS
229	+ ------------------------------------------------*/
230	+
231	+ fade: function(current,next,opts) {
232	+ // Role: Transition function
233	+ // Type: Fade - fades slides in and out
234	+
235	+ var _this = this;
236	+
237	+ next.show();
238	+ current.fade({
239	+ duration : opts.transitionTime,
240	+ afterFinish : function() {
241	+ return opts.transitionFinish();
242	+ }
243	+ });
244	+ },
245	+
246	+ slide: function(current,next,opts) {
247	+ // Role: Transition function
248	+ // Type: Slider - slides slides across the screen
249	+ var _this = this;
250	+
251	+ var leftPos = this.slideWidth * this.nextSlideID;
252	+
253	+
254	+ new Effect.Morph(_this.showEle, {
255	+ style: {
256	+ left: -leftPos + 'px'
257	+ },
258	+ duration : opts.transitionTime,
259	+ afterFinish : function() {
260	+ return opts.transitionFinish();
261	+ }
262	+ });
263	+ },
264	+
265	+
266	+
267	+ /* SETUP METHODS
268	+ ------------------------------------------------*/
269	+
270	+ setupSlides: function() {
271	+ var _this = this;
272	+
273	+
274	+
275	+ // Get and set user defined custom intervals
276	+ this.slides.each(function(e, index) {
277	+
278	+
279	+ if (_this.options.transitionType !== "slide") {
280	+ e.hide();
281	+ }
282	+ var slideInt = e.readAttribute('data-slide-interval');
283	+ slideInt = (slideInt && slideInt.blank()) ? undefined : slideInt; // check slideInt is not a blank string
284	+
285	+ _this.slideIntervals.push(slideInt); // push intervals into array for use later
286	+ });
287	+
288	+ // Ensure first slide is visible and has active class
289	+ this.slides[this.currentSlideID].show().addClassName('active-slide');
290	+ },
291	+
292	+ setupTransitions: function(transType) {
293	+ // Role: Setup basics for transitions
294	+ var _this = this;
295	+
296	+ if (typeof(transType) == "function") { // user has defined custom transition function
297	+ // If function then user has passed in custom transition function to be used
298	+ this.transitionType = transType;
299	+ this.element.addClassName('transition-custom');
300	+ } else { // it's a string
301	+ this.transitionType = this[transType];
302	+ this.element.addClassName('transition-' + transType);
303	+
304	+ if (transType === "slide") {
305	+
306	+ this.showWindow = this.element.down('.show').wrap('div', { 'class': 'show-window' });
307	+ this.showEle = this.showWindow.down('.show');
308	+ var slideLayout = this.slides[0].getLayout();
309	+ this.slideWidth = slideLayout.get('width');
310	+ this.slideHeight = slideLayout.get('height');
311	+
312	+
313	+ this.showWindow.setStyle({
314	+ width : _this.slideWidth + "px",
315	+ height : _this.slideHeight + "px"
316	+ });
317	+ }
318	+ }
319	+ },
320	+
321	+ setupControls: function() {
322	+ // Role: Setup controls
323	+
324	+ var _this = this;
325	+
326	+ if (!this.options.controls) {
327	+ return false;
328	+ }
329	+
330	+ this.protoControls = this.element.down('.proto-controls'); // Stop/Forward/Back buttons
331	+
332	+ if (typeof this.protoControls==="undefined" ) {
333	+
334	+ var controlsEle = new Element('ol', { 'class': 'proto-controls'});
335	+ var controlsTemplate = new Template('<li class="#{htmlclass}"><a href="javascript:void(0)" title="#{title}">#{text}</a></li>');
336	+
337	+ var startStop = controlsTemplate.evaluate({
338	+ htmlclass: "proto-control start-stop",
339	+ text: this.playText,
340	+ title: "Pause the show"
341	+ });
342	+ var backward = controlsTemplate.evaluate({
343	+ htmlclass: "proto-control backward",
344	+ text: this.previousText,
345	+ title: "Go to Previous slide and play backwards"
346	+ });
347	+ var forward = controlsTemplate.evaluate({
348	+ htmlclass: "proto-control forward",
349	+ text: this.nextText,
350	+ title: "Go to Next slide and play forwards"
351	+ });
352	+
353	+ // Build a DOM fragment from all the above
354	+ controlsEle.insert(startStop,'bottom').insert(backward,'bottom').insert(forward,'bottom');
355	+ this.element.insert(controlsEle,'bottom'); // add into DOM
356	+ this.protoControls = $(controlsEle); // extend the DOM fragment
357	+ }
358	+
359	+ // If the controls already exists in the DOM
360	+ this.controlStartStop = this.protoControls.down('.start-stop');
361	+ this.controlForward = this.protoControls.down('.forward');
362	+ this.controlBackward = this.protoControls.down('.backward');
363	+
364	+
365	+ // define "lock" variable to stop abuse of controls
366	+ var handlingClick = false;
367	+
368	+ this.protoControls.on("click", ".proto-control", function(event, element) {
369	+ event.stop();
370	+
371	+ // make sure we're not processing multiple click events
372	+ if (handlingClick) {
373	+ return false;
374	+ }
375	+
376	+ handlingClick = true;
377	+
378	+
379	+
380	+ if(element === _this.controlForward) {
381	+ _this.next();
382	+ } else if (element === _this.controlBackward) {
383	+ _this.previous();
384	+ } else {
385	+
386	+ if (_this.running) {
387	+ _this.stop(); // if we're "Playing" then stop the show
388	+ } else {
389	+ _this.play(); // else if we're not "Playing" then start the show
390	+ }
391	+ }
392	+ /remove the "lock" variable/
393	+ handlingClick = false;
394	+ });
395	+
396	+ },
397	+
398	+
399	+ setupNavigation: function() {
400	+ // Role: Setup Navigation
401	+ var _this = this;
402	+
403	+ if (!this.options.navigation) {
404	+ return false;
405	+ }
406	+
407	+ this.protoNavigation = this.element.down('.proto-navigation');
408	+
409	+ if (typeof this.protoNavigation==="undefined" ) {
410	+ var navEle = new Element('ol', { 'class': 'proto-navigation'});
411	+ var navTemplate = new Template('<li><a href="##{number}" title="Skip to Slide #{number}">#{number}</a></li>');
412	+
413	+ this.slides.each(function(e,index) { // for each slide in the show create a Nav <li> using the Template above
414	+ var li = navTemplate.evaluate({number: index+1});
415	+ navEle.insert(li,'bottom');
416	+ });
417	+
418	+ this.element.insert(navEle,'bottom');
419	+ this.protoNavigation = this.element.down('.proto-navigation');
420	+ }
421	+
422	+ this.protoNavigation.down('li').addClassName('current-slide');
423	+
424	+ // define "lock" variable to stop abuse of controls
425	+ var handlingClick = false;
426	+
427	+ this.protoNavigation.on("click", "a", function(event, element) {
428	+ event.stop();
429	+
430	+ // make sure we're not processing multiple click events
431	+ if (handlingClick) {
432	+ return false;
433	+ }
434	+
435	+ handlingClick = true;
436	+
437	+ var index = element.hash.substr(1,2); // get the slide ID from the href hash (eg: #3)
438	+ _this.gotoSlide(index-1);
439	+
440	+ /remove the "lock" variable/
441	+ handlingClick = false;
442	+ });
443	+ },
444	+
445	+ updateNavigation: function(current,next) {
446	+ if (typeof this.protoNavigation !== "undefined" ) {
447	+ this.protoNavigation.select('li')[current].removeClassName('current-slide');
448	+ this.protoNavigation.select('li')[next].addClassName('current-slide');
449	+ }
450	+ },
451	+
452	+ setupCaptions: function() {
453	+ var _this = this;
454	+
455	+ if (this.options.captions) {
456	+ var captionEle = new Element('div', { 'class' : 'slide-caption'});
457	+ captionEle.hide();
458	+ this.element.insert(captionEle,'bottom');
459	+ this.captionsElement = captionEle;
460	+ this.updateCaptions(_this.currentSlideEle);
461	+ }
462	+
463	+ },
464	+
465	+ updateCaptions: function(slide) {
466	+ if (!this.options.captions) {
467	+ return false;
468	+ }
469	+
470	+ var nextCaption = slide.down('img').readAttribute('alt');
471	+ if (nextCaption.replace(/^\s\|\s$/g,'').length) { // check that the attribute has some content (not just spaces)
472	+ if(!this.captionsElement.visible()) {
473	+ // just check that the element is visible
474	+ this.captionsElement.show();
475	+ }
476	+ this.captionsElement.update(nextCaption);
477	+ } else { // if no caption is found then hide the caption element
478	+ this.captionsElement.hide();
479	+ }
480	+ },
481	+
482	+
483	+ stopOnHover: function() {
484	+ var _this = this;
485	+
486	+ if (this.options.pauseOnHover) {
487	+ this.element.down('.show').observe('mouseenter',function() {
488	+ _this.stop();
489	+ }).observe('mouseleave',function() {
490	+ _this.play();
491	+ });
492	+
493	+
494	+ }
495	+ },
496	+
497	+ setupKeyboardControls: function() {
498	+ // 39 = right arrow
499	+ // 37 = left arrow
500	+
501	+ if (!this.options.keyboardControls) {
502	+ return false;
503	+ }
504	+
505	+ var _this = this;
506	+ document.observe('keydown', function(key) {
507	+
508	+ var keyCode = key.keyCode;
509	+
510	+ // stop arrow keys from working when focused on form items
511	+ if ( (!key.target.tagName.match('TEXTAREA\|INPUT\|SELECT')) && (keyCode === 37 \|\| keyCode === 39) ) {
512	+ if (keyCode === 37) {
513	+ _this.previous();
514	+ } else if (keyCode === 39) {
515	+ _this.next();
516	+ }
517	+ } else {
518	+ return false;
519	+ }
520	+ });
521	+ },
522	+
523	+ setupSwipeEvents: function() {
524	+ var _this = this;
525	+ var touchStartX = false;
526	+
527	+ if (!this.options.swipeEvents) {
528	+ return false;
529	+ }
530	+
531	+
532	+ /* TOUCH START: Get and store the position of the initial touch */
533	+ this.element.observe('touchstart', function(e) {
534	+
535	+ touchStartX = e.targetTouches[0].clientX;
536	+ });
537	+
538	+
539	+ /* TOUCH MOVE: Called every time a user moves finger across the screen */
540	+ this.element.observe('touchmove', function(e) {
541	+ e.preventDefault();
542	+ if (touchStartX > e.targetTouches[0].clientX) {
543	+ _this.previous();
544	+ } else {
545	+ _this.next();
546	+ }
547	+ });
548	+
549	+ },
550	+
551	+
552	+
553	+ fireCustomEvent: function(event_name,trans_time,direction,slideID) {
554	+ if(this.options.fireEvents) {
555	+ var element = this.element;
556	+ element.fire(event_name, {
557	+ showID : this.showUniqueID,
558	+ transitionTime : trans_time,
559	+ direction : direction,
560	+ slideID : slideID
561	+ });
562	+ }
563	+ },
564	+
565	+
566	+ /* UTILITY FUNCTIONS
567	+ ------------------------------------------------*/
568	+
569	+ isPlaying: function() {
570	+ return this.masterTimer != null;
571	+ },
572	+
573	+ isAnimating: function() {
574	+ return this.animating;
575	+ },
576	+
577	+ toggleAnimating: function(bln) {
578	+ // Role: toggles var to say whether animation is in progress and manipulates DOM
579	+ this.animating = bln;
580	+ if (bln) {
581	+ this.element.addClassName("animating");
582	+ } else {
583	+ this.element.removeClassName("animating");
584	+ }
585	+ },
586	+
587	+ setNextIndex: function(next) {
588	+ // Role: Decides on direction and ensures within bounds
589	+
590	+ if(next === undefined) { // Ensure "next" has a value
591	+ next = this.currentSlideID+1;
592	+ }
593	+
594	+ // Ensure we're within bounds
595	+ if (next >= this.slidesLength) {
596	+ next = 0;
597	+ } else if (next < 0 ){
598	+ next = this.slidesLength-1;
599	+ }
600	+
601	+ this.nextSlideID = next;
602	+ this.nextSlideEle = this.slides[this.nextSlideID];
603	+ },
604	+
605	+ updateControls: function(status) {
606	+ if (this.options.controls) {
607	+ // Role: Updates the status of the Play/Pause button
608	+ var _this = this;
609	+
610	+ if (status) { // The show has been started so update the button to "Pause"
611	+ this.controlStartStop.down('a').update(_this.stopText);
612	+ } else {
613	+ // The show has been stopped so update the button to "Play"
614	+ this.controlStartStop.down('a').update(_this.playText);
615	+ }
616	+ }
617	+
618	+ },
619	+
620	+
621	+
622	+ setupTimer: function() {
623	+ // Role: creates the proto-progress-timer <canvas> element, gets 2D Context and inserta into DOM
624	+
625	+ this.progressTimerEle = document.createElement('canvas');
626	+ if (this.progressTimerEle.getContext && this.progressTimerEle.getContext('2d')) { // test for Canvas support
627	+ this.progressTimerEle.writeAttribute('class','proto-progress-timer');
628	+ this.progressTimerEle.width = 30;
629	+ this.progressTimerEle.height = 30;
630	+ this.element.insert(this.progressTimerEle,'bottom');
631	+ this.progressTimerCtx = this.progressTimerEle.getContext('2d');
632	+ } else {
633	+ this.progressTimer = false; // no canvas support
634	+ }
635	+ },
636	+
637	+
638	+ runProgressTimer: function() {
639	+ // Role: runs & controls the animation of the "progress timer"
640	+
641	+ var _this = this;
642	+
643	+
644	+ if (this.progressTimer) { // if user has set to use progress timer and the browser supports <canvas>
645	+
646	+
647	+
648	+ this.progressTimerEle.show();
649	+
650	+ // use Epoch time to ensure code executes in time specified
651	+ // borrowed from Emile JS http://script.aculo.us/downloads/emile.pdf
652	+ var start = (new Date).getTime();
653	+
654	+ // we want the timer to finish slightly before the slide transitions
655	+ // so we shorten the duration by 1/4
656	+ var duration = this.interval*0.75;
657	+ var finish = start+duration;
658	+ var angleStart = 0;
659	+
660	+
661	+ this.progressTimerPE = new PeriodicalExecuter(function(pe) {
662	+ _this.resetProgressTimer(); // clear the canvas ready for next segment
663	+ this.drawArc(_this.progressTimerCtx,0,360,'rgba(0,0,0,.2)'); // redraw the black bg circle
664	+
665	+ var time = (new Date).getTime();
666	+ var pos = time>finish ? 1 : (time-start)/duration;
667	+
668	+ // draw the arch passing in the ctx and the degress of the arch
669	+ this.drawArc(_this.progressTimerCtx,-5,Math.floor(( (360) * pos)),'rgba(255,255,255,.8)',true);
670	+
671	+ if( (!this.isPlaying()) \|\| time>finish) { // if we are stopped or we are finished then stop the PE and fade the canvas out
672	+ pe.stop();
673	+ _this.progressTimerEle.fade({
674	+ duration: (_this.interval > 1000) ? (_this.interval/8)/1000 : 0.2,
675	+ afterFinish: function() {
676	+ _this.resetProgressTimer();
677	+ }
678	+ });
679	+ }
680	+ }.bind(this),duration/100000);
681	+ }
682	+ },
683	+
684	+
685	+ resetProgressTimer: function() {
686	+ this.progressTimerEle.width = this.progressTimerEle.width;
687	+ },
688	+
689	+ stopProgressTimer: function() {
690	+ this.resetProgressTimer();
691	+ clearInterval(this.progressTimerPE);
692	+ },
693	+
694	+ drawArc: function(canvasCtx,startAngle,endAngle,strokeStyle) {
695	+ // Role: utility function for drawing archs on <canvas> elements
696	+
697	+ var drawingArc = true;
698	+ var ctx = canvasCtx;
699	+
700	+ ctx.beginPath();
701	+ ctx.strokeStyle = strokeStyle;
702	+ ctx.lineCap = 'butt';
703	+ ctx.lineWidth = 4;
704	+
705	+ ctx.arc(15,15,10, (Math.PI/180)(startAngle-90),(Math.PI/180)(endAngle-90), false);
706	+ ctx.stroke();
707	+ var drawingArc = false;
708	+ },
709	+
710	+
711	+
712	+ /* LOGGING FUNCTIONS
713	+ ------------------------------------------------*/
714	+
715	+ /*reportSlides: function() {
716	+ console.log("Current slide: " + this.currentSlideID);
717	+ console.log("Next slide: " + this.nextSlideID);
718	+ },*/
719	+
720	+
721	+
722	+
723	+ cc: function() {
724	+ // catches the comma
725	+ }
726	+
727	+
728	+
729	+
730	+ });
731	+
732	+ Element.addMethods({
733	+ // Make Protoshow available as method of all Prototype extended elements
734	+ // http://www.prototypejs.org/api/element/addmethods
735	+ protoShow: function(element, options) {
736	+ element = $(element);
737	+ var theShow = new protoShow(element,options);
738	+ return theShow;
739	+ }
740	+ });
741	+
742	+ }
743	+
744	+
745	+
746	+

js/slider/site.js ADDED Viewed

	@@ -0,0 +1,21 @@


1	+ var myshow;
2	+
3	+ Event.observe(window, "load", function() {
4	+
5	+
6	+ /*var myshow = new protoShow('myshow1',{
7	+ interval : 3000,
8	+ captions : true,
9	+ transitionType : "fade",
10	+ pauseOnHover : true,
11	+ cc : false
12	+ });*/
13	+
14	+ $('myshow1') && $('myshow1').protoShow({
15	+ interval : 2000,
16	+ captions : true
17	+ });
18	+
19	+
20	+
21	+ });

package.xml ADDED Viewed

	@@ -0,0 +1,18 @@


1	+ <?xml version="1.0"?>
2	+ <package>
3	+ <name>sliderbywebline</name>
4	+ <version>0.1.0</version>
5	+ <stability>stable</stability>
6	+ <license>GNU</license>
7	+ <channel>community</channel>
8	+ <extends/>
9	+ <summary>Banner Slider</summary>
10	+ <description>This the extension which will help the end user for the creating the slider of the image and products in the home page only.</description>
11	+ <notes>First Release</notes>
12	+ <authors><author><name>Webline</name><user>WeblineIndia</user><email>partners@weblineindia.com</email></author></authors>
13	+ <date>2015-03-31</date>
14	+ <time>06:58:18</time>
15	+ <contents><target name="magelocal"><dir name="Wli"><dir name="Wlislider"><dir name="Block"><dir name="Adminhtml"><dir name="Wlislider"><dir name="Edit"><file name="Form.php" hash="6b3c6cc2d21ca619afcac5c72a88a91f"/><dir name="Tab"><file name="Form.php" hash="9bcfce5ba5c7cc9e2314e08bd165c972"/></dir><file name="Tabs.php" hash="26a72f6cde207c9d4927a36a844ae36c"/></dir><file name="Edit.php" hash="180fb5869e1d96c7f1972d625060471e"/><file name="Grid.php" hash="b563d8fe83d62bcd3894abcbe51bd3ad"/><dir name="Renderer"><file name="Imagedisplay.php" hash="daf57760179b1a7b981f40be23c7998a"/></dir></dir><file name="Wlislider.php" hash="b731c5897b925c71c3d8f71f43f20680"/></dir><dir name="Html"><file name="Header.php" hash="f0021b078c8e1b54d2cdc00a64b10e20"/></dir></dir><dir name="Helper"><file name="Data.php" hash="1470ed740469ef03673c18098edf314c"/></dir><dir name="Model"><dir name="Mysql4"><dir name="Wlislider"><file name="Collection.php" hash="0abfee6305ac9cc3bdbb8f706a404da7"/></dir><file name="Wlislider.php" hash="32bd5804ad6e9edede5dfc1a96f521c6"/></dir><file name="Slideroption.php" hash="395881e1d1588004c1180e121b5b9604"/><file name="Wlislider.php" hash="6c9ea49c6d4bb61e5b89a8df77b176b3"/></dir><dir name="controllers"><dir name="Adminhtml"><file name="WlisliderController.php" hash="ebabdc6970a8e27eb92955897efe045c"/></dir><file name="IndexController.php" hash="876ece3f7e8da8635e54390315587a25"/></dir><dir name="etc"><file name="adminhtml.xml" hash="dd529ace51d0259e828bdfc1311570a9"/><file name="config.xml" hash="b458da7ea807dea9e2e3772b0ddfcd45"/><file name="system.xml" hash="4b8c924dfb600c2b2d088b78b4c79858"/></dir><dir name="sql"><dir name="wlislider_setup"><file name="mysql4-install-0.1.0.php" hash="e7d1233a2effd29cd77a677cb7452dd9"/></dir></dir></dir></dir></target><target name="mageetc"><dir name="modules"><file name="Wli_Wlislider.xml" hash="e15be05123fd644bbf4733de7c4282fa"/></dir></target><target name="magedesign"><dir name="frontend"><dir name="base"><dir name="default"><dir name="layout"><file name="wlislider.xml" hash="671811c7f1bfd8d2cf2af29641554ee9"/></dir><dir name="template"><dir name="wlislider"><dir name="page"><dir name="html"><file name="header.phtml" hash="b46012ac7e8b3f7ca2567cb8719c105d"/></dir></dir></dir></dir></dir></dir></dir></target><target name="mage"><dir name="."><file name="protoshow.php" hash="97f8dbf249aac78e0b3017b6f1b3d06e"/></dir><dir name="js"><dir name="slider"><file name="123protoshow.js" hash="0dc6f8d10dddf79c89b053bffc22787a"/><file name="site.js" hash="c65079ba473db100957b25dd1bee77b4"/></dir></dir></target><target name="mageskin"><dir name="frontend"><dir name="base"><dir name="default"><dir name="css"><dir name="slider"><file name="protoshow.css" hash="47388f1c00b9be464a0a35cb4b647250"/><file name="reset.css" hash="6d14fba47843fe2375aeeb7e5d9cf783"/><file name="site.css" hash="ef716c6aa8aabac7ae3750c2d8ac0a7c"/></dir></dir></dir></dir></dir></target></contents>
16	+ <compatible/>
17	+ <dependencies><required><php><min>5.2.0</min><max>5.6.0</max></php></required></dependencies>
18	+ </package>

protoshow.php ADDED Viewed

	@@ -0,0 +1,758 @@


1	+ <?php
2	+ $interval = Mage::getStoreConfig('wli_wlislider/wli_wlislider/interval',Mage::app()->getStore());
3	+ $autoplay = Mage::getStoreConfig('wli_wlislider/wli_wlislider/autoplay',Mage::app()->getStore()) ==1 ? 'true' : 'false';
4	+ $transitionType = Mage::getStoreConfig('wli_wlislider/wli_wlislider/transitionType',Mage::app()->getStore());
5	+ $transitionTime = Mage::getStoreConfig('wli_wlislider/wli_wlislider/transitionTime',Mage::app()->getStore());
6	+ $navigation = Mage::getStoreConfig('wli_wlislider/wli_wlislider/navigation',Mage::app()->getStore()) == 1 ? 'true' : 'false';
7	+ $controls = Mage::getStoreConfig('wli_wlislider/wli_wlislider/controls',Mage::app()->getStore()) == 1 ? 'true' : 'false';
8	+ $captions = Mage::getStoreConfig('wli_wlislider/wli_wlislider/captions',Mage::app()->getStore()) == 1 ? 'true' : 'false';
9	+ $pauseonhover = Mage::getStoreConfig('wli_wlislider/wli_wlislider/pauseonhover',Mage::app()->getStore()) == 1 ? 'true' : 'false';
10	+ $keyboardControls = Mage::getStoreConfig('wli_wlislider/wli_wlislider/keyboardControls',Mage::app()->getStore()) == 1 ? 'true' : 'false';
11	+ $progressTimer = Mage::getStoreConfig('wli_wlislider/wli_wlislider/progressTimer',Mage::app()->getStore()) == 1 ? 'true' : 'false';
12	+
13	+
14	+ ?>
15	+ <script>
16	+ /* ProtoShow JavaScript slide show,
17	+ * v 0.9 (beta) - 24/02/12
18	+ * Copyright(c) 2012 David Smith (web: http://www.aheadcreative.com; twitter: @get_dave)
19	+ *
20	+ * This work is licenced under the Creative Commons Attribution-No Derivative Works 3.0 Unported License.
21	+ * http://creativecommons.org/licenses/by-nd/3.0/
22	+ *
23	+ * For more information on this project visit:
24	+ * http://www.protoshow.net
25	+ * http://www.deepbluesky.com
26	+ *
27	+ --------------------------------------------------------------------------/
28	+
29	+
30	+
31	+ if(typeof Prototype=='undefined' \|\| typeof Scriptaculous =='undefined') {
32	+ throw("Protoshow.js requires the Prototype & Scriptaculous JavaScript frameworks");
33	+ } else {
34	+
35	+ var protoShow = Class.create({
36	+
37	+ initialize: function(element,options) {
38	+
39	+ // Default options
40	+ this.options = Object.extend({
41	+ selector : ".slide",
42	+ interval : <?php echo $interval;?>,
43	+ initialSlide : 1,
44	+ mode : "forward",
45	+ autoPlay : <?php echo $autoplay;?>,
46	+ autoRestart : true,
47	+ transitionType : "<?php echo $transitionType; ?>",
48	+ transitionTime : <?php echo $transitionTime;?>,
49	+ manTransitionTime : 0.5,
50	+ navigation : <?php echo $navigation; ?>,
51	+ controls : <?php echo $controls;?>,
52	+ stopText : "Pause",
53	+ playText : "Play",
54	+ nextText : "Next",
55	+ previousText : "Previous",
56	+ captions : <?php echo $captions;?>,
57	+ pauseOnHover : <?php echo $pauseonhover;?>,
58	+ keyboardControls : <?php echo $keyboardControls;?>,
59	+ fireEvents : true,
60	+ progressTimer : <?php echo $progressTimer;?>,
61	+ swipeEvents : true
62	+
63	+ }, options \|\| {}); // We use Prototype's Object.extend() to overwrite defaults with user preferences
64	+
65	+
66	+
67	+
68	+ // get/set various options
69	+ this.element = $(element); // DOM element that contains the slideshow
70	+ this.slides = this.element.select(this.options.selector); // Elements that are to be the "Slides"
71	+ this.slidesLength = this.slides.size(); // Total number of Slides
72	+ this.interval = this.options.interval;
73	+ this.transitionType = this.options.transitionType;
74	+ this.transitionTime = this.options.transitionTime;
75	+ this.manTransitionTime = this.options.manTransitionTime;
76	+ this.currentSlideID = this.options.initialSlide - 1;
77	+ this.nextSlideID = this.currentSlideID + 1;
78	+ this.playText = this.options.playText;
79	+ this.nextText = this.options.nextText;
80	+ this.previousText = this.options.previousText;
81	+ this.stopText = this.options.stopText;
82	+ this.mode = this[this.options.mode]; // Get play "mode" (forward, backward, random...etc)
83	+ this.autoPlay = this.options.autoPlay;
84	+ this.progressTimer = this.options.progressTimer;
85	+ this.showUniqueID = element; // get a unique ID based on the id attr of the show element
86	+
87	+
88	+
89	+
90	+ // define variables before use
91	+ this.running = false;
92	+ this.masterTimer = false;
93	+ this.animating = false; // boolean for "animating" status
94	+ this.loopCount = 0;
95	+ this.slideWidth = 0;
96	+ this.slideHeight = 0;
97	+ this.slideIntervals = [];
98	+ this.currentSlideEle = this.slides[this.currentSlideID];
99	+ this.nextSlideEle = this.slides[this.nextSlideID];
100	+
101	+
102	+ //run some initial setup
103	+ this.setupTransitions(this.options.transitionType);
104	+ this.setupSlides();
105	+ this.setupControls();
106	+ this.setupNavigation();
107	+ this.setupCaptions();
108	+ this.setupKeyboardControls();
109	+ this.setupSwipeEvents();
110	+ this.stopOnHover();
111	+
112	+ //this.createTimer();
113	+ this.setupTimer();
114	+
115	+ // let's get things going!
116	+ this.play();
117	+
118	+ },
119	+
120	+
121	+ /* DIRECTIONAL CONTROLS
122	+ ------------------------------------------------*/
123	+
124	+
125	+
126	+ play: function() {
127	+ // Role: Starts the show and initialises master timer
128	+
129	+ var _this = this;
130	+ this.running = true;
131	+ this.toggleMasterTimer(true);
132	+ this.updateControls(true);
133	+
134	+ this.fireCustomEvent("protoShow:started");
135	+ },
136	+
137	+ stop: function() {
138	+ // Completely stops the show and clears the master timer
139	+ var _this = this;
140	+
141	+ this.running = false;
142	+
143	+ this.toggleMasterTimer(false);
144	+ this.updateControls(false);
145	+
146	+ this.fireCustomEvent("protoShow:stopped");
147	+ },
148	+
149	+ toggleMasterTimer: function(bln) {
150	+ var _this = this;
151	+
152	+ if (bln) {
153	+ // Check if custom interval has been defined by user as data attribute in HTML
154	+ var slideInterval = (this.slideIntervals[this.currentSlideID]) ? this.slideIntervals[this.currentSlideID] : this.interval;
155	+ this.runProgressTimer();
156	+
157	+ // Set Master time which controls progress of show
158	+ this.masterTimer = new PeriodicalExecuter(function(pe) {
159	+ _this.mode();
160	+ }, slideInterval/1000);
161	+ this.loopCount++;
162	+ } else {
163	+ this.stopProgressTimer();
164	+ _this.masterTimer && _this.masterTimer.stop();
165	+ _this.masterTimer = null;
166	+ }
167	+
168	+ },
169	+
170	+ forward: function(transTime) {
171	+ // Role: Runs slideshow "forwards"
172	+
173	+ this.goMaster( this.currentSlideID + 1, transTime, "forward");
174	+ },
175	+
176	+ backward: function(transTime) {
177	+ // Role: Runs slideshow "backwards"
178	+
179	+ this.goMaster( this.currentSlideID - 1, transTime, "backward");
180	+ },
181	+
182	+ next: function() {
183	+ this.forward(this.manTransitionTime);
184	+ },
185	+
186	+ previous: function() {
187	+ this.backward(this.manTransitionTime);
188	+ },
189	+
190	+ gotoSlide: function(slide,transTime) {
191	+ if (slide === this.currentSlideID) {
192	+ return false;
193	+ }
194	+ this.goMaster( slide, this.manTransitionTime );
195	+ },
196	+
197	+ goMaster: function(next,transTime, direction) {
198	+ // Role: Master function - controls delegation of slide swapping
199	+
200	+ var _this = this;
201	+
202	+ // First thing's first, we hault the show whatever the circumstances
203	+ this.toggleMasterTimer(false);
204	+
205	+ if(this.isAnimating()) {
206	+ return false;
207	+ }
208	+
209	+ // Set the transistion speed to transTime arg (if set) else fallback to standard transitionTime
210	+ var transTime = (transTime) ? transTime : _this.transitionTime;
211	+
212	+
213	+
214	+ this.toggleAnimating(true);
215	+ this.setNextIndex(next); // set this.nextSlideID correctly
216	+
217	+ this.fireCustomEvent("protoShow:transitionStarted",transTime,direction,_this.nextSlideID);
218	+ _this.updateNavigation(_this.currentSlideID, _this.nextSlideID);
219	+
220	+ this.transitionType(this.currentSlideEle,this.nextSlideEle, {
221	+ transitionTime : transTime,
222	+ transitionFinish : function() { // pass a callback to ensure play can't resume until transition has completed
223	+ _this.toggleAnimating(false);
224	+ _this.currentSlideEle.removeClassName('active-slide');
225	+ _this.nextSlideEle.addClassName('active-slide');
226	+
227	+ _this.updateCaptions(_this.nextSlideEle);
228	+ _this.fireCustomEvent("protoShow:transitionFinished");
229	+ _this.currentSlideID = _this.nextSlideID; // update current slide to be the slide we're just moved to
230	+ _this.currentSlideEle = _this.slides[_this.nextSlideID];
231	+
232	+
233	+ if (_this.autoPlay && _this.running ) {
234	+ // if we're autoplaying and we're not explicity stopped
235	+ // otherwise show Master Timer is not permitted to restart itself
236	+ _this.toggleMasterTimer(true);
237	+ }
238	+ }
239	+ });
240	+ },
241	+
242	+
243	+ /* TRANSITION FUNCTIONS
244	+ ------------------------------------------------*/
245	+
246	+ fade: function(current,next,opts) {
247	+ // Role: Transition function
248	+ // Type: Fade - fades slides in and out
249	+
250	+ var _this = this;
251	+
252	+ next.show();
253	+ current.fade({
254	+ duration : opts.transitionTime,
255	+ afterFinish : function() {
256	+ return opts.transitionFinish();
257	+ }
258	+ });
259	+ },
260	+
261	+ slide: function(current,next,opts) {
262	+ // Role: Transition function
263	+ // Type: Slider - slides slides across the screen
264	+ var _this = this;
265	+
266	+ var leftPos = this.slideWidth * this.nextSlideID;
267	+
268	+
269	+ new Effect.Morph(_this.showEle, {
270	+ style: {
271	+ left: -leftPos + 'px'
272	+ },
273	+ duration : opts.transitionTime,
274	+ afterFinish : function() {
275	+ return opts.transitionFinish();
276	+ }
277	+ });
278	+ },
279	+
280	+
281	+
282	+ /* SETUP METHODS
283	+ ------------------------------------------------*/
284	+
285	+ setupSlides: function() {
286	+ var _this = this;
287	+
288	+
289	+
290	+ // Get and set user defined custom intervals
291	+ this.slides.each(function(e, index) {
292	+
293	+
294	+ if (_this.options.transitionType !== "slide") {
295	+ e.hide();
296	+ }
297	+ var slideInt = e.readAttribute('data-slide-interval');
298	+ slideInt = (slideInt && slideInt.blank()) ? undefined : slideInt; // check slideInt is not a blank string
299	+
300	+ _this.slideIntervals.push(slideInt); // push intervals into array for use later
301	+ });
302	+
303	+ // Ensure first slide is visible and has active class
304	+ this.slides[this.currentSlideID].show().addClassName('active-slide');
305	+ },
306	+
307	+ setupTransitions: function(transType) {
308	+ // Role: Setup basics for transitions
309	+ var _this = this;
310	+
311	+ if (typeof(transType) == "function") { // user has defined custom transition function
312	+ // If function then user has passed in custom transition function to be used
313	+ this.transitionType = transType;
314	+ this.element.addClassName('transition-custom');
315	+ } else { // it's a string
316	+ this.transitionType = this[transType];
317	+ this.element.addClassName('transition-' + transType);
318	+
319	+ if (transType === "slide") {
320	+
321	+ this.showWindow = this.element.down('.show').wrap('div', { 'class': 'show-window' });
322	+ this.showEle = this.showWindow.down('.show');
323	+ var slideLayout = this.slides[0].getLayout();
324	+ this.slideWidth = slideLayout.get('width');
325	+ this.slideHeight = slideLayout.get('height');
326	+
327	+
328	+ this.showWindow.setStyle({
329	+ width : _this.slideWidth + "px",
330	+ height : _this.slideHeight + "px"
331	+ });
332	+ }
333	+ }
334	+ },
335	+
336	+ setupControls: function() {
337	+ // Role: Setup controls
338	+
339	+ var _this = this;
340	+
341	+ if (!this.options.controls) {
342	+ return false;
343	+ }
344	+
345	+ this.protoControls = this.element.down('.proto-controls'); // Stop/Forward/Back buttons
346	+
347	+ if (typeof this.protoControls==="undefined" ) {
348	+
349	+ var controlsEle = new Element('ol', { 'class': 'proto-controls'});
350	+ var controlsTemplate = new Template('<li class="#{htmlclass}"><a href="javascript:void(0)" title="#{title}">#{text}</a></li>');
351	+
352	+ var startStop = controlsTemplate.evaluate({
353	+ htmlclass: "proto-control start-stop",
354	+ text: this.playText,
355	+ title: "Pause the show"
356	+ });
357	+ var backward = controlsTemplate.evaluate({
358	+ htmlclass: "proto-control backward",
359	+ text: this.previousText,
360	+ title: "Go to Previous slide and play backwards"
361	+ });
362	+ var forward = controlsTemplate.evaluate({
363	+ htmlclass: "proto-control forward",
364	+ text: this.nextText,
365	+ title: "Go to Next slide and play forwards"
366	+ });
367	+
368	+ // Build a DOM fragment from all the above
369	+ controlsEle.insert(startStop,'bottom').insert(backward,'bottom').insert(forward,'bottom');
370	+ this.element.insert(controlsEle,'bottom'); // add into DOM
371	+ this.protoControls = $(controlsEle); // extend the DOM fragment
372	+ }
373	+
374	+ // If the controls already exists in the DOM
375	+ this.controlStartStop = this.protoControls.down('.start-stop');
376	+ this.controlForward = this.protoControls.down('.forward');
377	+ this.controlBackward = this.protoControls.down('.backward');
378	+
379	+
380	+ // define "lock" variable to stop abuse of controls
381	+ var handlingClick = false;
382	+
383	+ this.protoControls.on("click", ".proto-control", function(event, element) {
384	+ event.stop();
385	+
386	+ // make sure we're not processing multiple click events
387	+ if (handlingClick) {
388	+ return false;
389	+ }
390	+
391	+ handlingClick = true;
392	+
393	+
394	+
395	+ if(element === _this.controlForward) {
396	+ _this.next();
397	+ } else if (element === _this.controlBackward) {
398	+ _this.previous();
399	+ } else {
400	+
401	+ if (_this.running) {
402	+ _this.stop(); // if we're "Playing" then stop the show
403	+ } else {
404	+ _this.play(); // else if we're not "Playing" then start the show
405	+ }
406	+ }
407	+ /remove the "lock" variable/
408	+ handlingClick = false;
409	+ });
410	+
411	+ },
412	+
413	+
414	+ setupNavigation: function() {
415	+ // Role: Setup Navigation
416	+ var _this = this;
417	+
418	+ if (!this.options.navigation) {
419	+ return false;
420	+ }
421	+
422	+ this.protoNavigation = this.element.down('.proto-navigation');
423	+
424	+ if (typeof this.protoNavigation==="undefined" ) {
425	+ var navEle = new Element('ol', { 'class': 'proto-navigation'});
426	+ var navTemplate = new Template('<li><a href="##{number}" title="Skip to Slide #{number}">#{number}</a></li>');
427	+
428	+ this.slides.each(function(e,index) { // for each slide in the show create a Nav <li> using the Template above
429	+ var li = navTemplate.evaluate({number: index+1});
430	+ navEle.insert(li,'bottom');
431	+ });
432	+
433	+ this.element.insert(navEle,'bottom');
434	+ this.protoNavigation = this.element.down('.proto-navigation');
435	+ }
436	+
437	+ this.protoNavigation.down('li').addClassName('current-slide');
438	+
439	+ // define "lock" variable to stop abuse of controls
440	+ var handlingClick = false;
441	+
442	+ this.protoNavigation.on("click", "a", function(event, element) {
443	+ event.stop();
444	+
445	+ // make sure we're not processing multiple click events
446	+ if (handlingClick) {
447	+ return false;
448	+ }
449	+
450	+ handlingClick = true;
451	+
452	+ var index = element.hash.substr(1,2); // get the slide ID from the href hash (eg: #3)
453	+ _this.gotoSlide(index-1);
454	+
455	+ /remove the "lock" variable/
456	+ handlingClick = false;
457	+ });
458	+ },
459	+
460	+ updateNavigation: function(current,next) {
461	+ if (typeof this.protoNavigation !== "undefined" ) {
462	+ this.protoNavigation.select('li')[current].removeClassName('current-slide');
463	+ this.protoNavigation.select('li')[next].addClassName('current-slide');
464	+ }
465	+ },
466	+
467	+ setupCaptions: function() {
468	+ var _this = this;
469	+
470	+ if (this.options.captions) {
471	+ var captionEle = new Element('div', { 'class' : 'slide-caption'});
472	+ captionEle.hide();
473	+ this.element.insert(captionEle,'bottom');
474	+ this.captionsElement = captionEle;
475	+ this.updateCaptions(_this.currentSlideEle);
476	+ }
477	+
478	+ },
479	+
480	+ updateCaptions: function(slide) {
481	+ if (!this.options.captions) {
482	+ return false;
483	+ }
484	+
485	+ var nextCaption = slide.down('img').readAttribute('alt');
486	+ if (nextCaption.replace(/^\s\|\s$/g,'').length) { // check that the attribute has some content (not just spaces)
487	+ if(!this.captionsElement.visible()) {
488	+ // just check that the element is visible
489	+ this.captionsElement.show();
490	+ }
491	+ this.captionsElement.update(nextCaption);
492	+ } else { // if no caption is found then hide the caption element
493	+ this.captionsElement.hide();
494	+ }
495	+ },
496	+
497	+
498	+ stopOnHover: function() {
499	+ var _this = this;
500	+
501	+ if (this.options.pauseOnHover) {
502	+ this.element.down('.show').observe('mouseenter',function() {
503	+ _this.stop();
504	+ }).observe('mouseleave',function() {
505	+ _this.play();
506	+ });
507	+
508	+
509	+ }
510	+ },
511	+
512	+ setupKeyboardControls: function() {
513	+ // 39 = right arrow
514	+ // 37 = left arrow
515	+
516	+ if (!this.options.keyboardControls) {
517	+ return false;
518	+ }
519	+
520	+ var _this = this;
521	+ document.observe('keydown', function(key) {
522	+
523	+ var keyCode = key.keyCode;
524	+
525	+ // stop arrow keys from working when focused on form items
526	+ if ( (!key.target.tagName.match('TEXTAREA\|INPUT\|SELECT')) && (keyCode === 37 \|\| keyCode === 39) ) {
527	+ if (keyCode === 37) {
528	+ _this.previous();
529	+ } else if (keyCode === 39) {
530	+ _this.next();
531	+ }
532	+ } else {
533	+ return false;
534	+ }
535	+ });
536	+ },
537	+
538	+ setupSwipeEvents: function() {
539	+ var _this = this;
540	+ var touchStartX = false;
541	+
542	+ if (!this.options.swipeEvents) {
543	+ return false;
544	+ }
545	+
546	+
547	+ /* TOUCH START: Get and store the position of the initial touch */
548	+ this.element.observe('touchstart', function(e) {
549	+
550	+ touchStartX = e.targetTouches[0].clientX;
551	+ });
552	+
553	+
554	+ /* TOUCH MOVE: Called every time a user moves finger across the screen */
555	+ this.element.observe('touchmove', function(e) {
556	+ e.preventDefault();
557	+ if (touchStartX > e.targetTouches[0].clientX) {
558	+ _this.previous();
559	+ } else {
560	+ _this.next();
561	+ }
562	+ });
563	+
564	+ },
565	+
566	+
567	+
568	+ fireCustomEvent: function(event_name,trans_time,direction,slideID) {
569	+ if(this.options.fireEvents) {
570	+ var element = this.element;
571	+ element.fire(event_name, {
572	+ showID : this.showUniqueID,
573	+ transitionTime : trans_time,
574	+ direction : direction,
575	+ slideID : slideID
576	+ });
577	+ }
578	+ },
579	+
580	+
581	+ /* UTILITY FUNCTIONS
582	+ ------------------------------------------------*/
583	+
584	+ isPlaying: function() {
585	+ return this.masterTimer != null;
586	+ },
587	+
588	+ isAnimating: function() {
589	+ return this.animating;
590	+ },
591	+
592	+ toggleAnimating: function(bln) {
593	+ // Role: toggles var to say whether animation is in progress and manipulates DOM
594	+ this.animating = bln;
595	+ if (bln) {
596	+ this.element.addClassName("animating");
597	+ } else {
598	+ this.element.removeClassName("animating");
599	+ }
600	+ },
601	+
602	+ setNextIndex: function(next) {
603	+ // Role: Decides on direction and ensures within bounds
604	+
605	+ if(next === undefined) { // Ensure "next" has a value
606	+ next = this.currentSlideID+1;
607	+ }
608	+
609	+ // Ensure we're within bounds
610	+ if (next >= this.slidesLength) {
611	+ next = 0;
612	+ } else if (next < 0 ){
613	+ next = this.slidesLength-1;
614	+ }
615	+
616	+ this.nextSlideID = next;
617	+ this.nextSlideEle = this.slides[this.nextSlideID];
618	+ },
619	+
620	+ updateControls: function(status) {
621	+ if (this.options.controls) {
622	+ // Role: Updates the status of the Play/Pause button
623	+ var _this = this;
624	+
625	+ if (status) { // The show has been started so update the button to "Pause"
626	+ this.controlStartStop.down('a').update(_this.stopText);
627	+ } else {
628	+ // The show has been stopped so update the button to "Play"
629	+ this.controlStartStop.down('a').update(_this.playText);
630	+ }
631	+ }
632	+
633	+ },
634	+
635	+
636	+
637	+ setupTimer: function() {
638	+ // Role: creates the proto-progress-timer <canvas> element, gets 2D Context and inserta into DOM
639	+
640	+ this.progressTimerEle = document.createElement('canvas');
641	+ if (this.progressTimerEle.getContext && this.progressTimerEle.getContext('2d')) { // test for Canvas support
642	+ this.progressTimerEle.writeAttribute('class','proto-progress-timer');
643	+ this.progressTimerEle.width = 30;
644	+ this.progressTimerEle.height = 30;
645	+ this.element.insert(this.progressTimerEle,'bottom');
646	+ this.progressTimerCtx = this.progressTimerEle.getContext('2d');
647	+ } else {
648	+ this.progressTimer = false; // no canvas support
649	+ }
650	+ },
651	+
652	+
653	+ runProgressTimer: function() {
654	+ // Role: runs & controls the animation of the "progress timer"
655	+
656	+ var _this = this;
657	+
658	+
659	+ if (this.progressTimer) { // if user has set to use progress timer and the browser supports <canvas>
660	+
661	+
662	+
663	+ this.progressTimerEle.show();
664	+
665	+ // use Epoch time to ensure code executes in time specified
666	+ // borrowed from Emile JS http://script.aculo.us/downloads/emile.pdf
667	+ var start = (new Date).getTime();
668	+
669	+ // we want the timer to finish slightly before the slide transitions
670	+ // so we shorten the duration by 1/4
671	+ var duration = this.interval*0.75;
672	+ var finish = start+duration;
673	+ var angleStart = 0;
674	+
675	+
676	+ this.progressTimerPE = new PeriodicalExecuter(function(pe) {
677	+ _this.resetProgressTimer(); // clear the canvas ready for next segment
678	+ this.drawArc(_this.progressTimerCtx,0,360,'rgba(0,0,0,.2)'); // redraw the black bg circle
679	+
680	+ var time = (new Date).getTime();
681	+ var pos = time>finish ? 1 : (time-start)/duration;
682	+
683	+ // draw the arch passing in the ctx and the degress of the arch
684	+ this.drawArc(_this.progressTimerCtx,-5,Math.floor(( (360) * pos)),'rgba(255,255,255,.8)',true);
685	+
686	+ if( (!this.isPlaying()) \|\| time>finish) { // if we are stopped or we are finished then stop the PE and fade the canvas out
687	+ pe.stop();
688	+ _this.progressTimerEle.fade({
689	+ duration: (_this.interval > 1000) ? (_this.interval/8)/1000 : 0.2,
690	+ afterFinish: function() {
691	+ _this.resetProgressTimer();
692	+ }
693	+ });
694	+ }
695	+ }.bind(this),duration/100000);
696	+ }
697	+ },
698	+
699	+
700	+ resetProgressTimer: function() {
701	+ this.progressTimerEle.width = this.progressTimerEle.width;
702	+ },
703	+
704	+ stopProgressTimer: function() {
705	+ this.resetProgressTimer();
706	+ clearInterval(this.progressTimerPE);
707	+ },
708	+
709	+ drawArc: function(canvasCtx,startAngle,endAngle,strokeStyle) {
710	+ // Role: utility function for drawing archs on <canvas> elements
711	+
712	+ var drawingArc = true;
713	+ var ctx = canvasCtx;
714	+
715	+ ctx.beginPath();
716	+ ctx.strokeStyle = strokeStyle;
717	+ ctx.lineCap = 'butt';
718	+ ctx.lineWidth = 4;
719	+
720	+ ctx.arc(15,15,10, (Math.PI/180)(startAngle-90),(Math.PI/180)(endAngle-90), false);
721	+ ctx.stroke();
722	+ var drawingArc = false;
723	+ },
724	+
725	+
726	+
727	+ /* LOGGING FUNCTIONS
728	+ ------------------------------------------------*/
729	+
730	+ /*reportSlides: function() {
731	+ console.log("Current slide: " + this.currentSlideID);
732	+ console.log("Next slide: " + this.nextSlideID);
733	+ },*/
734	+
735	+
736	+
737	+
738	+ cc: function() {
739	+ // catches the comma
740	+ }
741	+
742	+
743	+
744	+
745	+ });
746	+
747	+ Element.addMethods({
748	+ // Make Protoshow available as method of all Prototype extended elements
749	+ // http://www.prototypejs.org/api/element/addmethods
750	+ protoShow: function(element, options) {
751	+ element = $(element);
752	+ var theShow = new protoShow(element,options);
753	+ return theShow;
754	+ }
755	+ });
756	+
757	+ }
758	+ </script>

skin/frontend/base/default/css/slider/protoshow.css ADDED Viewed

	@@ -0,0 +1,305 @@


1	+ /* ####################################### */
2	+ /* ########### STANDARD SETUP ############ */
3	+ /* ####################################### */
4	+
5	+ .protoshow,
6	+ .protoshow .show {
7	+ position: relative;
8	+ margin: 0 auto;
9	+ padding: 0;
10	+ list-style: none;
11	+ width: 900px;
12	+ height: 300px;
13	+ }
14	+
15	+ .slide {
16	+ position: absolute;
17	+ top: 0;
18	+ left: 0;
19	+ z-index: 90;
20	+ height: 100%;
21	+ }
22	+
23	+ .active-slide {
24	+ z-index: 100;
25	+ }
26	+
27	+ .protoshow .slide-caption {
28	+ position: absolute;
29	+ left: 0;
30	+ bottom: 0;
31	+ right: 0;
32	+ z-index: 100;
33	+ padding: 1em 10px;
34	+ background-color: #000;
35	+ background-color: rgba(0,0,0,.4);
36	+ color:#fff;
37	+ }
38	+
39	+ .proto-progress-timer {
40	+ position: absolute;
41	+ top: 7px;
42	+ right: 7px;
43	+ z-index: 9999;
44	+ }
45	+
46	+
47	+ /* TRANSITION SLIDE
48	+ ------------------------------------------------*/
49	+
50	+ .transition-slide .show-window {
51	+ overflow: hidden;
52	+ position: relative;
53	+ }
54	+
55	+ .transition-slide .show {
56	+ position: absolute;
57	+ top: 0;
58	+ left: 0;
59	+ width: 999999px;
60	+ }
61	+
62	+ .transition-slide .slide {
63	+ position: static; /overide/
64	+ float: left;
65	+ display: block;
66	+ }
67	+
68	+
69	+ /* PROTO CONTROLS
70	+ ------------------------------------------------*/
71	+
72	+ .proto-controls,
73	+ .proto-navigation {
74	+ margin: 0;
75	+ padding: 0;
76	+ list-style: none;
77	+ }
78	+
79	+ .proto-controls a:link,
80	+ .proto-controls a:visited,
81	+ .proto-navigation a:link,
82	+ .proto-navigation a:visited {
83	+ display: block;
84	+ text-indent: -9999px;
85	+ overflow: hidden;
86	+ }
87	+
88	+ .proto-controls li {
89	+ position: absolute;
90	+ top: 50%;
91	+ margin-top: -36px;
92	+ left: 10px;
93	+ width: 10%;
94	+ height: 100%;
95	+ z-index: 110;
96	+ }
97	+
98	+ .proto-controls .forward {
99	+ right: 10px;
100	+ left: auto;
101	+ }
102	+
103	+ .proto-controls a {
104	+ width: 100%;
105	+ height: 61px;
106	+ background: url(../../images/proto_controls_bg.png) no-repeat 0 0;
107	+ opacity: 0.2;
108	+ -moz-opacity: 0.2;
109	+ filter:alpha(opacity=20);
110	+ }
111	+
112	+ .proto-controls a:hover,
113	+ .proto-controls a:focus {
114	+ opacity: 1;
115	+ -moz-opacity: 1;
116	+ filter:alpha(opacity=100);
117	+ }
118	+
119	+ .proto-controls .forward a {
120	+ background-position: 100% -90px;
121	+ }
122	+
123	+
124	+ /* PROTO NAVIGATION
125	+ ------------------------------------------------*/
126	+
127	+ .proto-navigation {
128	+ position: absolute;
129	+ top: 0;
130	+ right: 50%;
131	+ float: right;
132	+ z-index: 120;
133	+ }
134	+
135	+ .proto-navigation li {
136	+ float: left;
137	+ left: 50%;
138	+ padding: 12px 6px;
139	+ position: relative;
140	+
141	+ }
142	+
143	+ .proto-navigation a {
144	+ background-color: #fff;
145	+ background-color: rgba(0,0,0,.2);
146	+ height: 8px;
147	+ text-decoration: none;
148	+ width: 8px;
149	+ -moz-border-radius:30px;
150	+ -webkit-border-radius:30px;
151	+ border-radius:30px;
152	+ -moz-box-shadow: inset 0 1px 0 1px rgba(0,0,0,.1);
153	+ -webkit-box-shadow: inset 0 1px 0 1px rgba(0,0,0,.1);
154	+ box-shadow: inset 0 1px 0 1px rgba(0,0,0,.1);
155	+ }
156	+
157	+ .proto-navigation a:hover,
158	+ .proto-navigation a:focus {
159	+ background-color: #999;
160	+ }
161	+
162	+ .proto-navigation .current-slide a {
163	+ background-color: #363F4E;
164	+ }
165	+
166	+
167	+
168	+
169	+
170	+
171	+
172	+
173	+
174	+
175	+
176	+
177	+
178	+
179	+
180	+
181	+ /*
182	+ .proto-navigation {
183	+ margin: 0;
184	+ padding: 0;
185	+ list-style: none;
186	+ position: absolute;
187	+ right: 5px;
188	+ bottom: -25px;
189	+ z-index: 200;
190	+ }
191	+
192	+ .proto-navigation li {
193	+ float: left;
194	+ margin-right: 10px;
195	+ }
196	+
197	+ .proto-navigation li a:link,
198	+ .proto-navigation li a:visited {
199	+ display: block;
200	+ width: 8px;
201	+ height: 8px;
202	+ text-decoration: none;
203	+ background-color: rgba(255,255,255,0.5);
204	+ border: 1px solid #090809;
205	+ color: #666;
206	+ text-indent: -9999px;
207	+ overflow: hidden;
208	+ -moz-border-radius: 30px;
209	+ -webkit-border-radius: 30px;
210	+ border-radius: 30px;
211	+ }
212	+
213	+ .proto-navigation li a:hover,
214	+ .proto-navigation li a:focus {
215	+ background-color: #fff;
216	+ border-color: #000;
217	+ }
218	+
219	+
220	+ .proto-navigation li.current-slide a:link,
221	+ .proto-navigation li.current-slide a:visited {
222	+ background-color: rgba(30,30,30,0.9);
223	+
224	+ }
225	+
226	+
227	+
228	+
229	+
230	+
231	+ .proto-controls {
232	+ margin: 0;
233	+ padding: 0;
234	+ list-style: none;
235	+
236	+ }
237	+
238	+ .proto-controls .forward,
239	+ .proto-controls .backward,
240	+ .proto-controls .start-stop {
241	+ z-index: 200;
242	+ float: left;
243	+ margin: 10px 10px 0 0;
244	+ }
245	+
246	+ .proto-controls .start-stop {
247	+ margin-top: 10px;
248	+
249	+ }
250	+
251	+
252	+
253	+
254	+
255	+ .proto-controls a:link,
256	+ .proto-controls a:visited {
257	+ display: inline-block;
258	+ background-color: #090809;
259	+ background-image: -moz-linear-gradient(
260	+ center top,
261	+ rgb(123,125,130) 2%,
262	+ rgb(75,80,88) 3%,
263	+ rgb(42,45,50) 100%
264	+ );
265	+ color: #fff;
266	+ padding: 5px 10px;
267	+ border: 1px solid #090809;
268	+ -moz-border-radius: 20px;
269	+ -webkit-border-radius: 20px;
270	+ border-radius: 20px;
271	+ text-decoration: none;
272	+ text-align: center;
273	+ width: 60px;
274	+ }
275	+
276	+ .proto-controls a:hover,
277	+ .proto-controls a:focus {
278	+ background-image: -moz-linear-gradient(
279	+ center bottom,
280	+ rgb(42,45,50) 100%,
281	+ rgb(75,80,88) 90%,
282	+ rgb(123,125,130) 20%
283	+ );
284	+ color: #e1e1e1;
285	+ }
286	+
287	+
288	+ .slide-caption {
289	+ position: absolute;
290	+ bottom: 0px;
291	+ left: 0px;
292	+ width: 880px;
293	+ background-color: rgba(0,0,0,.5);
294	+ color: #fff;
295	+ z-index: 200;
296	+ padding: 10px;
297	+ }
298	+
299	+
300	+ .proto-timer {
301	+ position: absolute;
302	+ top: 10px;
303	+ right: 10px;
304	+ z-index: 9999;
305	+ }*/

skin/frontend/base/default/css/slider/reset.css ADDED Viewed

	@@ -0,0 +1,102 @@


1	+ /*
2	+ html5doctor.com Reset Stylesheet
3	+ v1.6.1
4	+ Last Updated: 2010-09-17
5	+ Author: Richard Clark - http://richclarkdesign.com
6	+ Twitter: @rich_clark
7	+ */
8	+
9	+ html, body, div, span, object, iframe,
10	+ h1, h2, h3, h4, h5, h6, p, blockquote, pre,
11	+ abbr, address, cite, code,
12	+ del, dfn, em, img, ins, kbd, q, samp,
13	+ small, strong, sub, sup, var,
14	+ b, i,
15	+ dl, dt, dd, ol, ul, li,
16	+ fieldset, form, label, legend,
17	+ table, caption, tbody, tfoot, thead, tr, th, td,
18	+ article, aside, canvas, details, figcaption, figure,
19	+ footer, header, hgroup, menu, nav, section, summary,
20	+ time, mark, audio, video {
21	+ margin:0;
22	+ padding:0;
23	+ border:0;
24	+ outline:0;
25	+ font-size:100%;
26	+ vertical-align:baseline;
27	+ background:transparent;
28	+ }
29	+
30	+ body {
31	+ line-height:1;
32	+ }
33	+
34	+ article,aside,details,figcaption,figure,
35	+ footer,header,hgroup,menu,nav,section {
36	+ display:block;
37	+ }
38	+
39	+ nav ul {
40	+ list-style:none;
41	+ }
42	+
43	+ blockquote, q {
44	+ quotes:none;
45	+ }
46	+
47	+ blockquote:before, blockquote:after,
48	+ q:before, q:after {
49	+ content:'';
50	+ content:none;
51	+ }
52	+
53	+ a {
54	+ margin:0;
55	+ padding:0;
56	+ font-size:100%;
57	+ vertical-align:baseline;
58	+ background:transparent;
59	+ }
60	+
61	+ /* change colours to suit your needs */
62	+ ins {
63	+ background-color:#ff9;
64	+ color:#000;
65	+ text-decoration:none;
66	+ }
67	+
68	+ /* change colours to suit your needs */
69	+ mark {
70	+ background-color:#ff9;
71	+ color:#000;
72	+ font-style:italic;
73	+ font-weight:bold;
74	+ }
75	+
76	+ del {
77	+ text-decoration: line-through;
78	+ }
79	+
80	+ abbr[title], dfn[title] {
81	+ border-bottom:1px dotted;
82	+ cursor:help;
83	+ }
84	+
85	+ table {
86	+ border-collapse:collapse;
87	+ border-spacing:0;
88	+ }
89	+
90	+ /* change border colour to suit your needs */
91	+ hr {
92	+ display:block;
93	+ height:1px;
94	+ border:0;
95	+ border-top:1px solid #cccccc;
96	+ margin:1em 0;
97	+ padding:0;
98	+ }
99	+
100	+ input, select {
101	+ vertical-align:middle;
102	+ }

skin/frontend/base/default/css/slider/site.css ADDED Viewed

	@@ -0,0 +1,9 @@


1	+ body {
2	+ font-size: 12px;
3	+ font-family: Arial, Helvetica, sans-serif;
4	+ background-color: #f7f7f7;
5	+ padding: 0px;
6	+ margin: 0px;
7	+ }
8	+
9	+