Code

Discussion on Barebone Ionic - Full Application

Discussion on Barebone Ionic - Full Application

By
Cart 801 sales

233 comments found.

Hi,

Great app! I have a question before I buy it. I have a website wordpress with plugin “Responsive FlipBook” same as http://mpcthemes.net/products/?product=flipbook_ , I want to connect and display my web in your app, Does it work with flipbook effect ? Thanks.

Mobile apps purpose is to consume structured data and display rendering them in the device. What you are describing here is to send what you have already in your web site and get displayed as it is in the app.

The short answer is no, the app is not prepared for that.

$ npm install $ bower install bower MODULE_NOT_FOUND Cannot find module ‘form-data’ ????????????

Could you please send me the .apk file you have built in order to test it in my end and check its performance?

I could deliver your mail to send it please

Please send me a private message by using the related form in the lower right corner in my profile page in CodeCanyon

http://codecanyon.net/user/skounis

This way we will establish a direct communication channel without exposing our email address to the public.

Hi,

Do you have List page(i see chat rooms list) that has buttons to delete?

Please check the SQLite module which is part of the recently release

1. http://www.screencast.com/t/v4k7sSwVBa

2. Slide left over a row and a menu will be revealed http://www.screencast.com/t/PxgOfOBZohD

Shopping cart provides also such a user experience:

1. http://www.screencast.com/t/Zxv2TfdjbINx

2. Add some products into the cart: http://www.screencast.com/t/5ElEGABIH

3. Visit the cart by using the icon in the top right corner: http://www.screencast.com/t/RkVx0PHcRHb

Perfect…Can’t ask more….

Will you add facebook comments in your app?

Could you please add a feature request here: http://goo.gl/forms/13VD9b1DPj

We are taken all the suggestion seriously under consideration

hello skounis i did exactly what said in pdf but some kind of problem appear when i run the template , screen appear all blank, can you tell me some instruccions or your skype for a litle metting, thank you

Hi,

Please send me a private message in order to arrange a Skype session.

Please also mention the operating system you are working on and the version of ios sdk and nodejs which are installed

Hi,

I have recently purchased this template. It is good template. I am trying to create form to enter data having hard time. Usually every theme or template has components or form element where you it will show all elements. I think that is missing. If you can please.

Please check the slide menu. There is an option that opens a screen where all the form controls Ionic provides and layouts are demonstrated

I got it. It is under elements folder. Thanks…

correct

If I buy is there anyone or anywhere that can help me with the set up so I can publish in both markets?

Hi, you could use this forum to post your message or contact me directly through the contact form in my profile page.

Hi,

The ‘Pull to refresh’ doesn’t seem to work in the drupal link? How should I develop the app for the existing drupal site? Is it easy? Can you please give me a few links if possible?

Please let me know.

Thanks.

Pull to Refresh is not implemented for the Drupal screens. You could do that by adding a directive in the “drupal-articles.html” and call a method in its controller

http://ionicframework.com/docs/api/directive/ionRefresher/

For the integration you are mentioning the existing drupal site should be adjusted and prepared in order to expose its information in JSON format. There are some details about that in the Quick Guide Document that comes with the project files:

Using Drupal, initially, you should install the Services module and enable it. A View that exposes a JSON feed of the articles should also be created.

The following tutorial describes this process:

A Beginners Guide to the Drupal Services Module

- https://www.ostraining.com/blog/drupal/services/

All the modules that are needed for this are listed below:

-https://www.drupal.org/project/services

- https://www.drupal.org/project/ctools

- https://www.drupal.org/project/libraries

- https://www.drupal.org/project/views - https://www.drupal.org/project/services_views

In the json files \n does not seem to make a new line in the app. They just get ignored. How can i make text start a new line or create a new paragraph in products?

The response from the JSONs is used for HTML markup. If you need to use \n you should search for this in the controller that received the data and replace it with “

Getting the error angular is not defined when i run grunt serve—lab – boxes show but they’re blank. All installs go find though, but i did have to change one of your paths as commented in this thread. Can you help?

To expand on this, i actually get 404s on all my assets.

It seems that the client libraries are not installed. Did you ran “npm install” ?

Could you please also mention your dev environment and operating system?

I am able to run the app using “grunt serve—force” however my CSS doesnt seem right. http://imgur.com/t5iBST3

And when I run using “grunt serve”, I get the following…

