Welcome Guest, Not a member yet? Register   Sign In
how to access a freestanding jquery plugin as an asset
#1

[eluser]bill19[/eluser]
Hi everyone,

I have been trying to get https://github.com/blueimp/jQuery-File-U...gniter-2.1 going , but have run into problems with the file paths.

I am trying a different approach . I was able to download and setup the https://github.com/blueimp/jQuery-File-Upload upload widget on my server, and it works fine out of the box by following the basic directions! Now I'd like to integrate it into a CI 2.10 project.

I have a directory structure like this:

Quote:application
assets
BLUEIMP
system
index.php

Now I am need to call the BLUEIMP index.html file from a controller. Its basically a view but obviously I can't call it as such because of it being in a different folder.

Can anyone give me some advice on how to proceed.

Thank you,

Bill
#2

[eluser]weboap[/eluser]
move the index.html to the views folder, and call it from your controller as such (you can change the file name)
then update the jquery libs links to match the new location
eg:
Code:
<skript type="text/javaskript" src="&lt;?= base_url()?&gt;BLUEIMP/..........js"></skript>

or move this calls to your view where you have &lt;head&gt;&lt;/head> ....
#3

[eluser]bill19[/eluser]
Thanks weboap,

Can a view be a .html file or do I need to change the extension to .php?

Bill
#4

[eluser]CroNiX[/eluser]
php, or the loader won't be able to find it (since you leave the file extension off and it automatically appends ".php" when looking for the files)
#5

[eluser]bill19[/eluser]
I am having some problem getting the asset paths straightened out. As recommended I have moved the index.html to the views folder, and renamed it 'newform.php'. when I load I get the following errors:

Quote:"NetworkError: 404 Not Found - http://localhost/upload1/index.php/css/style.css"
style.css
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/ve....widget.js"
jquery...dget.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/jq...ansport.js"
jquery...port.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/jq...load-fp.js"
jquery...d-fp.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/locale.js"
locale.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/jq...eupload.js"
jquery...load.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/css/j...oad-ui.css"
jquery...-ui.css
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/main.js"
main.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/jq...load-ui.js"
jquery...d-ui.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/ve....widget.js"
jquery...dget.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/jq...ansport.js"
jquery...port.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/jq...eupload.js"
jquery...load.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/jq...load-fp.js"
jquery...d-fp.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/jq...load-ui.js"
jquery...d-ui.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/locale.js"
locale.js
"NetworkError: 404 Not Found - http://localhost/upload1/index.php/js/main.js"

The code is:

Code:
<!DOCTYPE HTML>
&lt;!--
/*
* jQuery File Upload Plugin Demo 6.9
* https://github.com/blueimp/jQuery-File-Upload
*
* Copyright 2010, Sebastian Tschan
* https://blueimp.net
*
* Licensed under the MIT license:
* http://www.opensource.org/licenses/MIT
*/
--&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
&lt;meta charset="utf-8"&gt;

&lt;base href="&lt;?=base_url();?&gt;"&gt;

&lt;title&gt;jQuery File Upload Demo&lt;/title&gt;
&lt;meta name="description" content="File Upload widget with multiple file selection, drag&amp;drop support, progress bar and preview images for jQuery. Supports cross-domain, chunked and resumable file uploads. Works with any server-side platform (Google App Engine, PHP, Python, Ruby on Rails, Java, etc.) that supports standard HTML form file uploads."&gt;
&lt;meta name="viewport" content="width=device-width"&gt;
&lt;!-- Bootstrap CSS Toolkit styles --&gt;
&lt;link rel="stylesheet" href="http://blueimp.github.com/cdn/css/bootstrap.min.css"&gt;
&lt;!-- Generic page styles --&gt;
&lt;link rel="stylesheet" href="css/style.css"&gt;
&lt;!-- Bootstrap styles for responsive website layout, supporting different screen sizes --&gt;
&lt;link rel="stylesheet" href="http://blueimp.github.com/cdn/css/bootstrap-responsive.min.css"&gt;
&lt;!-- Bootstrap CSS fixes for IE6 --&gt;
&lt;!--[if lt IE 7]>&lt;link rel="stylesheet" href="http://blueimp.github.com/cdn/css/bootstrap-ie6.min.css"&gt;&lt;![endif]--&gt;
&lt;!-- Bootstrap Image Gallery styles --&gt;
&lt;link rel="stylesheet" href="http://blueimp.github.com/Bootstrap-Image-Gallery/css/bootstrap-image-gallery.min.css"&gt;
&lt;!-- CSS to style the file input field as button and adjust the Bootstrap progress bars --&gt;
&lt;link rel="stylesheet" href="css/jquery.fileupload-ui.css"&gt;
&lt;!-- Shim to make HTML5 elements usable in older Internet Explorer versions --&gt;
&lt;!--[if lt IE 9]>[removed][removed]<![endif]--&gt;
&lt;/head&gt;
&lt;body&gt;
<div class="navbar navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container">
            <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </a>
            <a class="brand" href="https://github.com/blueimp/jQuery-File-Upload">jQuery File Upload</a>
            <div class="nav-collapse">
                <ul class="nav">
                    <li class="active"><a href="#">Demo</a></li>
                    <li><a href="https://github.com/blueimp/jQuery-File-Upload/downloads">Downloads</a></li>
                    <li><a href="https://github.com/blueimp/jQuery-File-Upload">Source Code</a></li>
                    <li><a href="https://github.com/blueimp/jQuery-File-Upload/wiki">Documentation</a></li>
                    <li><a href="https://github.com/blueimp/jQuery-File-Upload/issues">Issues</a></li>
                    <li><a href="test/">Test</a></li>
                    <li><a href="https://blueimp.net">&copy; Sebastian Tschan</a></li>
                </ul>
            </div>
        </div>
    </div>
</div>
<div class="container">
    <div class="page-header">
        <h1>jQuery File Upload Demo</h1>
    </div>
    <blockquote>
        <p>File Upload widget with multiple file selection, drag&amp;drop support, progress bars and preview images for jQuery.<br>
        Supports cross-domain, chunked and resumable file uploads and client-side image resizing.<br>
        Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads.</p>
    </blockquote>
    <br>
    &lt;!-- The file upload form used as target for the file upload widget --&gt;
    &lt;form id="fileupload" action="server/php/" method="POST" enctype="multipart/form-data"&gt;
        &lt;!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload --&gt;
        <div class="row fileupload-buttonbar">
            <div class="span7">

Any advice?

Bill
#6

[eluser]weboap[/eluser]
bill19 you have an open thread for the same subject

http://ellislab.com/forums/viewthread/217980/
its not gonna take you anywhere to open multiple threads like this follow on the 1st
read my answer there.


#7

[eluser]bill19[/eluser]
Sorry for the confusion Weboap,

I had considered this thread to be a continuation of the other 1 ( I don't know how to close a thread ). That's why I said:

Quote:I have been trying to get https://github.com/blueimp/jQuery-File-U...gniter-2.1 going , but have run into problems with the file paths.

I am trying a different approach

Anyway, you are right about my having the same issue with the file paths. This is the first time I've dealt with JS and CSS files and I'm clearly having some trouble with it. I'll take a look at the links you provided, and try to regroup.

Thanks for looking at this,

Bill
#8

[eluser]skull[/eluser]
I have some problems, too. Please read this here http://stackoverflow.com/questions/13179...gniter-2-1

I cant post more words.. forum admins not allow.




Theme © iAndrew 2016 - Forum software by © MyBB