Dogukans-MacBook-Air:barebone-ionic dogukan$ grunt serve

Running “serve” task

Running “wiredep:app” (wiredep) task

Running “clean” task >> [Error: Failed to find ‘ANDROID_HOME’ environment variable. Try setting setting it manually. >> Failed to find ‘android’ command in your ‘PATH’. Try update your ‘PATH’ to include path to valid SDK directory.] >> Error: /Users/dogukan/Work/barebone-ionic/platforms/android/cordova/clean: Command failed with exit code 2 >> at ChildProcess.whenDone (/Users/dogukan/Work/barebone-ionic/node_modules/cordova/node_modules/cordova-lib/src/cordova/superspawn.js:139:23) >> at emitTwo (events.js:87:13) >> at ChildProcess.emit (events.js:172:7) >> at maybeClose (internal/child_process.js:817:16) >> at Process.ChildProcess._handle.onexit (internal/child_process.js:211:5) Warning: Task “clean” failed. Use—force to continue.

Aborted due to warnings.

Hi, according to the error message the system variable ANDROID_HOME is not properly set. This is related to the installation of the Android SDK in your computer.

If you open a terminal you should be able to get an output like what follows

http://www.screencast.com/t/lV191wgz2

if not you may set it manually be editing the ”.profile” file located in your home directory

http://www.screencast.com/t/3YDzfMxI

Hi,

I installed everything and not getting any errors during installation. However when I do grunt serve—lab Barebone launches in a browser with iOS on left and Android on right but page is blank. I also tried running simulator through XCode but its blank there too. In console i do see the following error:

ionic $ c Console log output: enabled Loading: /?restart=543573 ionic $ 0 820305 error ReferenceError: Can’t find variable: angular, http://localhost:8100/scripts/ad/ad.module.js, Line: 4

This error is for ever script. Please assist on how to fix.

If the app is not able to find angular is seems that the client javascript libraries are not loading or are not installed.

Please execute first:

grunt build --force
and then
npm install

and share with me any error message you will get in your console.

finally try to launch the app by executing:

grunt serve

or 

grunt serve --force

If you are using Windows there is a section in the Quick Start guide about a couple of additional steps.

Hello,

The events calendar is integrated with google calendar?

Thank you!

Currently the calendar module is getting data from a JSON structure. You can locate it in the file

app/scripts/events/events.service.js

If you need to get Google events you should extend this service and create a similar structure by getting data from Google Calendar API.

If you need me to do that for you please send me a private message.

route configuration, I am not able to find any configuration on routes. Please help. which files we have to modify if we want to add new modules? $urlRouterProvider.otherwise(’/app/home’);

The application is following an extremely modular architecture. Each module defiles its routes.

If you need to create a new module you may use “map” as your point of reference. It is the simplest module in the app.

For example:

1. Create a copy of the "app/scripts/map" folder and name it "app/scripts/foo" 
2. rename all the files within this folder according to the pattern "foo.*.js" 
3. edit these files and rename the module name and namespace from "barebone.map" to "barebone.foo" 
4. edit the "foo.module.js" file and configure your routes (states) 
5. edit the app.js file and add a reference to this module in the array of modules defined in the very top of this file. 

Please let me know if all this are providing you the solution you are looking for.

Thank you .

You are welcome. Do not hesitate to drop me back a line if you need any further information

Hi, if I wanted to create a new global directive, what would be the best way to do that? Should I add ‘wordpress.directive.js’ in the wordpress folder? I’m not sure exactly to the format of the directive file though. Could you give some guidance how to create: (a) a global directive (b) a directive for a specific feature e.g. Wordpress.

I did try something like this but I don’t think it is correct:

(function() {
'use strict';
angular
    .module('barebone.wordpress')
    .directive('elasticHeader', elasticHeader);
.directive('elasticHeader', function() {
return {
restrict: 'A',
etc.

etc.

Could you please let me know what the purpose of this directive will be?

It would be a parallax header effect on the Wordpress article page. It is only 1 small piece of code. Would be great to have it specific to the Wordpress posts page, or global for other pages as it’s just a class that gets added on the page to make it work. Would you’ve able to give an example of both if possible? Would be good to know in case I want to add other directives in the future, thanks :-)

I’m not sure i got the full picture of what you are trying to achieve and why this you are describing should be implemented by using a directive.

In general directives could be defined anywhere and injected and used in the files where they are needed.

For example you could check the “gmaps” directive which is defiled in the file:

app/scripts/common/directives/gmaps/gmaps.directive.js

and used in the html file:

app/scripts/map/map.html

HI skounis, nice app

I have 2 question for you about building apk, 1) I’ve got this warning when running command: ionic build, I have java version 1.6, what java version do you use? The Warning ” :CordovaLib:compileDebugJavawarning: java/lang/Object.class(java/lang:Object.class): major version 51 is newer than 50, the highest major version supported by this compiler. It is recommended that the compiler be upgraded. warning: java/lang/String.class(java/lang:String.class): major version 51 is newer than 50, the highest major version supported by this compiler. It is recommended that the compiler be upgraded. ” 2) The second is I fail building apk using command: ionic build. Do you know what has causing this error? The Error” :processDebugResources/Applications/AMPPS/www/ionic/barebone2.6/platforms/android/build/intermediates/manifests/full/debug/AndroidManifest.xml:28: error: Error: No resource found that matches the given name (at ‘icon’ with value ’@drawable/icon’).

FAILED

FAILURE: Build failed with an exception.

  • What went wrong: Execution failed for task ’:processDebugResources’. > com.android.ide.common.internal.LoggedErrorException: Failed to run command: /Users/naufal/Documents/android-sdk/build-tools/23.0.1/aapt package -f—no-crunch -I /Users/naufal/Documents/android-sdk/platforms/android-22/android.jar -M /Applications/AMPPS/www/ionic/barebone2.6/platforms/android/build/intermediates/manifests/full/debug/AndroidManifest.xml -S /Applications/AMPPS/www/ionic/barebone2.6/platforms/android/build/intermediates/res/debug -A /Applications/AMPPS/www/ionic/barebone2.6/platforms/android/build/intermediates/assets/debug -m -J /Applications/AMPPS/www/ionic/barebone2.6/platforms/android/build/generated/source/r/debug -F /Applications/AMPPS/www/ionic/barebone2.6/platforms/android/build/intermediates/res/resources-debug.ap_—debug-mode—custom-package com.titaniumtemplates.barebone_ionic -0 apk—output-text-symbols /Applications/AMPPS/www/ionic/barebone2.6/platforms/android/build/intermediates/symbols/debug Error Code: 1 Output: /Applications/AMPPS/www/ionic/barebone2.6/platforms/android/build/intermediates/manifests/full/debug/AndroidManifest.xml:28: error: Error: No resource found that matches the given name (at ‘icon’ with value ’@drawable/icon’).
  • Try: Run with—stacktrace option to get the stack trace. Run with—info or—debug option to get more log output.

BUILD FAILED

Total time: 7.371 secs

/Applications/AMPPS/www/ionic/barebone2.6/platforms/android/cordova/node_modules/q/q.js:126 throw e; ^ Error code 1 for command: /Applications/AMPPS/www/ionic/barebone2.6/platforms/android/gradlew with args: cdvBuildDebug,-b,/Applications/AMPPS/www/ionic/barebone2.6/platforms/android/build.gradle,-Dorg.gradle.daemon=true ERROR building one of the platforms: Error: /Users/naufal/www/ionic/barebone2.6/platforms/android/cordova/build: Command failed with exit code 1 You may not have the required environment or OS to build this project Error: /Users/naufal/www/ionic/barebone2.6/platforms/android/cordova/build: Command failed with exit code 1 at ChildProcess.whenDone (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/src/cordova/superspawn.js:139:23) at ChildProcess.emit (events.js:110:17) at maybeClose (child_process.js:1008:16) at Process.ChildProcess._handle.onexit (child_process.js:1080:5) “

Please try to remove and add Android platform.

grunt platform:remove:android

grunt platform:add:android

Try also to replace your package.json since it seems that become corrupted

request sent! maybe you can give me link to the latest source code too.. thanks

Hi, for time being there is no updated or more recent codebase that what is already provided by envato.

You may download the .zip file from your Envato account and replace the package.json file you are having in your file system with that you will get from the .zip fil.

I run below command and getting error. npm install -g generator-ionic

npm WARN peerDependencies The peer dependency yo@>=1.0.0 included from generator-ionic will no npm WARN peerDependencies longer be automatically installed to fulfill the peerDependency npm WARN peerDependencies in npm 3+. Your application will need to depend on it explicitly.

any pointers

I ran below command, getting error is it normal?

bower install

Running “clean” task >> Current working directory is not a Cordova-based project. Warning: Task “clean” failed. Use—force to continue.

Aborted due to warnings.

barebone-ionic svennela$ grunt build Running “build” task

Running “clean” task >> Current working directory is not a Cordova-based project. Warning: Task “clean” failed. Use—force to continue.

Aborted due to warnings.

Execution Time (2015-09-11 22:49:49 UTC) loading tasks 5ms ?? 2% clean 255ms ?????????????????????????????????????????????????????????????????? 97% Total 263ms

Hi, please try the force flag

grunt build --force

Hi,

I’ve tried to install on my Mac (clean new system, 10.10.5). I installed all the dependencies, Phonegap, NodeJS, Bower, Grunt, Yeoman. These are my versions: Node: v0.12.7, Ionic 1.6.4, Gulp CLI version 3.9.0, npm: 2.11.3. When I follow the instructions using npm install in the directory i get this: Running “clean” task >> Current working directory is not a Cordova-based project. Warning: Task “clean” failed. Use—force to continue.

Aborted due to warnings.

I can’t therefore run grunt built as it says ’>> Current working directory is not a Cordova-based project.’ Any ideas how I can get it installed?

EDIT: I finally got it working now. It’s not easy getting it setup I can tell you! It’s taken me an hour of fiddling!

Could you please send me a Private Message in order to arrange this. I will try to help you setup properly your environment and we may need a live session for that.

Thank you

My apologies, I was posting in the wrong comments section as I had purchased Barebones Ionic Material which I why I couldn’t’ find the SASS file in that folder. I’ve purchased this one now too so let me test first thanks :-)

Thank you for the update.

How do I get support with this?

I can’t get it running – I’ve installed all the pre requisites.

Even uploading the app to phonegap build produces an empty, white app,

Thanks

Hi,

You could post eny error or log message you are getting here. There is also the option to send me a private message in order to establish a direct communication channel through email.

Have you followed the instructions mentioned in the quick guide document that comes with the project’s files?

In addition to the this the following articles will help.you to check and confirm if your dev environment is properly prepared

http://www.titaniumtemplates.com/node/49 http://www.titaniumtemplates.com/node/48

In your reply please keep.in mind to mention your operating system and its version.

I get this error when trying to run the application: Error: [$injector:unpr] Unknown provider: $$asyncCallbackProvider <- $$asyncCallback <- $animate <- $compile <- $ionicTemplateLoader <- $ionicLoading

Hi, could you please let me know how you are trying to run the app. The commands you are using for this?

Please check also the following two articles and confirm that your environment is properly configured in order to meet all the prerequisites

http://www.titaniumtemplates.com/node/49 http://www.titaniumtemplates.com/node/48

I think I have proper enviroment. I followed the documentation that came with the app. The error comes to Chrome console when I run the app with “grunt serve—lab”. I got these warninig when I ran Yeoman generator(npm install -g generator-ionic):

npm WARN peerDependencies The peer dependency yo@>=1.0.0 included from generator-ionic will no npm WARN peerDependencies longer be automatically installed to fulfill the peerDependency npm WARN peerDependencies in npm 3+. Your application will need to depend on it explicitly. npm WARN deprecated CSSselect@0.4.1: the module is now available as ‘css-select’ npm WARN engine cordova-js@3.8.0: wanted: {node“} (current: {node“}) npm WARN engine npm@1.3.4: wanted: {node“} (current: {node“}) npm WARN deprecated CSSwhat@0.4.7: the module is now available as ‘css-what’ npm WARN engine xmlbuilder@2.2.1: wanted: {node || 0.10.x”} (current: {node“}) npm WARN installMany normalize-package-data was bundled with npm@1.3.4, but bundled package wasn’t found in unpacked tree

Maybe I’m missing some depencies that causes the error?

Hi, could you please check your node installation. What makes me consider an issue related to the node installation is the absence of a specific version on the node in your error messages http://www.screencast.com/t/9wgCvRn7P7t0

In the above message you should get something like (current: node:”x.x.x”)

There is the “n” tool you could use that displays the node version and provides you the option to select which version should be activated

http://www.screencast.com/t/vgX4C8CXck

I’m using node version 0.12.3

http://www.screencast.com/t/mOhbJdhJv
by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey